/* Grouped navigation, public order tracking and Reports charts */

/* --- Sidebar: pin brand + profile/logout, scroll only the nav list ---
   Fixes the profile/Log-out block being clipped when the menu is taller
   than the screen (tablet & short laptop viewports). */
aside{overflow:hidden}
aside .brand{flex:none}
aside nav{flex:1 1 auto;min-height:0;overflow-y:auto;overflow-x:hidden;overscroll-behavior:contain;scrollbar-width:thin}
aside .help{flex:none;margin-top:14px}
aside .user{flex:none}
@media (max-width:1180px){ aside nav{flex:1 1 auto!important} }

/* --- Grouped sidebar navigation --- */
.nav-group{display:flex;flex-direction:column;gap:3px;margin-bottom:5px}
.nav-group-label{margin:10px 12px 2px;font-size:7.5px;letter-spacing:2px;text-transform:uppercase;color:#7f97b0}
.nav-group:first-child .nav-group-label{margin-top:2px}
.lang-my .nav-group-label{letter-spacing:normal;text-transform:none}

/* --- Offline indicator --- */
.offline-bar{position:fixed;left:12px;bottom:12px;z-index:70;max-width:min(360px,calc(100vw - 24px));background:#5a3d00;color:#fff;font:600 11px/1.4 'DM Sans',sans-serif;padding:10px 14px;border-radius:10px;box-shadow:0 8px 24px rgba(4,10,20,.28)}
.lang-my .offline-bar{font-family:'Padauk','Noto Sans Myanmar','Myanmar Text',sans-serif}
@media (max-width:767px){ .is-offline .pos-mobilebar{bottom:calc(58px + env(safe-area-inset-bottom))} }

/* --- Public order tracking --- */
.track-card{width:min(560px,100%)}
.track-page .auth-card>p{margin-bottom:18px}
.track-link{margin-top:12px!important}
.tracker{margin-top:22px;border-top:1px solid var(--line);padding-top:20px}
.tracker-head{display:flex;flex-wrap:wrap;gap:10px 28px;margin-bottom:20px}
.tracker-head span{display:block;font-size:8px;color:var(--muted);text-transform:uppercase;letter-spacing:1.5px}
.tracker-head b{font:700 15px Manrope;margin-top:2px;display:block}
.tracker-steps{list-style:none;margin:0;padding:0}
.tracker-steps li{display:flex;gap:13px;align-items:flex-start;position:relative;padding-bottom:22px}
.tracker-steps li:last-child{padding-bottom:0}
.tracker-steps li:not(:last-child)::before{content:"";position:absolute;left:13px;top:28px;bottom:0;width:2px;background:var(--line)}
.tracker-steps li.done:not(:last-child)::before{background:#1f66c2}
.tracker-steps .dot{flex:none;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:#eef2f7;color:var(--muted);font-size:11px;font-weight:700}
.tracker-steps li.done .dot{background:#1f66c2;color:#fff}
.tracker-steps li.current .dot{background:#11156f;color:#fff;box-shadow:0 0 0 4px #11156f22}
.tracker-steps .dot svg{width:15px}
.tracker-steps p{margin:4px 0 0;font-size:12px;font-weight:600;color:var(--muted)}
.tracker-steps li.done p,.tracker-steps li.current p{color:var(--ink)}
.tracker-meta{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;margin-top:6px}
.tracker-meta div{display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--line);padding:9px 0}
.tracker-meta dt{color:var(--muted);font-size:10px}
.tracker-meta dd{margin:0;font-size:10px;font-weight:700;text-align:right}

/* --- Reports charts --- */
.report-charts{margin-top:18px}
.chart-block{margin-top:22px}
.chart-block:first-of-type{margin-top:16px}
.chart-block h4{font:700 12px Manrope;margin:0 0 14px}
.hbars{display:grid;gap:9px}
.hbar{display:grid;grid-template-columns:minmax(84px,1.3fr) 3fr minmax(72px,auto);gap:10px;align-items:center}
.hbar-label{font-size:10px;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hbar-track{background:#eef2f7;border-radius:5px;height:16px;overflow:hidden}
.hbar-fill{display:block;height:100%;border-radius:5px;min-width:3px}
.hbar-value{font-size:10px;font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.hbar-value em{color:var(--muted);font-style:normal;font-size:9px}
.vbars{display:flex;align-items:flex-end;gap:10px;height:210px;padding-top:22px}
.vbar{flex:1;display:flex;flex-direction:column;align-items:center;height:100%;gap:6px}
.vbar b{font-size:9px;font-variant-numeric:tabular-nums;color:var(--muted)}
.vbar-track{flex:1;width:100%;max-width:48px;display:flex;align-items:flex-end;background:repeating-linear-gradient(to top,#f4f6f9 0 1px,transparent 1px 34px)}
.vbar-fill{width:100%;border-radius:4px 4px 0 0;min-height:3px}
.vbar-label{font-size:9px;color:var(--muted)}

@media(max-width:560px){
 .hbar{grid-template-columns:1fr 1.8fr auto}
 .tracker-meta{grid-template-columns:1fr}
 .vbars{gap:6px}
}
@media(prefers-reduced-motion:no-preference){
 .hbar-fill,.vbar-fill{transition:width .35s ease,height .35s ease}
}