:root {
    --sidebar-bg: #073b66;
    --sidebar-bg-soft: #0b4f8a;
    --sidebar-hover: rgba(255,255,255,.12);
    --sidebar-active: #ffffff;
    --sidebar-active-text: #073b66;
    --body-bg: #f3f5f8;
}

body {
    background: var(--body-bg);
    color: #111827;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
}

.layout {
    min-height: 100vh;
}

.sidebar {
    width: 290px;
    background: linear-gradient(165deg, #052f52 0%, var(--sidebar-bg) 45%, var(--sidebar-bg-soft) 100%);
    color: #fff;
    box-shadow: 12px 0 35px rgba(7,59,102,.12);
}

@media (min-width: 992px) {
    .sidebar {
        min-height: 100vh;
        position: sticky;
        top: 0;
    }

    .content {
        width: calc(100% - 290px);
    }
}

.brand-box {
    padding: 1.15rem 1rem;
    border-bottom: 1px solid rgba(255,255,255,.12);
    min-height: 86px;
    background: rgba(0,0,0,.08);
}

.brand-logo-wrap{width:42px;height:42px;display:grid;place-items:center;flex:0 0 42px;border-radius:11px;background:#fff;padding:5px;box-shadow:0 8px 20px rgba(0,0,0,.18)}
.brand-logo-img{width:100%;height:100%;object-fit:contain}

.brand {
    color: #fff;
    font-weight: 800;
    font-size: 1.05rem;
    line-height: 1.2;
    margin: 0;
}

.brand small {
    display: block;
    font-weight: 400;
    color: #bfdbfe;
    margin-top: .25rem;
}

.sidebar-menu {
    padding: 1rem;
    max-height:calc(100vh - 86px);
    overflow-y:auto;
    scrollbar-width:thin;
    scrollbar-color:rgba(255,255,255,.25) transparent;
}

.menu-label {
    color: #bfdbfe;
    font-size: .72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em;
    padding: .75rem .75rem .35rem;
}

.nav-link,
.nav-parent {
    width: 100%;
    color: #dbeafe;
    border: 0;
    background: transparent;
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .75rem;
    padding: .76rem .88rem;
    border-radius: .75rem;
    font-weight: 600;
    transition: all .18s ease;
}

.nav-link:hover,
.nav-parent:hover {
    background: var(--sidebar-hover);
    color: #fff;
}

.nav-link.active,
.nav-sublink.active {
    background: var(--sidebar-active);
    color: var(--sidebar-active-text);
    font-weight: 700;
    box-shadow:0 7px 18px rgba(0,0,0,.13);
}

.nav-left {
    display: flex;
    align-items: center;
    gap: .65rem;
    min-width: 0;
}

.nav-icon {
    width: 1.35rem;
    text-align: center;
    flex: 0 0 auto;
}

.chevron {
    transition: transform .18s ease;
    font-size: .85rem;
}

.nav-parent:not(.collapsed) .chevron {
    transform: rotate(180deg);
}

.submenu {
    margin: .25rem 0 .55rem 2.05rem;
    padding-left: .75rem;
    border-left: 1px solid rgba(255,255,255,.2);
}

.nav-sublink {
    color: #dbeafe;
    text-decoration: none;
    display: block;
    padding: .55rem .75rem;
    margin: .15rem 0;
    border-radius: .5rem;
    font-size: .93rem;
    transition: all .18s ease;
}

.nav-sublink:hover {
    color: #fff;
    background: var(--sidebar-hover);
}

.topbar {
    min-height: 72px;
    background: rgba(255,255,255,.96);
    border-bottom: 1px solid #e2e8f0;
    position: sticky;
    top: 0;
    z-index: 1020;
    backdrop-filter:blur(12px);
    box-shadow:0 4px 18px rgba(15,23,42,.04);
}

.topbar-app{display:flex;align-items:center;gap:.7rem;color:#0f172a;font-weight:800;font-size:.94rem}.topbar-app span{display:flex;flex-direction:column;line-height:1.15}.topbar-app small{color:#64748b;font-size:.66rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.15rem}.topbar-logo{width:26px;height:26px;object-fit:contain}

.content {
    min-width: 0;
}

.card {
    border-radius: .75rem;
    border: 1px solid #e5e7eb;
    box-shadow: 0 8px 20px rgba(15, 23, 42, .04);
}

.btn-menu {
    border: 1px solid #e5e7eb;
    background: #fff;
}

.account-trigger{display:flex;align-items:center;gap:.6rem;max-width:min(280px,48vw);border:1px solid #dce5ee;background:#fff;border-radius:999px;padding:.3rem .65rem .3rem .35rem;color:#0f172a;line-height:1.15;transition:.18s;box-shadow:0 4px 12px rgba(15,23,42,.05)}.account-trigger:hover,.account-trigger[aria-expanded=true]{border-color:#9cb9cf;background:#f8fbfd;box-shadow:0 7px 20px rgba(11,79,138,.12)}.account-trigger:focus-visible{outline:3px solid rgba(14,116,180,.2);outline-offset:2px}.account-trigger:after{flex:0 0 auto;color:#64748b;margin-left:.1rem}.account-avatar{width:34px;height:34px;min-width:34px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#073b66,#0b6aa5);color:#fff;font-size:.85rem;font-weight:900;box-shadow:0 4px 12px rgba(11,79,138,.25)}.account-copy{min-width:0;text-align:left;max-width:190px}.account-copy strong,.account-copy small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.account-copy strong{font-size:.8rem}.account-copy small{font-size:.67rem;color:#64748b;margin-top:.1rem}.account-menu{width:min(310px,calc(100vw - 24px));padding:.55rem;border:1px solid #e2e8f0;border-radius:.9rem;background:#fff;box-shadow:0 20px 45px rgba(15,23,42,.18);margin-top:.55rem!important;overflow:hidden}.account-menu-head{display:flex;align-items:center;gap:.75rem;min-width:0;padding:.6rem}.account-menu-head>div{min-width:0}.account-avatar-lg{width:42px!important;height:42px!important;min-width:42px!important}.account-menu-head strong,.account-menu-head small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.account-menu-head strong{font-size:.87rem}.account-menu-head small{font-size:.71rem;color:#64748b}.account-menu .dropdown-divider{margin:.35rem 0;border-color:#edf2f7}.account-menu .dropdown-item{display:flex;align-items:center;gap:.7rem;width:100%;border-radius:.65rem;padding:.65rem;color:#334155;white-space:normal}.account-menu .dropdown-item:hover,.account-menu .dropdown-item:focus{background:#eef4f9;color:#073b66}.account-menu .dropdown-item i{width:32px;height:32px;flex:0 0 32px;display:grid;place-items:center;background:#eaf2f8;border-radius:.6rem;color:#0b4f8a;font-size:.95rem}.account-menu .dropdown-item span,.account-menu .dropdown-item small{display:block}.account-menu .dropdown-item span{font-size:.82rem;font-weight:700;line-height:1.2}.account-menu .dropdown-item small{font-size:.67rem;color:#64748b;font-weight:500;margin-top:.1rem}.account-menu form{margin:0}.account-menu .account-logout{color:#b42318}.account-menu .account-logout:hover,.account-menu .account-logout:focus{background:#fff5f4;color:#9f1d14}.account-menu .account-logout i{background:#fff0ee;color:#b42318}

.account-modal .modal-content{border:0;border-radius:1.1rem;box-shadow:0 25px 60px rgba(15,23,42,.2);overflow:hidden}.account-modal .modal-header{background:linear-gradient(135deg,#073b66,#0b4f8a);color:#fff;border:0;padding:1.15rem 1.25rem}.account-modal .modal-header p{font-size:.78rem;color:rgba(255,255,255,.76)}.account-modal .modal-header .btn-close{filter:brightness(0) invert(1)}.account-modal .modal-body{padding:1.25rem}.account-modal .modal-footer{border-top:1px solid #edf2f7;padding: .85rem 1.25rem}.profile-summary{display:flex;align-items:center;gap:1rem;padding:1rem;background:#eef4f9;border-radius:1rem;margin-bottom:1rem}.profile-avatar{width:58px;height:58px;font-size:1.25rem;flex:0 0 58px}.profile-summary h3{font-size:1rem;font-weight:800;margin:0;color:#073b66}.profile-summary p{font-size:.78rem;color:#64748b;margin:.2rem 0 0}.profile-data{display:grid;grid-template-columns:1fr 1fr;gap:.75rem}.profile-data>div{padding:.85rem;border:1px solid #e2e8f0;border-radius:.8rem;background:#fff}.profile-data small,.profile-data strong{display:block}.profile-data small{font-size:.7rem;color:#64748b;font-weight:700;margin-bottom:.25rem}.profile-data strong{font-size:.82rem;color:#1e293b;word-break:break-word}.account-modal .form-label{font-weight:700;color:#334155}.account-modal .form-control{min-height:44px;border-radius:.75rem;border-color:#cfd9e5}

@media (max-width: 991.98px) {
    .sidebar {
        width: 310px;
    }

    .container-fluid {
        padding: 1rem !important;
    }
    .topbar-app small{display:none}.account-menu{width:min(310px,calc(100vw - 24px))}.profile-data{grid-template-columns:1fr}
}
