/*
 * SENEGO DESIGN SYSTEM — TOKENS (source unique de vérité)
 * =======================================================
 * Toutes les valeurs de design du thème (couleurs, typo, espacements, rayons,
 * ombres) sont définies ICI, et NULLE PART AILLEURS. Changer une valeur ici la
 * propage à tout le site, les plugins et l'éditeur de blocs.
 *
 * RÈGLE : pour tout NOUVEAU développement (plugin, bloc, carte, formulaire…),
 * utiliser exclusivement les variables `--senego-*` ci-dessous.
 *
 * Le bloc « ALIAS » en bas re-mappe les anciens noms de variables (issus de
 * core.css, header.css, account.css) vers ces tokens, AUX VALEURS IDENTIQUES,
 * pour que tout le CSS existant continue de fonctionner sans le moindre
 * changement visuel pendant la migration progressive.
 *
 * Ce fichier doit être chargé EN PREMIER (avant core.css, header.css, plugins).
 */

:root {

  /* ════════════════════════ COULEURS ════════════════════════ */
  /* Marque */
  --senego-color-primary:        #ff9900;   /* orange Senego */
  --senego-color-primary-dark:   #e68a00;   /* hover/actif */
  --senego-color-accent:         #e63900;   /* rouge d'accent (alertes éditoriales, liens forts) */

  /* Texte */
  --senego-color-text:           #1a1a1a;   /* texte principal des composants */
  --senego-color-heading:        #16181c;   /* titres */
  --senego-color-muted:          #6b7280;   /* texte secondaire */
  --senego-color-meta:           #666666;   /* méta : date, catégorie, auteur */

  /* Surfaces & fonds */
  --senego-color-bg:             #f2f3ef;   /* fond de page */
  --senego-color-surface:        #ffffff;   /* cartes, encarts, surfaces */
  --senego-color-surface-subtle: #fafafa;   /* fond doux (zones secondaires) */

  /* Bordures */
  --senego-color-border:         #e0e0e0;   /* bordure standard */
  --senego-color-border-line:    #ececec;   /* séparateurs (header, compte) */
  --senego-color-border-soft:    #eceef1;   /* bordure discrète (cartes) */
  --senego-color-border-strong:  #d8d8d8;   /* bordure marquée */
  --senego-color-border-focus:   #aaaaaa;   /* bordure au focus clavier */
  --senego-color-surface-muted:  #f8f9fa;   /* fond neutre (lignes survolées) */

  /* Premium */
  --senego-color-premium-bg:     #fff7e6;   /* fond des blocs premium */
  --senego-color-premium:        #c98a17;   /* doré premium */

  /* États sémantiques (succès / erreur / avertissement / info) */
  --senego-color-success:        #16a34a;   --senego-color-success-bg: #ecfdf3;
  --senego-color-error:          #dc2626;   --senego-color-error-bg:   #fef2f2;
  --senego-color-warning:        #f59e0b;   --senego-color-warning-bg: #fffbeb;
  --senego-color-info:           #2563eb;   --senego-color-info-bg:    #eff6ff;

  /* Barre supérieure (topbar noire) */
  --senego-color-topbar-bg:      #000000;
  --senego-color-topbar-text:    #ffffff;

  /* ════════════════════════ TYPOGRAPHIE ════════════════════════ */
  --senego-font-base:    'Source Sans 3', system-ui, -apple-system, sans-serif;
  /* Titres : Public Sans (self-hosted), repli sur Source Sans 3 — choix 2026-05-31. */
  --senego-font-heading: 'Public Sans', 'Source Sans 3', system-ui, -apple-system, sans-serif;

  /* Échelle de tailles de texte */
  --senego-text-xs:   0.75rem;   /* 12px */
  --senego-text-sm:   0.875rem;  /* 14px */
  --senego-text-base: 1rem;      /* 16px — corps */
  --senego-text-md:   1.125rem;  /* 18px */
  --senego-text-lg:   1.25rem;   /* 20px */
  --senego-text-xl:   1.5rem;    /* 24px */
  --senego-text-2xl:  1.875rem;  /* 30px */

  /* Tailles des titres (alignées sur l'existant h1–h6) */
  --senego-h1: 2.5rem;
  --senego-h2: 2rem;
  --senego-h3: 1.75rem;
  --senego-h4: 1.5rem;
  --senego-h5: 1.25rem;
  --senego-h6: 1rem;

  /* Graisses & interlignes */
  --senego-weight-normal:   400;
  --senego-weight-medium:   500;
  --senego-weight-semibold: 600;
  --senego-weight-bold:     700;
  --senego-leading-tight: 1.3;   /* titres */
  --senego-leading-base:  1.7;   /* corps */

  /* ════════════════════════ ESPACEMENTS ════════════════════════ */
  --senego-space-xs:  4px;
  --senego-space-sm:  8px;
  --senego-space-md:  16px;
  --senego-space-lg:  24px;
  --senego-space-xl:  32px;
  --senego-space-2xl: 48px;
  --senego-card-gap:  16px;   /* écart vertical unique entre cartes/blocs */

  /* ════════════════════════ RAYONS ════════════════════════ */
  --senego-radius-xs:   6px;   /* badges, petites puces */
  --senego-radius-sm:   8px;   /* cartes, boutons, champs */
  --senego-radius-md:   10px;
  --senego-radius-lg:   12px;  /* grandes surfaces */
  --senego-radius-pill: 50px;  /* pilules, boutons arrondis */

  /* ════════════════════════ OMBRES ════════════════════════ */
  --senego-shadow-sm: 0 1px 2px rgba(16,24,40,.06);
  --senego-shadow-md: 0 1px 2px rgba(16,24,40,.06), 0 6px 16px rgba(16,24,40,.06);
  --senego-shadow-lg: 0 10px 28px rgba(16,24,40,.14);

  /* ════════════════════════ HAUTEURS DE GABARIT (header) ════════════════════════ */
  --senego-topbar-h:  34px;
  --senego-mainbar-h: 84px;
  --senego-navbar-h:  44px;
  --senego-compact-h: 56px;

  /* ════════════════════════ MOUVEMENT ════════════════════════ */
  --senego-ease:       cubic-bezier(.2,.7,.2,1);
  --senego-transition: 120ms;

  /* Cibles tactiles accessibles (≥ 44px recommandé) */
  --senego-tap-target: 44px;

  /* ════════════════════════ SPÉCIFIQUES MOBILE ════════════════════════ */
  /* Valeurs utilisées par les media queries mobile (cartes, espacements). */
  --senego-mobile-radius:  12px;
  --senego-mobile-gap:     12px;
  --senego-mobile-padding: 16px;
  /* Gouttière horizontale du contenu en mobile (le contenu ne touche jamais les
     bords de l'écran → les arrondis des cartes restent visibles). */
  --senego-mobile-gutter:  12px;
  --senego-shadow-card:        0 1px 3px rgba(0,0,0,.08);
  --senego-shadow-card-hover:  0 4px 12px rgba(0,0,0,.12);


  /* ╔══════════════════════════════════════════════════════════════════════╗
     ║  ALIAS RÉTRO-COMPATIBLES — NE PAS UTILISER POUR DU NOUVEAU CODE        ║
     ║  Anciens noms (core/header/account) → tokens, valeurs IDENTIQUES.      ║
     ║  Permet de supprimer les :root dupliqués sans rien casser.            ║
     ╚══════════════════════════════════════════════════════════════════════╝ */

  /* — core.css — */
  --color-text:          #000000;                       /* texte body historique (inchangé) */
  --color-meta:          var(--senego-color-meta);
  --color-background:    var(--senego-color-bg);
  --color-primary:       var(--senego-color-primary);
  --color-secondary:     var(--senego-color-primary-dark);
  --color-border:        var(--senego-color-border);
  --color-border-focus:  var(--senego-color-border-focus);
  --color-bg-alt:        var(--senego-color-surface);
  --color-bg-subtle:     var(--senego-color-surface-subtle);
  --color-top-bar-bg:    var(--senego-color-topbar-bg);
  --color-top-bar-text:  var(--senego-color-topbar-text);
  --color-main-nav-bg:   var(--senego-color-primary);
  --font-primary:        var(--senego-font-base);
  --font-headings:       var(--senego-font-heading);
  --spacing-unit:        1rem;
  --soft-accent:         var(--senego-color-accent);
  --soft-ink:            var(--senego-color-heading);
  --soft-muted:          var(--senego-color-muted);
  --soft-radius:         var(--senego-radius-sm);
  --soft-radius-sm:      var(--senego-radius-sm);
  --soft-shadow:         var(--senego-shadow-md);
  --soft-shadow-hover:   var(--senego-shadow-lg);
  --soft-surface:        var(--senego-color-surface);
  --soft-line:           var(--senego-color-border-soft);
  --card-gap:            var(--senego-card-gap);
  --mobile-radius:       var(--senego-mobile-radius);
  --mobile-gap:          var(--senego-mobile-gap);
  --mobile-padding:      var(--senego-mobile-padding);
  --card-shadow:         var(--senego-shadow-card);
  --card-shadow-hover:   var(--senego-shadow-card-hover);
  --mobile-font-body:    var(--senego-font-base);
  --mobile-font-heading: var(--senego-font-heading);

  /* — header.css — */
  --orange:        var(--senego-color-primary);
  --orange-dark:   var(--senego-color-primary-dark);
  --red:           var(--senego-color-accent);
  --ink:           var(--senego-color-text);
  --meta:          var(--senego-color-meta);
  --line:          var(--senego-color-border-line);
  --line-strong:   var(--senego-color-border-strong);
  --bg:            #ffffff;
  --bg-soft:       var(--senego-color-surface-subtle);
  --black:         #000000;
  --gold:          var(--senego-color-premium);
  --premium-bg:    var(--senego-color-premium-bg);
  --shadow-sm:     0 1px 0 rgba(0,0,0,.04);
  --shadow-md:     0 8px 24px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.04);
  --shadow-lg:     0 24px 60px rgba(0,0,0,.18), 0 6px 18px rgba(0,0,0,.08);
  --ease:          var(--senego-ease);
  --topbar-h:      var(--senego-topbar-h);
  --mainbar-h:     var(--senego-mainbar-h);
  --navbar-h:      var(--senego-navbar-h);
  --compact-h:     var(--senego-compact-h);

  /* — account.css (plugin) — */
  --primary:       var(--senego-color-primary);
  --primary-dark:  var(--senego-color-primary-dark);
  --accent-red:    var(--senego-color-accent);
  --gold-soft:     var(--senego-color-premium-bg);
  --gold-line:     #ead8ab;
  --ink-2:         #2d2d2d;
  --meta-2:        #8a8a8a;
  --line-2:        #f0f0f0;
  --bg-2:          var(--senego-color-surface-subtle);
  --bg-3:          var(--senego-color-surface-muted);
  --r-sm:          var(--senego-radius-sm);
  --r-md:          var(--senego-radius-md);
  --r-lg:          var(--senego-radius-lg);
  --shadow-1:      0 1px 2px rgba(20,20,20,.04);
  --shadow-2:      0 2px 8px rgba(20,20,20,.05);
  --shadow-3:      0 10px 30px rgba(20,20,20,.08);
  /* Espace compte unifié sur les polices du site — décision 2026-05-31.
     --ui = corps (Source Sans 3) ; --serif = display/titres (Public Sans). */
  --ui:            var(--senego-font-base);
  --serif:         var(--senego-font-heading);
}