/* WCAG 2.1 AA platform-wide remediation
   Loaded after platform.css — rules here intentionally override Tailwind defaults. */

/* ─── 2.4.7 / 1.4.11  Focus indicators ───────────────────────────────────────
   Already in app.onRequestStart.cfm inline <style> for early paint.
   Repeated here with higher specificity to win against Bootstrap nav resets. */
.nav-link:focus-visible,
.dropdown-item:focus-visible,
.dropdown-toggle:focus-visible {
    outline: 2px solid currentColor;
    outline-offset: 2px;
}

/* ─── 1.4.1  Inline link underlines ──────────────────────────────────────────
   Underline body-copy links so color alone doesn't convey meaning.
   Anchored to landmarks we control — nav/button links are exempt. */
#main-content a:not([class]),
[role="main"] a:not([class]) {
    text-decoration: underline;
    text-underline-offset: 3px;
}

/* ─── 2.5.5  Minimum interactive target size ─────────────────────────────────
   Buttons and icon-only links must be at least 24×24px touchable area. */
button,
[type="button"],
[type="submit"],
[type="reset"] {
    min-height: 24px;
    min-width: 24px;
}

a.icon-link,
.icon-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 44px;
    min-width: 44px;
}

/* ─── 1.4.12  Text spacing tolerance ─────────────────────────────────────────
   Prevent fixed-height prose containers from clipping text when user applies
   custom text-spacing styles (line-height 1.5×, letter-spacing 0.12em, etc.) */
#main-content,
[role="main"] {
    min-height: 0;
    overflow: visible;
}

/* ─── 2.3.3  Reduced motion (AAA, cheap) ─────────────────────────────────────
   Pause auto-playing carousels for users who prefer reduced motion. */
@media (prefers-reduced-motion: reduce) {
    .carousel,
    .slick-slider,
    [data-ride="carousel"] {
        animation: none !important;
        transition: none !important;
    }

    .carousel-item {
        transition: none !important;
    }
}