/* ========================================
   NC DATAGRID
======================================== */

.nc-datagrid{

    width:100%;

    background:#FFF;

    border-radius:16px;

    box-shadow:var(--nc-shadow);

    overflow:hidden;

}

.nc-datagrid-header{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:20px 24px;

    border-bottom:1px solid var(--nc-border);

}

.nc-datagrid-title{

    font-size:20px;

    font-weight:700;

}

.nc-datagrid-title{

    font-size:20px;

    font-weight:700;

}

.nc-datagrid-tools{

    display:flex;

    align-items:center;

    gap:12px;

}

.nc-search-box{

    width:280px;

}

.nc-search-box input{

    width:100%;

    padding:12px 15px;

    border:1px solid var(--nc-border);

    border-radius:10px;

}

.nc-datagrid table{

    width:100%;

    border-collapse:collapse;

}

.nc-datagrid thead{

    background:#F8FAFC;

}

.nc-datagrid th{

    padding:18px;

    text-align:left;

    font-size:14px;

    color:#64748B;

    font-weight:600;

}

.nc-datagrid td{

    padding:18px;

    border-top:1px solid var(--nc-border);

}

.nc-datagrid tbody tr{

    transition:.20s;

}

.nc-datagrid tbody tr:hover{

    background:#F9FBFD;

}

.nc-actions{

    display:flex;

    gap:10px;

}

.nc-action{

    width:36px;

    height:36px;

    border-radius:10px;

    display:flex;

    justify-content:center;

    align-items:center;

    cursor:pointer;

    transition:.20s;

    background:#F5F7FA;

}

.nc-action:hover{

    background:#E8EDF3;

}

.nc-empty{

    padding:60px;

    text-align:center;

    color:#94A3B8;

}

.nc-datagrid-footer{

    display:flex;

    justify-content:space-between;

    align-items:center;

    padding:18px 24px;

    border-top:1px solid var(--nc-border);

}

.nc-pagination{

    display:flex;

    gap:8px;

}

.nc-page-btn{

    width:36px;

    height:36px;

    display:flex;

    justify-content:center;

    align-items:center;

    border-radius:8px;

    cursor:pointer;

    background:#FFF;

    border:1px solid var(--nc-border);

}

.nc-page-btn.active{

    background:var(--nc-primary);

    color:white;

}