/**
 * Accessibility Styles
 * WCAG 2.1 AA compliance additions
 */


/* ============================================================
   Skip to Content Link
   ============================================================ */
.skip-link {
    background: #1712A8;
    border-radius: 0 0 4px 0;
    color: #ffffff;
    display: block;
    font-size: 14px;
    font-weight: 700;
    left: 0;
    padding: 12px 24px;
    position: absolute;
    text-decoration: none;
    top: -100%;
    z-index: 99999;
    transition: top 0.2s ease;
}
.skip-link:focus {
    top: 0;
    outline: 3px solid #0072C5;
    outline-offset: 2px;
}

/* Screen reader only utility class */
.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal !important;
}
.screen-reader-text:focus {
    background-color: #1712A8;
    border-radius: 0 0 4px 0;
    clip: auto !important;
    clip-path: none;
    color: #ffffff;
    display: block;
    font-size: 14px;
    font-weight: 700;
    height: auto;
    left: 0;
    line-height: normal;
    padding: 12px 24px;
    text-decoration: none;
    top: 0;
    width: auto;
    z-index: 99999;
}


/* ============================================================
   Focus Visibility — all interactive elements
   ============================================================ */

/* Global focus ring (applies everywhere focus-visible is supported) */
:focus-visible {
    outline: 3px solid #0072C5;
    outline-offset: 2px;
}

/* Remove default :focus outline only when :focus-visible is supported */
@supports selector(:focus-visible) {
    :focus:not(:focus-visible) {
        outline: none;
    }
}

/* Ensure toggle button has clear focus ring */
.toggle:focus-visible {
    outline: 3px solid #0072C5;
    outline-offset: 4px;
    border-radius: 4px;
}

/* Main menu links focus ring */
.main-menu a:focus-visible {
    outline: 3px solid #0072C5;
    outline-offset: 2px;
    border-radius: 2px;
}

/* Footer menu links focus ring */
.footer-menu a:focus-visible {
    outline: 3px solid #0072C5;
    outline-offset: 2px;
    border-radius: 2px;
}

/* Button focus ring */
.button:focus-visible {
    outline: 3px solid #0072C5;
    outline-offset: 3px;
}

/* Input / form field focus ring */
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: 2px solid #0072C5;
    outline-offset: 0;
}

/* Logo link focus ring */
.logo:focus-visible {
    outline: 3px solid #0072C5;
    outline-offset: 4px;
    border-radius: 3px;
}

/* Modal close button focus ring */
.modal__close-button:focus-visible {
    outline: 3px solid #0072C5;
    outline-offset: 3px;
    border-radius: 3px;
}

/* Tabs title focus ring */
.tabs__title:focus-visible {
    outline: 3px solid #0072C5;
    outline-offset: 2px;
    border-radius: 2px;
}

/* Any element with role="button" or tabindex */
[role="button"]:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid #0072C5;
    outline-offset: 2px;
}


/* ============================================================
   Color Contrast Fixes
   ============================================================ */

/* Features block title: #A0A3AD on white = ~2.4:1 (fails AA)
   Fix: #868996 = 3.4:1 — keeps the original muted gray look,
   passes WCAG AA for large text (minimum 3:1 required) */
.block-features__title {
    color: #868996 !important;
}

/* Team block title: same issue, same fix */
.block-team__title {
    color: #868996 !important;
}

/* button--border-gray: #A0A3AD text on white bg fails AA (2.4:1)
   Fix: #6B6F7E = 5.0:1 on white — passes AA for small text,
   visually close to the original muted gray design */
.button--border-gray {
    color: #6B6F7E !important;
    border-color: #6B6F7E !important;
}
.button--border-gray:hover,
.button--border-gray:focus {
    color: #1712A8 !important;
    border-color: #1712A8 !important;
}

/* Sample loan modal arrows — sync with button--border-gray color */
.sample-loan-modal__button::before,
.sample-loan-modal__button::after {
    border-color: #6B6F7E !important;
}
.sample-loan-modal__button:hover::before,
.sample-loan-modal__button:hover::after,
.sample-loan-modal__button:focus::before,
.sample-loan-modal__button:focus::after {
    border-color: #1712A8 !important;
}

/* team item position: #A0A3AD on white fails AA
   Fix: darken to pass 4.5:1 */
.block-team__item-position {
    color: #6B6E7A !important;
}


/* ============================================================
   Sub-menu keyboard accessibility (focus-within)
   ============================================================ */
.main-menu > .menu-item.menu-item-has-children:focus-within > .sub-menu {
    display: block;
    z-index: 10;
}


/* ============================================================
   Accessible hidden / visually-hidden elements
   ============================================================ */
[aria-hidden="true"] {
    pointer-events: none;
}


/* ============================================================
   Modal accessibility
   ============================================================ */

/* Ensure modal is not in tab order when hidden */
.modal-container:not(.modal-container--active) {
    visibility: hidden;
    pointer-events: none;
}

/* Ensure modal overlay blocks background interaction */
.modal-container--active {
    position: fixed;
    inset: 0;
    z-index: 9999;
}