/* ==========================================================================
   Options et Préférences d'Accessibilité - Sitaudis 2026
   Prise en charge :
   - Contrastes : normal, contraste élevé (fond noir texte blanc), sépia / crème doux, inversion
   - Typographies : normale, police sans-serif renforcée, police OpenDyslexic
   - Tailles de police : normale (100%), grande (115%), très grande (130%)
   - Espacements : normal, aéré (interlignage 1.85, espacement mots)
   - Soulignement des liens
   ========================================================================== */

/* 1. TAILLES DE TEXTE */
[data-a11y-size="large"] {
  font-size: 115% !important;
}
[data-a11y-size="large"] .sitaudis-card-title,
[data-a11y-size="large"] .feature-card-content .sitaudis-card-title {
  font-size: 1.15em !important;
}
[data-a11y-size="large"] .sitaudis-card-excerpt,
[data-a11y-size="large"] .feature-card-content .sitaudis-card-excerpt {
  font-size: 15px !important;
}

[data-a11y-size="xlarge"] {
  font-size: 130% !important;
}
[data-a11y-size="xlarge"] .sitaudis-card-title,
[data-a11y-size="xlarge"] .feature-card-content .sitaudis-card-title {
  font-size: 1.3em !important;
}
[data-a11y-size="xlarge"] .sitaudis-card-excerpt,
[data-a11y-size="xlarge"] .feature-card-content .sitaudis-card-excerpt {
  font-size: 16.5px !important;
}

/* 2. POLICES ACCESSIBLES */
/* Police Dyslexie (OpenDyslexic chargée depuis CDN) */
@import url('https://fonts.cdnfonts.com/css/opendyslexic');

[data-a11y-font="opendyslexic"],
[data-dyslexic="true"] {
  --font-body: 'OpenDyslexic', -apple-system, sans-serif !important;
  --font-title: 'OpenDyslexic', -apple-system, sans-serif !important;
  --font-serif: 'OpenDyslexic', Georgia, serif !important;
  letter-spacing: 0.04em !important;
  word-spacing: 0.08em !important;
  line-height: 1.75 !important;
}

[data-a11y-font="accessible"] {
  --font-body: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
  --font-title: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
  --font-serif: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
  letter-spacing: 0.025em !important;
  word-spacing: 0.04em !important;
}

/* 3. CONTRASTES */
/* Contraste Élevé (fond noir absolu, texte blanc pur) */
[data-a11y-contrast="high"] {
  --bg-page: #000000 !important;
  --bg-surface: #111111 !important;
  --bg-nav: #000000 !important;
  --text-main: #ffffff !important;
  --text-muted: #e5e7eb !important;
  --border-color: #ffffff !important;
  --card-border: 2px solid #ffffff !important;
  background-color: #000000 !important;
  color: #ffffff !important;
}

[data-a11y-contrast="high"] body {
  background: #000000 !important;
  color: #ffffff !important;
}

[data-a11y-contrast="high"] .sitaudis-card,
[data-a11y-contrast="high"] .feature-horizontal-card,
[data-a11y-contrast="high"] .sitaudis-quote-card,
[data-a11y-contrast="high"] .sitaudis-editions-card {
  background: #111111 !important;
  border: 2px solid #ffffff !important;
}

[data-a11y-contrast="high"] .sitaudis-card-title a,
[data-a11y-contrast="high"] .feature-card-content a,
[data-a11y-contrast="high"] .sitaudis-card-author,
[data-a11y-contrast="high"] .sitaudis-card-excerpt {
  color: #ffffff !important;
}

[data-a11y-contrast="high"] .sitaudis-nav-topbar {
  background: #000000 !important;
  border-bottom: 2px solid #ffffff !important;
}

[data-a11y-contrast="high"] .sitaudis-brand-logo img {
  filter: brightness(0) invert(1) !important;
}

[data-a11y-contrast="high"] .sitaudis-nav-bottombar {
  background: #000000 !important;
  border-bottom: 2px solid #ffffff !important;
}

/* Contraste Sépia / Doux pour les yeux */
[data-a11y-contrast="sepia"] {
  --bg-page: #fbf0d9 !important;
  --bg-surface: #f4e8c1 !important;
  --bg-nav: #3d3024 !important;
  --text-main: #2d241e !important;
  --text-muted: #5e4c3e !important;
  --border-color: #d8c7a5 !important;
  --card-border: 1px solid #d8c7a5 !important;
  background-color: #fbf0d9 !important;
  color: #2d241e !important;
}

[data-a11y-contrast="sepia"] body {
  background: #fbf0d9 !important;
  color: #2d241e !important;
}

[data-a11y-contrast="sepia"] .sitaudis-card,
[data-a11y-contrast="sepia"] .feature-horizontal-card,
[data-a11y-contrast="sepia"] .sitaudis-quote-card,
[data-a11y-contrast="sepia"] .sitaudis-editions-card {
  background: #f4e8c1 !important;
  border: 1px solid #c9b48b !important;
}

[data-a11y-contrast="sepia"] .sitaudis-card-title a,
[data-a11y-contrast="sepia"] .feature-card-content a,
[data-a11y-contrast="sepia"] .sitaudis-card-excerpt {
  color: #2d241e !important;
}

/* 4. ESPACEMENTS & INTERLIGNAGE */
[data-a11y-spacing="large"] p,
[data-a11y-spacing="large"] .sitaudis-card-excerpt,
[data-a11y-spacing="large"] .feature-card-content .sitaudis-card-excerpt,
[data-a11y-spacing="large"] .sitaudis-reading-content {
  line-height: 1.95 !important;
  letter-spacing: 0.03em !important;
  word-spacing: 0.06em !important;
  margin-bottom: 1.5em !important;
}

/* 5. SOULIGNEMENT DES LIENS */
[data-a11y-underline="true"] a {
  text-decoration: underline !important;
  text-underline-offset: 3px !important;
}

/* 6. REDUCTION DES ANIMATIONS */
@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;
  }
}

/* ==========================================================================
   CONFORMITÉ WCAG 2.2 : FOCUS CLAVIER VISIBLE & CLASSE SR-ONLY
   ========================================================================== */
:focus-visible {
  outline: 3px solid #3366ff !important;
  outline-offset: 3px !important;
  border-radius: 2px !important;
}

[data-mode="dark"] :focus-visible {
  outline: 3px solid #60a5fa !important;
  outline-offset: 3px !important;
}

/* Classe universelle pour contenu réservé aux lecteurs d'écran (Screen Readers) */
.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;
}
