/* Sitewide accessibility baseline: skip link + visible keyboard focus. */

.skip-to-content-link {
    position: absolute;
    top: -1000px;
    left: 0;
    z-index: 2000;
    padding: 12px 20px;
    background: #ffffff;
    color: #000000;
    font-weight: 600;
    text-decoration: none;
    border: 2px solid #000000;
}

.skip-to-content-link:focus {
    top: 0;
    left: 0;
}

/* Visual heading sizes, decoupled from semantic level. MudBlazor's Typo prop
   controls both the rendered tag (h1-h6) AND the default font size/weight in
   one setting, which is why pages across the site picked whatever Typo level
   "looked right" rather than reflecting real document structure -- producing
   skipped heading levels and zero real <h1>s sitewide. These classes let a
   heading use the correct semantic Typo (tag) while keeping whatever visual
   size it originally had, via Class="visual-hN". Values match MudBlazor's own
   default Typography.H1..H6. */
.visual-h1 { font-size: 6rem; font-weight: 300; line-height: 1.167; letter-spacing: -.01562em; }
.visual-h2 { font-size: 3.75rem; font-weight: 300; line-height: 1.2; letter-spacing: -.00833em; }
.visual-h3 { font-size: 3rem; font-weight: 400; line-height: 1.167; letter-spacing: 0; }
.visual-h4 { font-size: 2.125rem; font-weight: 400; line-height: 1.235; letter-spacing: .00735em; }
.visual-h5 { font-size: 1.5rem; font-weight: 400; line-height: 1.334; letter-spacing: 0; }
.visual-h6 { font-size: 1.25rem; font-weight: 500; line-height: 1.6; letter-spacing: .0075em; }

/* Standard sr-only pattern: visible to assistive tech, invisible on screen.
   Used where a component wraps its activator in a way that no aria-label
   parameter or attribute splat can reach (e.g. MudMenu's ActivatorContent,
   whose wrapping element is generated by the component itself). */
.visually-hidden {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* MudBlazor's default filled-success chip color (#4caf50) with white text only
   clears ~2.78:1 -- well under the 4.5:1 minimum. Used for several "NEW" nav
   badges (kccircus.com/cssa2027duck.com promo links, new-document indicators).
   #2e7d32 (this app's own light-theme Success color, used elsewhere already)
   clears ~5.13:1 with the same white text. */
.mud-chip-filled.mud-chip-color-success {
    background-color: #2e7d32 !important;
}

/* This app's dark-theme Primary (#ef5350, a deliberately lighter red for
   readability elsewhere) only clears ~3.49:1 with the white text a filled chip
   uses -- under the 4.5:1 minimum. var(--mud-palette-appbar-background) is
   identical to Primary in light mode (#b71c1c, no visual change there) but
   resolves to the darker #c62828 in dark mode (~5.62:1 with white), already
   used elsewhere in this app's own dark palette. */
.mud-chip-filled.mud-chip-color-primary {
    background-color: var(--mud-palette-appbar-background) !important;
}

/* MudBlazor's own "text" MudAlert variant for Severity.Warning uses
   --mud-palette-warning-darken (#cc6600) on its near-transparent warning tint --
   only ~3.84:1 against the effectively-white LIGHT-mode background behind it,
   under the 4.5:1 minimum (this is the original audit's registration "No Invite
   Code" finding, Phase 6.2). The same color already passes against dark mode's
   background (~6.71:1 per the original audit's own dark-mode retest), so this
   can't be a global override -- that would fix light mode by breaking dark mode
   (confirmed: it did, on the first attempt). Scoped to a class the light-mode-only
   call site applies itself (via a cascaded IsDarkMode check), not a blanket rule. */
.warning-alert-contrast-fix .mud-alert-message {
    color: #995200 !important;
}

/* MudBlazor/Bootstrap reset focus outlines on several interactive elements;
   restore a visible indicator. A concentric black+white double ring is used
   instead of a single color because the site's surfaces span white cards,
   a dark red app bar, and a near-black dark theme -- for any single
   background color, at least one of black/white always contrasts >=3:1
   against it (the worst case, a mid-gray backdrop, still yields ~4.58:1
   against whichever of the two rings is more visible), so this meets the
   3:1 "adjacent colors" requirement in both themes without per-theme rules. */
:focus-visible {
    outline: 2px solid #000000 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 4px #ffffff, 0 0 0 6px #000000 !important;
}