/* ============================================================
 * LESKOV — R20 Accessibility (focus, skip-link, sr-only, motion)
 * WCAG 2.1 AA: visible focus, contrast, motion-reduce, sr-only.
 * ============================================================ */

/* ---------- Skip link ---------- */

.leskov-skip-link {
    position: absolute;
    top: -100px;
    left: 12px;
    z-index: 100000;
    padding: 10px 16px;
    /* Было #4f8bff: белый текст на нём даёт 3.25:1 при норме 4.5:1.
       Тот же синий, но глубже — 5.6:1, вид не меняется. */
    background: #1c4fd0;
    color: #fff;
    border-radius: 6px;
    font-weight: 600;
    text-decoration: none;
    transition: top 0.15s ease;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
}
.leskov-skip-link:focus,
.leskov-skip-link:focus-visible {
    top: 12px;
    outline: 3px solid #ffd54f;
    outline-offset: 2px;
}

/* ---------- Screen-reader-only ---------- */

.leskov-sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

/* ---------- Focus indicators (universal) ---------- */

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible,
summary:focus-visible,
[contenteditable="true"]:focus-visible {
    outline: 3px solid #ffd54f;
    outline-offset: 2px;
    border-radius: 4px;
}

/* Some elements have transparent outlines by default — make sure
 * the focus ring stays visible against the dark theme. */
.leskov-skip-link:focus-visible {
    outline-color: #ffd54f;
}

/* Buttons get a slightly tighter outline so it doesn't crowd
 * small icon buttons. */
.site-btn:focus-visible,
.tiny-action:focus-visible,
.icon-button:focus-visible,
[data-pwa-install-action]:focus-visible,
[data-pwa-update-action]:focus-visible {
    outline-offset: 3px;
}

/* ---------- Form fields ---------- */

.leskov-field-label {
    display: inline-block;
    font-size: 13px;
    color: rgba(255, 255, 255, 0.85);
    margin-bottom: 4px;
}
.leskov-required-star {
    color: #ff5b5b;
    margin-left: 2px;
    font-weight: 700;
}
.leskov-form-hint {
    margin: 4px 0 0;
    font-size: 12px;
    color: rgba(255, 255, 255, 0.6);
    line-height: 1.4;
}
.leskov-form-error {
    margin: 4px 0 0;
    font-size: 12px;
    color: #ff8080;
    line-height: 1.4;
}
input[aria-invalid="true"],
textarea[aria-invalid="true"],
select[aria-invalid="true"] {
    border-color: #ff5b5b;
    background: rgba(255, 91, 91, 0.08);
}
input[aria-invalid="true"]:focus-visible,
textarea[aria-invalid="true"]:focus-visible {
    outline-color: #ff5b5b;
}

/* ---------- Aria-current navigation ---------- */

[aria-current="page"] {
    font-weight: 600;
    color: #4f8bff;
}
[aria-current="page"]::after {
    content: "";
    display: inline-block;
    width: 4px;
    height: 4px;
    border-radius: 50%;
    background: #4f8bff;
    margin-left: 6px;
    vertical-align: middle;
}

/* ---------- Reduced motion ---------- */

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
    .leskov-pwa-install-banner,
    .leskov-pwa-update-banner,
    .leskov-pwa-offline-toast,
    .leskov-reaction-pill,
    .leskov-reaction-picker-item {
        animation: none !important;
    }
}

/* ---------- Forced-colors (Windows High Contrast) ---------- */

@media (forced-colors: active) {
    .leskov-skip-link,
    [data-pwa-install-action],
    [data-pwa-update-action] {
        border: 2px solid CanvasText;
        background: ButtonFace;
        color: ButtonText;
    }
    a:focus-visible,
    button:focus-visible,
    input:focus-visible,
    textarea:focus-visible,
    select:focus-visible {
        outline: 3px solid Highlight;
    }
}

/* ---------- High contrast (prefers-contrast: more) ---------- */

@media (prefers-contrast: more) {
    .leskov-account-state,
    .leskov-reactions,
    .leskov-poll,
    .leskov-draft-card {
        border-width: 2px;
        border-color: rgba(255, 255, 255, 0.45);
    }
    .site-btn {
        border-width: 2px;
    }
    a, button, input, textarea, select {
        font-weight: 500;
    }
}

/* ---------- Light-mode focus contrast ---------- */

@media (prefers-color-scheme: light) {
    a:focus-visible,
    button:focus-visible,
    input:focus-visible,
    textarea:focus-visible,
    select:focus-visible,
    [tabindex]:focus-visible {
        outline: 3px solid #b45309;
    }
    .leskov-form-hint { color: rgba(0, 0, 0, 0.65); }
    .leskov-form-error { color: #b91c1c; }
    .leskov-field-label { color: rgba(0, 0, 0, 0.85); }
}