/* Lien d'évitement (WCAG 2.4.1), includes/modules/accessibility/public-display.php :
   invisible tant qu'il n'a pas le focus clavier, comme tout skip-link standard. */
.eh-a11y-skip-link {
    position: fixed;
    top: -100px;
    left: 12px;
    z-index: 999999;
    background: #111;
    color: #fff;
    padding: 10px 16px;
    border-radius: 6px;
    text-decoration: none;
    font-size: 0.875rem;
    font-family: sans-serif;
    transition: top 0.2s ease;
}

.eh-a11y-skip-link:focus {
    top: 12px;
}

/* Panneau Accessibilité, ancré au bouton engrenage (même position que les
   panneaux panier et cookies : assets/css/sticky-cart.css / cookie-consent.css). */
.eh-a11y-panel,
.eh-a11y-panel *,
.eh-a11y-panel *::before,
.eh-a11y-panel *::after {
    box-sizing: border-box;
}

.eh-a11y-panel {
    /* display: flex est posé par assets/css/core.css (sélecteur par id, plus
       spécifique) : ne pas le redéclarer ici, au risque d'entrer en conflit
       d'ordre de cascade avec la règle qui masque ce panneau par défaut. */
    flex-direction: column;
    width: 100%;

    /* max-height (pas height:100%) : #eh-fab grandit selon son propre contenu
       (height: auto), donc un pourcentage ici ne se résoudrait jamais et la
       zone de défilement plus bas ne saurait jamais quand s'activer. */
    max-height: calc(100vh - 140px);
    min-height: 0;
    font-family: sans-serif;
}

@media (max-width: 1440px) {
    .eh-a11y-panel {
        max-height: calc(100vh - 120px);
    }
}

@media (max-width: 480px) {
    .eh-a11y-panel {
        max-height: calc(100vh - 110px);
    }
}

.eh-a11y-close {
    position: absolute;
    top: 8px;
    right: 14px;
    width: 28px;
    height: 28px;
    border-radius: 0;
    border: none;
    background: rgba(0, 0, 0, 0.06);
    color: #333;
    font-size: 0.875rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    z-index: 2;
    flex-shrink: 0;
}

.eh-a11y-close:hover {
    background: rgba(0, 0, 0, 0.12);
}

/* Seule cette zone défile si le contenu dépasse : la croix, elle, reste
   toujours en place et cliquable dans son intégralité. */
.eh-a11y-scroll {
    flex: 1;
    min-height: 0;
    overflow: hidden auto;

    /* Marge droite plus large que les autres côtés : laisse de la place à la
       barre de défilement, pour qu'elle n'arrive pas juste sous la croix de
       fermeture (position: absolute, hors de cette zone qui défile). */
    padding: 34px 20px 16px 16px;
}

/* Gotu : même police que le titre produit du panneau panier et que les
   titres/boutons du panneau cookies (assets/css/sticky-cart.css,
   cookie-consent.css) — les 3 panneaux doivent se lire comme un seul système. */
.eh-a11y-title {
    margin: 0 0 14px;
    font-size: 1rem;
    font-weight: 700;
    color: #111;
    font-family: Gotu, sans-serif;
}

.eh-a11y-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 0;
    border-top: 1px solid #eee;
}

.eh-a11y-row:first-of-type {
    border-top: none;
}

.eh-a11y-row label,
.eh-a11y-row span {
    font-size: 0.8125rem;
    color: #333;
}

#eh-a11y-lang {
    font-size: 0.8125rem;
    padding: 6px 8px;
    border: 1px solid #ccc;
    border-radius: 0;
    background: #fff;
}

.eh-a11y-switch {
    width: 42px;
    height: 24px;
    border-radius: 0;
    border: none;
    background: #ccc;
    cursor: pointer;
    position: relative;
    padding: 0;
    flex-shrink: 0;
    transition: background 0.2s ease;
}

.eh-a11y-switch-knob {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 20px;
    height: 20px;
    border-radius: 0;
    background: #fff;
    box-shadow: 0 1px 3px rgb(0 0 0 / 30%);
    transition: transform 0.2s ease;
}

.eh-a11y-switch[aria-pressed="true"] {
    background: #111;
}

.eh-a11y-switch[aria-pressed="true"] .eh-a11y-switch-knob {
    transform: translateX(18px);
}

.eh-a11y-note {
    margin: 12px 0 0;
    font-size: 0.6875rem;
    color: #888;
    line-height: 1.4;
}

/* Stepper "Taille du texte" */
.eh-a11y-stepper {
    display: flex;
    align-items: center;
    gap: 8px;
}

.eh-a11y-stepper button {
    width: 26px;
    height: 26px;
    border-radius: 0;
    border: 1px solid #ccc;
    background: #fff;
    color: #111;
    font-size: 0.9375rem;
    line-height: 1;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

.eh-a11y-stepper button:hover:not(:disabled) {
    background: #f0f0f0;
}

.eh-a11y-stepper button:disabled {
    opacity: 0.4;
    cursor: not-allowed;
}

.eh-a11y-stepper span {
    min-width: 42px;
    text-align: center;
    font-size: 0.75rem;
    font-variant-numeric: tabular-nums;
    color: #333;
}

/* Bouton "Réinitialiser les réglages" */
.eh-a11y-reset {
    display: block;
    width: 100%;
    margin-top: 16px;
    padding: 8px;
    background: none;
    border: 1px solid #ccc;
    color: #333;
    font-size: 0.75rem;
    cursor: pointer;
}

.eh-a11y-reset:hover {
    background: #f0f0f0;
    border-color: #999;
}

/* ========================================
   Effets appliqués au site : contraste, curseur agrandi, liens soulignés
   ======================================== */

/* Un filtre CSS global ne garantit aucun ratio de contraste WCAG précis, et
   peut même dégrader un contraste déjà correct sur certaines combinaisons de
   couleurs — un vrai jeu de couleurs de substitution testées serait plus
   fiable, mais suppose de connaître les couleurs du thème actif. En
   attendant, on limite l'intensité du filtre et on ajoute un signal de
   distinction des liens qui ne dépend pas de la couleur (soulignement). */
html.eh-a11y-contrast {
    filter: contrast(1.2) saturate(1.05);
}

html.eh-a11y-contrast img,
html.eh-a11y-contrast video {
    filter: contrast(0.9);
}

html.eh-a11y-contrast a {
    text-decoration: underline;
}

html.eh-a11y-underline-links a {
    text-decoration: underline !important;
    text-underline-offset: 2px;
}

html.eh-a11y-large-cursor,
html.eh-a11y-large-cursor a,
html.eh-a11y-large-cursor button,
html.eh-a11y-large-cursor input,
html.eh-a11y-large-cursor select,
html.eh-a11y-large-cursor textarea,
html.eh-a11y-large-cursor [role="button"] {
    cursor: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48' viewBox='0 0 32 32'%3E%3Cpath d='M6 2 L6 28 L13 21 L18 30 L22 28 L17 19 L26 19 Z' fill='black' stroke='white' stroke-width='2' stroke-linejoin='round'/%3E%3C/svg%3E") 6 4, auto !important;
}

/* Focus clavier visible, cohérent avec les panneaux panier/cookies. */
.eh-a11y-close:focus-visible,
.eh-a11y-switch:focus-visible,
#eh-a11y-lang:focus-visible {
    outline: 2px solid #2563eb;
    outline-offset: 2px;
}