/* ==========================================================================
   Accessibility remediation stylesheet (WCAG 2.1 AA)
   Loaded last so it can layer on top of the existing theme.
   Goal: fix a11y issues WITHOUT altering layout/content. Visual impact is
   limited to (a) a keyboard-only focus ring and (b) minimal contrast/target
   adjustments that are impossible to satisfy otherwise.
   ========================================================================== */

/* --- SC 2.4.7 Focus Visible -------------------------------------------------
   Show a clear focus ring for KEYBOARD users only (:focus-visible), so mouse
   interaction looks exactly as before. */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible,
[role="button"]:focus-visible,
[role="link"]:focus-visible,
[role="tab"]:focus-visible,
[contenteditable]:focus-visible {
    outline: 3px solid #0a3d62 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 2px #ffffff !important; /* halo so the ring shows on dark bgs too */
}
/* Fallback for browsers without :focus-visible support */
.js-focus-visible :focus:not(.focus-visible) { outline: none; }

/* --- SC 2.4.1 Skip link ---------------------------------------------------- */
.a11y-skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 100000;
    background: #0a3d62;
    color: #ffffff !important;
    padding: 10px 18px;
    font: 600 15px/1.4 "Open Sans", Arial, sans-serif;
    text-decoration: underline;
    border-radius: 0 0 6px 0;
}
.a11y-skip-link:focus {
    left: 8px;
    top: 8px;
    outline: 3px solid #ffffff !important;
}
/* Make the skip-link target programmatically focusable without an outline flash */
#main-content:focus { outline: none; }

/* --- SC 2.1.1 / 1.4.13 Keyboard-operable dropdown menus ---------------------
   The theme reveals sub-menus on :hover only. Mirror that on keyboard focus so
   sub-navigation is reachable by keyboard. Visual appearance is identical to
   the hover state, so no design change for pointer users. */
.wsmenu-list li:focus-within > .sub-menu,
.wsmenu-list li:focus-within > .wsmegamenu,
nav li:focus-within > ul.sub-menu {
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
    pointer-events: auto !important;
    left: auto;
}
/* keep nested submenu positioning consistent with the hover rule */
.wsmenu-list .sub-menu li:focus-within > .sub-menu {
    visibility: visible !important;
    opacity: 1 !important;
    display: block !important;
}

/* --- SC 1.4.1 Use of colour: distinguish in-text links ----------------------
   Only target links inside body/content prose, not nav/buttons/cards, to avoid
   any layout change. */
main p a:not(.btn):not([class*="button"]),
.footer-distributed p a,
.content a:not(.btn),
article a:not(.btn) {
    text-decoration: underline;
}

/* --- SC 1.4.3 Text contrast ------------------------------------------------
   NOTE: the footer sits on a DARK background (#141414 / #0e0e0e). Its theme
   colour #bbb already gives ~9.7:1 there, so it is deliberately left alone —
   an earlier revision forced #595959 here and dropped it to 2.63:1.

   The genuine failures are the muted grey #8e8e8e used for body copy on WHITE
   (3.27:1). #707070 keeps the same muted appearance and reaches ~4.95:1. */
.caption p,
.testimonialsBlock > p,
.testimonialsBlock .media-body p,
.text-danger.sub-info,
.topic p {
    color: #707070;
}

/* 10px orange-red on a pale peach chip: #ff4b00 on #ffebe0 is 2.9:1.
   #c23b00 is the same hue, darkened to ~4.6:1. Background untouched. */
.faq-table .highlight {
    color: #c23b00;
}

/* White countdown labels on #007bff give 3.97:1. Same blue, one step darker,
   reaches ~5.2:1 for the white text sitting on it. */
.countdown {
    background-color: #0069d9;
}

/* --- SC 2.5.8 Target size (minimum 24px) -----------------------------------
   Give small footer/nav text-links enough vertical hit area. Uses padding so
   text position is visually unchanged. */
.footer-links li a,
.footer-menu li a,
ul.footer-links li a,
.footer-distributed .footer-links li a {
    display: inline-block;
    min-height: 24px;
    line-height: 24px;
}

/* --- SC 2.5.8 Target size: stacked link lists -------------------------------
   Links that sit on their own line (separated by <br>) are not covered by the
   "inline" exception, so give them a 24px hit area via line-height. */
.odrLink a {
    display: inline-block;
    min-height: 24px;
    line-height: 24px;
}

/* --- SC 2.2.2 Pause, Stop, Hide: accessible replacement for <marquee> -------
   Reproduces the old ticker exactly (13px/34px Open Sans, white, scrolling
   right-to-left at the same ~180px/s that scrollamount="3" produced) but as a
   CSS animation that can genuinely be paused, and with a visible control.
   The scroll distance/duration are measured at runtime by accessibility.js. */
.a11y-ticker {
    display: flex;
    align-items: center;
    width: 100%;
    line-height: 34px;
}
.a11y-ticker-viewport {
    flex: 1 1 auto;
    overflow: hidden;
    position: relative;
}
.a11y-ticker-track {
    display: inline-block;
    white-space: nowrap;
    margin: 0;
    padding: 0;
    color: #fff;
    font-size: 13px;
    line-height: 34px;
    font-family: 'Open Sans', sans-serif;
    will-change: transform;
    animation: a11y-ticker-scroll var(--a11y-ticker-duration, 45s) linear infinite;
}
@keyframes a11y-ticker-scroll {
    from { transform: translateX(var(--a11y-ticker-from, 100%)); }
    to   { transform: translateX(var(--a11y-ticker-to, -100%)); }
}
.a11y-ticker[data-a11y-paused="true"] .a11y-ticker-track {
    animation-play-state: paused;
}
/* Pause/play control — sized to the 24x24 minimum target, tinted to the bar. */
.a11y-ticker-toggle {
    flex: 0 0 auto;
    width: 24px;
    height: 24px;
    margin-right: 6px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #ffffff;
    font-size: 11px;
    line-height: 24px;
    text-align: center;
    cursor: pointer;
    border-radius: 3px;
}
.a11y-ticker-toggle:hover { background: rgba(255, 255, 255, 0.18); }
.a11y-ticker-toggle .a11y-ticker-glyph::before { content: "\275A\275A"; letter-spacing: -1px; }
.a11y-ticker[data-a11y-paused="true"] .a11y-ticker-toggle .a11y-ticker-glyph::before { content: "\25B6"; }

/* --- Screen-reader-only utility (used by accessibility.js) ------------------ */
.a11y-visually-hidden {
    position: absolute !important;
    width: 1px; height: 1px;
    padding: 0; margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}
/* Reduced-motion: stop animations for users who prefer it.
   The ticker is excluded from the blanket rule — collapsing its duration would
   fling it to its end position and hide the text. Instead it stops moving and
   wraps so the whole notice stays readable. */
@media (prefers-reduced-motion: reduce) {
    *:not(.a11y-ticker-track) {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
    }
    .a11y-ticker-track {
        animation: none !important;
        transform: none !important;
        white-space: normal;
        display: block;
    }
    .a11y-ticker-toggle { display: none; }
}
