/*
 * Accessibility basics shared by the public site, the admin and the customer portal.
 * Loaded last by each layout, so it wins over the templates' own rules.
 *
 *  1. A skip link: the first thing a keyboard or screen-reader user reaches, jumping past the
 *     menu to the page's content.
 *  2. A visible outline wherever the keyboard is: the public template removes outlines
 *     (`outline: none`), which leaves keyboard users not knowing where they are.
 *  3. Less motion for people who ask for it in their system settings.
 */

/* ── 1. Skip link ─────────────────────────────────────────────────────── */
.skip-link {
    position: absolute;
    left: 8px;
    top: -120px;
    z-index: 100000;
    padding: 10px 16px;
    border-radius: 6px;
    background: #0f172a;
    color: #fff;
    font: 600 14px/1.2 system-ui, -apple-system, "Segoe UI", sans-serif;
    text-decoration: none;
}
.skip-link:focus,
.skip-link:focus-visible {
    top: 8px;
    color: #fff;
    outline: 3px solid #fbbf24 !important;
    outline-offset: 2px;
}

/* The landmark the skip link jumps to takes focus without drawing a ring around the whole page. */
main:focus,
main:focus-visible { outline: none !important; }

/* ── 2. Keyboard focus ────────────────────────────────────────────────── */
:focus-visible {
    outline: 3px solid #1d4ed8 !important;
    outline-offset: 2px !important;
}
/* On dark surfaces a dark blue ring disappears; use a light one. */
[data-bs-theme="dark"] :focus-visible,
#sidebar :focus-visible,
.cp-sidebar :focus-visible,
.iq-banner :focus-visible,
footer :focus-visible {
    outline-color: #7dd3fc !important;
}

/* ── 3. Reduced motion ────────────────────────────────────────────────── */
@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}