/* a11y.css — global accessibility primitives.
   Loaded once via app_header.php / header.php. Pairs with js/keyboard-utils.js
   (focus traps) and the ARIA landmark conventions in app_includes/a11y.php. */

/* ── Skip-link target. The skip link itself lives inside both header partials
   ── and is hidden until focused. */
.skip-link {
    position: fixed;
    top: -100%;
    left: 16px;
    z-index: 9999;
    padding: 12px 18px;
    background: #E85D3A;
    color: #fff;
    text-decoration: none;
    border-radius: 8px;
    font-weight: 700;
    font-size: 0.85rem;
    transition: top 0.18s ease;
}
.skip-link:focus,
.skip-link:focus-visible {
    top: 16px;
    outline: 3px solid #fff;
    outline-offset: 2px;
}

/* ── Visually-hidden helper (for screen-reader-only labels). */
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    margin: -1px !important;
    padding: 0 !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* ── Live regions for toasts / status messages. */
.tratok-live, .tratok-status, [aria-live] {
    /* Layout-safe; just ensures focus styles can't bleed through if a SR
       implementation tries to render the live container. */
    outline: none;
}

/* ── Focus indicator standard — every interactive element gets a clear ring. */
button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 3px solid #2ECDA7 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 0 5px rgba(46, 205, 167, 0.18) !important;
}

/* ── prefers-reduced-motion — disable all motion app-wide for affected users. */
@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;
    }
    .ptr,
    .skeleton,
    .swal2-show,
    .swal2-hide {
        animation: none !important;
        transition: none !important;
    }
}

/* ── Touch targets: 44×44 minimum for primary actions. */
.btn-primary,
.btn-secondary,
.btn-danger,
.btn-cancel,
.modal-close,
.bn,
.modal-btn {
    min-width: 44px;
    min-height: 44px;
}

/* ── High-contrast mode hint. */
@media (forced-colors: active) {
    button, .btn-primary, .btn-secondary {
        border: 1px solid CanvasText;
        forced-color-adjust: none;
        background: ButtonFace;
        color: ButtonText;
    }
}