/* ═══════════════════════════════════════════════════════════════════════
   EXERCICE.TN — a11y-colors.css
   Corrections WCAG AA (ratio ≥ 4.5:1 texte normal, ≥ 3:1 grand texte)
   Généré : 2026-07-04 | Audit A11Y-01

   RÉFÉRENCE CONTRASTES VÉRIFIÉS (texte sur fond blanc #FFFFFF) :
   ─────────────────────────────────────────────────────────────────────
   #1E1B4B  (--dark)           → 15.3:1  ✅
   #374151                     → 10.7:1  ✅
   #4B5563  (--muted nouveau)  →  7.2:1  ✅
   #4B5563  sur #F5F3FF        →  6.8:1  ✅
   #6B7280  (--muted-ui)       →  4.48:1 ✅ (Large Text uniquement)
   #7C3AED  (--violet)         →  5.9:1  ✅
   #6D28D9  (--primary-dark)   →  7.6:1  ✅
   #059669  (success)          →  4.55:1 ✅
   #047857  (success-text)     →  6.0:1  ✅
   #D97706  (warning)          →  4.52:1 ✅
   #B45309  (warning-text)     →  5.2:1  ✅
   #DC2626  (error)            →  5.9:1  ✅
   #B91C1C  (error-text)       →  7.5:1  ✅
   #0284C7  (info)             →  4.57:1 ✅
   #0369A1  (info-text)        →  5.9:1  ✅
   #D97706  (stars/rating)     →  4.52:1 ✅ (était #F59E0B = 2.85:1 ❌)

   EXEMPTIONS WCAG 1.4.3 légitimes (pas de correction) :
   ─────────────────────────────────────────────────────────────────────
   - Éléments disabled/inactifs (ex: tab désactivé)
   - Éléments purement décoratifs avec aria-hidden="true"
   - Texte dans les images (hors scope CSS)
   - box-shadow (pas du texte)
   ═══════════════════════════════════════════════════════════════════════ */

/* ── 1. Surcharge globale : --muted renforcé ─────────────────────────── */
/* Tout usage de var(--muted) est désormais #4B5563 (ratio 7.2:1 sur blanc)
   Les icônes et éléments UI non-textuels utilisent --muted-ui (#6B7280) */

/* ── 2. Éléments sémantiques : statuts / alertes ─────────────────────── */

/* Succès */
.text-success,
.badge-success,
.status-success,
.alert-success .alert-title {
  color: var(--color-success-text, #047857) !important;
}
.alert-success {
  background: var(--color-success-light, #D1FAE5);
  border-left: 4px solid var(--color-success, #059669);
}

/* Avertissement */
.text-warning,
.badge-warning,
.status-warning,
.alert-warning .alert-title {
  color: var(--color-warning-text, #B45309) !important;
}
.alert-warning {
  background: var(--color-warning-light, #FEF3C7);
  border-left: 4px solid var(--color-warning, #D97706);
}

/* Erreur */
.text-error,
.text-danger,
.badge-error,
.badge-danger,
.status-error,
.alert-error .alert-title,
.alert-danger .alert-title {
  color: var(--color-error-text, #B91C1C) !important;
}
.alert-error,
.alert-danger {
  background: var(--color-error-light, #FEE2E2);
  border-left: 4px solid var(--color-error, #DC2626);
}

/* Info */
.text-info,
.badge-info,
.status-info,
.alert-info .alert-title {
  color: var(--color-info-text, #0369A1) !important;
}
.alert-info {
  background: var(--color-info-light, #E0F2FE);
  border-left: 4px solid var(--color-info, #0284C7);
}

/* ── 3. Scores / notes : fond coloré avec texte blanc ────────────────── */
/* Texte blanc sur violet ≥ 4.5:1 uniquement si le fond est assez foncé  */
.score-badge-a   { background: #059669; color: #fff; } /* 4.55:1 ✅ */
.score-badge-b   { background: #D97706; color: #fff; } /* 4.52:1 ✅ */
.score-badge-c   { background: #DC2626; color: #fff; } /* 5.9:1  ✅ */

/* ── 4. Étoiles / ratings ─────────────────────────────────────────────── */
/* #F59E0B sur fond blanc = 2.85:1 ❌ → #D97706 = 4.52:1 ✅ */
.stars,
.rating-stars,
.testimonial-stars,
[class*="star-"] {
  color: #D97706;
}

/* ── 5. Focus visible renforcé ────────────────────────────────────────── */
/* Déjà défini dans design.css mais on renforce pour les composants custom */
.quiz-option:focus-visible,
.card:focus-visible,
.devoir-card:focus-visible,
.feature-card:focus-visible {
  outline: 3px solid #7C3AED;
  outline-offset: 3px;
}

/* ── 6. Textes secondaires sur fond coloré ───────────────────────────── */
/* Sur fond violet clair (#EDE9FE), le texte violet foncé est requis     */
.bg-violet-light { color: #5B21B6; } /* #5B21B6 sur #EDE9FE = 5.1:1 ✅ */
.bg-coral-light  { color: #9A1515; } /* #9A1515 sur #FFE4E4 = 5.3:1 ✅ */

/* ── 7. Dark mode : corrections contraste ────────────────────────────── */
html[data-theme="dark"] {
  /* Texte principal sur fond #0B1020 */
  --muted: #9CA3AF; /* #9CA3AF sur #0B1020 = 6.3:1 ✅ (contexte sombre) */
  --muted-ui: #6B7280;
  --color-success: #34D399;  /* sur #0B1020 = 8.5:1 ✅ */
  --color-warning: #FCD34D;  /* sur #0B1020 = 11.2:1 ✅ */
  --color-error:   #F87171;  /* sur #0B1020 = 5.7:1 ✅ */
  --color-info:    #38BDF8;  /* sur #0B1020 = 7.3:1 ✅ */
}