/* Shared navigation: colored, code-native symbols and a compact icon rail. */
.shell { grid-template-columns:260px minmax(0,1fr); }
.shell .sidebar { width:260px; padding:12px; }
.sidebar-collapse { align-self:flex-end; flex:0 0 36px; display:grid; place-items:center; width:36px; height:36px; padding:7px; margin:0 0 6px; border:0; border-radius:9px; background:transparent; color:#c3ceda; cursor:pointer; }
.sidebar-collapse:hover { background:rgba(255,255,255,.12); color:#fff; }
.sidebar-collapse svg { width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.sidebar :is(button,[tabindex]):focus-visible { outline:2px solid #64d2ff; outline-offset:-2px; }
.shell .sidebar .brand { flex-shrink:0; padding:0 6px 12px; gap:8px; }
.shell .sidebar .brand-logo { width:100px; height:60px; }
.sidebar .nav-label { margin:18px 10px 8px; color:#91a3b6; font-size:10px; letter-spacing:.13em; }
.sidebar .nav { gap:4px; }
.sidebar .nav button { min-height:46px; padding:7px 10px; gap:11px; font-size:14px; line-height:20px; }
.sidebar .nav-icon { --icon-rgb:100,210,255; flex:0 0 30px; width:30px; height:30px; border:0; border-radius:0; background:transparent; color:rgb(var(--icon-rgb)); display:grid; place-items:center; }
.sidebar .nav-icon svg { display:block; width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.theme-toggle .theme-icon,html[data-theme] .theme-toggle .theme-icon { border:0; border-radius:0; background:transparent; box-shadow:none; color:var(--blue); }
html[data-theme] .sidebar .theme-icon { color:#c594ff; }
.sidebar .theme-icon svg { width:22px; height:22px; }
.sidebar .nav-icon-invoices,.sidebar .nav-icon-reconciliation { --icon-rgb:70,211,153; }
.sidebar .nav-icon-calendar,.sidebar .nav-icon-templates { --icon-rgb:255,126,161; }
.sidebar .nav-icon-quotes,.sidebar .nav-icon-documents { --icon-rgb:255,193,92; }
.sidebar .nav-icon-customers,.sidebar .nav-icon-projects { --icon-rgb:132,168,255; }
.sidebar .nav-icon-sources,.sidebar .nav-icon-vendors { --icon-rgb:197,148,255; }
.sidebar .nav-icon-reports,.sidebar .nav-icon-sow { --icon-rgb:108,218,226; }
.sidebar .nav-icon-settings { --icon-rgb:176,188,207; }
.sidebar .nav-text { flex:1; min-width:0; }
.sidebar .sidebar-theme-toggle { flex-shrink:0; min-height:48px; margin-top:12px; padding:7px 10px; }
.sidebar .sidebar-theme-toggle>span:nth-child(2),.sidebar .sidebar-theme-toggle>b { display:block; }
.sidebar .sidebar-foot { flex-shrink:0; padding:8px 4px 0; }
.sidebar .user-chip { gap:8px; }
.sidebar .sidebar-user-details { min-width:0; flex:1; }
.sidebar .sidebar-user-details strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.sidebar .logout { display:block; min-width:32px; min-height:36px; }
.sidebar-backdrop { display:none; }
.shell.sidebar-collapsed { grid-template-columns:76px minmax(0,1fr); }
.shell.sidebar-collapsed .sidebar { width:76px; padding:12px 8px; }
.sidebar-collapsed .sidebar-collapse { align-self:center; }
.sidebar-collapsed .sidebar-toggle-arrow { transform:translateX(29px) scaleX(-1); }
.shell.sidebar-collapsed .sidebar .brand { width:52px; height:44px; margin:0 auto 8px; padding:0; overflow:hidden; }
.shell.sidebar-collapsed .sidebar .brand-logo { width:52px; height:52px; flex:0 0 52px; clip-path:inset(0 0 35% 0); }
.sidebar-collapsed .sidebar :is(.brand-stack,.nav-label,.nav-text,.nav-count,.sidebar-user-details,.user-chip>.avatar),.sidebar-collapsed .sidebar-theme-toggle>span:nth-child(2),.sidebar-collapsed .sidebar-theme-toggle>b { display:none; }
.sidebar-collapsed .sidebar-nav-scroll { padding-right:0; }
.sidebar-collapsed .nav+.nav-label+.nav { border-top:1px solid rgba(255,255,255,.12); margin-top:12px; padding-top:12px; }
.sidebar-collapsed .sidebar .nav button { justify-content:center; padding:7px; }
.sidebar-collapsed .sidebar .sidebar-theme-toggle { justify-content:center; padding:7px; }
.sidebar-collapsed .user-chip { justify-content:center; padding:0; }
.sidebar-collapsed .logout { margin:0; }
@media(max-width:760px) {
  .sidebar-collapse { width:44px; height:44px; flex-basis:44px; }
  .shell { display:block; }
  .shell .main { margin-left:76px; }
  .shell.sidebar-mobile-open .sidebar { width:min(280px,calc(100vw - 32px)); }
  .sidebar-mobile-open .sidebar .brand { width:auto; height:auto; overflow:visible; align-items:center; }
  .sidebar-mobile-open .sidebar .brand-logo { clip-path:none; }
  .sidebar-mobile-open .sidebar :is(.brand-stack,.nav-label,.nav-text,.nav-count,.user-chip>div) { display:block; }
  .sidebar-mobile-open .sidebar .user-chip>.avatar { display:grid; }
  .sidebar-mobile-open .sidebar .nav button { justify-content:flex-start; }
  .sidebar-mobile-open .sidebar-backdrop { display:block; position:fixed; inset:0; z-index:19; border:0; border-radius:0; background:rgba(0,0,0,.55); }
}
@media print { .sidebar-backdrop { display:none!important; } }
