/* Frontend Modularization Phase 3: Sidebar and grouped navigation styles. */
.sidebar { position:fixed; left:0; top:0; width:250px; height:100vh; background:var(--dark); color:white; padding:22px 16px; box-sizing:border-box; overflow-y:auto; overflow-x:hidden; }
.mark { width:58px; height:58px; border-radius:16px; background:var(--brand); display:flex; align-items:center; justify-content:center; font-size:40px; font-weight:900; margin-bottom:16px; box-shadow:inset 0 0 0 3px white; }
.sidebar-logo-full { width:170px; max-width:100%; height:auto; display:block; margin:0 0 14px; background:white; border-radius:12px; padding:8px; box-shadow:0 2px 10px rgba(0,0,0,.25); }
.sidebar-logo-icon { width:58px; height:58px; border-radius:16px; object-fit:cover; background:white; margin-bottom:12px; box-shadow:inset 0 0 0 3px white; }
.nav { padding-bottom:24px; }
.nav-group { margin:0 0 14px; }
.nav-group-toggle { width:100%; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 8px 7px; border:0; border-bottom:1px solid rgba(255,255,255,.15); border-radius:0; background:transparent; color:rgba(255,255,255,.68); cursor:pointer; font-size:11px; font-weight:900; letter-spacing:.08em; text-align:left; text-transform:uppercase; }
.nav-group-toggle:hover { color:white; background:rgba(255,255,255,.04); }
.nav-group-chevron { display:inline-flex; align-items:center; justify-content:center; width:18px; height:18px; transition:transform .18s ease; }
.nav-group-chevron svg { width:14px; height:14px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.nav-group.collapsed .nav-group-chevron { transform:rotate(-90deg); }
.nav-group-items { display:grid; grid-template-rows:1fr; opacity:1; transition:grid-template-rows .18s ease, opacity .14s ease; }
.nav-group-items-inner { min-height:0; overflow:hidden; padding-top:7px; }
.nav-group.collapsed .nav-group-items { grid-template-rows:0fr; opacity:0; }
.nav-item { padding:11px 12px; border-radius:10px; margin-bottom:6px; background:rgba(255,255,255,.06); font-weight:bold; cursor:pointer; }
.nav-item.active { background:var(--brand); }