/**
 * CSS pour les fonctionnalités d'accessibilité RGAA Manager
 * Styles appliqués dynamiquement selon les préférences utilisateur
 */

/* ==============================================
   CONTRASTE ÉLEVÉ
   ============================================== */

body.rgaa-high-contrast,
body.rgaa-high-contrast * {
    background-color: #000000 !important;
    color: #ffffff !important;
    border-color: #ffffff !important;
    text-shadow: none !important;
    box-shadow: none !important;
}

body.rgaa-high-contrast a,
body.rgaa-high-contrast a * {
    color: #ffff00 !important;
    text-decoration: underline !important;
}

body.rgaa-high-contrast a:hover,
body.rgaa-high-contrast a:focus {
    color: #ffffff !important;
    background-color: #ffff00 !important;
}

body.rgaa-high-contrast button,
body.rgaa-high-contrast input[type="button"],
body.rgaa-high-contrast input[type="submit"] {
    background-color: #ffffff !important;
    color: #000000 !important;
    border: 2px solid #ffffff !important;
}

body.rgaa-high-contrast button:hover,
body.rgaa-high-contrast button:focus {
    background-color: #ffff00 !important;
    color: #000000 !important;
    border-color: #ffff00 !important;
}

/* Images en contraste élevé */
body.rgaa-high-contrast img {
    filter: contrast(1.2) brightness(1.1) !important;
}

/* ==============================================
   AJUSTEMENT TAILLE DE POLICE
   ============================================== */

body.rgaa-font-size-small {
    font-size: 0.85em !important;
}

body.rgaa-font-size-small * {
    font-size: inherit !important;
}

body.rgaa-font-size-large {
    font-size: 1.15em !important;
}

body.rgaa-font-size-large * {
    font-size: inherit !important;
}

body.rgaa-font-size-xl {
    font-size: 1.3em !important;
}

body.rgaa-font-size-xl * {
    font-size: inherit !important;
}

/* ==============================================
   NAVIGATION CLAVIER AMÉLIORÉE
   ============================================== */

body.rgaa-keyboard-nav *:focus {
    outline: 3px solid #ffff00 !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 5px rgba(255, 255, 0, 0.7) !important;
}

body.rgaa-keyboard-nav a:focus,
body.rgaa-keyboard-nav button:focus,
body.rgaa-keyboard-nav input:focus,
body.rgaa-keyboard-nav select:focus,
body.rgaa-keyboard-nav textarea:focus {
    background-color: rgba(255, 255, 0, 0.1) !important;
}

/* Skip links pour navigation clavier */
body.rgaa-keyboard-nav .rgaa-skip-link {
    position: absolute !important;
    top: -40px !important;
    left: 6px !important;
    background: #000000 !important;
    color: #ffffff !important;
    padding: 8px 12px !important;
    text-decoration: none !important;
    z-index: 100000 !important;
    border-radius: 4px !important;
    font-weight: bold !important;
    font-size: 14px !important;
    transition: all 0.3s ease !important;
}

body.rgaa-keyboard-nav .rgaa-skip-link:focus {
    top: 6px !important;
    outline: 2px solid #ffff00 !important;
}

/* ==============================================
   MODE DYSLEXIE
   ============================================== */

body.rgaa-dyslexia-mode {
    font-family:
        "OpenDyslexic", "Comic Sans MS", cursive, Arial, sans-serif !important;
    line-height: 1.6 !important;
    letter-spacing: 0.05em !important;
    word-spacing: 0.1em !important;
}

body.rgaa-dyslexia-mode * {
    font-family: inherit !important;
    line-height: inherit !important;
    letter-spacing: inherit !important;
    word-spacing: inherit !important;
}

body.rgaa-dyslexia-mode p,
body.rgaa-dyslexia-mode li,
body.rgaa-dyslexia-mode span {
    text-align: left !important;
    hyphens: none !important;
}

body.rgaa-dyslexia-mode h1,
body.rgaa-dyslexia-mode h2,
body.rgaa-dyslexia-mode h3,
body.rgaa-dyslexia-mode h4,
body.rgaa-dyslexia-mode h5,
body.rgaa-dyslexia-mode h6 {
    margin-bottom: 0.8em !important;
    font-weight: bold !important;
}

/* ==============================================
   ZOOM DU TEXTE
   ============================================== */

body.rgaa-text-zoom {
    transform-origin: 0 0 !important;
}

/* Support pour différents navigateurs */
body.rgaa-text-zoom-110 {
    zoom: 1.1 !important;
    -moz-transform: scale(1.1) !important;
    -webkit-transform: scale(1.1) !important;
    transform: scale(1.1) !important;
}

body.rgaa-text-zoom-120 {
    zoom: 1.2 !important;
    -moz-transform: scale(1.2) !important;
    -webkit-transform: scale(1.2) !important;
    transform: scale(1.2) !important;
}

body.rgaa-text-zoom-130 {
    zoom: 1.3 !important;
    -moz-transform: scale(1.3) !important;
    -webkit-transform: scale(1.3) !important;
    transform: scale(1.3) !important;
}

body.rgaa-text-zoom-140 {
    zoom: 1.4 !important;
    -moz-transform: scale(1.4) !important;
    -webkit-transform: scale(1.4) !important;
    transform: scale(1.4) !important;
}

body.rgaa-text-zoom-150 {
    zoom: 1.5 !important;
    -moz-transform: scale(1.5) !important;
    -webkit-transform: scale(1.5) !important;
    transform: scale(1.5) !important;
}

/* ==============================================
   ANIMATIONS RÉDUITES
   ============================================== */

body.rgaa-reduced-motion *,
body.rgaa-reduced-motion *::before,
body.rgaa-reduced-motion *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
}

/* ==============================================
   CLASSE UTILITAIRES RGAA
   ============================================== */

/* Texte visible uniquement par les lecteurs d'écran */
.rgaa-sr-only {
    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;
}

/* Région live pour les annonces */
.rgaa-live-region {
    position: absolute !important;
    left: -10000px !important;
    width: 1px !important;
    height: 1px !important;
    overflow: hidden !important;
}

/* Focus visible amélioré - Appliqué uniquement si navigation clavier activée */
body.rgaa-keyboard-nav .rgaa-focus-visible:focus,
body.rgaa-keyboard-nav [role="button"]:focus,
body.rgaa-keyboard-nav [role="link"]:focus,
body.rgaa-keyboard-nav [role="menuitem"]:focus,
body.rgaa-keyboard-nav [role="tab"]:focus {
    outline: 3px solid #0073aa !important;
    outline-offset: 2px !important;
    box-shadow: 0 0 5px rgba(0, 115, 170, 0.7) !important;
}

/* ==============================================
   COMPATIBILITÉ RESPONSIVE
   ============================================== */

@media (max-width: 768px) {
    body.rgaa-font-adjusted {
        font-size: 1.1em !important;
    }

    body.rgaa-text-zoom {
        transform-origin: 0 0 !important;
        overflow-x: auto !important;
    }
}

@media (max-width: 480px) {
    body.rgaa-dyslexia-mode {
        line-height: 1.8 !important;
        letter-spacing: 0.08em !important;
    }
}

/* ==============================================
   THÈME SOMBRE SYSTÈME
   ============================================== */

@media (prefers-color-scheme: dark) {
    body.rgaa-auto-dark-mode {
        background-color: #1a1a1a !important;
        color: #e0e0e0 !important;
    }

    body.rgaa-auto-dark-mode * {
        background-color: inherit !important;
        color: inherit !important;
    }

    body.rgaa-auto-dark-mode a {
        color: #58a6ff !important;
    }

    body.rgaa-auto-dark-mode a:hover {
        color: #79c0ff !important;
    }
}

/* ==============================================
   PRÉFÉRENCES MOUVEMENT RÉDUIT
   ============================================== */

@media (prefers-reduced-motion: reduce) {
    body.rgaa-respect-motion-preferences *,
    body.rgaa-respect-motion-preferences *::before,
    body.rgaa-respect-motion-preferences *::after {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
        scroll-behavior: auto !important;
    }
}

/* ==============================================
   CONTRASTE ÉLEVÉ SYSTÈME
   ============================================== */

@media (prefers-contrast: high) {
    body.rgaa-respect-contrast-preferences {
        filter: contrast(1.5) !important;
    }

    body.rgaa-respect-contrast-preferences * {
        border-width: 2px !important;
        outline-width: 3px !important;
    }
}

/* ==============================================
   NOUVELLES FONCTIONNALITÉS D'ACCESSIBILITÉ
   ============================================== */

/* Arrêter les animations */
body.rgaa-stop-animations *,
body.rgaa-stop-animations *::before,
body.rgaa-stop-animations *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
}

/* Surligner les liens */
body.rgaa-highlight-links a {
    background-color: #ffff00 !important;
    color: #000000 !important;
    padding: 2px 4px !important;
    border-radius: 3px !important;
    text-decoration: underline !important;
    font-weight: bold !important;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2) !important;
}

body.rgaa-highlight-links a:hover,
body.rgaa-highlight-links a:focus {
    background-color: #ff6600 !important;
    color: #ffffff !important;
}

/* Espacer le texte */
body.rgaa-text-spacing {
    letter-spacing: 0.12em !important;
    word-spacing: 0.16em !important;
}

body.rgaa-text-spacing *,
body.rgaa-text-spacing p,
body.rgaa-text-spacing li,
body.rgaa-text-spacing span,
body.rgaa-text-spacing div {
    letter-spacing: inherit !important;
    word-spacing: inherit !important;
}

/* Masquer les images */
body.rgaa-hide-images img,
body.rgaa-hide-images picture,
body.rgaa-hide-images svg,
body.rgaa-hide-images [style*="background-image"] {
    opacity: 0.1 !important;
    filter: grayscale(100%) !important;
}

body.rgaa-hide-images img[alt]:not([alt=""])::after {
    content: "[📷 " attr(alt) "]" !important;
    display: inline-block !important;
    background: #f0f0f0 !important;
    padding: 8px !important;
    border: 1px solid #ddd !important;
    border-radius: 4px !important;
    font-style: italic !important;
    color: #666 !important;
    opacity: 1 !important;
    filter: none !important;
    position: absolute !important;
    z-index: 10 !important;
}

/* Agrandir le curseur */
body.rgaa-big-cursor,
body.rgaa-big-cursor * {
    cursor:
        url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><polygon fill="black" points="1,1 1,13 5,9 9,13 13,9 9,5 13,1"/><polygon fill="white" points="2,2 2,11 5,8 8,11 11,8 8,5 11,2"/></svg>')
            1 1,
        auto !important;
}

body.rgaa-big-cursor a,
body.rgaa-big-cursor button,
body.rgaa-big-cursor input[type="button"],
body.rgaa-big-cursor input[type="submit"],
body.rgaa-big-cursor [role="button"] {
    cursor:
        url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32"><polygon fill="black" points="8,1 8,7 12,7 12,10 8,10 8,16 14,16 14,10 18,10 18,7 14,7 14,1"/><polygon fill="white" points="9,2 9,6 13,6 13,9 9,9 9,15 13,15 13,9 17,9 17,6 13,6 13,2"/></svg>')
            8 1,
        pointer !important;
}

/* Hauteur de ligne */
body.rgaa-line-height {
    line-height: 2 !important;
}

body.rgaa-line-height *,
body.rgaa-line-height p,
body.rgaa-line-height li,
body.rgaa-line-height div,
body.rgaa-line-height span {
    line-height: inherit !important;
}

/* Aligner le texte à gauche */
body.rgaa-text-align *,
body.rgaa-text-align p,
body.rgaa-text-align div,
body.rgaa-text-align h1,
body.rgaa-text-align h2,
body.rgaa-text-align h3,
body.rgaa-text-align h4,
body.rgaa-text-align h5,
body.rgaa-text-align h6,
body.rgaa-text-align li,
body.rgaa-text-align td,
body.rgaa-text-align th {
    text-align: left !important;
    justify-content: flex-start !important;
}

/* Info-bulles permanentes */
body.rgaa-tooltips [title]:hover::after,
body.rgaa-tooltips [title]:focus::after {
    content: attr(title) !important;
    position: absolute !important;
    bottom: 100% !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    background: #333 !important;
    color: #fff !important;
    padding: 8px 12px !important;
    border-radius: 4px !important;
    font-size: 14px !important;
    white-space: nowrap !important;
    z-index: 1000 !important;
    pointer-events: none !important;
    margin-bottom: 5px !important;
}

body.rgaa-tooltips [title] {
    position: relative !important;
}
