/**
 * Accessibility helpers.
 * Loaded site-wide. Additive only — does not alter the existing visual design
 * for mouse users (skip link and SR text are hidden until keyboard-focused).
 */

/* Visually hidden, but available to screen readers. */
.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    position: absolute !important;
    word-wrap: normal !important;
}

/* The skip-link target is programmatically focusable; don't show a ring around
   the whole content area when focus lands there. */
#container[tabindex="-1"]:focus {
    outline: none;
}

/* Skip-to-content link: off-screen until it receives keyboard focus. */
.skip-link.screen-reader-text:focus {
    clip: auto;
    clip-path: none;
    width: auto;
    height: auto;
    margin: 0;
    padding: 12px 20px;
    position: fixed !important;
    top: 8px;
    right: 8px;
    z-index: 100000;
    background: #ffffff;
    color: #000000;
    border: 2px solid #000000;
    border-radius: 4px;
    font-size: 16px;
    line-height: 1;
    text-decoration: none;
}

/* Visible focus indicator for keyboard users only. :focus-visible keeps the
   design untouched for mouse/touch interactions (no ring on click). */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible,
[role="button"]:focus-visible {
    outline: 2px solid #000000;
    outline-offset: 2px;
}

/* Respect users who ask the OS to minimise motion. Only affects those users;
   everyone else sees the existing animations exactly as before. */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}