/* ==========================================================================
   PNS THEMES — 5 modern presets applied via html[data-apptheme="N"].
   Higher specificity than page :root defaults; works in light + dark.
   Fonts are applied by global-settings.js via --font-main/--font-heading.
   ========================================================================== */

/* ---------- Theme 1 : PNS Bleu (default) ---------- */
:root[data-apptheme="1"] {
  --primary: #2563eb;
  --primary-hover: #1d4ed8;
  --primary-dark: #1d4ed8;
  --primary-light: rgba(37, 99, 235, 0.09);
  --purple: #2563eb;
  --purple-dark: #1d4ed8;
  --purple-light: rgba(37, 99, 235, 0.09);
  --accent-2: #06b6d4;
  --bg-app: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
  --bg-card: rgba(255, 255, 255, 0.88);
  --bg-input: #ffffff;
  --text-main: #0f172a;
  --text-primary: #0f172a;
  --text-secondary: #475569;
  --text-muted: #64748b;
  --ink: #0f172a;
  --muted: #64748b;
  --border-color: rgba(148, 163, 184, 0.28);
  --line: rgba(148, 163, 184, 0.28);
}
:root[data-theme="dark"][data-apptheme="1"] {
  --bg-app: linear-gradient(135deg, #090d16 0%, #0f172a 100%);
  --bg-card: rgba(22, 28, 45, 0.9);
  --bg-input: rgba(15, 23, 42, 0.9);
  --text-main: #f8fafc;
  --text-primary: #f8fafc;
  --text-secondary: #94a3b8;
  --text-muted: #94a3b8;
  --ink: #f8fafc;
  --muted: #94a3b8;
  --border-color: rgba(148, 163, 184, 0.18);
  --line: rgba(148, 163, 184, 0.18);
}

/* ---------- Theme 2 : Émeraude ---------- */
:root[data-apptheme="2"] {
  --primary: #059669;
  --primary-hover: #047857;
  --primary-dark: #047857;
  --primary-light: rgba(5, 150, 105, 0.10);
  --purple: #059669;
  --purple-dark: #047857;
  --purple-light: rgba(5, 150, 105, 0.10);
  --accent-2: #10b981;
  --bg-app: linear-gradient(135deg, #ecfdf5 0%, #d1fae5 100%);
  --bg-card: rgba(255, 255, 255, 0.9);
  --bg-input: #ffffff;
  --text-main: #064e3b;
  --text-primary: #064e3b;
  --text-secondary: #4d7c6c;
  --text-muted: #6b9a8a;
  --ink: #064e3b;
  --muted: #6b9a8a;
  --border-color: rgba(16, 185, 129, 0.28);
  --line: rgba(16, 185, 129, 0.28);
}
:root[data-theme="dark"][data-apptheme="2"] {
  --bg-app: linear-gradient(135deg, #022c22 0%, #064e3b 130%);
  --bg-card: rgba(6, 40, 30, 0.92);
  --bg-input: rgba(4, 28, 22, 0.9);
  --text-main: #ecfdf5;
  --text-primary: #ecfdf5;
  --text-secondary: #a7d8c5;
  --text-muted: #8cc0ad;
  --ink: #ecfdf5;
  --muted: #8cc0ad;
  --border-color: rgba(16, 185, 129, 0.25);
  --line: rgba(16, 185, 129, 0.25);
}

/* ---------- Theme 3 : Violet Royal ---------- */
:root[data-apptheme="3"] {
  --primary: #7c3aed;
  --primary-hover: #6d28d9;
  --primary-dark: #6d28d9;
  --primary-light: rgba(124, 58, 237, 0.10);
  --purple: #7c3aed;
  --purple-dark: #6d28d9;
  --purple-light: rgba(124, 58, 237, 0.10);
  --accent-2: #a78bfa;
  --bg-app: linear-gradient(135deg, #f5f3ff 0%, #ede9fe 100%);
  --bg-card: rgba(255, 255, 255, 0.9);
  --bg-input: #ffffff;
  --text-main: #2e1065;
  --text-primary: #2e1065;
  --text-secondary: #6d6390;
  --text-muted: #8b83a8;
  --ink: #2e1065;
  --muted: #8b83a8;
  --border-color: rgba(139, 92, 246, 0.28);
  --line: rgba(139, 92, 246, 0.28);
}
:root[data-theme="dark"][data-apptheme="3"] {
  --bg-app: linear-gradient(135deg, #150826 0%, #2e1065 130%);
  --bg-card: rgba(30, 16, 60, 0.92);
  --bg-input: rgba(20, 10, 42, 0.9);
  --text-main: #f5f3ff;
  --text-primary: #f5f3ff;
  --text-secondary: #c4b5fd;
  --text-muted: #a78bfa;
  --ink: #f5f3ff;
  --muted: #a78bfa;
  --border-color: rgba(139, 92, 246, 0.28);
  --line: rgba(139, 92, 246, 0.28);
}

/* ---------- Theme 4 : Braise Sunset ---------- */
:root[data-apptheme="4"] {
  --primary: #ea580c;
  --primary-hover: #c2410c;
  --primary-dark: #c2410c;
  --primary-light: rgba(234, 88, 12, 0.10);
  --purple: #ea580c;
  --purple-dark: #c2410c;
  --purple-light: rgba(234, 88, 12, 0.10);
  --accent-2: #f59e0b;
  --bg-app: linear-gradient(135deg, #fff7ed 0%, #ffedd5 100%);
  --bg-card: rgba(255, 255, 255, 0.9);
  --bg-input: #ffffff;
  --text-main: #431407;
  --text-primary: #431407;
  --text-secondary: #7c5a48;
  --text-muted: #a08068;
  --ink: #431407;
  --muted: #a08068;
  --border-color: rgba(234, 88, 12, 0.25);
  --line: rgba(234, 88, 12, 0.25);
}
:root[data-theme="dark"][data-apptheme="4"] {
  --bg-app: linear-gradient(135deg, #1c0a02 0%, #431407 130%);
  --bg-card: rgba(45, 20, 7, 0.92);
  --bg-input: rgba(30, 13, 4, 0.9);
  --text-main: #fff7ed;
  --text-primary: #fff7ed;
  --text-secondary: #fdba74;
  --text-muted: #ea9a5c;
  --ink: #fff7ed;
  --muted: #ea9a5c;
  --border-color: rgba(234, 88, 12, 0.30);
  --line: rgba(234, 88, 12, 0.30);
}

/* ---------- Theme 5 : Arctique ---------- */
:root[data-apptheme="5"] {
  --primary: #0891b2;
  --primary-hover: #0e7490;
  --primary-dark: #0e7490;
  --primary-light: rgba(8, 145, 178, 0.10);
  --purple: #0891b2;
  --purple-dark: #0e7490;
  --purple-light: rgba(8, 145, 178, 0.10);
  --accent-2: #22d3ee;
  --bg-app: linear-gradient(135deg, #ecfeff 0%, #cffafe 100%);
  --bg-card: rgba(255, 255, 255, 0.9);
  --bg-input: #ffffff;
  --text-main: #164e63;
  --text-primary: #164e63;
  --text-secondary: #4d7e8f;
  --text-muted: #6b9aa9;
  --ink: #164e63;
  --muted: #6b9aa9;
  --border-color: rgba(6, 182, 212, 0.28);
  --line: rgba(6, 182, 212, 0.28);
}
:root[data-theme="dark"][data-apptheme="5"] {
  --bg-app: linear-gradient(135deg, #04141a 0%, #164e63 130%);
  --bg-card: rgba(8, 35, 45, 0.92);
  --bg-input: rgba(5, 24, 31, 0.9);
  --text-main: #ecfeff;
  --text-primary: #ecfeff;
  --text-secondary: #a5d8e5;
  --text-muted: #7cc0d4;
  --ink: #ecfeff;
  --muted: #7cc0d4;
  --border-color: rgba(6, 182, 212, 0.28);
  --line: rgba(6, 182, 212, 0.28);
}