/* =====================================================================
   console-nav.css - one nav behaviour and one nav look for every
   console shell. Patrick, 2026-10-02: "Some of the nav bars go all the
   way to the bottom of the screen, some stop and keep scrolling down,
   they need to be consistent. Follow the advising design."

   The Advising family (.app-container .sidebar - Advising, Registrar,
   Special Programs, Admin, Roll Call) is the reference and is styled in
   brand.css. This file brings the eight shells that carry their own
   prefix (adm, alo, cc, cmm, cur, idc, ldr, sch) to the same behaviour:

     - the sidebar is as tall as the window and stays put while the
       page scrolls;
     - the brand block and the mission line are pinned, and the link
       list scrolls inside the sidebar when it is taller than the window;
     - same width, font, link size and spacing, and the same active
       marker (3px bar and a tint) as Advising.

   Colour is NOT set here, with one exception: Leadership (Frank Blue,
   gold accent - Patrick, 2026-10-16). Every other console keeps the sidebar
   colour its own stylesheet gives it.

   Loaded from App.razor, so it is in <head> before any console
   stylesheet or inline <style>. Every selector is prefixed ":root body"
   so it outranks the console rules, which are at most two classes.
   "position" is set only above each console's own mobile breakpoint:
   below it the console turns the sidebar into a fixed off-canvas drawer
   and that must keep working.
   ===================================================================== */

:root body :is(.adm-sidebar, .alo-sidebar, .cc-sidebar, .cmm-sidebar, .cur-sidebar, .idc-sidebar, .ldr-sidebar, .sch-sidebar) {
    top: 0;
    height: 100vh;
    align-self: flex-start;
    width: var(--sidebar-width, 180px);
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    font-family: var(--nh-body-font, "Segoe UI", Tahoma, sans-serif);
    box-shadow: 2px 0 8px rgba(0, 0, 0, 0.1);
}

@media (min-width: 901px) {
    :root body :is(.adm-sidebar, .alo-sidebar, .cc-sidebar, .cmm-sidebar, .idc-sidebar, .sch-sidebar) {
        position: sticky;
    }
}

@media (min-width: 861px) {
    :root body :is(.cur-sidebar, .ldr-sidebar) {
        position: sticky;
    }
}

/* Brand block and mission line never shrink; the list between them does. */
:root body :is(.adm-brand, .alo-brand, .cc-brand, .cmm-brand, .cur-brand, .idc-brand, .ldr-brand, .sch-brand) {
    flex-shrink: 0;
    padding: 14px;
    gap: 10px;
}

:root body :is(.adm-mission, .alo-mission, .cc-mission, .cmm-mission, .cur-mission, .idc-mission, .ldr-mission, .sch-mission) {
    flex-shrink: 0;
    margin-top: auto;
    padding: 12px 14px;
}

:root body :is(.adm-nav, .alo-nav, .cc-nav, .cmm-nav, .cur-nav, .idc-nav, .ldr-nav, .sch-nav) {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    padding: 8px 0;
    gap: 0;
}

:root body :is(.adm-nav, .alo-nav, .cc-nav, .cmm-nav, .cur-nav, .idc-nav, .ldr-nav, .sch-nav)::-webkit-scrollbar {
    width: 6px;
}

:root body :is(.adm-nav, .alo-nav, .cc-nav, .cmm-nav, .cur-nav, .idc-nav, .ldr-nav, .sch-nav)::-webkit-scrollbar-thumb {
    background: rgba(255, 255, 255, 0.25);
    border-radius: 3px;
}

:root body :is(.adm-nav, .alo-nav, .cc-nav, .cmm-nav, .cur-nav, .idc-nav, .ldr-nav, .sch-nav)::-webkit-scrollbar-track {
    background: transparent;
}

/* Links: Advising's size and spacing. Inline padding-left on sub-links
   (the indent inside a twirl-down) still applies - it is more specific. */
:root body :is(.adm-nav, .alo-nav, .cc-nav, .cmm-nav, .cur-nav, .idc-nav, .ldr-nav, .sch-nav) a,
:root body .cmm-nav .cmm-planned {
    padding: 10px 14px;
    gap: 10px;
    font-size: 13px;
    border-left: 3px solid transparent;
    border-radius: 0;
}

:root body :is(.adm-nav, .alo-nav, .cc-nav, .cmm-nav, .cur-nav, .idc-nav, .ldr-nav, .sch-nav) details > summary {
    padding: 10px 14px !important;
    gap: 10px !important;
    font-size: 13px !important;
    border-left: 3px solid transparent;
}

:root body :is(.adm-nav, .alo-nav, .cc-nav, .cmm-nav, .cur-nav, .idc-nav, .ldr-nav, .sch-nav) a:hover {
    background: rgba(255, 255, 255, 0.1);
    color: #fff;
    border-left-color: var(--nh-confident-yellow, #FFCC00);
}

:root body :is(.adm-nav, .alo-nav, .cc-nav, .cmm-nav, .cur-nav, .idc-nav, .ldr-nav, .sch-nav) a.active {
    background: rgba(255, 204, 0, 0.16);
    color: #fff;
    border-left-color: var(--nh-confident-yellow, #FFCC00);
    font-weight: 600;
}

/* =====================================================================
   Leadership - Frank Blue sidebar, white text, gold accent (Patrick,
   2026-10-16: "I do not like the Gold Nav menu. I like the gold accent on
   the hub card and probably as an accent on the Nav menu."). This
   replaces the gold sidebar of 2026-10-02. Gold is the accent only: a
   rule under the brand block, the NH mark, the hover and active bar, and
   the active tint. The hub card keeps its gold (--team-leadership-accent
   in brand.css is unchanged). #D4AF37 is the muted gold, deliberately not
   Confident Yellow (#FFCC00), which stays the attention colour. White on
   the gradient is 18.4:1 to 16.1:1; #D4AF37 on it is 8.8:1 to 7.7:1.
   ===================================================================== */
:root body .ldr-sidebar {
    background: linear-gradient(180deg, #02084B, #0A1466);
    color: #fff;
    border-right: 3px solid #D4AF37;
}

:root body .ldr-sidebar .ldr-brand {
    border-bottom: 2px solid #D4AF37;
}

:root body .ldr-sidebar .ldr-logo {
    color: #02084B;
}

:root body .ldr-sidebar .ldr-logo b {
    color: #B8860B;
}

:root body .ldr-sidebar :is(.ldr-t1, .ldr-t2) {
    color: #fff;
}

:root body .ldr-sidebar .ldr-nav :is(a, summary, span, div) {
    color: rgba(255, 255, 255, 0.92) !important;
}

:root body .ldr-sidebar .ldr-nav a:hover {
    background: rgba(212, 175, 55, 0.12);
    border-left-color: #D4AF37;
}

:root body .ldr-sidebar .ldr-nav a.active,
:root body .ldr-sidebar .ldr-nav summary.active {
    background: rgba(212, 175, 55, 0.2);
    border-left-color: #D4AF37;
}

:root body .ldr-sidebar .ldr-nav a.active :is(span, div) {
    color: #fff !important;
}

/* All Dashboards keeps the Confident Yellow every console gives it (AllDashboardsLink);
   the white link colour above must not reach it. The logo tile is white, so its N is
   Frank Blue and its H the darker gold, as the other consoles colour theirs. */
:root body .ldr-sidebar .ldr-nav .nh-all-dash,
:root body .ldr-sidebar .ldr-nav .nh-all-dash :is(span, svg) {
    color: var(--nh-confident-yellow, #FFCC00) !important;
    font-weight: 600;
}

:root body .ldr-sidebar .nh-all-dash:hover {
    background: rgba(212, 175, 55, 0.12);
    border-left-color: #D4AF37;
}

:root body .ldr-sidebar .ldr-sep {
    background: rgba(212, 175, 55, 0.35);
}

:root body .ldr-sidebar .ldr-mission {
    border-top-color: rgba(212, 175, 55, 0.5);
    color: rgba(255, 255, 255, 0.75);
}

:root body .ldr-sidebar .ldr-mission b {
    color: #D4AF37;
}

:root body .ldr-sidebar .ldr-nav::-webkit-scrollbar-thumb {
    background: rgba(212, 175, 55, 0.35);
}
