/*
 * PHARANEA — CSS accessibilité globale (WCAG 2.1 AA)
 * À inclure sur toutes les pages via <link rel="stylesheet" href="/assets/a11y.css">
 * Pas de compétition avec les CSS métier — cible uniquement les cas a11y.
 */

/* ═══════════ Skip-link (WCAG 2.4.1 Contournement de blocs) ═══════════ */
.a11y-skip {
    position: absolute;
    top: -100px;
    left: 0;
    background: #1e4d7b;
    color: #fff;
    padding: 12px 20px;
    z-index: 9999;
    font-weight: 600;
    text-decoration: none;
    border-radius: 0 0 8px 0;
    transition: top .15s;
    font-size: .95rem;
}
.a11y-skip:focus {
    top: 0;
    outline: 3px solid #4a9c5c;
    outline-offset: 2px;
}

/* ═══════════ Focus visible amélioré (WCAG 2.4.7) ═══════════ */
*:focus-visible {
    outline: 2px solid #1e4d7b;
    outline-offset: 2px;
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
    outline: 2px solid #1e4d7b;
    outline-offset: 2px;
    box-shadow: 0 0 0 4px rgba(30, 77, 123, .15);
}

/* Focus main-content : discret mais utilisable clavier */
#main-content:focus,
main:focus {
    outline: none;
}

/* ═══════════ Screen reader only (WCAG 4.1.2 + 1.1.1) ═══════════ */
.sr-only,
.visually-hidden {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* ═══════════ Contrastes améliorés (WCAG 1.4.3 — AA = 4.5:1 texte normal) ═══════════ */
/* Le gris #5d6b75 sur fond blanc = ratio 5.3:1 ✅ */
/* Le gris #8998a5 sur fond blanc = ratio 3.1:1 ❌ — à éviter en texte principal */
.text-muted,
.text-gris {
    color: #4a5762 !important;  /* Assombri : ratio 7.4:1 sur blanc */
}
small.text-muted,
.font-xs.text-muted {
    color: #5d6b75;  /* Un peu plus clair OK pour texte >18px ou secondaire */
}

/* ═══════════ Cible tactile minimum 44x44 (WCAG 2.5.5) ═══════════ */
button, a.btn, input[type=submit], input[type=button] {
    min-height: 40px;      /* Léger compromis : 40px au lieu de 44 sur desktop */
}
@media (pointer: coarse) {
    /* Sur mobile/tablette, cibles plus larges */
    button, a.btn, input[type=submit], input[type=button] {
        min-height: 44px;
        min-width: 44px;
    }
}

/* ═══════════ Réduire animations si préférence système (WCAG 2.3.3) ═══════════ */
@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;
    }
}

/* ═══════════ Images sans alt : signal visible en dev ═══════════ */
img:not([alt]) {
    outline: 3px solid #c33 !important;
    outline-offset: 2px;
}
img[alt=""] {
    /* alt="" volontaire (décorative) — pas d'outline */
}

/* ═══════════ Boutons icon-only : forcer un label ARIA ═══════════ */
button:not([aria-label]):not([title]):empty::before {
    content: "⚠️ Bouton sans label";
    color: #c33;
    font-size: .7rem;
}