body{
background:#f5f7fb;
font-family:'Inter',sans-serif;
}

.sidebar{

position:fixed;
left:0;
width:240px;
height:100%;
background:#1e293b;
padding:20px;
transition:0.3s;

}

.sidebar a {
    display: flex;
    justify-content: flex-start;
    text-align: center;
    align-items: center;
    gap: 10px;
    padding: 10px 15px;
    color: #cbd5e1;
    text-decoration: none;
    border-radius: 6px;
    margin-bottom: 5px;
}

.sidebar a:hover{
background:#334155;
color:white;
}

.main{

margin-left:240px;
padding:30px;

}

.sidebar.collapsed{

width:70px;

}

.sidebar.collapsed a{

text-align:center;

}

.sidebar.collapsed a span{

display:none;

}

.stat-card{

border-radius:10px;
transition:0.2s;

}

.stat-card:hover{

transform:translateY(-3px);
box-shadow:0 10px 25px rgba(0,0,0,0.08);

}

.dataTables_wrapper{

background:white;
padding:15px;
border-radius:8px;

}

table.dataTable{

border-collapse:collapse !important;

}

table.dataTable thead th{

background:#f8fafc;
font-weight:600;
border-bottom:1px solid #e5e7eb;

}

table.dataTable tbody tr{

border-bottom:1px solid #f1f5f9;

}

table.dataTable tbody tr:hover{

background:#f9fafb;

}

.table-card{

background:#fff;
border-radius:6px;
box-shadow:0 1px 4px rgba(0,0,0,0.05);
border:1px solid #e9ecef;

}

.table-perfex{

width:100%;
border-collapse:collapse;

}

.table-perfex thead th{

background:#f8f9fa;
font-weight:600;
font-size:13px;
border-bottom:1px solid #e9ecef;
padding:12px;

}

.table-perfex tbody td{

padding:12px;
font-size:14px;
border-bottom:1px solid #f1f3f5;

}

.table-perfex tbody tr:hover{

background:#f8fafc;

}

/* contenedor */

.dt-container{

background:#fff;
padding:20px;
border-radius:6px;

}

/* header */

table.dataTable thead th{

background:#f8f9fa;
font-weight:600;
font-size:13px;
border-bottom:1px solid #e9ecef;

}

/* filas */

table.dataTable tbody td{

padding:12px;
border-bottom:1px solid #f1f3f5;

}

/* hover */

table.dataTable tbody tr:hover{

background:#f9fafb;

}

/* buscador */

.dt-search input{

border:1px solid #ced4da;
border-radius:4px;
padding:4px 8px;

}

/* selector registros */

.dt-length select{

border:1px solid #ced4da;
border-radius:4px;

}

/* paginación */

.dt-paging .pagination{

margin:0;

}

.card{

border-radius:8px;
box-shadow:0 1px 3px rgba(0,0,0,0.05);

}

table.dataTable thead th{

background:#f1f5f9;

}