/* Accessibility theme helpers applied to the main document */

body.a11y-dark-theme {
    background: #121212 !important;
    color: #eaeaea !important;
}

/* .modern-header keeps its own bg-white navbar regardless of this simulated dark override (it is
   not part of the document body's flow that a11y-dark-theme darkens), so it is excluded here --
   otherwise its links inherit a light-on-dark color meant for the dark body background and fail
   contrast against the still-white header (axe color-contrast, found testing the read-aloud panel
   dark-theme case 2026-09-22). */
body.a11y-dark-theme a:not(.modern-header a) {
    color: #82cfff !important;
}

body.a11y-dark-theme table,
body.a11y-dark-theme th,
body.a11y-dark-theme td {
    background: transparent !important;
    color: inherit !important;
    border-color: #444 !important;
}

body.a11y-dark-theme input,
body.a11y-dark-theme select,
body.a11y-dark-theme textarea {
    background: #1e1e1e !important;
    color: #eee !important;
    border-color: #555 !important;
}

body.a11y-contrast-scale {
    background: var(--a11y-contrast-bg, #0b0b0b) !important;
    color: var(--a11y-contrast-fg, #ffffff) !important;
}

/* Same .modern-header exclusion as the dark-theme rule above: the navbar keeps its own bg-white
   background under this override too, so it must not take the link color meant for the dark
   contrast-scale body background either (axe color-contrast, 2026-09-22). */
body.a11y-contrast-scale a:not(.modern-header a) {
    color: var(--a11y-contrast-link, #ffd60a) !important;
    text-decoration: underline !important;
}

body.a11y-contrast-scale *:focus {
    outline: 3px solid var(--a11y-contrast-link, #ffd60a) !important;
    outline-offset: 2px !important;
}

body.a11y-contrast-scale input,
body.a11y-contrast-scale select,
body.a11y-contrast-scale textarea,
body.a11y-contrast-scale button {
    background: var(--a11y-contrast-bg, #0b0b0b) !important;
    color: var(--a11y-contrast-fg, #ffffff) !important;
    border-color: var(--a11y-contrast-border, #ffffff) !important;
}

body.a11y-large-text {
    font-size: 118% !important;
}

body.a11y-underline-links a {
    text-decoration: underline !important;
}

body.a11y-readable-font {
    font-family: Verdana, Tahoma, Arial, Helvetica, sans-serif !important;
}

body.a11y-reduce-motion *,
body.a11y-reduce-motion *::before,
body.a11y-reduce-motion *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
}

body.a11y-focus-visible *:focus {
    outline: 3px solid #ffbf47 !important;
    outline-offset: 2px !important;
}

/* High-contrast palette helpers for the widget panel itself */

#a11y-widget .a11y-panel {
    background: #ffffff;
    color: #222222;
}

#a11y-widget .a11y-panel .a11y-secondary {
    background: #f0f0f0;
    color: #333333;
    border-color: #cccccc;
}

#a11y-widget .a11y-panel .a11y-primary {
    background: #005a9e;
    color: #ffffff;
}

body.a11y-dark-theme #a11y-widget .a11y-panel {
    background: #1f2937;
    color: #f9fafb;
    border-color: #374151;
}

body.a11y-dark-theme #a11y-widget .a11y-panel .a11y-secondary {
    background: #374151;
    color: #f9fafb;
    border-color: #4b5563;
}

body.a11y-dark-theme #a11y-widget .a11y-panel .a11y-primary {
    background: #2563eb;
    color: #ffffff;
}

body.a11y-contrast-scale #a11y-widget .a11y-panel {
    background: var(--a11y-contrast-bg, #0b0b0b);
    color: var(--a11y-contrast-fg, #ffffff);
    border-color: var(--a11y-contrast-border, #ffffff);
}

body.a11y-contrast-scale #a11y-widget .a11y-panel .a11y-secondary {
    background: var(--a11y-contrast-bg, #0b0b0b);
    color: var(--a11y-contrast-fg, #ffffff);
    border-color: var(--a11y-contrast-border, #ffffff);
}

body.a11y-contrast-scale #a11y-widget .a11y-panel .a11y-primary {
    background: var(--a11y-contrast-link, #ffd60a);
    color: #000000;
}

body.a11y-contrast-scale #a11y-widget .a11y-panel a,
body.a11y-dark-theme #a11y-widget .a11y-panel a {
    color: inherit;
}

body.a11y-contrast-scale #a11y-widget .a11y-panel input,
body.a11y-dark-theme #a11y-widget .a11y-panel input,
body.a11y-contrast-scale #a11y-widget .a11y-panel select,
body.a11y-dark-theme #a11y-widget .a11y-panel select,
body.a11y-contrast-scale #a11y-widget .a11y-panel textarea,
body.a11y-dark-theme #a11y-widget .a11y-panel textarea {
    background: transparent;
    color: inherit;
    border-color: currentColor;
}

body.a11y-contrast-scale #a11y-widget .a11y-panel .a11y-contrast-helper,
body.a11y-dark-theme #a11y-widget .a11y-panel .a11y-contrast-helper {
    color: inherit;
}

body.a11y-contrast-scale #a11y-widget .a11y-panel input[type="range"] {
    accent-color: var(--a11y-contrast-link, #ffd60a);
}

body.a11y-dark-theme #a11y-widget .a11y-panel input[type="range"] {
    accent-color: #2563eb;
}

body.a11y-contrast-scale #a11y-widget .a11y-panel .a11y-option input[type="checkbox"],
body.a11y-dark-theme #a11y-widget .a11y-panel .a11y-option input[type="checkbox"] {
    accent-color: currentColor;
}

body.a11y-contrast-scale #a11y-widget .a11y-panel .a11y-panel-header,
body.a11y-dark-theme #a11y-widget .a11y-panel .a11y-panel-header {
    border-color: currentColor;
}

body.a11y-contrast-scale #a11y-widget .a11y-panel .a11y-panel-footer,
body.a11y-dark-theme #a11y-widget .a11y-panel .a11y-panel-footer {
    border-color: currentColor;
}

body.a11y-contrast-scale #a11y-widget .a11y-panel button,
body.a11y-dark-theme #a11y-widget .a11y-panel button {
    box-shadow: none;
}

/* Read-aloud controls in the panel (pause/resume + speed). The #a11y-widget rules above out-rank widget.css, so each theme
   restates the disabled look (aria-disabled, so the button stays focusable), the native <select> option list and the focus ring. */
#a11y-widget .a11y-panel .a11y-readout-controls .a11y-secondary[aria-disabled="true"] {
    background: #ececec;
    color: #595959;
    border-color: #cccccc;
    border-style: dashed;
    cursor: not-allowed;
}

body.a11y-dark-theme #a11y-widget .a11y-panel .a11y-readout-controls .a11y-secondary[aria-disabled="true"] {
    background: #2b3443;
    color: #a8b1bf;
    border-color: #4b5563;
    border-style: dashed;
}

body.a11y-contrast-scale #a11y-widget .a11y-panel .a11y-readout-controls .a11y-secondary[aria-disabled="true"] {
    border-style: dashed;
    cursor: not-allowed;
}

body.a11y-dark-theme #a11y-widget .a11y-panel select option {
    background: #1f2937;
    color: #f9fafb;
}

body.a11y-contrast-scale #a11y-widget .a11y-panel select option {
    background: var(--a11y-contrast-bg, #0b0b0b);
    color: var(--a11y-contrast-fg, #ffffff);
}

/* The default blue ring is about 1.6:1 against the dark panel; use the site's yellow ring on dark and high-contrast panels. */
body.a11y-dark-theme #a11y-widget .a11y-panel .a11y-readout-controls :focus-visible,
body.a11y-contrast-scale #a11y-widget .a11y-panel .a11y-readout-controls :focus-visible {
    outline-color: #ffbf47;
}
