/* NEXO_ADMIN_V2B_BGCORE_STYLE */

:root{
    --nx-bg:#f1f4f8;
    --nx-nav:#0b2b49;
    --nx-nav2:#0e365c;
    --nx-blue:#1686f7;
    --nx-blue-dark:#0874dd;
    --nx-text:#16334f;
    --nx-muted:#8292a7;
    --nx-line:#dbe3ec;
    --nx-panel:#ffffff;
    --nx-green:#198754;
    --nx-red:#d14343;
    --nx-orange:#d9822b;
}

.nx-app{
    position:fixed;
    inset:0;
    z-index:50;
    display:grid;
    grid-template-columns:260px minmax(0,1fr);
    background:var(--nx-bg);
    color:var(--nx-text);
    overflow:hidden;
    font-family:
        Inter,
        -apple-system,
        BlinkMacSystemFont,
        "Segoe UI",
        sans-serif;
}

.nx-sidebar{
    height:100vh;
    overflow:auto;
    background:
        linear-gradient(
            180deg,
            #0b2b49,
            #092640
        );
    color:white;
    display:flex;
    flex-direction:column;
}

.nx-brand{
    padding:25px 20px 22px;
}

.nx-brand-main{
    color:#28a1ff;
    font-size:29px;
    line-height:1;
    font-weight:900;
    letter-spacing:.2px;
}

.nx-brand-sub{
    margin-top:5px;
    color:#a9c2db;
    text-transform:uppercase;
    font-size:10px;
    letter-spacing:1.5px;
    font-weight:800;
}

.nx-nav{
    flex:1;
    padding:8px 12px 20px;
}

.nx-nav-group{
    margin-top:18px;
}

.nx-nav-title{
    padding:0 10px 8px;
    color:#5f87ad;
    text-transform:uppercase;
    font-size:10px;
    letter-spacing:1.4px;
    font-weight:900;
}

.nx-nav-item{
    display:flex;
    align-items:center;
    gap:9px;
    width:100%;
    margin:2px 0;
    padding:10px 11px;
    border:0;
    border-radius:8px;
    background:transparent;
    color:#e4eef8;
    text-align:left;
    cursor:pointer;
    font-size:13px;
}

.nx-nav-item:hover{
    background:rgba(255,255,255,.06);
}

.nx-nav-item.active{
    background:#1e5c91;
    color:white;
    font-weight:800;
}

.nx-sidebar-user{
    margin:12px 14px 18px;
    padding:15px 4px;
    border-top:1px solid rgba(255,255,255,.09);
    font-size:12px;
}

.nx-sidebar-user strong{
    display:block;
    color:#fff;
    margin-bottom:3px;
}

.nx-sidebar-user span{
    color:#89a8c5;
}

.nx-main{
    height:100vh;
    overflow:auto;
    min-width:0;
}

.nx-topbar{
    height:66px;
    background:#fff;
    border-bottom:1px solid var(--nx-line);
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 22px;
    position:sticky;
    top:0;
    z-index:20;
}

.nx-topbar-title{
    font-weight:850;
    font-size:17px;
    color:#112f4c;
}

.nx-top-user{
    display:flex;
    align-items:center;
    gap:10px;
}

.nx-avatar{
    width:34px;
    height:34px;
    border-radius:50%;
    display:flex;
    justify-content:center;
    align-items:center;
    color:#fff;
    background:#1d3955;
    font-size:11px;
    font-weight:900;
}

.nx-top-user-meta strong{
    display:block;
    color:#19334c;
    font-size:12px;
}

.nx-top-user-meta small{
    color:#8192a5;
    font-size:10px;
}

.nx-btn-logout{
    margin-left:6px;
    border:1px solid var(--nx-line);
    background:#fff;
    border-radius:8px;
    padding:7px 11px;
    cursor:pointer;
    color:#526b83;
}

.nx-content{
    padding:22px;
}

.nx-page-head{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:15px;
    margin-bottom:16px;
}

.nx-eyebrow{
    color:#0879e7;
    text-transform:uppercase;
    letter-spacing:1.2px;
    font-size:10px;
    font-weight:900;
}

.nx-page-head h1{
    margin:5px 0 2px;
    font-size:25px;
    line-height:1.2;
    color:#153350;
}

.nx-page-head p{
    margin:0;
    color:var(--nx-muted);
    font-size:12px;
}

.nx-primary,
.nx-secondary,
.nx-danger,
.nx-mini{
    border-radius:8px;
    cursor:pointer;
    font-family:inherit;
    font-weight:750;
}

.nx-primary{
    border:1px solid #0d7eea;
    background:linear-gradient(#1c8cf8,#0877e4);
    color:white;
    padding:9px 14px;
}

.nx-secondary{
    border:1px solid var(--nx-line);
    background:#fff;
    color:#36536e;
    padding:9px 14px;
}

.nx-danger{
    border:1px solid #e6b5b5;
    background:#fff5f5;
    color:#b83232;
    padding:9px 14px;
}

.nx-mini{
    border:1px solid var(--nx-line);
    background:#fff;
    color:#31526e;
    padding:6px 9px;
    font-size:11px;
}

.nx-mini.blue{
    color:#0875db;
}

.nx-mini.red{
    color:#bd3939;
}

.nx-stats{
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:12px;
    margin-bottom:14px;
}

.nx-stat{
    display:flex;
    align-items:center;
    gap:13px;
    min-height:70px;
    padding:13px 16px;
    background:#fff;
    border:1px solid var(--nx-line);
    border-radius:10px;
}

.nx-stat-icon{
    width:39px;
    height:39px;
    border-radius:9px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-weight:900;
    font-size:16px;
}

.nx-stat-icon.purple{
    background:#efe9ff;
    color:#6945c7;
}

.nx-stat-icon.green{
    background:#e4f8ed;
    color:#208e53;
}

.nx-stat-icon.blue{
    background:#e8f2ff;
    color:#1776dc;
}

.nx-stat-icon.orange{
    background:#fff1e3;
    color:#ca7824;
}

.nx-stat-label{
    font-size:9px;
    text-transform:uppercase;
    color:#8595aa;
    letter-spacing:1px;
    font-weight:900;
}

.nx-stat-value{
    font-size:24px;
    font-weight:850;
    color:#183753;
    line-height:1.05;
    margin-top:2px;
}

.nx-stat-sub{
    color:#91a0b2;
    font-size:9px;
    margin-top:3px;
}

.nx-grid-2{
    display:grid;
    grid-template-columns:1fr 1.1fr;
    gap:12px;
    margin-bottom:12px;
}

.nx-panel{
    background:#fff;
    border:1px solid var(--nx-line);
    border-radius:10px;
    overflow:hidden;
}

.nx-panel-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:10px;
    padding:13px 15px;
    border-bottom:1px solid var(--nx-line);
}

.nx-panel-head h2{
    margin:0;
    color:#173650;
    font-size:14px;
}

.nx-panel-head p{
    margin:3px 0 0;
    color:#8a9aac;
    font-size:10px;
}

.nx-status-row{
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:12px;
    margin:0 14px;
    padding:11px 0;
    border-bottom:1px solid #edf1f5;
}

.nx-status-row:last-child{
    border-bottom:0;
}

.nx-status-name{
    color:#193752;
    font-size:12px;
    font-weight:800;
}

.nx-status-sub{
    color:#8a9bad;
    font-size:9px;
    margin-top:2px;
}

.nx-badge{
    display:inline-flex;
    align-items:center;
    min-height:23px;
    border-radius:6px;
    padding:3px 8px;
    font-size:9px;
    font-weight:800;
}

.nx-badge.ok{
    background:#e4f7ec;
    border:1px solid #bce4cc;
    color:#18864c;
}

.nx-badge.off{
    background:#fceaea;
    border:1px solid #efc1c1;
    color:#bf3737;
}

.nx-panel-link{
    display:block;
    margin:7px 14px 12px;
    padding:8px;
    border:1px solid var(--nx-line);
    border-radius:7px;
    background:#f9fbfd;
    color:#0876df;
    text-align:center;
    font-size:10px;
    font-weight:800;
    cursor:pointer;
}

.nx-table-wrap{
    overflow:auto;
}

.nx-table{
    width:100%;
    border-collapse:collapse;
}

.nx-table th,
.nx-table td{
    border-bottom:1px solid #e9eef4;
    padding:10px 12px;
    text-align:left;
    vertical-align:middle;
    font-size:11px;
}

.nx-table th{
    background:#fafbfd;
    color:#75879b;
    font-size:9px;
    text-transform:uppercase;
    letter-spacing:.7px;
    white-space:nowrap;
}

.nx-table td{
    color:#243f59;
}

.nx-table tbody tr:hover{
    background:#fbfcfe;
}

.nx-actions{
    display:flex;
    flex-wrap:wrap;
    gap:5px;
}

.nx-quick-grid{
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:9px;
    padding:10px 13px 13px;
}

.nx-quick{
    border:1px solid var(--nx-line);
    border-radius:8px;
    padding:13px 12px;
    cursor:pointer;
    background:#fff;
}

.nx-quick:hover{
    background:#f8fbff;
    border-color:#bcd4ec;
}

.nx-quick-icon{
    font-size:17px;
    margin-bottom:6px;
}

.nx-quick strong{
    display:block;
    color:#1b3853;
    font-size:11px;
}

.nx-quick small{
    display:block;
    color:#91a0b0;
    font-size:9px;
    margin-top:3px;
}

.nx-section{
    display:none;
}

.nx-section.active{
    display:block;
}

.nx-empty{
    padding:25px;
    text-align:center;
    color:#8a99aa;
}

.nx-modal-backdrop{
    position:fixed;
    inset:0;
    z-index:1000;
    background:rgba(7,22,38,.58);
    display:flex;
    align-items:center;
    justify-content:center;
    padding:20px;
}

.nx-modal{
    width:min(760px,96vw);
    max-height:90vh;
    overflow:auto;
    background:#fff;
    border-radius:13px;
    box-shadow:
        0 30px 70px
        rgba(0,0,0,.28);
}

.nx-modal.small{
    width:min(520px,96vw);
}

.nx-modal-head{
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:17px 18px;
    border-bottom:1px solid var(--nx-line);
}

.nx-modal-head h3{
    margin:0;
    font-size:17px;
    color:#15344f;
}

.nx-modal-close{
    width:32px;
    height:32px;
    border:0;
    border-radius:7px;
    background:#eef3f7;
    color:#50677c;
    cursor:pointer;
}

.nx-modal-body{
    padding:18px;
}

.nx-modal-foot{
    display:flex;
    justify-content:flex-end;
    gap:8px;
    padding:13px 18px;
    border-top:1px solid var(--nx-line);
}

.nx-form-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:13px;
}

.nx-field{
    margin-bottom:12px;
}

.nx-field.full{
    grid-column:1/-1;
}

.nx-field label{
    display:block;
    color:#405b73;
    font-size:10px;
    text-transform:uppercase;
    letter-spacing:.7px;
    font-weight:850;
    margin-bottom:5px;
}

.nx-field input,
.nx-field textarea,
.nx-field select{
    width:100%;
    box-sizing:border-box;
    border:1px solid #ccd7e2;
    border-radius:8px;
    padding:9px 10px;
    color:#173550;
    background:white;
    outline:none;
    font:inherit;
    font-size:12px;
}

.nx-field textarea{
    min-height:76px;
    resize:vertical;
}

.nx-check{
    display:flex;
    align-items:center;
    gap:7px;
    font-size:11px;
    color:#304d67;
}

.nx-check input{
    width:auto;
}

.nx-permission-box{
    margin-top:12px;
    border:1px solid var(--nx-line);
    border-radius:9px;
    overflow:hidden;
}

.nx-permission-row{
    display:grid;
    grid-template-columns:minmax(180px,1fr) 110px 110px;
    align-items:center;
    gap:8px;
    padding:9px 11px;
    border-bottom:1px solid #ebf0f4;
}

.nx-permission-row:last-child{
    border-bottom:0;
}

.nx-permission-row strong{
    font-size:11px;
    color:#23425d;
}

.nx-message{
    margin-top:10px;
    border-radius:8px;
    padding:9px 10px;
    display:none;
    font-size:11px;
}

.nx-message.error{
    display:block;
    background:#fff0f0;
    color:#af3030;
    border:1px solid #efc8c8;
}

.nx-message.ok{
    display:block;
    background:#edf9f1;
    color:#187d46;
    border:1px solid #c4e9d2;
}

.nx-role-card{
    padding:14px;
    border-bottom:1px solid var(--nx-line);
}

.nx-role-card:last-child{
    border-bottom:0;
}

.nx-role-card strong{
    font-size:13px;
    color:#193650;
}

.nx-role-card p{
    margin:3px 0 0;
    color:#8798aa;
    font-size:10px;
}

@media(max-width:1050px){
    .nx-stats{
        grid-template-columns:repeat(2,1fr);
    }

    .nx-grid-2{
        grid-template-columns:1fr;
    }
}

@media(max-width:800px){
    .nx-app{
        position:absolute;
        grid-template-columns:1fr;
        overflow:auto;
    }

    .nx-sidebar{
        height:auto;
    }

    .nx-nav{
        display:flex;
        flex-wrap:wrap;
        gap:4px;
    }

    .nx-nav-group{
        margin:0;
    }

    .nx-nav-title{
        display:none;
    }

    .nx-nav-item{
        width:auto;
    }

    .nx-sidebar-user{
        display:none;
    }

    .nx-main{
        height:auto;
    }

    .nx-topbar{
        position:static;
    }

    .nx-form-grid{
        grid-template-columns:1fr;
    }

    .nx-permission-row{
        grid-template-columns:1fr;
    }
}

@media(max-width:560px){
    .nx-stats{
        grid-template-columns:1fr;
    }

    .nx-quick-grid{
        grid-template-columns:1fr;
    }

    .nx-top-user-meta{
        display:none;
    }

    .nx-content{
        padding:12px;
    }
}