/* ════════════════════════════════════════════════════════════════════════════
   Quizlabor Assistent – DESKTOP-Ansicht (ergänzt app.css)
   Nur ab Breite ≥ 801px geladen (media-Attribut im <link>, siehe layout.php).
   Baut auf der gemeinsamen Basis aus app.css auf und stellt die klassische
   Sidebar-Spalte links her. Überschneidet sich NICHT mit der Mobile-Shell
   (@media max-width: 800px in app.css) → deshalb kein !important nötig.
   ════════════════════════════════════════════════════════════════════════════ */

/* App-Shell: Sidebar-Spalte + Inhalt nebeneinander */
.app { display: flex; min-height: 100vh; }

/* Sidebar: sticky Spalte über die volle Fensterhöhe */
.sidebar {
    position: sticky; top: 0; align-self: flex-start;
    width: 240px; height: 100vh; flex-shrink: 0;
    background: rgb(var(--bg-surface));
    border-right: 1px solid rgb(var(--borderColor));
    padding: 1.1rem .9rem;
}
/* Innerer Wrapper (existiert fürs mobile Follow-Menü) wird auf dem Desktop zur
   vollhohen Flex-Spalte, damit .nav dazwischen IN SICH scrollt und Marke oben
   bzw. Fuß unten fix bleiben – statt dass die Navigation die Spalte sprengt. */
.sidebar > div {
    display: flex; flex-direction: column;
    height: 100%;
}

/* Marke oben: Logo + Untertitel „Assistent" */
.sidebar .brand {
    display: block; text-decoration: none;
    padding: .1rem .5rem 1rem; margin-bottom: .2rem;
}
.brand-sub {
    display: block; margin-top: .25rem; padding-left: .1rem;
    font-size: .72rem; font-weight: 500; letter-spacing: .16em; text-transform: uppercase;
    color: rgb(var(--textMuted));
}

/* Den Hamburger-Umschalter gibt es nur mobil */
.sidebar_switch { display: none; }

/* Navigation: Gruppen mit statischer Kopfzeile, alle Einträge sichtbar
   (die Akkordeon-Regeln aus app.css greifen nur ≤800px). */
.nav-group { margin-bottom: 1.1rem; }
.nav-head {
    display: block; cursor: default;
    font-size: .68rem; text-transform: uppercase; letter-spacing: .06em;
    color: rgb(var(--textMuted)); padding: 0 .5rem; margin-bottom: .35rem;
}

/* Fußbereich (Benutzer + Theme-Switch) mit Trennlinie */
.sidebar-foot { border-top: 1px solid rgb(var(--borderColor)); padding-top: .8rem; }