/* ────────────────────────────────────────────────────────────────────
   Entreprendre.Blog — Design tokens
   Source unique de vérité pour les 3 surfaces : Next.js, Parcours Nour,
   Dashboard Nour, Articles Ghost.

   Inclusion :
     - Parcours Nour : <link rel="stylesheet" href="/nour/v9/static/tokens.css">
       AVANT parcours_v9.css et dashboard_v2.css
     - Next.js : @import "../../shared/tokens.css"; en tête de globals.css
     - Articles Ghost : code injection footer

   Théme :
     - Dark = défaut (sans attribut)
     - Light = body[data-theme="light"] (Nour) OU html.light (Next.js)

   ──────────────────────────────────────────────────────────────────── */

:root {
  /* ── Couleurs core ───────────────────────────────────────────────── */
  --eb-gold:        #C9A84C;
  --eb-gold-light:  #E8C97A;
  --eb-gold-soft:   #D4B66B;     /* compat */
  --eb-black:       #0A0A0A;
  --eb-dark:        #111111;
  --eb-dark-2:      #1A1A1A;
  --eb-dark-3:      #222222;
  --eb-white:       #FFFFFF;
  --eb-grey:        #888888;
  --eb-grey-light:  #CCCCCC;
  --eb-success:     #1d9e75;
  --eb-danger:      #ef4444;
  --eb-violet:      #6366F1;     /* plan Standard */

  /* ── Sémantique dark mode (défaut) ───────────────────────────────── */
  --bg:           var(--eb-black);
  --bg-card:      var(--eb-dark-2);
  --bg-card-2:    var(--eb-dark-3);
  --bg-elevated:  var(--eb-dark-2);
  --text:         var(--eb-white);
  --text-muted:   var(--eb-grey-light);
  --text-dim:     var(--eb-grey);
  --accent:       var(--eb-gold);
  --accent-2:     var(--eb-success);
  --border:       rgba(255, 255, 255, 0.08);
  --danger:       var(--eb-danger);

  /* ── Aliases pour compat dashboard_v2 (--dv2-*) ──────────────────── */
  --dv2-bg:           var(--bg);
  --dv2-bg-elev:      var(--eb-dark);
  --dv2-bg-card:      var(--bg-card);
  --dv2-border:       var(--border);
  --dv2-border-strong: rgba(255, 255, 255, 0.18);
  --dv2-text:         var(--text);
  --dv2-text-dim:     var(--text-muted);
  --dv2-text-soft:    var(--text-dim);
  --dv2-gold:         var(--eb-gold);
  --dv2-gold-soft:    var(--eb-gold-soft);
  --dv2-danger:       var(--danger);
  --dv2-ok:           var(--eb-success);
  --dv2-standard:     var(--eb-violet);
  --dv2-expert:       #b347ff;

  /* ── Typography ──────────────────────────────────────────────────── */
  --font-sans:       'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-size-base:  16px;
  --font-size-sm:    14px;
  --font-size-lg:    18px;
  --font-size-xl:    24px;
  --font-size-2xl:   32px;
  --font-size-3xl:   48px;

  /* ── Spacing ─────────────────────────────────────────────────────── */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-6: 24px;
  --space-8: 32px;

  /* ── Radius ──────────────────────────────────────────────────────── */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;

  /* ── Layout ──────────────────────────────────────────────────────── */
  --stepper-h: 48px;
  --header-h:  56px;

  /* ── Transitions ─────────────────────────────────────────────────── */
  --t-fast:    150ms;
  --t-medium:  250ms;
  --t-slow:    400ms;
}

/* ── Light mode — supporte les 2 mécaniques ────────────────────────── */
[data-theme="light"],
html.light {
  --bg:           #F5F5F0;
  --bg-card:      #FFFFFF;
  --bg-card-2:    #F0F0EB;
  --bg-elevated:  #FFFFFF;
  --text:         #111111;
  --text-muted:   #555555;
  --text-dim:     #888888;
  --border:       rgba(0, 0, 0, 0.08);
  /* Gold légèrement assombri pour contraste sur fond clair */
  --accent:       #B8923A;

  /* Re-pointer les alias dashboard_v2 aussi */
  --dv2-bg:        var(--bg);
  --dv2-bg-elev:   #FAFAF5;
  --dv2-bg-card:   var(--bg-card);
  --dv2-border:    var(--border);
  --dv2-border-strong: rgba(0, 0, 0, 0.18);
  --dv2-text:      var(--text);
  --dv2-text-dim:  var(--text-muted);
  --dv2-text-soft: var(--text-dim);
  --dv2-gold:      var(--accent);
}