/*
 * Global Accessibility Utilities
 * Implements WCAG 2.1 AA compliance for focus indicators, screen reader
 * utilities, skip navigation, and form validation states.
 * Created for TIK-1681
 */

/* =================================================================
   Section A — Screen Reader Utilities
   Modern .visually-hidden using clip-path (replaces deprecated clip)
   ================================================================= */
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Becomes visible on focus — used for skip links */
.visually-hidden-focusable:not(:focus):not(:focus-within) {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip-path: inset(50%) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* =================================================================
   Section B — Skip Link
   Off-screen by default, appears fixed at top of page on focus
   ================================================================= */
.skip-link:focus {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10000;
    display: block;
    width: auto;
    padding: 12px 24px;
    background: #cf1c35;
    color: #fff;
    font-size: 1.6em;
    font-weight: 600;
    text-decoration: none;
    outline: 3px solid #000;
    outline-offset: -3px;
}

/* =================================================================
   Section C — Global Focus Restoration
   Overrides the destructive outline:none !important from bootstrap.css
   Uses :focus-visible so click-based focus is unaffected
   ================================================================= */

/* Restore focus indicators for form controls */
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: 2px solid #cf1c35 !important;
    outline-offset: 0;
}

/* General interactive element focus */
a:focus-visible {
    outline: 2px solid #cf1c35;
    outline-offset: 2px;
    border-radius: 2px;
}

button:focus-visible,
[role="button"]:focus-visible {
    outline: 2px solid #cf1c35;
    outline-offset: 2px;
    border-radius: 3px;
}

/* Footer social icon links — add padding so focus ring has breathing room */
.footer .social-networks a {
    padding: 4px;
    border-radius: 4px;
}

/* =================================================================
   Section D — Form Validation States
   Visual counterpart to ARIA attributes set by form-validation.js
   ================================================================= */
[aria-invalid="true"] {
    border-color: #d9534f !important;
}

[aria-invalid="true"]:focus-visible {
    outline-color: #d9534f !important;
    box-shadow: 0 0 0 0.2rem rgba(217, 83, 79, 0.25);
}

.form-error-message {
    color: #d9534f;
    font-size: 1.2em;
}

/* =================================================================
   Section E — Required Field Indicator
   ================================================================= */
label .required-indicator {
    color: #d9534f;
}

/* =================================================================
   Section F — High Contrast & Reduced Motion
   ================================================================= */
@media (prefers-contrast: high) {
    a:focus-visible,
    button:focus-visible,
    [role="button"]:focus-visible,
    input:focus-visible,
    textarea:focus-visible,
    select:focus-visible {
        outline-width: 3px;
        outline-color: currentColor;
    }

    [aria-invalid="true"] {
        border-width: 3px;
    }

    .skip-link:focus {
        outline-width: 4px;
        outline-color: currentColor;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
    }
}

/* =================================================================
   Print — Remove focus indicators
   ================================================================= */
@media print {
    .skip-link {
        display: none !important;
    }
}