:root{
    --primary:#1769ff;
    --primary-dark:#0e4fd4;
    --primary-soft:#eaf2ff;
    --teal:#0bb8a9;
    --teal-soft:#e9fbf8;
    --green:#18a866;
    --green-soft:#e9f9f0;
    --orange:#ff9914;
    --orange-soft:#fff4e3;
    --red:#eb4767;
    --red-soft:#fff0f3;
    --purple:#7957d5;
    --ink:#17233c;
    --muted:#6c7890;
    --line:#e6ebf3;
    --surface:#f7f9fc;
    --sidebar:244px;
    --shadow:0 8px 28px rgba(39,60,99,.07);
}

*{box-sizing:border-box}
html,body{min-height:100%}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;background:var(--surface);color:var(--ink)}
a{text-decoration:none}.btn{font-weight:600;border-radius:10px}.btn-primary{background:linear-gradient(135deg,#1769ff,#1684ff);border:0;box-shadow:0 8px 18px rgba(23,105,255,.18)}.btn-primary:hover{background:linear-gradient(135deg,#0e5be8,#0778ef)}

/* Shell */
.hms-shell{display:flex;min-height:100vh}.hms-sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar);background:#fff;border-right:1px solid var(--line);padding:20px 15px;display:flex;flex-direction:column;z-index:1045;overflow-y:auto}.brand{display:flex;align-items:center;gap:11px;padding:3px 7px 21px;position:relative}.brand-mark{width:45px;height:45px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(135deg,#05a9af,#20c99e);color:#fff;font-size:23px;box-shadow:0 10px 22px rgba(11,184,169,.22)}.brand strong{display:block;color:var(--primary);font-size:23px;line-height:1.05}.brand small{display:block;color:var(--muted);font-size:12px;margin-top:4px}.sidebar-close{position:absolute;right:0;top:7px;border:0;background:transparent;color:var(--muted)}.hms-nav{gap:4px}.hms-nav .nav-link{display:flex;align-items:center;gap:12px;padding:10px 13px;border-radius:10px;color:#35435b;font-weight:600;font-size:14px;transition:.18s}.hms-nav .nav-link i{width:22px;font-size:18px}.hms-nav .nav-link:hover{background:#f0f5ff;color:var(--primary)}.hms-nav .nav-link.active{color:#fff;background:linear-gradient(135deg,#236cff,#1684ff);box-shadow:0 8px 18px rgba(23,105,255,.22)}.support-card{margin-top:auto;background:linear-gradient(135deg,#edfbfa,#f8fffe);border:1px solid #d5f1ee;border-radius:15px;padding:15px;display:flex;gap:12px;color:#087c73}.support-card>i{font-size:29px}.support-card strong,.support-card small,.support-card a{display:block}.support-card small{color:#668684;font-size:12px}.support-card a{margin-top:8px;color:#079388;font-size:12px;font-weight:700}.sidebar-backdrop{display:none}
.hms-main{margin-left:var(--sidebar);width:calc(100% - var(--sidebar));min-height:100vh}.hms-topbar{height:82px;padding:0 26px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:13px;position:sticky;top:0;z-index:1035}.topbar-heading h5{font-size:16px;font-weight:700;margin:0}.topbar-heading small{font-size:12px;color:var(--muted)}.top-search{display:flex;align-items:center;gap:10px;border:1px solid var(--line);background:#fbfcff;border-radius:28px;padding:9px 16px;width:min(370px,32vw)}.top-search input{width:100%;border:0;outline:0;background:transparent;color:var(--ink);font-size:13px}.quick-add-btn{display:inline-flex;align-items:center;gap:8px;color:#17233c;font-weight:700}.quick-add-btn>i{width:35px;height:35px;border-radius:50%;display:grid;place-items:center;background:var(--primary);color:#fff}.topbar-icon{width:40px;height:40px;border:1px solid transparent;background:#fff;display:grid;place-items:center;border-radius:50%;color:#33425a}.topbar-icon:hover{background:#f3f6fb}.topbar-badge{position:absolute;right:1px;top:0;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:#e82445;color:#fff;font-size:10px;display:grid;place-items:center}.user-menu-button{display:flex;align-items:center;gap:9px;border:0}.user-avatar{width:39px;height:39px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#0fb7a8,#1769ff);color:#fff;font-weight:800}.user-copy{text-align:left;line-height:1.15}.user-copy strong,.user-copy small{display:block}.user-copy strong{font-size:13px}.user-copy small{font-size:11px;color:var(--muted);margin-top:3px}.content-area{padding:25px 27px 35px}

/* Shared components */
.hms-card{border:1px solid var(--line);border-radius:16px;box-shadow:var(--shadow);overflow:hidden;background:#fff}.hms-card .card-header{background:#fff;border-bottom:1px solid var(--line);padding:17px 20px;display:flex;justify-content:space-between;align-items:center}.hms-card .card-header h5{margin:0;font-size:15px;font-weight:750}.hms-card .card-header small{display:block;color:var(--muted);font-size:11px;margin-top:3px}.hms-card .card-header>a{font-size:12px;font-weight:700;color:var(--primary)}.table{margin:0}.table thead th{background:#f9fbfe;color:#65738b;text-transform:uppercase;font-size:10px;letter-spacing:.045em;border-bottom:1px solid var(--line);padding:13px 15px;white-space:nowrap}.table td{padding:13px 15px;border-color:#edf1f6;font-size:13px}.person-cell{display:flex;align-items:center;gap:10px}.person-cell strong,.person-cell small{display:block}.person-cell small{font-size:11px;color:var(--muted);margin-top:2px}.avatar{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--primary-soft);color:var(--primary);font-size:11px;font-weight:800;flex:0 0 auto}.avatar-lg{width:39px;height:39px}.status{display:inline-flex;padding:5px 10px;border-radius:20px;font-size:11px;font-weight:700}.status-success{background:#e8f8ef;color:#138553}.status-warning{background:#fff3df;color:#c77800}.status-danger{background:#ffe8ed;color:#d92d53}.status-info{background:#e8f1ff;color:#1769ff}.status-secondary{background:#eef1f5;color:#65738b}.status-dark{background:#e8eaf0;color:#2c3548}.form-control,.form-select{border-color:#dfe6f0;border-radius:9px;min-height:42px;font-size:13px;box-shadow:none}.form-control:focus,.form-select:focus{border-color:#8db4ff;box-shadow:0 0 0 .2rem rgba(23,105,255,.08)}.form-label{font-size:12px;font-weight:650;color:#34425a;margin-bottom:6px}.page-actions{display:flex;justify-content:space-between;align-items:center;margin-bottom:22px}.page-actions h2{font-weight:800;margin:0}.page-actions p{margin:5px 0 0;color:var(--muted)}.card-toolbar{display:flex;gap:12px;align-items:center;padding:16px 18px;border-bottom:1px solid var(--line)}.search-control{display:flex;align-items:center;gap:10px;border:1px solid var(--line);border-radius:10px;padding:9px 13px;background:#fff;min-width:320px}.search-control input{border:0;outline:0;width:100%}.card-footer{background:#fff;border-top:1px solid var(--line);padding:14px 18px}.pagination{margin:0}

/* Dashboard */
.dashboard-welcome{display:flex;align-items:center;justify-content:space-between;gap:18px}.dashboard-welcome .eyebrow{display:inline-block;color:var(--primary);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.1em;margin-bottom:5px}.dashboard-welcome h2{font-size:24px;font-weight:800}.dashboard-welcome p{color:var(--muted);font-size:13px}.dashboard-actions{display:flex;gap:10px}.dashboard-stat{position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:16px;min-height:118px;padding:18px;display:flex;align-items:center;gap:14px;box-shadow:var(--shadow)}.dashboard-stat-icon{width:55px;height:55px;border-radius:50%;display:grid;place-items:center;font-size:23px;flex:0 0 auto}.dashboard-stat-content{min-width:0}.dashboard-stat-content>span{font-size:12px;color:#526078;display:block}.dashboard-stat-content strong{display:block;font-size:22px;margin:4px 0;white-space:nowrap}.dashboard-stat-content small{font-size:10px;color:#26945f}.mini-sparkline{position:absolute;right:14px;bottom:14px;font-size:26px;opacity:.75}.stat-blue{background:linear-gradient(135deg,#fff,#f4f8ff)}.stat-blue .dashboard-stat-icon{background:#e7f1ff;color:var(--primary)}.stat-blue .mini-sparkline{color:var(--primary)}.stat-green{background:linear-gradient(135deg,#fff,#f3fcf7)}.stat-green .dashboard-stat-icon{background:var(--green-soft);color:var(--green)}.stat-green .mini-sparkline{color:var(--green)}.stat-orange{background:linear-gradient(135deg,#fff,#fff9f0)}.stat-orange .dashboard-stat-icon{background:var(--orange-soft);color:var(--orange)}.stat-orange .mini-sparkline{color:var(--orange)}.stat-teal{background:linear-gradient(135deg,#fff,#f1fcfb)}.stat-teal .dashboard-stat-icon{background:var(--teal-soft);color:var(--teal)}.stat-teal .mini-sparkline{color:var(--teal)}.chart-card .card-body{padding:17px}.chart-wrap{height:260px;position:relative}.appointment-chart-layout,.bed-chart-layout{display:flex;align-items:center;gap:20px}.donut-wrap{width:155px;height:155px;position:relative;flex:0 0 155px}.donut-wrap canvas{position:relative;z-index:1}.donut-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;pointer-events:none}.donut-center strong{font-size:22px}.donut-center span{font-size:11px;color:var(--muted)}.chart-legend{flex:1}.chart-legend>div{display:grid;grid-template-columns:12px 1fr auto;align-items:center;gap:8px;padding:7px 0;font-size:11px}.chart-legend strong{font-size:11px}.legend-dot{width:8px;height:8px;border-radius:50%}.legend-total{border-top:1px solid var(--line);margin-top:5px;padding-top:11px!important;grid-template-columns:1fr auto!important}.recent-patients-card{min-height:425px}.alert-card .card-body{background:linear-gradient(135deg,#fff,#fff8fa)}.stock-alert-row{display:flex;align-items:center;gap:11px;padding:13px 18px;border-bottom:1px solid #f3e9ec;font-size:12px}.stock-alert-row:last-child{border-bottom:0}.stock-alert-row strong,.stock-alert-row small{display:block}.stock-alert-row small{color:var(--muted);font-size:10px;margin-top:2px}.stock-alert-row>span:last-child{font-size:10px;color:#8a5360}.stock-warning{color:var(--red)}.bed-card .card-body{padding:15px 18px}.bed-donut{width:135px;height:135px;flex-basis:135px}

/* Patient registration */
.registration-header{display:flex;align-items:flex-end;justify-content:space-between;gap:18px}.registration-header h2{font-size:24px;font-weight:800;margin:7px 0 3px}.registration-header p{font-size:13px;color:var(--muted);margin:0}.breadcrumb-line{display:flex;align-items:center;gap:8px;font-size:11px;color:#7c879b}.breadcrumb-line a{color:#6d7890}.breadcrumb-line i{font-size:10px}.registration-header-actions{display:flex;gap:9px}.registration-section>.section-title{display:flex;align-items:center;gap:11px;padding:17px 20px;border-bottom:1px solid var(--line);background:#fff}.section-title>span{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:var(--primary-soft);color:var(--primary);font-size:12px;font-weight:800}.section-title h5,.section-title p{margin:0}.section-title h5{color:var(--primary);font-size:14px;font-weight:800}.section-title p{color:var(--muted);font-size:10px;margin-top:3px}.registration-section .card-body{padding:20px}.photo-upload-box{width:100%;min-height:157px;border:1.5px dashed #bdc9dc;border-radius:12px;background:#fbfcff;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#61708a;cursor:pointer;overflow:hidden}.photo-upload-box:hover{border-color:var(--primary);background:#f5f8ff}.photo-upload-box i{font-size:32px;margin-bottom:7px}.photo-upload-box strong,.photo-upload-box small{display:block}.photo-upload-box strong{font-size:12px}.photo-upload-box small{font-size:9px;color:#8c97aa;margin-top:4px}.photo-upload-box img{width:100%;height:157px;object-fit:cover}.payment-info-note{display:flex;align-items:center;gap:12px;padding:15px;border-radius:11px;background:#f6f9ff;border:1px solid #e3ebf8}.payment-info-note>i{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:var(--primary-soft);color:var(--primary);font-size:20px}.payment-info-note strong,.payment-info-note small{display:block}.payment-info-note small{color:var(--muted);font-size:10px;margin-top:3px}.repeater-row{padding:11px;border:1px solid var(--line);border-radius:11px;background:#fbfcfe}.registration-aside .card-body{padding:18px}.tip-line{display:flex;gap:10px;margin-bottom:14px;font-size:11px;line-height:1.5;color:#536178}.tip-line:last-child{margin-bottom:0}.tip-line i{color:var(--green);margin-top:2px}.aside-benefit{display:flex;gap:10px;align-items:flex-start;margin-top:14px}.aside-benefit>span{width:36px;height:36px;flex:0 0 36px;border-radius:50%;display:grid;place-items:center;background:var(--teal-soft);color:var(--teal)}.aside-benefit strong,.aside-benefit small{display:block}.aside-benefit strong{font-size:11px;color:#087c73}.aside-benefit small{font-size:10px;color:var(--muted);margin-top:2px}.summary-row{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid var(--line);font-size:11px}.summary-row:last-of-type{border-bottom:0}.sticky-action-card{position:sticky;top:102px}

/* Existing pages */
.stat-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px;display:flex;align-items:center;gap:16px;min-height:125px;box-shadow:var(--shadow)}.stat-icon{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font-size:25px}.stat-card span{display:block;color:#536078;font-size:14px}.stat-card strong{display:block;font-size:24px;margin:5px 0}.stat-card small{color:#24a46d}.tone-blue .stat-icon{background:#eaf2ff;color:#1769ff}.tone-green .stat-icon{background:#e9f9f0;color:#16a765}.tone-orange .stat-icon{background:#fff4e4;color:#ff8f00}.tone-teal .stat-icon{background:#e8faf8;color:#0ba99b}.tone-red .stat-icon{background:#ffecef;color:#ef476f}.tone-purple .stat-icon{background:#f1edff;color:#7957d5}.form-section{padding:22px}.form-section h5{font-weight:750;color:var(--primary);padding-bottom:14px;border-bottom:1px dashed var(--line);margin-bottom:18px}.tip-card{padding:20px}.tip-card h5{font-weight:700;color:#18375c}.tip-card ul{padding-left:20px;color:#55657b}.tip-card li{margin:12px 0}.quick-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:18px}.quick-actions a{border:1px solid var(--line);border-radius:12px;padding:18px;color:#33425a;display:flex;flex-direction:column;gap:8px}.quick-actions i{font-size:24px;color:var(--primary)}.metric-circle{width:165px;height:165px;border-radius:50%;margin:26px auto;display:flex;flex-direction:column;align-items:center;justify-content:center;border:14px solid #dbf5f1;box-shadow:inset 0 0 0 4px var(--teal)}.metric-circle strong{font-size:38px}.metric-circle span{color:var(--muted)}

/* Login remains compatible */
.login-body{background:#f7faff}.login-hero{background:radial-gradient(circle at 80% 50%,#e6f3ff 0,transparent 38%),linear-gradient(135deg,#f4f9ff,#e9f4ff);align-items:center;padding:8vw;position:relative;overflow:hidden}.login-hero:after{content:"";position:absolute;width:500px;height:500px;border-radius:50%;background:linear-gradient(145deg,rgba(23,105,255,.12),rgba(11,184,169,.12));right:-130px;bottom:-180px}.hero-content{max-width:700px;position:relative;z-index:1}.brand.big strong{font-size:31px}.hero-content h1{font-size:54px;line-height:1.08;margin:48px 0 22px;font-weight:800}.hero-content h1 span{color:var(--primary)}.hero-content>p{font-size:18px;color:#5f6e86;max-width:590px}.feature-card{height:150px;background:rgba(255,255,255,.78);border:1px solid rgba(255,255,255,.9);border-radius:16px;padding:18px;display:flex;flex-direction:column;gap:7px;box-shadow:0 10px 25px rgba(23,105,255,.06)}.feature-card i{font-size:27px;color:var(--primary)}.feature-card small{color:var(--muted)}.login-card{width:min(100%,550px);background:#fff;border:1px solid var(--line);border-radius:22px;padding:48px;box-shadow:0 20px 50px rgba(31,59,105,.1)}.login-card h2{font-size:34px;font-weight:800}.login-card .input-group-text{background:#fff;border-color:#dfe6f0}.security-note{text-align:center;color:#728098;font-size:13px;margin-top:30px}

@media(max-width:1399.98px){.appointment-chart-layout,.bed-chart-layout{flex-direction:column}.chart-legend{width:100%}.chart-legend>div{padding:5px 0}.sticky-action-card{position:static}}
@media(max-width:1199.98px){.dashboard-stat-content strong{font-size:19px}.chart-wrap{height:235px}}
@media(max-width:991.98px){.hms-sidebar{transform:translateX(-100%);transition:.2s ease}.hms-sidebar.show{transform:translateX(0)}.sidebar-backdrop.show{display:block;position:fixed;inset:0;background:rgba(17,29,52,.38);z-index:1040}.hms-main{margin-left:0;width:100%}.content-area{padding:18px}.hms-topbar{padding:0 15px}.dashboard-welcome,.registration-header{align-items:flex-start}.registration-header{flex-direction:column}.registration-header-actions{width:100%;flex-wrap:wrap}.login-card{padding:28px}}
@media(max-width:767.98px){.dashboard-welcome{flex-direction:column;align-items:flex-start}.dashboard-actions{width:100%;flex-wrap:wrap}.dashboard-actions .btn{flex:1}.appointment-chart-layout,.bed-chart-layout{flex-direction:row}.registration-header-actions .btn{flex:1}.photo-upload-box{max-width:180px}.card-toolbar{flex-wrap:wrap}.search-control{min-width:100%}}
@media(max-width:575.98px){.content-area{padding:14px}.appointment-chart-layout,.bed-chart-layout{flex-direction:column}.page-actions{align-items:flex-start;flex-direction:column}.quick-actions{grid-template-columns:1fr}.registration-header-actions{display:grid;grid-template-columns:1fr 1fr}.registration-header-actions .btn-primary{grid-column:1 / -1}.dashboard-stat{min-height:105px}.chart-wrap{height:210px}.topbar-heading{display:none!important}}

/* ==========================================================
   SUMAIT BRAND LOGO
   ========================================================== */

.sumait-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 78px;
    padding: 10px 14px;
}

.brand-logo-link {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 56px;
    width: 56px;
    height: 56px;
    padding: 3px;
    text-decoration: none;
    border-radius: 10px;
    background: #ffffff;
}

.sumait-logo {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.brand-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.brand-text strong {
    color: #08783f;
    font-size: 17px;
    font-weight: 800;
    line-height: 1.2;
}

.brand-text small {
    margin-top: 3px;
    color: #6c7789;
    font-size: 10px;
    font-weight: 500;
    line-height: 1.3;
}

@media (max-width: 1199.98px) {
    .brand-text strong {
        font-size: 15px;
    }

    .brand-text small {
        font-size: 9px;
    }
}

/* ==========================================================
   SIDEBAR COMPONENT
   ========================================================== */

.hms-sidebar {
    position: fixed;
    z-index: 1045;
    pointer-events: auto;
}

.hms-nav,
.hms-nav .nav-link,
.hms-menu-group,
.hms-menu-group summary,
.hms-submenu,
.hms-submenu a {
    pointer-events: auto;
}

.sidebar-backdrop {
    pointer-events: none;
}

/* ==========================================================
   USERS SUBMENU
   ========================================================== */

.hms-menu-group {
    position: relative;
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
}

.hms-menu-group > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 46px;
    padding: 11px 14px;
    color: #34425d;
    font-size: 14px;
    font-weight: 600;
    list-style: none;
    cursor: pointer;
    user-select: none;
    border-radius: 10px;
    transition:
        color 0.18s ease,
        background 0.18s ease,
        box-shadow 0.18s ease;
}

.hms-menu-group > summary::-webkit-details-marker {
    display: none;
}

.hms-menu-group > summary::marker {
    display: none;
    content: "";
}

.hms-menu-group > summary:hover {
    color: #1769ff;
    background: #eef4ff;
}

.hms-menu-group > summary.active {
    color: #ffffff;
    background: linear-gradient(
        135deg,
        #1769ff,
        #2688ff
    );
    box-shadow:
        0 8px 18px
        rgba(23, 105, 255, 0.22);
}

.hms-menu-group .menu-label {
    display: flex;
    align-items: center;
    gap: 13px;
}

.hms-menu-group .menu-label > i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    font-size: 18px;
}

.hms-menu-group .submenu-arrow {
    width: auto;
    margin-left: auto;
    font-size: 12px;
    transition: transform 0.2s ease;
}

.hms-menu-group[open] .submenu-arrow {
    transform: rotate(180deg);
}

.hms-submenu {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin: 5px 0 8px;
    padding-left: 28px;
}

.hms-submenu a {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 39px;
    padding: 8px 11px;
    color: #66758e;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none;
    border-radius: 8px;
    cursor: pointer;
    transition:
        color 0.18s ease,
        background 0.18s ease;
}

.hms-submenu a i {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 17px;
    font-size: 14px;
}

.hms-submenu a:hover {
    color: #1769ff;
    background: #eef4ff;
}

.hms-submenu a.active {
    color: #1769ff;
    background: #e6efff;
}

/* ==========================================================
   MOBILE SIDEBAR
   ========================================================== */

@media (max-width: 991.98px) {
    body.sidebar-open {
        overflow: hidden;
    }

    .hms-sidebar {
        transform: translateX(-100%);
        transition: transform 0.22s ease;
    }

    .hms-sidebar.show {
        transform: translateX(0);
    }

    .sidebar-backdrop {
        position: fixed;
        inset: 0;
        z-index: 1040;
        visibility: hidden;
        opacity: 0;
        background: rgba(12, 22, 40, 0.5);
        transition:
            visibility 0.2s ease,
            opacity 0.2s ease;
    }

    .sidebar-backdrop.show {
        visibility: visible;
        opacity: 1;
        pointer-events: auto;
    }
}

/* ==========================================================
   IMPROVED SIDEBAR STRUCTURE
   ========================================================== */

.hms-sidebar {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    z-index: 1045;
    display: flex;
    flex-direction: column;
    width: 305px;
    overflow: hidden;
    border-right: 1px solid #e3e9f1;
    background: #ffffff;
    box-shadow: 7px 0 30px rgba(22, 36, 61, 0.04);
}

.sidebar-navigation {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 13px 16px 20px;
    scrollbar-width: thin;
    scrollbar-color: #cdd6e2 transparent;
}

.sidebar-navigation::-webkit-scrollbar {
    width: 5px;
}

.sidebar-navigation::-webkit-scrollbar-track {
    background: transparent;
}

.sidebar-navigation::-webkit-scrollbar-thumb {
    border-radius: 20px;
    background: #cdd6e2;
}

.sidebar-section {
    margin-bottom: 18px;
}

.sidebar-section:last-child {
    margin-bottom: 0;
}

.sidebar-section-title {
    display: block;
    margin: 0 10px 7px;
    color: #9aa5b5;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}

/* ==========================================================
   BRAND
   ========================================================== */

.sumait-brand {
    display: flex;
    align-items: center;
    flex: 0 0 auto;
    gap: 11px;
    min-height: 108px;
    padding: 16px 20px;
    border-bottom: 1px solid #edf1f6;
}

.brand-logo-link {
    display: grid;
    place-items: center;
    width: 62px;
    height: 68px;
    flex: 0 0 62px;
    overflow: hidden;
    text-decoration: none;
}

.sumait-logo {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.brand-text {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.brand-text strong {
    color: #08783f;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: -0.5px;
    line-height: 1.2;
}

.brand-text small {
    margin-top: 4px;
    color: #728096;
    font-size: 10px;
    line-height: 1.4;
}

.sidebar-close {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    margin-left: auto;
    color: #56657b;
    border: 0;
    border-radius: 10px;
    background: #f2f5f9;
}

/* ==========================================================
   STANDARD NAVIGATION LINK
   ========================================================== */

.hms-nav {
    gap: 4px;
}

.hms-nav .nav-link {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 55px;
    padding: 9px 12px;
    color: #3f4e66;
    text-decoration: none;
    border-radius: 12px;
    transition:
        color 0.18s ease,
        background 0.18s ease,
        box-shadow 0.18s ease,
        transform 0.18s ease;
}

.hms-nav .nav-link:hover {
    color: #1769ff;
    background: #f0f5ff;
    transform: translateX(2px);
}

.hms-nav .nav-link.active {
    color: #ffffff;
    background:
        linear-gradient(
            135deg,
            #1769ff,
            #2688ff
        );
    box-shadow: 0 10px 23px rgba(23, 105, 255, 0.22);
}

.nav-icon {
    display: grid;
    place-items: center;
    width: 35px;
    height: 35px;
    flex: 0 0 35px;
    color: #4c5e78;
    font-size: 17px;
    border-radius: 10px;
    background: #f2f5f9;
}

.nav-link:hover .nav-icon {
    color: #1769ff;
    background: #ffffff;
}

.nav-link.active .nav-icon,
.hms-menu-group > summary.active .nav-icon {
    color: #1769ff;
    background: rgba(255, 255, 255, 0.95);
}

.nav-copy {
    display: flex;
    flex: 1;
    flex-direction: column;
    min-width: 0;
}

.nav-copy strong {
    overflow: hidden;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.25;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-copy small {
    display: block;
    margin-top: 3px;
    overflow: hidden;
    color: #929daf;
    font-size: 9px;
    font-weight: 500;
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.nav-link.active .nav-copy small,
.hms-menu-group > summary.active .nav-copy small {
    color: rgba(255, 255, 255, 0.76);
}

/* ==========================================================
   EXPANDABLE MENU GROUPS
   ========================================================== */

.hms-menu-group {
    display: block;
    width: 100%;
}

.hms-menu-group > summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 55px;
    padding: 9px 12px;
    color: #3f4e66;
    list-style: none;
    cursor: pointer;
    user-select: none;
    border-radius: 12px;
    transition:
        color 0.18s ease,
        background 0.18s ease,
        box-shadow 0.18s ease;
}

.hms-menu-group > summary::-webkit-details-marker {
    display: none;
}

.hms-menu-group > summary::marker {
    display: none;
    content: "";
}

.hms-menu-group > summary:hover {
    color: #1769ff;
    background: #f0f5ff;
}

.hms-menu-group > summary.active {
    color: #ffffff;
    background:
        linear-gradient(
            135deg,
            #1769ff,
            #2688ff
        );
    box-shadow: 0 10px 23px rgba(23, 105, 255, 0.22);
}

.hms-menu-group .menu-label {
    display: flex;
    align-items: center;
    flex: 1;
    gap: 12px;
    min-width: 0;
}

.submenu-arrow {
    flex: 0 0 auto;
    font-size: 11px;
    transition: transform 0.2s ease;
}

.hms-menu-group[open] .submenu-arrow {
    transform: rotate(180deg);
}

/* ==========================================================
   SUBMENU
   ========================================================== */

.hms-submenu {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin: 7px 0 4px 18px;
    padding: 3px 0 3px 19px;
    border-left: 1px solid #dce4ef;
}

.hms-submenu a {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    min-height: 48px;
    padding: 8px 10px;
    color: #5a6980;
    text-decoration: none;
    border-radius: 9px;
    transition:
        color 0.18s ease,
        background 0.18s ease,
        transform 0.18s ease;
}

.hms-submenu a:hover {
    color: #1769ff;
    background: #f0f5ff;
    transform: translateX(2px);
}

.hms-submenu a.active {
    color: #1769ff;
    background: #e9f1ff;
}

.hms-submenu a > i {
    display: grid;
    place-items: center;
    width: 26px;
    height: 26px;
    flex: 0 0 26px;
    margin-top: 1px;
    font-size: 13px;
    border-radius: 7px;
    background: #eef2f7;
}

.hms-submenu a.active > i {
    color: #ffffff;
    background: #1769ff;
}

.hms-submenu a > span {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.hms-submenu a strong {
    font-size: 11px;
    font-weight: 700;
    line-height: 1.3;
}

.hms-submenu a small {
    display: block;
    margin-top: 2px;
    overflow: hidden;
    color: #96a0af;
    font-size: 8px;
    line-height: 1.4;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* ==========================================================
   SIDEBAR FOOTER
   ========================================================== */

.sidebar-footer {
    flex: 0 0 auto;
    padding: 12px 15px 16px;
    border-top: 1px solid #edf1f6;
    background: #ffffff;
}

.support-card {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 12px;
    border: 1px solid #dceee4;
    border-radius: 13px;
    background:
        linear-gradient(
            135deg,
            #f1faf5,
            #ffffff
        );
}

.support-card-icon {
    display: grid;
    place-items: center;
    width: 39px;
    height: 39px;
    flex: 0 0 39px;
    color: #08783f;
    font-size: 17px;
    border-radius: 11px;
    background: #dff4e8;
}

.support-card-copy {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.support-card-copy strong {
    color: #26354b;
    font-size: 11px;
    font-weight: 700;
}

.support-card-copy small {
    margin-top: 1px;
    color: #7d899a;
    font-size: 8px;
}

.support-card-copy a {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 5px;
    color: #08783f;
    font-size: 8px;
    font-weight: 700;
    text-decoration: none;
}

/* ==========================================================
   MAIN CONTENT POSITION
   ========================================================== */

.hms-main {
    min-height: 100vh;
    margin-left: 305px;
}

/* ==========================================================
   MOBILE SIDEBAR
   ========================================================== */

@media (max-width: 991.98px) {
    body.sidebar-open {
        overflow: hidden;
    }

    .hms-sidebar {
        width: min(305px, 87vw);
        transform: translateX(-100%);
        transition: transform 0.22s ease;
    }

    .hms-sidebar.show {
        transform: translateX(0);
    }

    .hms-main {
        margin-left: 0;
    }

    .sidebar-backdrop {
        position: fixed;
        inset: 0;
        z-index: 1040;
        visibility: hidden;
        opacity: 0;
        pointer-events: none;
        background: rgba(12, 22, 40, 0.55);
        transition:
            visibility 0.2s ease,
            opacity 0.2s ease;
    }

    .sidebar-backdrop.show {
        visibility: visible;
        opacity: 1;
        pointer-events: auto;
    }
}

@media (max-width: 575.98px) {
    .sumait-brand {
        min-height: 94px;
        padding: 13px 16px;
    }

    .brand-logo-link {
        width: 54px;
        height: 60px;
        flex-basis: 54px;
    }

    .brand-text strong {
        font-size: 17px;
    }
}

/* ==========================================================
   SIDEBAR SUBMENU CLICK FIX
   ========================================================== */

.hms-sidebar {
    pointer-events: auto;
}

.sidebar-navigation,
.hms-nav,
.hms-menu-group,
.hms-menu-group > summary,
.hms-submenu,
.hms-submenu a {
    pointer-events: auto;
}

.hms-menu-group {
    position: relative;
    z-index: 1;
}

.hms-menu-group > summary {
    position: relative;
    z-index: 2;
}

.hms-submenu {
    position: relative;
    z-index: 10;
}

.hms-submenu a {
    position: relative;
    z-index: 11;
    cursor: pointer;
}

.hms-submenu a::before,
.hms-submenu a::after {
    pointer-events: none;
}

/*
|--------------------------------------------------------------------------
| Avoid invisible elements covering patient links
|--------------------------------------------------------------------------
*/

.patient-menu-group {
    overflow: visible;
}

.patient-submenu {
    overflow: visible;
}

.patient-submenu a {
    width: 100%;
    text-decoration: none;
}

/*
|--------------------------------------------------------------------------
| Make each submenu item easier to click
|--------------------------------------------------------------------------
*/

.patient-submenu a {
    min-height: 54px;
    padding: 9px 10px;
}

.patient-submenu a > span {
    flex: 1;
    min-width: 0;
}

.patient-submenu a strong,
.patient-submenu a small,
.patient-submenu a i {
    pointer-events: none;
}