/* ─────────────────────────────────────────────────────────────────────────────
   THÈME PARTAGÉ VULKAN — tokens de marque + moteur clair/sombre.
   Extrait des pages où ce bloc était dupliqué à l'identique (30 pages) : une seule
   source de vérité, chargée AVANT le <style> inline de chaque page pour que
   d'éventuelles surcharges locales gardent la priorité. Les pages dont le bloc
   différait (business, funnel, index, mon-entrainement...) gardent leur version
   inline — à migrer ici au cas par cas si on veut aller au bout.
   ───────────────────────────────────────────────────────────────────────────── */
:root{
    --true-black:#000000;
    --black:#070606;
    --ink:#0C0A0A;
    --stone-deep:#120F0F;
    --stone:#1A1616;
    --stone-mid:#221C1C;
    --stone-light:#2D2424;
    --charcoal:#392E2E;

    --red-ember:#B5293C;
    --red:#7E1D2B;
    --red-blood:#5E1622;
    --red-dark:#3C0E15;
    --red-vein:#240810;
    --divider:rgba(126,29,43,0.35);
    --tint:rgba(94,22,34,0.6);

    --gold:#C7A24A;
    --gold-light:#E4C36A;
    --gold-bright:#F2D584;
    --gold-muted:#5E4715;

    --steel:#9A9CA1;
    --steel-light:#C6C8CD;

    --n-700:#4A4242;
    --n-600:#5C5353;
    --n-500:#756B6B;
    --n-400:#948A8A;
    --n-300:#B4ABAB;
    --n-200:#D2CBCB;
    --n-100:#ECE7E7;

    --white:#F4F1EC;
    --pure-white:#FFFFFF;

    --font-display:'Cinzel', Georgia, serif;
    --font-condensed:'Barlow Condensed', Impact, sans-serif;
    --font-body:'Barlow', -apple-system, BlinkMacSystemFont, sans-serif;

    --max-w:1180px;
    --radius-sm:2px;
    --radius-md:4px;
    --radius-pill:9999px;

    --shadow-md:0 4px 16px rgba(0,0,0,0.5);
    --shadow-lg:0 8px 32px rgba(0,0,0,0.6);
    --shadow-red-md:0 0 24px rgba(126,29,43,0.35);
    --transition:250ms ease;
  }

  /* ═════════════════════ THEME ENGINE — clair / sombre ═════════════════════
     Le sombre reste la valeur par défaut de :root (identité de marque, inchangée).
     Le clair redéfinit les MÊMES variables (fonds, textes neutres) — tout le CSS
     existant qui utilise var(--stone), var(--white), var(--n-500)... continue de
     marcher sans modification. Les couleurs de marque (--red*, --gold*) ne bougent
     JAMAIS : ce sont elles qui gardent la DA reconnaissable dans les deux thèmes.
     --on-accent / --on-accent-dark sont deux constantes qui NE changent JAMAIS de
     valeur : elles servent uniquement au texte posé sur une surface de marque à
     couleur fixe (ex. bouton bordeaux, pastille or) qui ne doit jamais s'inverser. */
  :root{
    --on-accent:#F4F1EC;
    --gray:var(--n-400);
    --on-accent-dark:#1A1616;
    --theme-transition:background-color 320ms cubic-bezier(0.16,1,0.3,1), border-color 320ms cubic-bezier(0.16,1,0.3,1), color 320ms cubic-bezier(0.16,1,0.3,1), box-shadow 320ms cubic-bezier(0.16,1,0.3,1);
    /* teintes de fond "en creux" (sections, encarts sunken) — pensées pour le sombre (voile
       noir sur texture déjà sombre) ; redéfinies en clair juste en dessous pour rester un
       voile chaud très léger au lieu d'un gris terne plaqué sur un fond clair. */
    --section-tint:rgba(0,0,0,0.45);
    --panel-tint:rgba(0,0,0,0.25);
    --panel-tint-sm:rgba(0,0,0,0.2);
  }
  @media (prefers-color-scheme: light){
    html:not([data-theme="dark"]){
      --true-black:#EFEAE2; --black:#EFEAE2; --ink:#E7E0D3;
      --stone-deep:#EFE7D6; --stone:#F5F0E4; --stone-mid:#FEFCF8; --stone-light:#D8CCB4; --charcoal:#C7B99C;
      --n-700:#C9BFB0; --n-600:#A79C8C; --n-500:#8A807C; --n-400:#635B56; --n-300:#4A4342; --n-200:#2B2624; --n-100:#171313;
      --white:#171313; --pure-white:#000000;
      --divider:rgba(23,19,19,0.18); --tint:rgba(126,29,43,0.08);
      --section-tint:rgba(23,19,19,0.05); --panel-tint:rgba(23,19,19,0.07); --panel-tint-sm:rgba(23,19,19,0.055);
      --shadow-md:0 3px 14px rgba(60,14,21,0.10); --shadow-lg:0 12px 34px rgba(60,14,21,0.14); --shadow-red-md:0 0 24px rgba(126,29,43,0.16);
      --gold:#7E1D2B; --gold-light:#5E1622; --gold-bright:#3C0E15; --gold-muted:#D8CCB4;
    }
  }
  html[data-theme="light"]{
    --true-black:#EFEAE2; --black:#EFEAE2; --ink:#E7E0D3;
    --stone-deep:#EFE7D6; --stone:#F5F0E4; --stone-mid:#FEFCF8; --stone-light:#D8CCB4; --charcoal:#C7B99C;
    --n-700:#C9BFB0; --n-600:#A79C8C; --n-500:#8A807C; --n-400:#635B56; --n-300:#4A4342; --n-200:#2B2624; --n-100:#171313;
    --white:#171313; --pure-white:#000000;
    --divider:rgba(23,19,19,0.18); --tint:rgba(126,29,43,0.08);
    --section-tint:rgba(23,19,19,0.05); --panel-tint:rgba(23,19,19,0.07); --panel-tint-sm:rgba(23,19,19,0.055);
    --shadow-md:0 3px 14px rgba(60,14,21,0.10); --shadow-lg:0 12px 34px rgba(60,14,21,0.14); --shadow-red-md:0 0 24px rgba(126,29,43,0.16);
    --gold:#7E1D2B; --gold-light:#5E1622; --gold-bright:#3C0E15; --gold-muted:#D8CCB4;
  }
  /* transition douce (fondu) au changement de thème, plutôt qu'un flash brutal */
  html, body, .dash-card, .btn, input, select, textarea, .exercise-block, .log-row, nav.wrap{
    transition:var(--theme-transition);
  }
  /* canevas de fond : la texture "béton sombre" est spécifique au thème sombre ;
     en clair on garde un fond papier propre avec juste un souffle bordeaux en haut. */
  @media (prefers-color-scheme: light){
    html:not([data-theme="dark"]) body{
      background-image:radial-gradient(ellipse 80% 45% at 50% 0%, rgba(126,29,43,0.06), transparent 60%);
    }
    html:not([data-theme="dark"]) body::after{ background:none; }
  }
  html[data-theme="light"] body{
    background-image:radial-gradient(ellipse 80% 45% at 50% 0%, rgba(126,29,43,0.06), transparent 60%);
  }
  html[data-theme="light"] body::after{ background:none; }

  /* boutons / pastilles à couleur de marque FIXE : leur texte ne doit jamais suivre
     l'inversion de --white (sinon texte sombre sur fond bordeaux/or = illisible). */
  .btn-primary, .auth-tab.active, .proof-nav{ color:var(--on-accent); }

  /* ───────── bouton toggle de thème (injecté par assets/theme.js dans le menu) ───────── */
  .vk-theme-toggle-btn{
    background:none;border:1px solid var(--stone-light);color:var(--gold-light);
    border-radius:9999px;width:34px;height:34px;font-size:15px;line-height:1;cursor:pointer;
    display:inline-flex;align-items:center;justify-content:center;margin-right:10px;
    transition:var(--theme-transition), transform 200ms ease;
  }
  .vk-theme-toggle-btn:hover{border-color:var(--gold);transform:scale(1.08);}
  .vk-theme-toggle-btn:active{transform:scale(0.92);}