/* WCAG 2.2 site-wide accessibility helpers.
   Covers: 2.4.7 Focus Visible, 2.4.11 Focus Not Obscured (Minimum),
   2.4.13 Focus Appearance, 2.5.8 Target Size (Minimum), 1.4.13 Reduced Motion,
   1.4.11 Non-text Contrast, 1.4.3 Contrast (Minimum) helpers and
   screen-reader-only utilities. */

/* Visually hidden helper (Bootstrap 5 `.visually-hidden` + legacy `.sr-only`) */
.sr-only,
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.sr-only-focusable:active,
.sr-only-focusable:focus,
.visually-hidden-focusable:active,
.visually-hidden-focusable:focus {
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
}

/* Bootstrap 5 high-contrast forced-colors focus support */
.sr-only-focusable:not(:focus):not(:focus-visible),
.visually-hidden-focusable:not(:focus):not(:focus-visible) {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Skip link: visible when focused (2.4.1 Bypass Blocks) */
a.sr-only.sr-only-focusable:focus,
a.sr-only-focusable:focus,
a.sr-only.sr-only-focusable:focus-visible,
a.sr-only-focusable:focus-visible,
a.visually-hidden.visually-hidden-focusable:focus,
a.visually-hidden-focusable:focus,
a.visually-hidden.visually-hidden-focusable:focus-visible,
a.visually-hidden-focusable:focus-visible {
    background: #000;
    color: #fff;
    padding: 8px 16px;
    z-index: 10000;
    top: 0;
    left: 0;
    text-decoration: underline;
    outline: 3px solid #ffbf47;
    outline-offset: 2px;
}

/* WCAG 2.2 SC 2.4.7 / 2.4.13 Focus Appearance: ensure all focusable elements
   have a visible, high-contrast focus indicator (>= 2px solid, contrasting)
   when reached via keyboard. Mouse/touch clicks intentionally do NOT show the
   ring (uses :focus-visible). */
:focus-visible {
    outline: 3px solid #ffbf47 !important;
    outline-offset: 2px !important;
}

a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible,
[role="button"]:focus-visible,
[role="link"]:focus-visible,
[role="menuitem"]:focus-visible,
[role="tab"]:focus-visible {
    outline: 3px solid #ffbf47 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 1px #000 !important;
}

/* Suppress the focus ring for pointer (mouse/touch) interactions in browsers
   that support :focus-visible. */
:focus:not(:focus-visible) {
    outline: none !important;
    box-shadow: none !important;
}

/* WCAG 2.2 SC 2.5.8 Target Size (Minimum) - 24 x 24 CSS pixels for
   pointer targets. Applied to small icon links / buttons. */
a,
button,
input[type="button"],
input[type="submit"],
input[type="reset"],
[role="button"] {
    min-height: 24px;
    min-width: 24px;
}

/* Larger touch target for primary buttons, with text centred horizontally
   and padding to comfortably meet target-size requirements. */
.btn,
button,
input[type="button"],
input[type="submit"],
input[type="reset"] {
    min-height: 44px;
    padding-top: 8px;
    padding-bottom: 8px;
}

/* Strengthen focus indication on actionable controls (2.4.11 / 2.4.13). */
.btn:not(:disabled):focus-visible,
.btn:not(.disabled):not([disabled]):focus-visible,
button:not(:disabled):focus-visible,
input[type="button"]:not(:disabled):focus-visible,
input[type="submit"]:not(:disabled):focus-visible,
input[type="reset"]:not(:disabled):focus-visible {
    box-shadow: 0 0 0 1px #000, 0 0 0 4px rgba(255, 191, 71, 0.45) !important;
}

/* Ensure form controls meet target size */
.form-control,
.form-select,
select.form-control {
    min-height: 44px;
}

/* WCAG SC 1.3.1 - error styling that doesn't rely on color alone */
.field-validation-error,
.text-danger,
.validation-summary-errors {
    color: #b30000;
    font-weight: 600;
}

.field-validation-error::before,
.validation-summary-errors li::before {
    content: "\26A0 "; /* warning sign */
    margin-right: 4px;
}

/* WCAG SC 1.4.13 - Content on Hover or Focus: tooltip-like UI must remain
   visible & dismissable. Native title tooltips handled by browser; this adds
   a visible cue that more info exists. */
[title]:not([title=""]) {
    cursor: help;
}

/* WCAG SC 2.4.11 - Focus Not Obscured: ensure focused elements are not hidden
   behind sticky/fixed headers or footers. */
:target {
    scroll-margin-top: 80px;
}

*:focus {
    scroll-margin-top: 80px;
    scroll-margin-bottom: 60px;
}

/* WCAG SC 1.4.4 - Resize Text: ensure text can scale to 200% without loss.
   Avoid fixed heights on text containers. */
body {
    text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
}

/* WCAG SC 1.4.10 - Reflow: support single-column reading at 320px viewport */
@media (max-width: 320px) {
    body {
        overflow-x: auto;
    }
}

/* WCAG SC 2.3.3 / 2.2.2 - respect prefers-reduced-motion. */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}

/* Print accessibility - ensure focus indicators are not printed */
@media print {
    :focus {
        outline: none !important;
        box-shadow: none !important;
    }
}

@media (forced-colors: active) {
    :focus-visible,
    a:focus-visible,
    button:focus-visible,
    input:focus-visible,
    select:focus-visible,
    textarea:focus-visible,
    [tabindex]:focus-visible,
    [role="button"]:focus-visible,
    [role="link"]:focus-visible,
    [role="menuitem"]:focus-visible,
    [role="tab"]:focus-visible {
        outline: 2px solid CanvasText !important;
        outline-offset: 2px !important;
        box-shadow: none !important;
    }
}



