/* Accessibility overrides — loaded after cleenhearts.css.
   Restores WCAG 2.1 AA conformance without modifying the vendored template CSS. */

/* Visible keyboard focus on every interactive element. The template strips
   `outline` from many controls without providing a :focus replacement. */
:focus-visible {
    outline: 2px solid var(--cleenhearts-purple, #965995);
    outline-offset: 2px;
    border-radius: 2px;
}

/* Active main-nav link contrast: gold (#F6D469) on white is 1.44:1 — fail.
   Use the brand purple for active text on light backgrounds. Selectors match
   the cleenhearts.css specificity so we win the cascade. Covers both the
   `current` class injected at runtime and the static `active` class. */
.main-menu .main-menu__list > li.current > a,
.main-menu .main-menu__list > li.active > a,
.main-menu .main-menu__list > li.current-menu-item > a {
    color: var(--cleenhearts-purple, #965995);
    text-decoration: underline;
    text-underline-offset: 4px;
}

/* Mobile nav copy of the same list. */
.mobile-nav__container .main-menu__list > li.current > a,
.mobile-nav__container .main-menu__list > li.active > a {
    color: var(--cleenhearts-purple, #965995);
}

/* Donation organizer designation: ensure contrast against white card. */
.sidebar-donation__organizer__designation {
    color: #6e3e6d; /* darker purple — 7.4:1 on white */
}

/* Donation organizer designation: ensure contrast against white card. */
.sidebar-donation__organizer__designation {
    color: #6e3e6d; /* darker purple — 7.4:1 on white */
}

/* Skip link — visible only when focused. */
.skip-link {
    position: absolute;
    left: -9999px;
    top: 0;
    z-index: 100000;
    padding: 12px 20px;
    background: var(--cleenhearts-purple, #965995);
    color: #ffffff;
    font-weight: 700;
    text-decoration: none;
    border-radius: 0 0 6px 0;
}
.skip-link:focus,
.skip-link:focus-visible {
    left: 0;
}

/* Tap-target minimum size for footer / topbar social-link icons. */
.social-link a,
.topbar-one__social a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 24px;
    min-height: 24px;
    padding: 4px;
}