/* ========== DARK MODE ========== */
/* Fonds principaux - TOUT sur le meme fond sombre, bordures pour separer */
.dark body { background-color: #0f172a !important; color: #f1f5f9 !important; }
.dark .bg-slate-100, .dark .bg-slate-200, .dark .bg-gray-100, .dark .bg-gray-50 { background-color: #0f172a !important; }
.dark .bg-white, .dark .bg-slate-50 { background-color: #0f172a !important; border: 1px solid #1e293b; }
/* Fonds colores -> subtils sur fond sombre */
.dark .bg-indigo-100, .dark .bg-indigo-50 { background-color: rgba(99,102,241,0.12) !important; }
.dark .bg-purple-100, .dark .bg-purple-50 { background-color: rgba(168,85,247,0.12) !important; }
.dark .bg-green-100, .dark .bg-green-50 { background-color: rgba(34,197,94,0.10) !important; }
.dark .bg-teal-100, .dark .bg-teal-50 { background-color: rgba(20,184,166,0.10) !important; }
.dark .bg-red-100, .dark .bg-red-50 { background-color: rgba(248,113,113,0.12) !important; }
.dark .bg-amber-100, .dark .bg-amber-50 { background-color: rgba(251,191,36,0.10) !important; }
.dark .bg-blue-100, .dark .bg-blue-50 { background-color: rgba(96,165,250,0.12) !important; }
.dark .bg-orange-100 { background-color: rgba(251,146,60,0.12) !important; }
.dark .bg-pink-100, .dark .bg-pink-50 { background-color: rgba(244,114,182,0.12) !important; }
.dark .bg-yellow-100, .dark .bg-yellow-50 { background-color: rgba(250,204,21,0.10) !important; }
/* Textes - contraste WCAG AA (4.5:1 min) */
.dark .text-slate-900, .dark .text-slate-800, .dark .text-gray-900, .dark .text-gray-800 { color: #f1f5f9 !important; }
.dark .text-slate-700, .dark .text-gray-700 { color: #e2e8f0 !important; }
.dark .text-slate-600, .dark .text-slate-500, .dark .text-gray-600, .dark .text-gray-500 { color: #a7b4c6 !important; }
.dark .text-slate-400, .dark .text-gray-400 { color: #8896ab !important; }
/* Textes colores - boost luminosite pour contraste */
.dark .text-indigo-600, .dark .text-indigo-700 { color: #a5b4fc !important; }
.dark .text-purple-600, .dark .text-purple-700 { color: #c4b5fd !important; }
.dark .text-green-600, .dark .text-green-700 { color: #86efac !important; }
.dark .text-teal-600, .dark .text-teal-700 { color: #5eead4 !important; }
.dark .text-red-600, .dark .text-red-700 { color: #fca5a5 !important; }
.dark .text-amber-700, .dark .text-amber-800 { color: #fcd34d !important; }
.dark .text-blue-600, .dark .text-blue-700 { color: #93c5fd !important; }
.dark .text-orange-600 { color: #fdba74 !important; }
/* Bordures */
.dark .border-slate-200, .dark .border-slate-100, .dark .border-slate-300,
.dark .border-gray-200, .dark .border-gray-100, .dark .border-gray-300 { border-color: #2a3444 !important; }
.dark .border-indigo-200, .dark .border-indigo-300 { border-color: rgba(99,102,241,0.25) !important; }
.dark .border-green-200 { border-color: rgba(34,197,94,0.25) !important; }
.dark .border-red-200, .dark .border-red-300 { border-color: rgba(248,113,113,0.25) !important; }
.dark .border-amber-200, .dark .border-amber-400 { border-color: rgba(251,191,36,0.25) !important; }
.dark .border-teal-200 { border-color: rgba(20,184,166,0.25) !important; }
.dark .border-blue-200, .dark .border-blue-300 { border-color: rgba(59,130,246,0.25) !important; }
.dark .border-pink-200, .dark .border-pink-300 { border-color: rgba(244,114,182,0.25) !important; }
.dark .border-amber-100, .dark .border-purple-300, .dark .border-purple-400 { border-color: rgba(168,85,247,0.25) !important; }
.dark .divide-slate-100 > * + *, .dark .divide-slate-200 > * + * { border-color: #2a3444 !important; }
.dark [class*="bg-slate-50\/"], .dark [class*="bg-slate-50/"] { background-color: transparent !important; }
/* Ombres - subtiles, pas de halo */
.dark .shadow-sm, .dark .shadow { box-shadow: 0 1px 2px rgba(0,0,0,0.4) !important; }
.dark .shadow-md { box-shadow: 0 2px 8px rgba(0,0,0,0.4) !important; }
.dark .shadow-lg, .dark .shadow-xl, .dark .shadow-2xl { box-shadow: 0 4px 12px rgba(0,0,0,0.5) !important; }
/* Formulaires */
.dark input, .dark select, .dark textarea { background-color: #111827 !important; color: #f1f5f9 !important; border-color: #374151 !important; }
.dark input::placeholder, .dark textarea::placeholder { color: #94a3b8 !important; }
.dark input[type="range"] { background-color: transparent !important; }
.dark input[type="checkbox"] { background-color: #111827 !important; accent-color: #6366f1; }
/* Nav et menus dropdown : leger contraste pour flotter au-dessus */
.dark nav.bg-white { background-color: #111827 !important; border-color: #1e293b !important; }
.dark .nav-dropdown > div { background-color: #111827 !important; border-color: #1e293b !important; }
/* Code */
.dark pre, .dark code { background-color: #111827 !important; color: #e2e8f0 !important; }
/* Hover */
.dark .hover\:bg-slate-100:hover, .dark .hover\:bg-slate-50:hover { background-color: #243044 !important; }
.dark .hover\:bg-indigo-50:hover, .dark .hover\:bg-purple-50:hover, .dark .hover\:bg-green-50:hover,
.dark .hover\:bg-teal-50:hover, .dark .hover\:bg-red-50:hover { background-color: rgba(255,255,255,0.06) !important; }
/* Tables + div-tables : TOUT transparent, bordures fines uniquement */
.dark table, .dark table thead, .dark table tbody, .dark table tr, .dark table th, .dark table td { background-color: transparent !important; background: transparent !important; }
.dark table thead th { color: #8896ab !important; border-bottom: 1px solid #1e293b !important; font-weight: 600; }
.dark table tbody tr { border-bottom: 1px solid #1e293b !important; }
.dark table tbody tr:hover { background-color: rgba(255,255,255,0.03) !important; }
.dark table td { border-bottom: 1px solid #1e293b !important; }
/* Div-based rows : forcer transparent sur bg-slate-50/100/200 dans les listes */
.dark div[class*="bg-slate-5"], .dark div[class*="bg-slate-1"],
.dark div[class*="bg-gray-5"], .dark div[class*="bg-gray-1"],
.dark div.bg-slate-50, .dark div.bg-slate-100, .dark div.bg-slate-200,
.dark div.bg-gray-50, .dark div.bg-gray-100 { background-color: transparent !important; background: transparent !important; }
/* Lignes alternees : pas de fond, juste une bordure */
.dark .even\:bg-slate-50:nth-child(even), .dark .odd\:bg-slate-50:nth-child(odd) { background: transparent !important; }
/* Boutons Back-office : meme style que Front-office (outline neutre) */
.dark .bg-blue-600:not(.bg-indigo-600):not([class*="btn-cta"]) { background-color: transparent !important; border: 1px solid #475569 !important; color: #cbd5e1 !important; }
.dark .bg-pink-600 { background-color: transparent !important; border: 1px solid #475569 !important; color: #cbd5e1 !important; }
/* Teal = couleur de marque "Formation" : tous les bg-teal-600 sont des CTA primaires
   (Générer les CMS, Déployer, Envoyer les identifiants...). On garde l'aplat coloré en dark
   pour préserver la hiérarchie visuelle, comme indigo-600/green-500 plus bas. */
.dark .bg-teal-600 { background-color: #0d9488 !important; color: #ffffff !important; }
.dark .bg-teal-600:hover, .dark .hover\:bg-teal-700:hover { background-color: #0f766e !important; }
/* Modals */
.dark #confirmModal > div,
.dark [id$="Modal"] > div > div { background-color: #111827 !important; border: 1px solid #1e293b !important; }
.dark [id$="Modal"] .bg-slate-50 { background-color: #0f172a !important; }
/* Footer */
.dark footer.bg-white { background-color: #0f172a !important; border-color: #1e293b !important; }
.dark footer .text-slate-500 { color: #94a3b8 !important; }
/* Gradients et from/to : tout transparent en dark */
.dark [class*="bg-gradient"] { background: #0f172a !important; }
.dark [class*="from-slate"], .dark [class*="from-indigo"], .dark [class*="from-blue"],
.dark [class*="from-purple"], .dark [class*="from-pink"], .dark [class*="from-white"],
.dark [class*="to-white"], .dark [class*="to-slate"] {
    --tw-gradient-from: #0f172a !important;
    --tw-gradient-to: #0f172a !important;
    background: #0f172a !important;
}
/* Scrollbar */
.dark ::-webkit-scrollbar { width: 8px; height: 8px; }
.dark ::-webkit-scrollbar-track { background: #111827; }
.dark ::-webkit-scrollbar-thumb { background: #374151; border-radius: 4px; }
.dark ::-webkit-scrollbar-thumb:hover { background: #4b5563; }
/* Liens colores -> plus lumineux */
.dark a.text-indigo-600, .dark .text-indigo-600 a { color: #a5b4fc !important; }
.dark a.text-purple-600, .dark .text-purple-600 a { color: #c4b5fd !important; }
.dark a.text-teal-600, .dark .text-teal-600 a { color: #5eead4 !important; }
.dark a.text-green-600, .dark .text-green-600 a { color: #86efac !important; }
/* Badges (petits fonds colores avec texte) */
.dark .bg-green-500 { background-color: #22c55e !important; }
.dark .bg-indigo-600 { background-color: #6366f1 !important; }
.dark .bg-purple-600 { background-color: #9333ea !important; }
.dark .bg-red-500 { background-color: #ef4444 !important; }
/* Separateurs hr */
.dark hr { border-color: #2a3444 !important; }
/* Hover sur cartes CMS (generateur WP/PS) : pas de bg clair */
.dark .hover\:bg-blue-50:hover { background-color: rgba(59,130,246,0.10) !important; }
.dark .hover\:bg-pink-50:hover { background-color: rgba(236,72,153,0.10) !important; }
.dark .hover\:border-blue-400:hover { border-color: #60a5fa !important; }
.dark .hover\:border-pink-400:hover { border-color: #f472b6 !important; }
.dark .group-hover\:bg-blue-200 { background-color: rgba(59,130,246,0.20) !important; }
.dark .group-hover\:bg-pink-200 { background-color: rgba(236,72,153,0.20) !important; }
/* Timeline generateur : trait de connexion visible */
.dark .h-0\.5.bg-slate-200 { background-color: #334155 !important; }
/* Fonds de barres de progression / pills slate-200 : eclaircir (sinon = couleur de fond, invisible) */
.dark .bg-slate-200.rounded-full { background-color: #334155 !important; }
/* Range slider */
.dark input[type="range"]::-webkit-slider-track { background: #64748b !important; }
.dark input[type="range"]::-webkit-slider-runnable-track { background: #64748b !important; }
.dark input[type="range"]::-webkit-slider-thumb { background: #6366f1 !important; }
/* PAP badges : discrets, pas d'action */
.dark .bg-purple-100 { background-color: transparent !important; border: 1px solid #334155 !important; }
.dark .text-purple-700 { color: #8896ab !important; }
.dark .text-purple-800 { color: #8896ab !important; }
/* Notice generateur (fond violet) */
.dark .bg-purple-50 { background-color: rgba(147,51,234,0.10) !important; }
/* Badges : couleurs semantiques attenuees mais lisibles (WCAG AA) */
.dark .bg-green-100, .dark .bg-green-50 { background-color: rgba(34,197,94,0.15) !important; }
.dark .text-green-800, .dark .text-green-700 { color: #86efac !important; }
.dark .bg-red-100, .dark .bg-red-50 { background-color: rgba(239,68,68,0.15) !important; }
.dark .text-red-800, .dark .text-red-700 { color: #fca5a5 !important; }
.dark .bg-amber-100, .dark .bg-amber-50, .dark .bg-yellow-100 { background-color: rgba(245,158,11,0.15) !important; }
.dark .text-amber-800, .dark .text-amber-700 { color: #fcd34d !important; }
.dark .bg-blue-100, .dark .bg-blue-50 { background-color: rgba(59,130,246,0.12) !important; }
.dark .text-blue-800, .dark .text-blue-700 { color: #93c5fd !important; }
.dark .bg-indigo-100, .dark .bg-indigo-50 { background-color: rgba(99,102,241,0.12) !important; }
.dark .text-indigo-800, .dark .text-indigo-700 { color: #a5b4fc !important; }
.dark .bg-purple-100, .dark .bg-purple-50 { background-color: rgba(168,85,247,0.12) !important; }
.dark .text-purple-800, .dark .text-purple-700 { color: #d8b4fe !important; }
.dark .bg-teal-100, .dark .bg-teal-50 { background-color: rgba(20,184,166,0.12) !important; }
.dark .text-teal-800, .dark .text-teal-700 { color: #5eead4 !important; }
.dark .bg-pink-100, .dark .bg-pink-50 { background-color: rgba(244,114,182,0.12) !important; }
.dark .text-pink-800, .dark .text-pink-700 { color: #f9a8d4 !important; }
.dark .bg-orange-100 { background-color: rgba(251,146,60,0.12) !important; }
/* Icones dans badges : garder leur couleur mais attenuee */
.dark .text-blue-500 { color: #60a5fa !important; }
.dark .text-pink-500 { color: #f472b6 !important; }
.dark .text-orange-500 { color: #fb923c !important; }