/* ================================================================
   Mode sombre — SIS (Système d'Information Sanitaire)
   ----------------------------------------------------------------
   Feuille de superposition : elle ne remplace AUCUNE classe du
   projet, elle redéfinit les couleurs des utilitaires Tailwind les
   plus utilisés lorsque la balise <html> porte la classe « dark ».

   Pourquoi cette méthode ?
     • elle fonctionne aussi sur le contenu généré dynamiquement par
       js/app.js et js/modules/*.js (tableaux, cartes, graphiques) ;
     • le mode clair reste strictement identique à avant ;
     • changer de thème = ajouter/retirer une seule classe sur <html>.

   Palette : slate-900/800 pour les surfaces, teintes assombries pour
   les accents (sky, red, green, amber, purple…).
   ================================================================ */

/* ---------------- Base ---------------- */
html.dark { color-scheme: dark; }

html.dark body {
  background-color: #0b1220 !important;   /* fond général de la page */
  color: #cbd5e1 !important;
}

html.dark ::-webkit-scrollbar-track { background: #0f172a; }
html.dark ::-webkit-scrollbar-thumb { background: #475569; }

/* ---------------- Surfaces ---------------- */
html.dark .bg-white      { background-color: #1e293b !important; }
html.dark .bg-slate-50   { background-color: #172033 !important; }
html.dark .bg-slate-100  { background-color: #0f172a !important; }
html.dark .bg-slate-200  { background-color: #27354c !important; }
html.dark .bg-slate-300  { background-color: #334155 !important; }

html.dark .bg-sky-50     { background-color: #0c4a6e !important; }
html.dark .bg-sky-100    { background-color: #075985 !important; }
html.dark .bg-sky-200    { background-color: #0c4a6e !important; }

html.dark .bg-red-50     { background-color: #450a0a !important; }
html.dark .bg-red-100    { background-color: #7f1d1d !important; }
html.dark .bg-rose-50    { background-color: #4c0519 !important; }
html.dark .bg-rose-50\/30,
html.dark .bg-rose-50\/20 { background-color: rgba(76, 5, 25, 0.35) !important; }
html.dark .bg-pink-50    { background-color: #500724 !important; }
html.dark .bg-pink-50\/20 { background-color: rgba(80, 7, 36, 0.35) !important; }
html.dark .bg-pink-100   { background-color: #831843 !important; }
html.dark .bg-amber-50   { background-color: #451a03 !important; }
html.dark .bg-amber-100  { background-color: #78350f !important; }
html.dark .bg-green-50   { background-color: #052e16 !important; }
html.dark .bg-green-100  { background-color: #14532d !important; }
html.dark .bg-emerald-100{ background-color: #064e3b !important; }
html.dark .bg-purple-50  { background-color: #2e1065 !important; }
html.dark .bg-purple-100 { background-color: #4c1d95 !important; }
html.dark .bg-cyan-100   { background-color: #164e63 !important; }
html.dark .bg-teal-100   { background-color: #134e4a !important; }
html.dark .bg-indigo-100 { background-color: #312e81 !important; }
html.dark .bg-orange-100 { background-color: #7c2d12 !important; }
html.dark .bg-yellow-100 { background-color: #713f12 !important; }

/* Bandeau « année décalée » : on le garde jaune vif (texte foncé) car il
   doit rester très visible — pas de règle sur bg-amber-300 / hover:bg-amber-200. */

/* ---------------- Survols et focus ---------------- */
html.dark .hover\:bg-slate-50:hover   { background-color: #27354c !important; }
html.dark .hover\:bg-slate-100:hover  { background-color: #27354c !important; }
html.dark .hover\:bg-slate-200:hover  { background-color: #334155 !important; }
html.dark .hover\:bg-sky-50:hover     { background-color: #0c4a6e !important; }
html.dark .hover\:bg-sky-100:hover    { background-color: #075985 !important; }
html.dark .hover\:bg-sky-200:hover    { background-color: #0369a1 !important; }
html.dark .hover\:bg-red-100:hover    { background-color: #7f1d1d !important; }
html.dark .hover\:bg-red-200:hover    { background-color: #991b1b !important; }
html.dark .hover\:bg-rose-100:hover   { background-color: #831843 !important; }
html.dark .hover\:bg-purple-50:hover  { background-color: #2e1065 !important; }
html.dark .hover\:bg-purple-200:hover { background-color: #5b21b6 !important; }
html.dark .focus\:bg-white:focus      { background-color: #0f172a !important; }
html.dark .focus\:bg-sky-100:focus    { background-color: #075985 !important; }
html.dark .focus\:bg-rose-100:focus   { background-color: #831843 !important; }

/* ---------------- Textes ---------------- */
html.dark .text-slate-900,
html.dark .text-slate-800 { color: #e2e8f0 !important; }
html.dark .text-slate-700 { color: #cbd5e1 !important; }
html.dark .text-slate-600 { color: #b6c2d1 !important; }
html.dark .text-slate-500 { color: #94a3b8 !important; }
html.dark .text-slate-400 { color: #7d8ea3 !important; }

html.dark .text-sky-900 { color: #7dd3fc !important; }
html.dark .text-sky-800 { color: #7dd3fc !important; }
html.dark .text-sky-700 { color: #7dd3fc !important; }
html.dark .text-sky-600 { color: #38bdf8 !important; }

html.dark .text-red-800,
html.dark .text-red-700 { color: #fca5a5 !important; }
html.dark .text-red-600,
html.dark .text-red-500 { color: #f87171 !important; }

html.dark .text-rose-800,
html.dark .text-rose-700,
html.dark .text-rose-600,
html.dark .text-rose-300 { color: #fda4af !important; }

html.dark .text-pink-900,
html.dark .text-pink-800,
html.dark .text-pink-300 { color: #f9a8d4 !important; }

html.dark .text-green-900,
html.dark .text-green-700,
html.dark .text-green-300 { color: #86efac !important; }
html.dark .text-green-600 { color: #4ade80 !important; }

html.dark .text-amber-800,
html.dark .text-amber-700 { color: #fcd34d !important; }
html.dark .text-amber-600,
html.dark .text-amber-500 { color: #fbbf24 !important; }

html.dark .text-purple-900,
html.dark .text-purple-800,
html.dark .text-purple-700 { color: #d8b4fe !important; }
html.dark .text-purple-600,
html.dark .text-purple-500 { color: #c084fc !important; }

/* ---------------- Bordures / séparateurs ---------------- */
html.dark .border-slate-100 { border-color: #24314a !important; }
html.dark .border-slate-200 { border-color: #334155 !important; }
html.dark .border-slate-300 { border-color: #475569 !important; }

html.dark .border-sky-100   { border-color: #0c4a6e !important; }
html.dark .border-sky-200   { border-color: #075985 !important; }
html.dark .border-sky-300   { border-color: #0ea5e9 !important; }

html.dark .border-red-200,
html.dark .border-red-300 { border-color: #7f1d1d !important; }
html.dark .border-rose-200  { border-color: #881337 !important; }
html.dark .border-pink-200  { border-color: #831843 !important; }
html.dark .border-green-200 { border-color: #14532d !important; }
html.dark .border-amber-200,
html.dark .border-amber-300 { border-color: #78350f !important; }
html.dark .border-purple-200,
html.dark .border-purple-300 { border-color: #4c1d95 !important; }

html.dark .ring-slate-200 { --tw-ring-color: #334155 !important; }
html.dark .divide-slate-100 > * + *,
html.dark .divide-slate-200 > * + * { border-color: #334155 !important; }

/* ---------------- Formulaires ---------------- */
html.dark input, html.dark select, html.dark textarea {
  background-color: #0f172a;
  color: #e2e8f0;
  border-color: #334155;
}
html.dark input::placeholder, html.dark textarea::placeholder { color: #64748b; }
html.dark input:disabled, html.dark select:disabled { background-color: #16202f; color: #94a3b8; }
html.dark option { background-color: #0f172a; color: #e2e8f0; }
html.dark input[type="date"]::-webkit-calendar-picker-indicator { filter: invert(0.8); }

/* ---------------- Composants internes (css/style.css) ---------------- */
html.dark .tab-active {
  background-color: #075985 !important;
  color: #bae6fd !important;
  border-color: #38bdf8 !important;
}
html.dark .tab-inactive {
  background-color: #172033 !important;
  color: #94a3b8 !important;
}
html.dark .tab-inactive:hover { background-color: #27354c !important; }

html.dark .prest-row { border-bottom-color: #24314a !important; }
html.dark .prest-row:hover { background-color: #27354c !important; }
html.dark .prest-label { color: #cbd5e1 !important; }
html.dark .prest-input {
  background-color: #0f172a !important;
  border-color: #334155 !important;
  color: #e2e8f0 !important;
}
html.dark .prest-input:focus { border-color: #0ea5e9 !important; }
html.dark .prest-title {
  background-color: #0c4a6e !important;
  color: #7dd3fc !important;
}
html.dark .bold-label { color: #e2e8f0 !important; }

/* ---------------- Aperçus « papier » ----------------
   Le rapport à imprimer affiché dans l'application doit rester blanc,
   comme le PDF qu'il préfigure (classe posée par afficherApercuPDF). */
html.dark .apercu-papier {
  background-color: #ffffff !important;
  color: #1e293b !important;
}
html.dark .apercu-papier .text-slate-800 { color: #1e293b !important; }
html.dark .apercu-papier .text-slate-600 { color: #475569 !important; }
html.dark .apercu-papier .text-slate-500 { color: #64748b !important; }
html.dark .apercu-papier .text-green-700 { color: #15803d !important; }
html.dark .apercu-papier .text-red-600   { color: #dc2626 !important; }
html.dark .apercu-papier .text-sky-900   { color: #0c4a6e !important; }
html.dark .apercu-papier .border-slate-200 { border-color: #e2e8f0 !important; }

/* ---------------- Filet de sécurité PDF ----------------
   Les documents PDF sont générés en clair (js/theme.js retire la classe
   « dark » pendant la capture html2canvas). Ces règles protègent en plus
   les conteneurs de rapport s'ils restaient affichés dans l'application. */
html.dark #pdf-liste-a4,
html.dark #pdf-liste-module,
html.dark #pdf-rapport-global,
html.dark #pdf-rapport-module {
  background-color: #ffffff !important;
  color: #000000 !important;
}

/* ---------------- Module PHARMACIE : grille des stocks ---------------- */
html.dark .ph-cadre {
  background-color: #0f172a !important;
  border-color: #334155 !important;
}
html.dark .ph-table tbody td {
  background-color: #1e293b !important;
  border-color: #263348 !important;
  color: #e2e8f0 !important;
}
html.dark .ph-table tbody tr:hover td { background-color: #27354c !important; }
html.dark .ph-table .ph-nom { background-color: #1e293b !important; color: #e2e8f0 !important; }
html.dark .ph-table thead .ph-nom { background-color: #0c4a6e !important; color: #e0f2fe !important; }
html.dark .ph-table tbody tr:hover td.ph-nom { background-color: #27354c !important; }
html.dark .ph-table tfoot td {
  background-color: #78350f !important;
  color: #fde68a !important;
  border-top-color: #b45309 !important;
}
html.dark .ph-table tfoot .ph-nom { background-color: #78350f !important; color: #fde68a !important; }
html.dark .ph-sous { color: #94a3b8 !important; }
html.dark .ph-traceur { background-color: #0c4a6e !important; color: #7dd3fc !important; }

/* Saisies */
html.dark .ph-in {
  background-color: #0f172a !important;
  border-color: #334155 !important;
  color: #e2e8f0 !important;
}
html.dark .ph-in.ph-in-auto { background-color: #102a43 !important; border-color: #1e4976 !important; color: #93c5fd !important; }
html.dark .ph-in:focus { border-color: #0ea5e9 !important; background-color: #0c2438 !important; }
html.dark .ph-in.ph-in-perime { background-color: #450a0a !important; color: #fca5a5 !important; border-color: #7f1d1d !important; }
html.dark .ph-in.ph-date-rouge { background-color: #7f1d1d !important; color: #fecaca !important; border-color: #b91c1c !important; }
html.dark .ph-in.ph-date-orange { background-color: #7c2d12 !important; color: #fed7aa !important; border-color: #c2410c !important; }
html.dark .ph-in.ph-date-vert { background-color: #064e3b !important; color: #a7f3d0 !important; border-color: #047857 !important; }
html.dark .ph-in.ph-date-noir { background-color: #4c0519 !important; color: #ffe4e6 !important; border-color: #9f1239 !important; }
html.dark .ph-select {
  background-color: #0f172a !important;
  border-color: #334155 !important;
  color: #e2e8f0 !important;
}
html.dark .ph-fin { background-color: #0c4a6e !important; color: #7dd3fc !important; }
html.dark .ph-fin.ph-fin-zero { background-color: #7f1d1d !important; color: #fecaca !important; }

/* Pastilles d'échéance */
html.dark .ph-chip.ph-vert   { background-color: #064e3b !important; color: #a7f3d0 !important; }
html.dark .ph-chip.ph-orange { background-color: #7c2d12 !important; color: #fed7aa !important; }
html.dark .ph-chip.ph-rouge  { background-color: #7f1d1d !important; color: #fecaca !important; }
html.dark .ph-chip.ph-noir   { background-color: #4c0519 !important; color: #ffe4e6 !important; }
html.dark .ph-chip.ph-gris   { background-color: #27354c !important; color: #cbd5e1 !important; }
html.dark .ph-chip.ph-bleu   { background-color: #0c4a6e !important; color: #7dd3fc !important; }
html.dark .ph-chip.ph-violet { background-color: #2e1065 !important; color: #c4b5fd !important; }

/* Catalogue */
html.dark .ph-cat-table th { background-color: #0f172a !important; color: #94a3b8 !important; border-color: #334155 !important; }
html.dark .ph-cat-table td { border-color: #263348 !important; color: #e2e8f0 !important; }
html.dark .ph-cat-table tbody tr:hover { background-color: #27354c !important; }

/* Libellé modifiable dans la grille */
html.dark .ph-nom-in { color: #e2e8f0 !important; }
html.dark .ph-nom-in:hover { background-color: #1e293b !important; border-color: #334155 !important; }
html.dark .ph-nom-in:focus { background-color: #0f172a !important; border-color: #38bdf8 !important; }

/* Pagination des grilles */
html.dark .ph-pagination { border-top-color: #334155 !important; }
html.dark .ph-pagination .ph-page-info { color: #94a3b8 !important; }
html.dark .ph-page { background-color: #1e293b !important; border-color: #334155 !important; color: #e2e8f0 !important; }
html.dark .ph-page:hover:not(:disabled) { background-color: #334155 !important; border-color: #38bdf8 !important; }
html.dark .ph-page-active { background-color: #0284c7 !important; border-color: #0284c7 !important; color: #ffffff !important; }

/* Utilitaires complémentaires utilisés par le tableau de bord pharmacie */
html.dark .text-orange-800, html.dark .text-orange-700 { color: #fdba74 !important; }
html.dark .text-orange-600, html.dark .text-orange-500 { color: #fb923c !important; }
html.dark .text-violet-800, html.dark .text-violet-700 { color: #c4b5fd !important; }
html.dark .text-violet-600 { color: #a78bfa !important; }
html.dark .bg-orange-50 { background-color: #431407 !important; }
html.dark .bg-violet-50 { background-color: #2e1065 !important; }
html.dark .border-orange-200 { border-color: #7c2d12 !important; }