/* ============================================================
   ClickCollect — Dark Theme Overrides
   Active lorsque <html class="dark">
   Surcharge les classes Tailwind pour un rendu sombre cohérent.
   ============================================================ */

/* ── Fond de page & texte global ──────────────────────── */
html.dark body {
    background-color: #0f172a; /* slate-900 */
    color: #e2e8f0;            /* slate-200 */
}

/* ── Fonds de carte / conteneur ───────────────────────── */
html.dark .bg-white       { background-color: #1e293b !important; } /* slate-800 */
html.dark .bg-gray-50     { background-color: #0f172a !important; } /* slate-900 */
html.dark .bg-gray-100    { background-color: #1e293b !important; } /* slate-800 */
html.dark .bg-gray-200    { background-color: #334155 !important; } /* slate-700 */
html.dark .bg-gray-300    { background-color: #475569 !important; } /* slate-600 */
html.dark .bg-gray-800    { background-color: #0f172a !important; } /* slate-900 */
html.dark .bg-gray-900    { background-color: #020617 !important; } /* slate-950 */
html.dark .bg-blue-50     { background-color: #172554 !important; } /* blue-950 */
html.dark .bg-green-50    { background-color: #052e16 !important; } /* green-950 */
html.dark .bg-red-50      { background-color: #450a0a !important; } /* red-950 */
html.dark .bg-yellow-50   { background-color: #422006 !important; } /* yellow-950 */
html.dark .bg-indigo-50   { background-color: #1e1b4b !important; } /* indigo-950 */
html.dark .bg-gray-700    { background-color: #1e293b !important; }

/* ── Textes ───────────────────────────────────────────── */
html.dark .text-gray-900  { color: #f8fafc !important; } /* slate-50 */
html.dark .text-gray-800  { color: #f8fafc !important; } /* slate-50  → +clair */
html.dark .text-gray-700  { color: #f1f5f9 !important; } /* slate-100 → +clair */
html.dark .text-gray-600  { color: #e2e8f0 !important; } /* slate-200 → +clair */
html.dark .text-gray-500  { color: #e2e8f0 !important; } /* slate-200 → +clair */
html.dark .text-gray-400  { color: #cbd5e1 !important; } /* slate-300 → +clair */
html.dark .text-gray-300  { color: #94a3b8 !important; } /* slate-400 */
html.dark .text-white     { color: #f8fafc !important; }
html.dark .text-black     { color: #f1f5f9 !important; }
html.dark .text-green-600 { color: #4ade80 !important; }
html.dark .text-green-700 { color: #86efac !important; }
html.dark .text-green-800 { color: #bbf7d0 !important; }
html.dark .text-red-600   { color: #f87171 !important; }
html.dark .text-red-700   { color: #fca5a5 !important; }
html.dark .text-red-800   { color: #fecaca !important; }
html.dark .text-blue-600  { color: #60a5fa !important; }
html.dark .text-blue-800  { color: #93c5fd !important; }
html.dark .text-yellow-800{ color: #fde68a !important; }
html.dark .text-indigo-600{ color: #818cf8 !important; }
html.dark .text-indigo-700{ color: #a5b4fc !important; }

/* ── Bordures ──────────────────────────────────────────── */
html.dark .border-gray-200   { border-color: #334155 !important; } /* slate-700 */
html.dark .border-gray-300   { border-color: #475569 !important; } /* slate-600 */
html.dark .border-gray-700   { border-color: #475569 !important; }
html.dark .border-b          { border-color: #334155 !important; }
html.dark .border-t          { border-color: #334155 !important; }
html.dark .divide-gray-200 > * + * { border-color: #334155 !important; }

/* ── Ombres ────────────────────────────────────────────── */
html.dark .shadow-sm  { box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.4) !important; }
html.dark .shadow     { box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.5) !important; }
html.dark .shadow-md  { box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.5) !important; }
html.dark .shadow-lg  { box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.5) !important; }
html.dark .shadow-xl  { box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.5) !important; }
html.dark .shadow-2xl { box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.6) !important; }

/* ── Hover states ──────────────────────────────────────── */
html.dark .hover\:bg-gray-50:hover  { background-color: #334155 !important; }
html.dark .hover\:bg-gray-100:hover { background-color: #334155 !important; }
html.dark .hover\:bg-gray-200:hover { background-color: #475569 !important; }
html.dark .hover\:bg-gray-300:hover { background-color: #64748b !important; }
html.dark .hover\:bg-gray-800:hover { background-color: #1e293b !important; }
html.dark .hover\:text-gray-900:hover { color: #f8fafc !important; }

/* ── Formulaires ───────────────────────────────────────── */
html.dark input,
html.dark select,
html.dark textarea {
    background-color: #1e293b !important; /* slate-800 */
    color: #f1f5f9 !important;            /* slate-100 → +clair */
    border-color: #475569 !important;     /* slate-600 */
}
html.dark input::placeholder,
html.dark textarea::placeholder {
    color: #cbd5e1 !important;            /* slate-300 → +clair */
}
html.dark input:focus,
html.dark select:focus,
html.dark textarea:focus {
    border-color: #3b82f6 !important;     /* blue-500 */
    outline: none;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.2) !important;
}

/* ── Tableaux ──────────────────────────────────────────── */
html.dark thead { background-color: #1e293b !important; }
html.dark tbody tr:hover { background-color: #1e293b !important; }
html.dark tbody tr.bg-white { background-color: #1e293b !important; }

/* ── Cartes et conteneurs spéciaux ─────────────────────── */
html.dark .rounded-xl { /* rien, hérité du bg */ }
html.dark hr { border-color: #334155 !important; }

/* ── Sidebar admin (reste sombre, pas de changement) ───── */

/* ── Boutons ───────────────────────────────────────────── */
html.dark .bg-gray-200 { background-color: #334155 !important; }
html.dark .bg-gray-200:hover { background-color: #475569 !important; }

/* ── Badges & étiquettes ───────────────────────────────── */
html.dark .bg-green-100 { background-color: #052e16 !important; }
html.dark .text-green-800 { color: #bbf7d0 !important; }
html.dark .bg-red-100   { background-color: #450a0a !important; }
html.dark .text-red-800 { color: #fecaca !important; }
html.dark .bg-blue-100  { background-color: #172554 !important; }
html.dark .text-blue-800 { color: #93c5fd !important; }
html.dark .bg-yellow-100 { background-color: #422006 !important; }
html.dark .text-yellow-800 { color: #fde68a !important; }

/* ── Liens ─────────────────────────────────────────────── */
/* Ne s'applique qu'aux liens SANS couleur de texte explicite : une classe `text-*`
   porte une intention (barre d'onglets, badge) qui ne doit pas être écrasée — c'est
   ce qui rendait les onglets de l'espace coursier illisibles (3,7:1). */
html.dark a:not([class*="text-"]) { color: #93c5fd; } /* blue-300 → +clair */
html.dark a.text-gray-500,
html.dark a.text-gray-600,
html.dark a.text-gray-700 { color: #e2e8f0 !important; } /* slate-200 → +clair */
html.dark a.text-primary { color: var(--color-primary) !important; }
html.dark a:hover { color: #bfdbfe; } /* blue-200 */

/* Leaflet : les contrôles de la carte (+ / −, attribution) restent sur **fond blanc**
   (composant tiers non thémé). La règle générale des liens les rendrait bleu clair sur
   blanc — 1,7:1. On rétablit une couleur foncée pour ces contrôles uniquement. */
html.dark .leaflet-control a,
html.dark .leaflet-bar a,
html.dark .leaflet-control span,
html.dark .leaflet-control-attribution {
    color: #1d4ed8 !important; /* blue-700 */
}
html.dark .leaflet-control-attribution {
    background-color: rgba(255, 255, 255, 0.85) !important;
}

/* ── Header / Navbar ───────────────────────────────────── */
html.dark nav.bg-white { background-color: #1e293b !important; }
html.dark nav.border-b { border-color: #334155 !important; }

/* ── Footer ────────────────────────────────────────────── */
html.dark footer { background-color: #0f172a !important; }
html.dark footer .text-gray-400 { color: #cbd5e1 !important; } /* slate-300 → +clair */
html.dark footer .text-gray-500 { color: #e2e8f0 !important; } /* slate-200 → +clair */

/* ── Modales / Overlays ────────────────────────────────── */
html.dark .fixed.inset-0.bg-black\/30,
html.dark .bg-black\/30 { background-color: rgba(0, 0, 0, 0.6) !important; }
html.dark .bg-black\/40 { background-color: rgba(0, 0, 0, 0.7) !important; }

/* ── Sélection ─────────────────────────────────────────── */
html.dark ::selection {
    background-color: #1e40af;
    color: #e2e8f0;
}

/* ── DÉBUT BLOC GÉNÉRÉ (scripts/maj_dark_theme.py) ─────── */

/* Fonds : les teintes claires deviennent des surfaces sombres de même teinte. */
html.dark .bg-amber-100 { background-color: #413501 !important; }
html.dark .hover\:bg-amber-100:hover { background-color: #413501 !important; }
html.dark .bg-amber-50 { background-color: #423500 !important; }
html.dark .hover\:bg-amber-50:hover { background-color: #423500 !important; }
html.dark .bg-amber-500 { background-color: #9e6506 !important; }
html.dark .bg-amber-600 { background-color: #a75c05 !important; }
html.dark .bg-blue-600 { background-color: #2563eb !important; }
html.dark .bg-blue-700 { background-color: #1d4ed8 !important; }
html.dark .bg-blue-800 { background-color: #1e40af !important; }
html.dark .bg-blue-900 { background-color: #1e3a8a !important; }
html.dark .bg-emerald-50 { background-color: #063c22 !important; }
html.dark .hover\:bg-emerald-50:hover { background-color: #063c22 !important; }
html.dark .bg-emerald-600 { background-color: #04825b !important; }
html.dark .bg-gray-600 { background-color: #4b5563 !important; }
html.dark .bg-green-600 { background-color: #117f3a !important; }
html.dark .bg-green-700 { background-color: #15803d !important; }
html.dark .bg-indigo-100 { background-color: #000f42 !important; }
html.dark .hover\:bg-indigo-100:hover { background-color: #000f42 !important; }
html.dark .bg-indigo-600 { background-color: #4f46e5 !important; }
html.dark .bg-indigo-700 { background-color: #4338ca !important; }
html.dark .bg-orange-100 { background-color: #422600 !important; }
html.dark .hover\:bg-orange-100:hover { background-color: #422600 !important; }
html.dark .bg-orange-50 { background-color: #422500 !important; }
html.dark .hover\:bg-orange-50:hover { background-color: #422500 !important; }
html.dark .bg-purple-100 { background-color: #200042 !important; }
html.dark .hover\:bg-purple-100:hover { background-color: #200042 !important; }
html.dark .bg-red-500 { background-color: #e21313 !important; }
html.dark .bg-red-600 { background-color: #dc2626 !important; }
html.dark .bg-red-700 { background-color: #b91c1c !important; }

/* Textes colorés foncés : éclaircis pour rester lisibles sur fond sombre. */
html.dark .text-amber-600 { color: #f88c0f !important; }
html.dark .hover\:text-amber-600:hover { color: #f88c0f !important; }
html.dark .text-amber-700 { color: #f69042 !important; }
html.dark .hover\:text-amber-700:hover { color: #f69042 !important; }
html.dark .text-amber-800 { color: #ef8f55 !important; }
html.dark .hover\:text-amber-800:hover { color: #ef8f55 !important; }
html.dark .text-amber-900 { color: #eb915e !important; }
html.dark .hover\:text-amber-900:hover { color: #eb915e !important; }
html.dark .text-blue-100 { color: #dbeafe !important; }
html.dark .hover\:text-blue-100:hover { color: #dbeafe !important; }
html.dark .text-blue-700 { color: #8aa5ef !important; }
html.dark .hover\:text-blue-700:hover { color: #8aa5ef !important; }
html.dark .text-blue-900 { color: #8ea5e6 !important; }
html.dark .hover\:text-blue-900:hover { color: #8ea5e6 !important; }
html.dark .text-emerald-700 { color: #06bd89 !important; }
html.dark .hover\:text-emerald-700:hover { color: #06bd89 !important; }
html.dark .text-green-900 { color: #2ebe67 !important; }
html.dark .hover\:text-green-900:hover { color: #2ebe67 !important; }
html.dark .text-indigo-800 { color: #aaa6e5 !important; }
html.dark .hover\:text-indigo-800:hover { color: #aaa6e5 !important; }
html.dark .text-orange-600 { color: #f68a51 !important; }
html.dark .hover\:text-orange-600:hover { color: #f68a51 !important; }
html.dark .text-orange-700 { color: #f58a5e !important; }
html.dark .hover\:text-orange-700:hover { color: #f58a5e !important; }
html.dark .text-purple-700 { color: #c392ed !important; }
html.dark .hover\:text-purple-700:hover { color: #c392ed !important; }
html.dark .text-purple-800 { color: #c496ea !important; }
html.dark .hover\:text-purple-800:hover { color: #c496ea !important; }
html.dark .text-red-100 { color: #fee2e2 !important; }
html.dark .hover\:text-red-100:hover { color: #fee2e2 !important; }
html.dark .text-red-400 { color: #f98484 !important; }
html.dark .hover\:text-red-400:hover { color: #f98484 !important; }
html.dark .text-red-500 { color: #f58686 !important; }
html.dark .hover\:text-red-500:hover { color: #f58686 !important; }
html.dark .text-red-900 { color: #e79595 !important; }
html.dark .hover\:text-red-900:hover { color: #e79595 !important; }
html.dark .text-yellow-700 { color: #ef920a !important; }
html.dark .hover\:text-yellow-700:hover { color: #ef920a !important; }
html.dark .text-yellow-900 { color: #e49a56 !important; }
html.dark .hover\:text-yellow-900:hover { color: #e49a56 !important; }

/* Bordures et séparateurs. */
html.dark .border-amber-200 { border-color: #a08103 !important; }
html.dark .border-amber-300 { border-color: #a07c03 !important; }
html.dark .border-blue-200 { border-color: #0349a1 !important; }
html.dark .border-blue-300 { border-color: #034da0 !important; }
html.dark .border-blue-400 { border-color: #60a5fa !important; }
html.dark .border-blue-700 { border-color: #1d4ed8 !important; }
html.dark .border-emerald-200 { border-color: #149056 !important; }
html.dark .border-gray-100 { border-color: #464e5d !important; }
html.dark .border-gray-400 { border-color: #9ca3af !important; }
html.dark .border-gray-600 { border-color: #4b5563 !important; }
html.dark .border-green-200 { border-color: #11923e !important; }
html.dark .border-green-300 { border-color: #139040 !important; }
html.dark .border-green-400 { border-color: #198a42 !important; }
html.dark .border-green-600 { border-color: #16a34a !important; }
html.dark .border-indigo-200 { border-color: #0322a0 !important; }
html.dark .border-indigo-500 { border-color: #6366f1 !important; }
html.dark .border-indigo-600 { border-color: #4f46e5 !important; }
html.dark .border-orange-200 { border-color: #a15702 !important; }
html.dark .border-red-200 { border-color: #a00303 !important; }
html.dark .border-red-300 { border-color: #9e0505 !important; }
html.dark .border-red-400 { border-color: #f87171 !important; }
html.dark .border-red-600 { border-color: #dc2626 !important; }
html.dark .border-yellow-200 { border-color: #a28e01 !important; }
html.dark .border-yellow-300 { border-color: #a18802 !important; }
html.dark .border-yellow-400 { border-color: #a08003 !important; }

/* Couleur de marque : assombrie en surface, éclaircie en texte —
   sinon texte noir/blanc sur la couleur du client reste sous 4,5:1. */
html.dark .bg-primary { background-color: color-mix(in srgb, rgb(var(--color-primary)) 72%, black) !important; }
html.dark .text-primary { color: color-mix(in srgb, rgb(var(--color-primary)) 42%, white) !important; }
html.dark .border-primary { border-color: color-mix(in srgb, rgb(var(--color-primary)) 60%, black) !important; }
html.dark .hover\:bg-primary:hover { background-color: color-mix(in srgb, rgb(var(--color-primary)) 62%, black) !important; }

/* Logs : les dates grises du journal doivent rester lisibles sur fond très sombre. */
html.dark .log-date { color: #94a3b8 !important; }

/* ── FIN BLOC GÉNÉRÉ ───────────────────────────────────── */