/* ======================================================
   THEMES — LÉONARD
   Toutes les couleurs centralisées ici
====================================================== */

/* ======================================================
   FALLBACK (sécurité si data-theme absent)
====================================================== */
:root {
  --bg: #0f1115;
  --bg-card: #1a1d24;
  --bg-hover: #141821;

  --text: #ffffff;
  --text-muted: #a1a1a1;
  --text-soft: #b5b8c1;

  --accent: #4f46e5;

  --border: #2a2e36;
  --border-soft: rgba(255,255,255,0.08);
  --border-softer: rgba(255,255,255,0.06);
  --border-subtle: rgba(255,255,255,0.06);

  --shadow: 0 4px 12px rgba(0,0,0,0.3);
  --shadow-soft: 0 2px 8px rgba(0,0,0,0.2);
  --shadow-strong: 0 10px 30px rgba(0,0,0,0.5);

  --input-bg: #111317;
  --input-bg-strong: #0b0e14;

  --table-head-bg: #0d0f14;
  --popover-bg: #1a1d24;

  --dropzone-bg: #15181f;
  --dropzone-hover-bg: rgba(79,70,229,0.2);

  --cell-editing-bg: rgba(79,70,229,0.18);

  /* Header / menu */
  --header-bg-1: #0f1115;
  --header-bg-2: #0b0d12;
  --header-border: #2a2e36;
  --header-shadow: 0 6px 20px rgba(0,0,0,0.45);

  --nav-btn-bg: #1a1d24;
  --nav-btn-border: #2a2e36;
  --nav-btn-text: #ffffff;
  --nav-btn-hover-bg: #242836;

  --nav-active-grad-1: #4f46e5;
  --nav-active-grad-2: #3b82f6;
  --nav-active-shadow: 0 4px 12px rgba(79,70,229,0.6);

  --dropdown-bg: #1a1d24;
  --dropdown-border: #2a2e36;
  --dropdown-hover-bg: #2a2e36;
  --dropdown-text: #ffffff;

  --section-grad-1: #0b1220;
  --section-grad-2: #0f172a;
  --section-border-left: #4f46e5;
  --section-text: #e5e7eb;

  /* Summary */
  --summary-grad-1: #111827;
  --summary-grad-2: #0f172a;
  --summary-value: #60a5fa;
  --summary-label: #94a3b8;
  --summary-count: #e5e7eb;

  /* Momentum — boutons */
  --momentum-btn-neg2: #b91c1c;
  --momentum-btn-neg1: #ef4444;
  --momentum-btn-pos1: #3b82f6;
  --momentum-btn-pos2: #22c55e;

  --momentum-selected-outline: #facc15;
  --momentum-selected-glow: rgba(250,204,21,0.7);

  /* Momentum — badges */
  --momentum-badge-neg2: #7f1d1d;
  --momentum-badge-neg1: #b91c1c;
  --momentum-badge-pos1: #15803d;
  --momentum-badge-pos2: #16a34a;
  --momentum-badge-neutral: #4b5563;

  /* ABCD Zones */
  --abcd-bar-bg: #111827;
  --abcd-segment-bg: #2b2f3a;

  --zone-A-bg: #1d4ed8;
  --zone-A-text: #e5f0ff;
  --zone-B-bg: #16a34a;
  --zone-B-text: #ecfdf3;
  --zone-C-bg: #eab308;
  --zone-C-text: #fffbeb;
  --zone-D-bg: #dc2626;
  --zone-D-text: #fee2e2;

  /* Zones badges (minuscules pour compatibility) */
  --zone-a-bg: #1d4ed8;
  --zone-a-text: #e5f0ff;
  --zone-b-bg: #16a34a;
  --zone-b-text: #ecfdf3;
  --zone-c-bg: #eab308;
  --zone-c-text: #fffbeb;
  --zone-d-bg: #dc2626;
  --zone-d-text: #fee2e2;

  --abcd-indicator-bg: #ffffff;
  --abcd-indicator-shadow: rgba(255,255,255,.7);
  
  --chart-grid: rgba(148,163,184,0.25);
  
  /* Allocation bars */
  --allocation-bar-bg: #2a2e36;
  --allocation-cursor-bg: #ffffff;
  --allocation-cursor-shadow: rgba(255,255,255,0.7);

  /* Success / Danger */
  --success: #22c55e;
  --danger: #ef4444;

  /* Overlay */
  --overlay-bg: rgba(0,0,0,0.35);
  --overlay-bg-strong: rgba(0,0,0,0.6);
}

/* ======================================================
   THEME DARK — ORIGINAL LÉONARD
====================================================== */
:root[data-theme="dark"] {
  /* Tout hérité du fallback → aucun override nécessaire */
}

/* ======================================================
   THEME LIGHT — LISIBLE & COHÉRENT
====================================================== */
:root[data-theme="light"] {
  --bg: #f6f7fb;
  --bg-card: #ffffff;
  --bg-hover: #eef2f7;

  --text: #0f172a;
  --text-muted: #64748b;
  --text-soft: #475569;

  --accent: #4f46e5;

  --border: #e2e8f0;
  --border-soft: rgba(15,23,42,0.08);
  --border-softer: rgba(15,23,42,0.05);
  --border-subtle: rgba(15,23,42,0.06);

  --shadow: 0 8px 22px rgba(15,23,42,0.08);
  --shadow-soft: 0 4px 12px rgba(15,23,42,0.06);
  --shadow-strong: 0 12px 40px rgba(15,23,42,0.12);

  --input-bg: #f1f5f9;
  --input-bg-strong: #eaf0f7;

  --table-head-bg: #f1f5f9;
  --popover-bg: #ffffff;

  --dropzone-bg: #f8fafc;
  --dropzone-hover-bg: rgba(79,70,229,0.1);

  --cell-editing-bg: rgba(79,70,229,0.1);

  /* Header / menu */
  --header-bg-1: #ffffff;
  --header-bg-2: #f6f7fb;
  --header-border: #e2e8f0;
  --header-shadow: 0 10px 24px rgba(15,23,42,0.08);

  --nav-btn-bg: #ffffff;
  --nav-btn-border: #e2e8f0;
  --nav-btn-text: #0f172a;
  --nav-btn-hover-bg: #f1f5f9;

  --nav-active-grad-1: #4f46e5;
  --nav-active-grad-2: #3b82f6;
  --nav-active-shadow: 0 4px 12px rgba(79,70,229,0.3);

  --dropdown-bg: #ffffff;
  --dropdown-border: #e2e8f0;
  --dropdown-hover-bg: #f1f5f9;
  --dropdown-text: #0f172a;

  --section-grad-1: #eef2ff;
  --section-grad-2: #f8fafc;
  --section-border-left: #4f46e5;
  --section-text: #0f172a;

  /* Summary */
  --summary-grad-1: #eef2ff;
  --summary-grad-2: #f8fafc;
  --summary-value: #1d4ed8;
  --summary-label: #64748b;
  --summary-count: #0f172a;

  /* Momentum — boutons (même en light) */
  --momentum-btn-neg2: #b91c1c;
  --momentum-btn-neg1: #ef4444;
  --momentum-btn-pos1: #3b82f6;
  --momentum-btn-pos2: #22c55e;

  --momentum-selected-outline: #facc15;
  --momentum-selected-glow: rgba(250,204,21,0.5);

  /* Momentum — badges */
  --momentum-badge-neg2: #fee2e2;
  --momentum-badge-neg1: #fecaca;
  --momentum-badge-pos1: #dbeafe;
  --momentum-badge-pos2: #dcfce7;
  --momentum-badge-neutral: #e5e7eb;

  /* ABCD Zones */
  --abcd-bar-bg: #e5e7eb;
  --abcd-segment-bg: #cbd5e1;

  --zone-A-bg: #2563eb;
  --zone-A-text: #ffffff;
  --zone-B-bg: #16a34a;
  --zone-B-text: #ffffff;
  --zone-C-bg: #ca8a04;
  --zone-C-text: #ffffff;
  --zone-D-bg: #dc2626;
  --zone-D-text: #ffffff;

  /* Zones badges (minuscules pour compatibility) */
  --zone-a-bg: #2563eb;
  --zone-a-text: #ffffff;
  --zone-b-bg: #16a34a;
  --zone-b-text: #ffffff;
  --zone-c-bg: #ca8a04;
  --zone-c-text: #ffffff;
  --zone-d-bg: #dc2626;
  --zone-d-text: #ffffff;

  --abcd-indicator-bg: #0f172a;
  --abcd-indicator-shadow: rgba(15,23,42,.35);
  
  --chart-grid: rgba(15,23,42,0.15);
  
  /* Allocation bars */
  --allocation-bar-bg: #e5e7eb;
  --allocation-cursor-bg: #0f172a;
  --allocation-cursor-shadow: rgba(15,23,42,0.35);

  /* Success / Danger */
  --success: #16a34a;
  --danger: #dc2626;

  /* Overlay */
  --overlay-bg: rgba(15,23,42,0.2);
  --overlay-bg-strong: rgba(15,23,42,0.4);
}

/* ======================================================
   THEME LIGHT-BLUE — CONTRASTE MAXIMAL (bleu clair)
====================================================== */
:root[data-theme="light-blue"] {
  --bg: #f0faff;                 /* bleu très clair */
  --bg-card: #ffffff;
  --bg-hover: #dbeafe;
  --text: #1e293b;                /* gris-ardoise très foncé → contraste parfait */
  --text-muted: #475569;
  --text-soft: #64748b;
  --accent: #0284c7;              /* bleu vif comme accent */
  --border: #a5d8ff;
  --border-soft: rgba(2,132,199,0.25);
  --border-softer: rgba(2,132,199,0.15);
  --border-subtle: rgba(2,132,199,0.1);
  --shadow: 0 8px 22px rgba(30,41,59,0.08);
  --shadow-soft: 0 4px 12px rgba(30,41,59,0.06);
  --shadow-strong: 0 12px 40px rgba(30,41,59,0.12);
  --input-bg: #e0f7fa;
  --input-bg-strong: #cffafe;
  --table-head-bg: #dbeafe;
  --popover-bg: #ffffff;
  --dropzone-bg: #f0faff;
  --dropzone-hover-bg: rgba(2,132,199,0.2);
  --cell-editing-bg: rgba(2,132,199,0.15);

  /* Header / menu */
  --header-bg-1: #ffffff;
  --header-bg-2: #f0faff;
  --header-border: #a5d8ff;
  --header-shadow: 0 10px 24px rgba(30,41,59,0.08);
  --nav-btn-bg: #ffffff;
  --nav-btn-border: #a5d8ff;
  --nav-btn-text: #1e293b;
  --nav-btn-hover-bg: #dbeafe;
  --nav-active-grad-1: #0284c7;
  --nav-active-grad-2: #0ea5e9;
  --nav-active-shadow: 0 4px 12px rgba(2,132,199,0.3);
  --dropdown-bg: #ffffff;
  --dropdown-border: #a5d8ff;
  --dropdown-hover-bg: #dbeafe;
  --dropdown-text: #1e293b;
  --section-grad-1: #e0f7fa;
  --section-grad-2: #f0faff;
  --section-border-left: #0284c7;
  --section-text: #1e293b;

  /* Summary */
  --summary-grad-1: #dbeafe;
  --summary-grad-2: #e0f7fa;
  --summary-value: #0369a1;
  --summary-label: #475569;
  --summary-count: #1e293b;

  /* ABCD Zones — texte blanc sur fonds colorés foncés pour max contraste */
/* ABCD Zones — fonds pastel clairs → texte noir foncé pour max lisibilité */
  --zone-A-bg: #bfdbfe;           /* bleu clair pastel */
  --zone-A-text: #1e293b;         /* noir ardoise */
  --zone-B-bg: #bbf7d0;           /* vert clair pastel */
  --zone-B-text: #1e293b;
  --zone-C-bg: #fde68a;           /* jaune clair pastel */
  --zone-C-text: #1e293b;
  --zone-D-bg: #fecaca;           /* rouge clair pastel */
  --zone-D-text: #1e293b;

  /* Badges minuscules (compatibilité) */
/* Badges minuscules (compatibilité) */
  --zone-a-bg: #bfdbfe; --zone-a-text: #1e293b;
  --zone-b-bg: #bbf7d0; --zone-b-text: #1e293b;
  --zone-c-bg: #fde68a; --zone-c-text: #1e293b;
  --zone-d-bg: #fecaca; --zone-d-text: #1e293b;

  --zone-a-bg: #0369a1; --zone-a-text: #1e293b;
  --zone-b-bg: #15803d; --zone-b-text: #1e293b;
  --zone-c-bg: #ca8a04; --zone-c-text: #1e293b;
  --zone-d-bg: #b91c1c; --zone-d-text: #1e293b;

  --abcd-bar-bg: #dbeafe;
  --abcd-segment-bg: #a5d8ff;
  --abcd-indicator-bg: #1e293b;
  --abcd-indicator-shadow: rgba(30,41,59,0.4);
  --chart-grid: rgba(30,41,59,0.15);

  /* Allocation bars */
  --allocation-bar-bg: #dbeafe;
  --allocation-cursor-bg: #1e293b;
  --allocation-cursor-shadow: rgba(30,41,59,0.4);

  /* Success / Danger / Overlay */
  --success: #15803d;
  --danger: #b91c1c;
  --overlay-bg: rgba(30,41,59,0.15);
  --overlay-bg-strong: rgba(30,41,59,0.4);
}

/* ======================================================
   THEME DARK-BLUE — VARIANTE PLUS BLEUTÉE (zones et accents en bleus dominants)
====================================================== */
:root[data-theme="dark-blue"] {
  --bg: #0c1828;                   /* bleu nuit plus marqué */
  --bg-card: #112240;
  --bg-hover: #172b4d;
  --text: #ffffff;
  --text-muted: #a5b4fc;           /* muted plus bleuté */
  --text-soft: #c7d2fe;
  --accent: #60a5fa;               /* bleu clair vif comme accent principal */
  --border: #1e3a8a;
  --border-soft: rgba(96,165,250,0.15);
  --border-softer: rgba(96,165,250,0.1);
  --shadow: 0 4px 12px rgba(0,0,0,0.4);
  --shadow-soft: 0 2px 8px rgba(0,0,0,0.3);
  --shadow-strong: 0 10px 30px rgba(0,0,0,0.6);

  /* Header / menu */
  --header-bg-1: #0c1828;
  --header-bg-2: #081526;
  --header-border: #1e3a8a;
  --nav-btn-bg: #112240;
  --nav-btn-hover-bg: #1e3a8a;
  --nav-active-grad-1: #60a5fa;
  --nav-active-grad-2: #93c5fd;
  --nav-active-shadow: 0 4px 12px rgba(96,165,250,0.5);
  --section-border-left: #60a5fa;
  --section-text: #e0e7ff;

  /* Summary */
  --summary-value: #93c5fd;

  /* ABCD Zones — plus de bleus tout en gardant la distinction */
  --zone-A-bg: #2563eb;             /* bleu plus vif pour A */
  --zone-A-text: #ffffff;
  --zone-B-bg: #3b82f6;             /* bleu moyen pour B au lieu du vert → plus "bleu" global */
  --zone-B-text: #ffffff;
  --zone-C-bg: #60a5fa;             /* bleu clair pour C */
  --zone-C-text: #1e293b;           /* texte foncé sur bleu clair */
  --zone-D-bg: #dc2626;             /* rouge conservé pour le danger */
  --zone-D-text: #ffffff;

  --zone-a-bg: #2563eb; --zone-a-text: #ffffff;
  --zone-b-bg: #3b82f6; --zone-b-text: #ffffff;
  --zone-c-bg: #60a5fa; --zone-c-text: #1e293b;
  --zone-d-bg: #dc2626; --zone-d-text: #ffffff;

  /* Autres ajustements bleutés */
  --dropzone-hover-bg: rgba(96,165,250,0.25);
  --cell-editing-bg: rgba(96,165,250,0.2);
}
/* ======================================================
   THEME DARK-BLUE SYMPA — BLEU NUIT À LA PLACE DU NOIR
====================================================== */
:root[data-theme="dark-blue-sympa"] {
  --bg: #0a1428;                  /* bleu nuit profond à la place du noir */
  --bg-card: #111c38;
  --bg-hover: #162142;
  --text: #ffffff;                /* texte blanc pur → lisibilité max */
  --text-muted: #b0c4ff;
  --text-soft: #94a3b8;
  --accent: #60a5fa;               /* cyan bleu vif sympa pour les actifs */
  --border: #1e3a8a;
  --border-soft: rgba(96,165,250,0.15);
  --border-softer: rgba(96,165,250,0.1);
  --border-subtle: rgba(96,165,250,0.08);
  --shadow: 0 4px 12px rgba(0,0,0,0.4);
  --shadow-soft: 0 2px 8px rgba(0,0,0,0.3);
  --shadow-strong: 0 10px 30px rgba(0,0,0,0.6);
  --input-bg: #0d1a33;
  --input-bg-strong: #091526;
  --table-head-bg: #0d1a33;
  --popover-bg: #111c38;
  --dropzone-bg: #0a1428;
  --dropzone-hover-bg: rgba(96,165,250,0.25);
  --cell-editing-bg: rgba(96,165,250,0.2);

  /* Header / menu */
  --header-bg-1: #0a1428;
  --header-bg-2: #060f1f;
  --header-border: #1e3a8a;
  --header-shadow: 0 6px 20px rgba(0,0,0,0.5);
  --nav-btn-bg: #111c38;
  --nav-btn-text: #ffffff;
  --nav-btn-hover-bg: #162142;
  --nav-active-grad-1: #60a5fa;
  --nav-active-grad-2: #93c5fd;
  --nav-active-shadow: 0 4px 12px rgba(96,165,250,0.5);
  --dropdown-bg: #111c38;
  --dropdown-hover-bg: #162142;
  --dropdown-text: #ffffff;
  --section-grad-1: #060f1f;
  --section-grad-2: #0a1428;
  --section-border-left: #60a5fa;
  --section-text: #e0efff;

  /* Summary */
  --summary-grad-1: #0d1a33;
  --summary-grad-2: #060f1f;
  --summary-value: #93c5fd;
  --summary-label: #b0c4ff;
  --summary-count: #ffffff;

  /* ABCD Zones — couleurs vives + texte blanc pour lisibilité */
  --zone-A-bg: #3b82f6;            /* bleu vif */
  --zone-A-text: #ffffff;
  --zone-B-bg: #22c55e;            /* vert */
  --zone-B-text: #ffffff;
  --zone-C-bg: #eab308;            /* jaune */
  --zone-C-text: #ffffff;
  --zone-D-bg: #ef4444;            /* rouge */
  --zone-D-text: #ffffff;

  --zone-a-bg: #3b82f6; --zone-a-text: #ffffff;
  --zone-b-bg: #22c55e; --zone-b-text: #ffffff;
  --zone-c-bg: #eab308; --zone-c-text: #ffffff;
  --zone-d-bg: #ef4444; --zone-d-text: #ffffff;

  --abcd-bar-bg: #0d1a33;
  --abcd-segment-bg: #162142;
  --chart-grid: rgba(176,196,255,0.2);

  /* Allocation bars */
  --allocation-bar-bg: #162142;
  --allocation-cursor-bg: #ffffff;

  /* Overlay */
  --overlay-bg: rgba(0,0,0,0.5);
  --overlay-bg-strong: rgba(0,0,0,0.75);
}

/* ======================================================
   THEME LIGHT-BLUE SYMPA — PASTEL DOUX ASSORTI
====================================================== */
:root[data-theme="light-blue-sympa"] {
  --bg: #f8fbff;                  /* presque blanc avec une touche bleue très légère */
  --bg-card: #ffffff;
  --bg-hover: #e0eaff;
  --text: #334155;                 /* gris-bleu foncé mais pas trop noir → plus doux */
  --text-muted: #64748b;
  --text-soft: #94a3b8;
  --accent: #60a5fa;
  --border: #c7d2fe;
  --border-soft: rgba(96,165,250,0.15);
  --border-softer: rgba(96,165,250,0.1);
  --border-subtle: rgba(96,165,250,0.08);
  --shadow: 0 8px 22px rgba(79,112,156,0.08);
  --shadow-soft: 0 4px 12px rgba(79,112,156,0.06);
  --shadow-strong: 0 12px 40px rgba(79,112,156,0.12);

  --input-bg: #eef2ff;
  --input-bg-strong: #e0eaff;
  --table-head-bg: #eef2ff;
  --popover-bg: #ffffff;
  --dropzone-bg: #f8fbff;

  /* Header / menu */
  --header-bg-1: #ffffff;
  --header-bg-2: #f8fbff;
  --header-border: #c7d2fe;
  --nav-btn-bg: #ffffff;
  --nav-btn-text: #334155;
  --nav-btn-hover-bg: #e0eaff;
  --nav-active-grad-1: #60a5fa;
  --nav-active-grad-2: #93c5fd;
  --section-border-left: #60a5fa;
  --section-text: #334155;

  /* Zones ABCD — pastel + texte doux */
  --zone-A-bg: #a5b4fc;            /* indigo pastel */
  --zone-A-text: #312e81;
  --zone-B-bg: #a7f3d0;            /* vert pastel */
  --zone-B-text: #065f46;
  --zone-C-bg: #fde68a;            /* jaune pastel */
  --zone-C-text: #854d0e;
  --zone-D-bg: #fca5a5;            /* rouge pastel */
  --zone-D-text: #991b1b;

  --zone-a-bg: #a5b4fc; --zone-a-text: #312e81;
  --zone-b-bg: #a7f3d0; --zone-b-text: #065f46;
  --zone-c-bg: #fde68a; --zone-c-text: #854d0e;
  --zone-d-bg: #fca5a5; --zone-d-text: #991b1b;
}
/* ======================================================
   THEME DARK-ELEGANT — Cartes zones avec fond opaque + texte coloré vif
   Style élégant inspiré des barres ABCD
====================================================== */
:root[data-theme="dark-elegant"] {
  /* Base identique au dark original */
  --bg: #0f1115;
  --bg-card: #1a1d24;
  --bg-hover: #141821;
  --text: #ffffff;
  --text-muted: #a1a1a1;
  --text-soft: #b5b8c1;
  --accent: #4f46e5;
  --border: #2a2e36;
  --border-soft: rgba(255,255,255,0.08);
  --border-softer: rgba(255,255,255,0.06);
  --border-subtle: rgba(255,255,255,0.06);
  --shadow: 0 4px 12px rgba(0,0,0,0.3);
  --shadow-soft: 0 2px 8px rgba(0,0,0,0.2);
  --shadow-strong: 0 10px 30px rgba(0,0,0,0.5);
  --input-bg: #111317;
  --input-bg-strong: #0b0e14;
  --table-head-bg: #0d0f14;
  --popover-bg: #1a1d24;
  --dropzone-bg: #15181f;
  --dropzone-hover-bg: rgba(79,70,229,0.2);
  --cell-editing-bg: rgba(79,70,229,0.18);

  /* Header / menu */
  --header-bg-1: #0f1115;
  --header-bg-2: #0b0d12;
  --header-border: #2a2e36;
  --header-shadow: 0 6px 20px rgba(0,0,0,0.45);
  --nav-btn-bg: #1a1d24;
  --nav-btn-border: #2a2e36;
  --nav-btn-text: #ffffff;
  --nav-btn-hover-bg: #242836;
  --nav-active-grad-1: #4f46e5;
  --nav-active-grad-2: #3b82f6;
  --nav-active-shadow: 0 4px 12px rgba(79,70,229,0.6);
  --dropdown-bg: #1a1d24;
  --dropdown-border: #2a2e36;
  --dropdown-hover-bg: #2a2e36;
  --dropdown-text: #ffffff;
  --section-grad-1: #0b1220;
  --section-grad-2: #0f172a;
  --section-border-left: #4f46e5;
  --section-text: #e5e7eb;

  /* Summary */
  --summary-grad-1: #111827;
  --summary-grad-2: #0f172a;
  --summary-value: #60a5fa;
  --summary-label: #94a3b8;
  --summary-count: #e5e7eb;

  /* Momentum — boutons */
  --momentum-btn-neg2: #b91c1c;
  --momentum-btn-neg1: #ef4444;
  --momentum-btn-pos1: #3b82f6;
  --momentum-btn-pos2: #22c55e;
  --momentum-selected-outline: #facc15;
  --momentum-selected-glow: rgba(250,204,21,0.7);

  /* Momentum — badges */
  --momentum-badge-neg2: #7f1d1d;
  --momentum-badge-neg1: #b91c1c;
  --momentum-badge-pos1: #15803d;
  --momentum-badge-pos2: #16a34a;
  --momentum-badge-neutral: #4b5563;

  /* ABCD Bar */
  --abcd-bar-bg: #111827;
  --abcd-segment-bg: #2b2f3a;
  --abcd-indicator-bg: #ffffff;
  --abcd-indicator-shadow: rgba(255,255,255,.7);
  --chart-grid: rgba(148,163,184,0.25);

  /* Allocation bars */
  --allocation-bar-bg: #2a2e36;
  --allocation-cursor-bg: #ffffff;
  --allocation-cursor-shadow: rgba(255,255,255,0.7);

  /* Success / Danger */
  --success: #22c55e;
  --danger: #ef4444;

  /* Overlay */
  --overlay-bg: rgba(0,0,0,0.35);
  --overlay-bg-strong: rgba(0,0,0,0.6);

  /* ========================================
     ZONES ABCD — STYLE ÉLÉGANT
     Fond opaque (0.42) + Texte coloré vif
  ======================================== */
  --zone-opacity: 0.42;

  /* Zone A — Bleu */
  --zone-A-bg: rgba(29, 78, 216, var(--zone-opacity));     /* Bleu foncé avec opacité */
  --zone-A-text: #60a5fa;                                   /* Bleu vif lumineux */
  --zone-A-border: rgba(96, 165, 250, 0.35);

  /* Zone B — Vert */
  --zone-B-bg: rgba(22, 163, 74, var(--zone-opacity));     /* Vert foncé avec opacité */
  --zone-B-text: #4ade80;                                   /* Vert vif lumineux */
  --zone-B-border: rgba(74, 222, 128, 0.35);

  /* Zone C — Jaune/Orange */
  --zone-C-bg: rgba(234, 179, 8, var(--zone-opacity));     /* Jaune foncé avec opacité */
  --zone-C-text: #fbbf24;                                   /* Jaune vif lumineux */
  --zone-C-border: rgba(251, 191, 36, 0.35);

  /* Zone D — Rouge */
  --zone-D-bg: rgba(220, 38, 38, var(--zone-opacity));     /* Rouge foncé avec opacité */
  --zone-D-text: #f87171;                                   /* Rouge vif lumineux */
  --zone-D-border: rgba(248, 113, 113, 0.35);

  /* Badges zones (minuscules pour compatibilité) */
  --zone-a-bg: rgba(29, 78, 216, var(--zone-opacity));
  --zone-a-text: #60a5fa;
  --zone-b-bg: rgba(22, 163, 74, var(--zone-opacity));
  --zone-b-text: #4ade80;
  --zone-c-bg: rgba(234, 179, 8, var(--zone-opacity));
  --zone-c-text: #fbbf24;
  --zone-d-bg: rgba(220, 38, 38, var(--zone-opacity));
  --zone-d-text: #f87171;
}

/* ======================================================
   STYLES SPÉCIFIQUES POUR LES CARTES ZONES
====================================================== */

/* Cartes zones en dark-elegant */
:root[data-theme="dark-elegant"] .zone-panel,
:root[data-theme="dark-elegant"] .section.zone-panel {
  border-radius: 16px !important;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(0,0,0,0.4);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
  backdrop-filter: blur(8px);
}

:root[data-theme="dark-elegant"] .zone-A,
:root[data-theme="dark-elegant"] .zone-panel.zone-A,
:root[data-theme="dark-elegant"] .section.zone-panel.zone-A {
  background: var(--zone-A-bg) !important;
  color: var(--zone-A-text) !important;
  border: 1px solid var(--zone-A-border);
}

:root[data-theme="dark-elegant"] .zone-B,
:root[data-theme="dark-elegant"] .zone-panel.zone-B,
:root[data-theme="dark-elegant"] .section.zone-panel.zone-B {
  background: var(--zone-B-bg) !important;
  color: var(--zone-B-text) !important;
  border: 1px solid var(--zone-B-border);
}

:root[data-theme="dark-elegant"] .zone-C,
:root[data-theme="dark-elegant"] .zone-panel.zone-C,
:root[data-theme="dark-elegant"] .section.zone-panel.zone-C {
  background: var(--zone-C-bg) !important;
  color: var(--zone-C-text) !important;
  border: 1px solid var(--zone-C-border);
}

:root[data-theme="dark-elegant"] .zone-D,
:root[data-theme="dark-elegant"] .zone-panel.zone-D,
:root[data-theme="dark-elegant"] .section.zone-panel.zone-D {
  background: var(--zone-D-bg) !important;
  color: var(--zone-D-text) !important;
  border: 1px solid var(--zone-D-border);
}

/* Effet hover élégant */
:root[data-theme="dark-elegant"] .zone-panel:hover,
:root[data-theme="dark-elegant"] .zone-A:hover,
:root[data-theme="dark-elegant"] .zone-B:hover,
:root[data-theme="dark-elegant"] .zone-C:hover,
:root[data-theme="dark-elegant"] .zone-D:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 32px rgba(0,0,0,0.6);
}

/* Sous-titres et textes secondaires dans les zones */
:root[data-theme="dark-elegant"] .zone-panel .zone-subtitle,
:root[data-theme="dark-elegant"] .zone-panel .text-muted,
:root[data-theme="dark-elegant"] .zone-panel small {
  opacity: 0.85;
  filter: brightness(1.1);
}

/* Titres des zones (plus lumineux) */
:root[data-theme="dark-elegant"] .zone-panel h3,
:root[data-theme="dark-elegant"] .zone-panel h4 {
  font-weight: 600;
  letter-spacing: 0.025em;
  text-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

/* Messages "Aucune classe" avec opacité réduite */
:root[data-theme="dark-elegant"] .zone-panel .empty-message {
  opacity: 0.7;
  font-style: italic;
}

/* ======================================================
   BARRES ABCD ACTIVES — Style coordonné
====================================================== */
:root[data-theme="dark-elegant"] .abcd-segment.seg-A.seg-active {
  background: rgba(96, 165, 250, 0.7) !important;
}

:root[data-theme="dark-elegant"] .abcd-segment.seg-B.seg-active {
  background: rgba(74, 222, 128, 0.7) !important;
}

:root[data-theme="dark-elegant"] .abcd-segment.seg-C.seg-active {
  background: rgba(251, 191, 36, 0.7) !important;
}

:root[data-theme="dark-elegant"] .abcd-segment.seg-D.seg-active {
  background: rgba(248, 113, 113, 0.7) !important;
}