/* ==========================================================
   GL FIARA GESTION - MODE SOMBRE professionnel (V7.2)
   GROUP LA FIARA - Bouake, Cote d'Ivoire

   Active uniquement lorsque <html data-theme="dark">.
   Charte respectee : vert #178a3e (identite/actions),
   or #f5c518 (accents), rouge = ALERTES uniquement.
   ========================================================== */

[data-theme="dark"] {
  --brand: #1fa551;
  --brand-dark: #178a3e;
  --brand-deep: #106b30;
  --gold: #f5c518;
  --ink: #e6ecf7;
  --bg: #0a0f1a;
  --surface: #121a29;
  --surface-2: #172136;
  --surface-3: #1e2a42;
  --card-border: #26324b;
  --muted: #94a3b8;
  --muted-2: #7c8aa3;
  color-scheme: dark;
}

[data-theme="dark"] body {
  background: var(--bg);
  color: var(--ink);
}

/* ---------- Scrollbar ---------- */
[data-theme="dark"] ::-webkit-scrollbar-thumb { background: #33415c; }
[data-theme="dark"] ::-webkit-scrollbar-thumb:hover { background: #475569; }

/* ---------- Surfaces principales ---------- */
[data-theme="dark"] .card,
[data-theme="dark"] .module-tile,
[data-theme="dark"] .table-wrap,
[data-theme="dark"] .modal-box {
  background: var(--surface);
  border-color: var(--card-border);
  color: var(--ink);
}
[data-theme="dark"] .card:hover,
[data-theme="dark"] .module-tile:hover { border-color: #33415c; }

[data-theme="dark"] .sidebar {
  background: linear-gradient(180deg, #070b13 0%, #0b1220 55%, #0d1526 100%);
}

/* ---------- Champs de saisie ---------- */
[data-theme="dark"] .input,
[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]):not([type="range"]),
[data-theme="dark"] select,
[data-theme="dark"] textarea {
  background: var(--surface-2);
  border-color: var(--card-border);
  color: var(--ink);
}
[data-theme="dark"] .input:focus,
[data-theme="dark"] input:focus,
[data-theme="dark"] select:focus,
[data-theme="dark"] textarea:focus {
  border-color: var(--brand);
  background: var(--surface-3);
}
[data-theme="dark"] ::placeholder { color: #64748b; }
[data-theme="dark"] .label { color: #b7c2d6; }

/* ---------- Boutons ---------- */
[data-theme="dark"] .btn-secondary {
  background: var(--surface-2);
  border-color: var(--card-border);
  color: var(--ink);
}
[data-theme="dark"] .btn-secondary:hover { background: var(--surface-3); }

/* ---------- Divers composants maison ---------- */
[data-theme="dark"] .toast,
[data-theme="dark"] .wh-chip,
[data-theme="dark"] .thumb,
[data-theme="dark"] .action-bar-sticky {
  background: var(--surface-2);
  border-color: var(--card-border);
  color: var(--ink);
}
[data-theme="dark"] thead th { background: var(--surface-2); color: #b7c2d6; }
[data-theme="dark"] tbody tr:hover { background: rgba(255, 255, 255, .035); }
[data-theme="dark"] hr { border-color: var(--card-border); }

/* ==========================================================
   Compatibilite Tailwind
   Les ecrans utilisent massivement les classes utilitaires
   (bg-white, text-slate-900...). On les reinterprete ici pour
   le mode sombre, ce qui evite de dupliquer chaque template.
   ========================================================== */
[data-theme="dark"] .bg-white { background-color: var(--surface) !important; }
[data-theme="dark"] .bg-white\/85,
[data-theme="dark"] .bg-white\/80,
[data-theme="dark"] .bg-white\/90,
[data-theme="dark"] .bg-white\/95,
[data-theme="dark"] .bg-white\/70,
[data-theme="dark"] .bg-white\/60,
[data-theme="dark"] .bg-white\/50 { background-color: rgba(18, 26, 41, .88) !important; }
[data-theme="dark"] .bg-slate-50 { background-color: var(--surface-2) !important; }
[data-theme="dark"] .bg-slate-100 { background-color: var(--surface-3) !important; }
[data-theme="dark"] .bg-slate-200 { background-color: #26324b !important; }

[data-theme="dark"] .hover\:bg-white:hover { background-color: var(--surface-2) !important; }
[data-theme="dark"] .hover\:bg-slate-50:hover { background-color: var(--surface-2) !important; }
[data-theme="dark"] .hover\:bg-slate-100:hover { background-color: var(--surface-3) !important; }

[data-theme="dark"] .text-slate-900,
[data-theme="dark"] .text-slate-800 { color: var(--ink) !important; }
[data-theme="dark"] .text-slate-700 { color: #cbd5e1 !important; }
[data-theme="dark"] .text-slate-600 { color: #b0bccd !important; }
[data-theme="dark"] .text-slate-500 { color: #9aa7bb !important; }
[data-theme="dark"] .text-slate-400 { color: #8593a8 !important; }
[data-theme="dark"] .hover\:text-slate-900:hover { color: #fff !important; }

[data-theme="dark"] .border-slate-50,
[data-theme="dark"] .border-slate-100,
[data-theme="dark"] .border-slate-200,
[data-theme="dark"] .border-slate-300 { border-color: var(--card-border) !important; }
[data-theme="dark"] .border-white { border-color: #26324b !important; }
[data-theme="dark"] .divide-slate-50 > :not([hidden]) ~ :not([hidden]) {
  border-color: var(--card-border) !important;
}
[data-theme="dark"] .ring-white { --tw-ring-color: #26324b !important; }

/* Zones deja sombres en mode clair : on les eclaircit legerement
   pour qu'elles restent lisibles sur un fond desormais noir. */
[data-theme="dark"] .bg-slate-950 { background-color: #0d1526 !important; }
[data-theme="dark"] .bg-slate-900 { background-color: #121a29 !important; }
[data-theme="dark"] .bg-slate-800 { background-color: #172136 !important; }
[data-theme="dark"] .bg-slate-700 { background-color: #1e2a42 !important; }

/* Pastilles : fonds pastel illisibles en sombre -> teintes profondes */
[data-theme="dark"] .badge-green { background: rgba(31, 165, 81, .18); color: #6ee7a8; }
[data-theme="dark"] .badge-amber { background: rgba(245, 197, 24, .16); color: #f5c518; }
[data-theme="dark"] .badge-slate,
[data-theme="dark"] .badge-muted { background: #26324b; color: #cbd5e1; }
[data-theme="dark"] .badge-blue,
[data-theme="dark"] .badge-info { background: rgba(31, 165, 81, .14); color: #86efac; }
[data-theme="dark"] .badge-red { background: rgba(239, 68, 68, .18); color: #fca5a5; }

/* ==========================================================
   V8.2 — COULEURS TAILWIND COMPLETES (correction lisibilite)
   Les ecrans utilisent bg-green-50 / text-red-600 / bg-amber-100...
   Sans ces regles, les textes foncez (600/700/800) devenaient
   quasi invisibles sur les surfaces sombres, et les fonds pastel
   clairs tranchaient violemment. Chaque famille est convertie :
   - fonds -50/-100/-200 -> surfaces teinees profondes ;
   - textes -500..-900 -> variantes claires et lisibles ;
   - bordures -200/-300 -> gris de carte sombre.
   ========================================================== */

/* ---------- Fonds pastel -> surfaces teintees sombres ---------- */
[data-theme="dark"] .bg-green-50,
[data-theme="dark"] .bg-emerald-50 { background-color: rgba(31, 165, 81, .12) !important; }
[data-theme="dark"] .bg-green-100,
[data-theme="dark"] .bg-emerald-100 { background-color: rgba(31, 165, 81, .18) !important; }
[data-theme="dark"] .bg-green-200,
[data-theme="dark"] .bg-emerald-200 { background-color: rgba(31, 165, 81, .26) !important; }
[data-theme="dark"] .bg-green-500,
[data-theme="dark"] .bg-green-600 { background-color: #1fa551 !important; }
[data-theme="dark"] .bg-green-400,
[data-theme="dark"] .bg-emerald-400,
[data-theme="dark"] .bg-emerald-500 { background-color: #178a3e !important; }

[data-theme="dark"] .bg-red-50 { background-color: rgba(239, 68, 68, .14) !important; }
[data-theme="dark"] .bg-red-100 { background-color: rgba(239, 68, 68, .2) !important; }
[data-theme="dark"] .bg-red-200 { background-color: rgba(239, 68, 68, .3) !important; }
[data-theme="dark"] .bg-red-500,
[data-theme="dark"] .bg-red-600 { background-color: #dc2626 !important; }

[data-theme="dark"] .bg-amber-50 { background-color: rgba(245, 197, 24, .12) !important; }
[data-theme="dark"] .bg-amber-100 { background-color: rgba(245, 197, 24, .18) !important; }
[data-theme="dark"] .bg-amber-200 { background-color: rgba(245, 197, 24, .26) !important; }
[data-theme="dark"] .bg-amber-400 { background-color: #d9a400 !important; }
[data-theme="dark"] .bg-amber-500 { background-color: #c99a00 !important; }
[data-theme="dark"] .bg-yellow-50 { background-color: rgba(245, 197, 24, .12) !important; }
[data-theme="dark"] .bg-yellow-100 { background-color: rgba(245, 197, 24, .18) !important; }

[data-theme="dark"] .bg-blue-50 { background-color: rgba(59, 130, 246, .14) !important; }
[data-theme="dark"] .bg-blue-100 { background-color: rgba(59, 130, 246, .2) !important; }
[data-theme="dark"] .bg-blue-500,
[data-theme="dark"] .bg-blue-600 { background-color: #2563eb !important; }

[data-theme="dark"] .bg-indigo-50 { background-color: rgba(99, 102, 241, .16) !important; }
[data-theme="dark"] .bg-indigo-100 { background-color: rgba(99, 102, 241, .22) !important; }
[data-theme="dark"] .bg-indigo-700 { background-color: #4338ca !important; }
[data-theme="dark"] .bg-indigo-800 { background-color: #3730a3 !important; }

[data-theme="dark"] .bg-orange-50 { background-color: rgba(249, 115, 22, .14) !important; }
[data-theme="dark"] .bg-orange-100 { background-color: rgba(249, 115, 22, .2) !important; }
[data-theme="dark"] .bg-purple-50 { background-color: rgba(147, 51, 234, .16) !important; }
[data-theme="dark"] .bg-rose-50 { background-color: rgba(244, 63, 94, .14) !important; }
[data-theme="dark"] .bg-cyan-50,
[data-theme="dark"] .bg-sky-50 { background-color: rgba(14, 165, 233, .14) !important; }
[data-theme="dark"] .bg-teal-50 { background-color: rgba(13, 148, 136, .14) !important; }
[data-theme="dark"] .bg-lime-50 { background-color: rgba(132, 204, 22, .14) !important; }
[data-theme="dark"] .bg-violet-50 { background-color: rgba(139, 92, 246, .16) !important; }

/* ---------- Textes foncez -> variantes claires lisibles ---------- */
[data-theme="dark"] .text-green-600,
[data-theme="dark"] .text-green-700,
[data-theme="dark"] .text-green-800,
[data-theme="dark"] .text-green-900 { color: #4ade80 !important; }
[data-theme="dark"] .text-green-500 { color: #22c55e !important; }
[data-theme="dark"] .text-green-400 { color: #4ade80 !important; }
[data-theme="dark"] .text-green-300,
[data-theme="dark"] .text-green-200 { color: #86efac !important; }
[data-theme="dark"] .text-emerald-600,
[data-theme="dark"] .text-emerald-700,
[data-theme="dark"] .text-emerald-800 { color: #34d399 !important; }
[data-theme="dark"] .text-emerald-500 { color: #10b981 !important; }
[data-theme="dark"] .text-emerald-400 { color: #34d399 !important; }

[data-theme="dark"] .text-red-600,
[data-theme="dark"] .text-red-700,
[data-theme="dark"] .text-red-800,
[data-theme="dark"] .text-red-900 { color: #f87171 !important; }
[data-theme="dark"] .text-red-500 { color: #ef4444 !important; }
[data-theme="dark"] .text-red-400 { color: #f87171 !important; }
[data-theme="dark"] .text-rose-600,
[data-theme="dark"] .text-rose-700 { color: #fb7185 !important; }

[data-theme="dark"] .text-amber-600,
[data-theme="dark"] .text-amber-700,
[data-theme="dark"] .text-amber-800,
[data-theme="dark"] .text-amber-900 { color: #fbbf24 !important; }
[data-theme="dark"] .text-amber-500 { color: #f5c518 !important; }
[data-theme="dark"] .text-amber-400 { color: #fbbf24 !important; }
[data-theme="dark"] .text-amber-300 { color: #fcd34d !important; }
[data-theme="dark"] .text-yellow-600,
[data-theme="dark"] .text-yellow-700,
[data-theme="dark"] .text-yellow-800 { color: #fbbf24 !important; }
[data-theme="dark"] .text-yellow-500 { color: #f5c518 !important; }

[data-theme="dark"] .text-blue-600,
[data-theme="dark"] .text-blue-700,
[data-theme="dark"] .text-blue-800 { color: #60a5fa !important; }
[data-theme="dark"] .text-blue-500 { color: #3b82f6 !important; }
[data-theme="dark"] .text-blue-400 { color: #60a5fa !important; }
[data-theme="dark"] .text-sky-600 { color: #38bdf8 !important; }
[data-theme="dark"] .text-cyan-600 { color: #22d3ee !important; }

[data-theme="dark"] .text-indigo-700,
[data-theme="dark"] .text-indigo-800 { color: #a5b4fc !important; }
[data-theme="dark"] .text-indigo-600 { color: #818cf8 !important; }
[data-theme="dark"] .text-violet-600 { color: #a78bfa !important; }
[data-theme="dark"] .text-purple-600 { color: #c084fc !important; }
[data-theme="dark"] .text-orange-500,
[data-theme="dark"] .text-orange-600,
[data-theme="dark"] .text-orange-700 { color: #fb923c !important; }
[data-theme="dark"] .text-teal-600 { color: #2dd4bf !important; }
[data-theme="dark"] .text-lime-600 { color: #a3e635 !important; }

/* text-white sur fond colore reste blanc : OK par nature. */
[data-theme="dark"] .text-slate-300 { color: #cbd5e1 !important; }
[data-theme="dark"] .text-slate-200 { color: #e2e8f0 !important; }

/* ---------- Bordures colorees ---------- */
[data-theme="dark"] .border-green-100,
[data-theme="dark"] .border-green-200,
[data-theme="dark"] .border-green-300,
[data-theme="dark"] .border-emerald-100,
[data-theme="dark"] .border-emerald-200 { border-color: rgba(31, 165, 81, .4) !important; }
[data-theme="dark"] .border-red-100,
[data-theme="dark"] .border-red-200,
[data-theme="dark"] .border-red-300 { border-color: rgba(239, 68, 68, .4) !important; }
[data-theme="dark"] .border-amber-100,
[data-theme="dark"] .border-amber-200,
[data-theme="dark"] .border-amber-300,
[data-theme="dark"] .border-yellow-200 { border-color: rgba(245, 197, 24, .35) !important; }
[data-theme="dark"] .border-blue-100,
[data-theme="dark"] .border-blue-200,
[data-theme="dark"] .border-blue-300 { border-color: rgba(59, 130, 246, .4) !important; }
[data-theme="dark"] .border-indigo-100,
[data-theme="dark"] .border-indigo-200 { border-color: rgba(99, 102, 241, .45) !important; }
[data-theme="dark"] .border-emerald-200 { border-color: rgba(16, 185, 129, .4) !important; }

/* ---------- Hover pastel ---------- */
[data-theme="dark"] .hover\:bg-green-50:hover,
[data-theme="dark"] .hover\:bg-emerald-50:hover { background-color: rgba(31, 165, 81, .18) !important; }
[data-theme="dark"] .hover\:bg-red-50:hover { background-color: rgba(239, 68, 68, .2) !important; }
[data-theme="dark"] .hover\:bg-amber-50:hover { background-color: rgba(245, 197, 24, .18) !important; }

/* ---------- Composants V8.2 de la fiche d'encaissement ---------- */
[data-theme="dark"] .enc-method.border-slate-200 { background: var(--surface-2); }
[data-theme="dark"] #encBox { background: var(--surface); }
[data-theme="dark"] #encBox .bg-white { background: var(--surface) !important; }
[data-theme="dark"] #encBox .bg-slate-50,
[data-theme="dark"] #encBox .bg-slate-100 { background: var(--surface-2) !important; }
[data-theme="dark"] #encBox .bg-indigo-50 { background: rgba(99, 102, 241, .2) !important; }
[data-theme="dark"] #encBox .bg-emerald-50 { background: rgba(16, 185, 129, .14) !important; }
[data-theme="dark"] #encBox .bg-red-50 { background: rgba(239, 68, 68, .16) !important; }

/* ---------- Tableaux : en-tete et bordures ---------- */
[data-theme="dark"] table.data,
[data-theme="dark"] .data td { border-color: var(--card-border); }
[data-theme="dark"] .table-wrap { border-color: var(--card-border); }

/* ---------- Modales ouvertes par JS (classe modal-overlay) ---------- */
[data-theme="dark"] .modal-box { background: var(--surface); color: var(--ink); }
[data-theme="dark"] .modal-box .bg-slate-50,
[data-theme="dark"] .modal-box .bg-slate-100 { background: var(--surface-2) !important; }

/* ---------- Liens verts/bleus ---------- */
[data-theme="dark"] a { color: inherit; }
[data-theme="dark"] .text-primary,
[data-theme="dark"] .link-green { color: #4ade80; }

/* ---------- kpi-icon et grad-* : deja colores, fond legers ajustes ----- */
[data-theme="dark"] .kpi-icon { box-shadow: 0 2px 10px rgba(0, 0, 0, .35); }

/* Le bouton de bascule clair/sombre */
.theme-toggle {
  display: inline-flex; align-items: center; justify-content: center;
  width: 2.25rem; height: 2.25rem; border-radius: 9999px;
  color: #64748b; background: transparent; border: 0; cursor: pointer;
  transition: background .18s ease, color .18s ease;
}
.theme-toggle:hover { background: #f1f5f9; color: #178a3e; }
[data-theme="dark"] .theme-toggle { color: #94a3b8; }
[data-theme="dark"] .theme-toggle:hover { background: #1e2a42; color: #f5c518; }
.theme-toggle .icon-dark { display: none; }
[data-theme="dark"] .theme-toggle .icon-dark { display: inline; }
[data-theme="dark"] .theme-toggle .icon-light { display: none; }

/* ==========================================================================
   V10.0 — MODE SOMBRE des nouveaux composants UX/UI
   ========================================================================== */

/* ---------- Focus clavier ---------- */
[data-theme="dark"] :focus-visible { outline-color: rgba(74, 222, 128, .6); }
[data-theme="dark"] ::selection { background: rgba(245, 197, 24, .3); }

/* ---------- Boutons : variantes V10 ---------- */
[data-theme="dark"] .btn-ghost { color: #b0bccd; }
[data-theme="dark"] .btn-ghost:hover { background: rgba(255, 255, 255, .07); color: #fff; }
[data-theme="dark"] .btn-soft-danger { background: rgba(239, 68, 68, .14); color: #fca5a5; border-color: rgba(239, 68, 68, .3); }
[data-theme="dark"] .btn-soft-danger:hover { background: rgba(239, 68, 68, .22); color: #fecaca; }
[data-theme="dark"] .btn-soft-success { background: rgba(16, 185, 129, .13); color: #6ee7b7; border-color: rgba(16, 185, 129, .28); }
[data-theme="dark"] .btn-soft-success:hover { background: rgba(16, 185, 129, .21); }
[data-theme="dark"] .btn-soft-brand { background: rgba(31, 165, 81, .14); color: #86efac; border-color: rgba(31, 165, 81, .3); }
[data-theme="dark"] .btn-soft-brand:hover { background: rgba(31, 165, 81, .22); }
[data-theme="dark"] .btn-soft-amber { background: rgba(245, 158, 11, .13); color: #fcd34d; border-color: rgba(245, 158, 11, .3); }
[data-theme="dark"] .btn-soft-amber:hover { background: rgba(245, 158, 11, .21); }
[data-theme="dark"] .btn-soft-slate { background: var(--surface-2); color: #b0bccd; border-color: var(--card-border); }
[data-theme="dark"] .btn-soft-slate:hover { background: var(--surface-3); color: #fff; }
[data-theme="dark"] .btn:focus-visible { box-shadow: 0 0 0 3px rgba(74, 222, 128, .35); }

/* ---------- Tableaux V10 : zebra, lignes actives, en-tête collant ---------- */
[data-theme="dark"] table.data.table-zebra tbody tr:nth-child(even),
[data-theme="dark"] .table-wrap.table-zebra table.data tbody tr:nth-child(even) { background: rgba(255, 255, 255, .015); }
[data-theme="dark"] table.data tbody tr.row-active { background: rgba(245, 197, 24, .07); }
[data-theme="dark"] .table-wrap.sticky-head thead th { background: var(--surface-2);
  box-shadow: 0 1px 0 var(--card-border); }

/* ---------- États vides + skeletons ---------- */
[data-theme="dark"] .empty-state { color: #8593a8; }
[data-theme="dark"] .empty-state .empty-icon { background: var(--surface-2);
  border-color: #33415c; color: #475569; }
[data-theme="dark"] .empty-state .empty-title { color: #cbd5e1; }
[data-theme="dark"] .skeleton { background: #1e2a42; }
[data-theme="dark"] .skeleton::after { background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .07), transparent); }

/* ---------- Titres de section + barres d'outils ---------- */
[data-theme="dark"] .page-section-title { color: var(--ink); }
[data-theme="dark"] .page-section-title i { color: #4ade80; }
[data-theme="dark"] .page-section-title .section-count { background: var(--surface-2);
  color: #94a3b8; border-color: var(--card-border); }

/* ---------- Formulaires V10 ---------- */
[data-theme="dark"] .field-hint { color: #7c8aa3; }
[data-theme="dark"] .req { color: #f87171; }
[data-theme="dark"] .field-error { color: #fca5a5; }
[data-theme="dark"] .input-invalid { border-color: rgba(248, 113, 113, .6) !important;
  box-shadow: 0 0 0 3px rgba(239, 68, 68, .15) !important; }

/* ---------- Pied de modale standard ---------- */
[data-theme="dark"] .modal-foot { background: var(--surface-2); border-top-color: var(--card-border); }

/* ---------- Boîte de confirmation élégante ---------- */
[data-theme="dark"] .gconfirm-box { background: var(--surface); }
[data-theme="dark"] .gconfirm-title { color: var(--ink); }
[data-theme="dark"] .gconfirm-msg { color: #9aa7bb; }
[data-theme="dark"] .gconfirm-icon.danger { background: rgba(239, 68, 68, .16); color: #fca5a5; }
[data-theme="dark"] .gconfirm-icon.warn { background: rgba(245, 158, 11, .15); color: #fcd34d; }
[data-theme="dark"] .gconfirm-icon.info { background: rgba(31, 165, 81, .15); color: #86efac; }

/* ---------- Touches clavier ---------- */
[data-theme="dark"] .kbd { background: var(--surface-2); border-color: #33415c; color: #b0bccd; }
[data-theme="dark"] .shortcuts-row { color: #b0bccd; }

/* ---------- Liens de marque ---------- */
[data-theme="dark"] a.link, [data-theme="dark"] .link { color: #4ade80; }
[data-theme="dark"] a.link:hover { color: #86efac; }

/* ============================================================
   V11.1 — MODALE ACHAT DIRECT (mode sombre)
   ============================================================ */
.dark .pm-section { border-color: #2a3446; background: #1a2333; }
.dark .pm-sec-title { color: #94a3b8; }
.dark .pm-sec-ico { background: #3d3012; color: #fbbf24; }
.dark .pm-ico-money { background: #123524; color: #34d399; }
.dark .pm-ico-doc { background: #1e2f4d; color: #60a5fa; }
.dark .pm-ico-chart { background: #2e2450; color: #a78bfa; }
.dark .pm-sub { border-color: #33405a; background: #151d2b; }
.dark .pm-sub-title { color: #cbd5e1; }
.dark .pm-line-total { color: #e2e8f0; }
.dark .pm-big { background: #222d40; color: #e2e8f0; }
.dark .pm-hint { background: #17233c; border-color: #24406e; color: #93c5fd; }
.dark .pm-recap { background: #151d2b; }
.dark .pm-recap-stock-line { background: #1a2333; border-color: #2a3446; color: #cbd5e1; }
.dark .pm-recap-grid > div { background: #1a2333; border-color: #2a3446; }
.dark .pm-recap-grid span { color: #7c8aa0; }
.dark .pm-recap-grid b { color: #e2e8f0; }
.dark .pm-progress-track { background: #2a3446; }
.dark .pm-confirm-rows { border-color: #2a3446; }
.dark .pm-confirm-row { border-bottom-color: #243046; }
.dark .pm-confirm-row span { color: #94a3b8; }
.dark .pm-confirm-row b { color: #e2e8f0; }
.dark .pm-confirm-row.pm-confirm-strong { background: #3d3012; }
.dark .pm-confirm-warn { background: #3d3012; border-color: #5a4814; color: #fcd34d; }
.dark .pm-success-ico { background: #123524; color: #34d399; }