/* =========================================================================
   Notre Budget — banque de thèmes
   -------------------------------------------------------------------------
   Un thème n'est QU'un jeu de variables CSS. Aucune règle de mise en page ici :
   le même HTML rend les 8 thèmes. On applique un thème avec

       document.documentElement.dataset.theme = 'aurore';

   et on le mémorise dans localStorage (clé « theme »).

   Contrat de variables — tout thème DOIT définir les 22 suivantes.
   Les noms reprennent ceux déjà utilisés par assets/app.css, pour que
   l'app existante bascule sans réécriture (voir PASSATION.md § Thèmes).

     Surfaces   --bg --bg2 --card --card2 --line
     Textes     --txt --muted
     Accents    --mint (positif) --teal (secondaire) --gold (attention)
                --rose (alerte)  --violet (perso)
     Sur accent --on-mint --on-gold --on-violet   (texte posé sur un aplat)
     Dégradés   --grad-mint --grad-sun --grad-violet
     Forme      --radius --shadow --font

   Réglage transverse : --pulse (0 = pas d'animation décorative, 1 = normal).
   Les thèmes calmes le mettent à 0 — utile les jours de surcharge.
   ========================================================================= */

/* ---------- 1 · NUIT — le thème actuel, bleu nuit et menthe ---------- */
:root,
[data-theme="nuit"] {
  --bg: #0d1220;  --bg2: #121a2e;  --card: #171f36;  --card2: #1d2745;
  --line: rgba(255,255,255,.07);
  --txt: #eef2ff;  --muted: #8b93b0;
  --mint: #34d399; --teal: #22d3ee; --gold: #fbbf24; --rose: #fb7185; --violet: #a78bfa;
  --on-mint: #06281c; --on-gold: #3d1408; --on-violet: #10102a;
  --grad-mint: linear-gradient(135deg, #34d399, #22d3ee);
  --grad-sun: linear-gradient(135deg, #fbbf24, #fb7185);
  --grad-violet: linear-gradient(135deg, #a78bfa, #22d3ee);
  --radius: 18px;
  --shadow: 0 8px 24px rgba(0,0,0,.25);
  --font: 'Segoe UI', system-ui, -apple-system, sans-serif;
  --page: radial-gradient(1200px 500px at 50% -10%, #1b2a52 0%, var(--bg) 55%);
  --pulse: 1;
}

/* ---------- 2 · AURORE — clair et chaud, crème et terracotta ---------- */
[data-theme="aurore"] {
  --bg: #fdf6ef;  --bg2: #f7ece1;  --card: #ffffff;  --card2: #fffaf4;
  --line: rgba(120,80,50,.13);
  --txt: #3b2b21;  --muted: #97836f;
  --mint: #0f9d76; --teal: #2a9db4; --gold: #e08c1f; --rose: #dc5a5a; --violet: #8a6bd1;
  --on-mint: #ffffff; --on-gold: #3b2b21; --on-violet: #ffffff;
  --grad-mint: linear-gradient(135deg, #14b48a, #2a9db4);
  --grad-sun: linear-gradient(135deg, #f0a53a, #dc5a5a);
  --grad-violet: linear-gradient(135deg, #9b7ce0, #2a9db4);
  --radius: 20px;
  --shadow: 0 6px 20px rgba(150,110,70,.14);
  --font: 'Segoe UI', system-ui, -apple-system, sans-serif;
  --page: radial-gradient(1100px 480px at 50% -10%, #ffe9d2 0%, var(--bg) 60%);
  --pulse: 1;
}

/* ---------- 3 · NÉON — noir profond, cyan et magenta. Contraste maximal ---------- */
[data-theme="neon"] {
  --bg: #05060a;  --bg2: #0b0d16;  --card: #101322;  --card2: #161a2e;
  --line: rgba(0,255,240,.16);
  --txt: #f2f6ff;  --muted: #7d86a8;
  --mint: #00f5c4; --teal: #22ddff; --gold: #ffd23f; --rose: #ff4d8d; --violet: #b06bff;
  --on-mint: #00201a; --on-gold: #2b1a00; --on-violet: #14001f;
  --grad-mint: linear-gradient(135deg, #00f5c4, #22ddff);
  --grad-sun: linear-gradient(135deg, #ffd23f, #ff4d8d);
  --grad-violet: linear-gradient(135deg, #b06bff, #22ddff);
  --radius: 14px;
  --shadow: 0 0 26px rgba(0,245,196,.16);
  --font: 'Segoe UI', system-ui, -apple-system, sans-serif;
  --page: radial-gradient(900px 460px at 50% -12%, #10233d 0%, var(--bg) 60%);
  --pulse: 1;
}

/* ---------- 4 · FORÊT — vert profond et or, calme ---------- */
[data-theme="foret"] {
  --bg: #0c1613;  --bg2: #10201b;  --card: #152a23;  --card2: #1b352c;
  --line: rgba(200,255,225,.08);
  --txt: #eaf5ee;  --muted: #86a396;
  --mint: #5fd39a; --teal: #4fc4c0; --gold: #e2b352; --rose: #e57a72; --violet: #a596e0;
  --on-mint: #052018; --on-gold: #2c1f06; --on-violet: #14112b;
  --grad-mint: linear-gradient(135deg, #5fd39a, #4fc4c0);
  --grad-sun: linear-gradient(135deg, #e2b352, #e57a72);
  --grad-violet: linear-gradient(135deg, #a596e0, #4fc4c0);
  --radius: 16px;
  --shadow: 0 8px 22px rgba(0,0,0,.3);
  --font: 'Segoe UI', system-ui, -apple-system, sans-serif;
  --page: radial-gradient(1000px 460px at 50% -10%, #1b3a2c 0%, var(--bg) 58%);
  --pulse: 1;
}

/* ---------- 5 · PAPIER — clair, sobre, un seul accent. Faible stimulation ---------- */
[data-theme="papier"] {
  --bg: #f6f7f9;  --bg2: #eef0f4;  --card: #ffffff;  --card2: #fbfcfd;
  --line: rgba(20,30,50,.12);
  --txt: #1c2333;  --muted: #71798c;
  --mint: #2f6fed; --teal: #4a8bd8; --gold: #b8860b; --rose: #c8483f; --violet: #5a5f9c;
  --on-mint: #ffffff; --on-gold: #ffffff; --on-violet: #ffffff;
  --grad-mint: linear-gradient(135deg, #2f6fed, #4a8bd8);
  --grad-sun: linear-gradient(135deg, #b8860b, #c8483f);
  --grad-violet: linear-gradient(135deg, #5a5f9c, #4a8bd8);
  --radius: 8px;
  --shadow: 0 1px 3px rgba(20,30,50,.1);
  --font: 'Segoe UI', system-ui, -apple-system, sans-serif;
  --page: var(--bg);
  --pulse: 0;                    /* aucune animation décorative : c'est le but du thème */
}

/* ---------- 6 · BONBON — pastel, rond, ludique ---------- */
[data-theme="bonbon"] {
  --bg: #fdf3fb;  --bg2: #f8e9fa;  --card: #ffffff;  --card2: #fef7ff;
  --line: rgba(150,90,160,.14);
  --txt: #3d2942;  --muted: #9b7fa6;
  --mint: #29b89a; --teal: #4bb8d8; --gold: #e8a33c; --rose: #ec5f9a; --violet: #9b6be8;
  --on-mint: #ffffff; --on-gold: #3d2942; --on-violet: #ffffff;
  --grad-mint: linear-gradient(135deg, #38ceac, #4bb8d8);
  --grad-sun: linear-gradient(135deg, #f7b955, #ec5f9a);
  --grad-violet: linear-gradient(135deg, #b183f5, #4bb8d8);
  --radius: 26px;
  --shadow: 0 8px 22px rgba(190,120,200,.18);
  --font: 'Segoe UI', system-ui, -apple-system, sans-serif;
  --page: radial-gradient(1000px 460px at 50% -10%, #ffe4f7 0%, var(--bg) 60%);
  --pulse: 1;
}

/* ---------- 7 · CONTRASTE — noir, blanc, jaune. Lisibilité avant tout ---------- */
[data-theme="contraste"] {
  --bg: #000000;  --bg2: #0a0a0a;  --card: #131313;  --card2: #1c1c1c;
  --line: rgba(255,255,255,.3);
  --txt: #ffffff;  --muted: #c9c9c9;
  --mint: #ffe600; --teal: #00e5ff; --gold: #ffa000; --rose: #ff5252; --violet: #d0a2ff;
  --on-mint: #000000; --on-gold: #000000; --on-violet: #000000;
  --grad-mint: linear-gradient(135deg, #ffe600, #ffa000);
  --grad-sun: linear-gradient(135deg, #ffa000, #ff5252);
  --grad-violet: linear-gradient(135deg, #d0a2ff, #00e5ff);
  --radius: 6px;
  --shadow: none;
  --font: 'Segoe UI', system-ui, -apple-system, sans-serif;
  --page: var(--bg);
  --pulse: 0;
}

/* ---------- 8 · OCÉAN — bleu profond et corail ---------- */
[data-theme="ocean"] {
  --bg: #07182b;  --bg2: #0b2138;  --card: #102b45;  --card2: #143552;
  --line: rgba(180,225,255,.09);
  --txt: #e8f4ff;  --muted: #85a2bd;
  --mint: #3ecfb2; --teal: #45b6f0; --gold: #ffc46b; --rose: #ff7a6b; --violet: #8fb2ff;
  --on-mint: #03231d; --on-gold: #33230a; --on-violet: #0a1730;
  --grad-mint: linear-gradient(135deg, #3ecfb2, #45b6f0);
  --grad-sun: linear-gradient(135deg, #ffc46b, #ff7a6b);
  --grad-violet: linear-gradient(135deg, #8fb2ff, #45b6f0);
  --radius: 18px;
  --shadow: 0 8px 24px rgba(0,12,26,.4);
  --font: 'Segoe UI', system-ui, -apple-system, sans-serif;
  --page: radial-gradient(1200px 520px at 50% -10%, #14456e 0%, var(--bg) 58%);
  --pulse: 1;
}