/* ==========================================================================
   In Pulse - tokens.css
   Variables de design (couleurs, typographie, espacements, ombres, thèmes).
   Tout le style du projet consomme exclusivement ces variables.
   Thèmes : [data-theme="clair"] (défaut) et [data-theme="sombre"].
   ========================================================================== */

/* --------------------------------------------------------------------------
   1. Thème clair (défaut) - ivoire, encre bleu nuit, accent or discret
   -------------------------------------------------------------------------- */
:root,
[data-theme="clair"] {
  color-scheme: light;

  /* ----- Fonds & surfaces ----- */
  --couleur-fond: #FAF7F2;            /* ivoire - fond de page */
  --couleur-fond-2: #F3EEE4;          /* ivoire soutenu - sections alternées */
  --couleur-surface: #FFFFFF;         /* cartes, panneaux */
  --couleur-surface-2: #FDFBF7;       /* surface secondaire, en-têtes de tableau */

  /* ----- Encre & textes ----- */
  --couleur-encre: #1B2A41;           /* bleu nuit - titres, aplats forts */
  --couleur-texte: #1B2A41;           /* texte courant */
  --couleur-texte-secondaire: #51607A;/* texte d'appui (AA sur ivoire) */
  --couleur-texte-discret: #5E6C84;   /* légendes, mentions */
  --couleur-sur-encre: #FAF7F2;       /* texte posé sur un aplat encre */

  /* ----- Filets & bordures ----- */
  --couleur-filet: #E6DECF;           /* filet fin chaud */
  --couleur-filet-fort: #D5C9B2;      /* bordure plus marquée (champs, hover) */

  /* ----- Accent or ----- */
  --couleur-accent: #B08D3E;          /* or discret - décor, bordures, icônes */
  --couleur-accent-hover: #9A782F;    /* or assombri - survol */
  --couleur-accent-texte: #7E6020;    /* or lisible en texte (AA sur ivoire et voile or) */
  --couleur-accent-fond: #F4ECDA;     /* voile or très clair */
  --couleur-focus: #7E6020;           /* anneau de focus : ≥ 3:1 sur ivoire (l'or décoratif ne suffit pas) */
  --couleur-sur-accent: #1B2A41;      /* texte posé sur un aplat or */

  /* ----- États ----- */
  --couleur-succes: #2A7349;
  --couleur-succes-fond: #E6F1E9;
  --couleur-attention: #8A5D0D;
  --couleur-attention-fond: #F8EFDA;
  --couleur-danger: #B03A2E;
  --couleur-danger-fond: #F9E8E5;
  --couleur-info: #2C5F8A;
  --couleur-info-fond: #E5EEF6;

  /* ----- Profils dirigeant (diagnostic) ----- */
  --profil-pilote: #9D2C2C;           /* rouge profond - fonce, décide vite */
  --profil-pilote-fond: #F7E6E3;
  --profil-visionnaire: #8C6308;      /* jaune ocre - idées, réseau */
  --profil-visionnaire-fond: #F8EFD6;
  --profil-batisseur: #2F6B3C;        /* vert - métier, terrain */
  --profil-batisseur-fond: #E6F1E7;
  --profil-stratege: #2C5F8A;         /* bleu - analyse, process */
  --profil-stratege-fond: #E4EEF6;

  /* ----- Boutons (résolus par thème) ----- */
  --bouton-principal-fond: #1B2A41;
  --bouton-principal-texte: #FAF7F2;
  --bouton-principal-fond-hover: #2A3D5C;

  /* ----- Ombres (douces, teintées d'encre - jamais de blur de fond) ----- */
  --ombre-douce: 0 1px 2px rgba(27, 42, 65, 0.05), 0 4px 14px rgba(27, 42, 65, 0.06);
  --ombre-moyenne: 0 2px 4px rgba(27, 42, 65, 0.07), 0 10px 28px rgba(27, 42, 65, 0.09);
  --ombre-haute: 0 4px 10px rgba(27, 42, 65, 0.08), 0 20px 44px rgba(27, 42, 65, 0.13);
}

/* --------------------------------------------------------------------------
   2. Thème sombre - club privé feutré : bleu nuit profond, ivoire, or
   -------------------------------------------------------------------------- */
[data-theme="sombre"] {
  color-scheme: dark;

  /* ----- Fonds & surfaces ----- */
  --couleur-fond: #0E1828;            /* bleu nuit très sombre */
  --couleur-fond-2: #111E31;          /* sections alternées */
  --couleur-surface: #17273E;         /* cartes - légèrement plus claires que le fond */
  --couleur-surface-2: #1C2F4A;       /* surface secondaire */

  /* ----- Encre & textes ----- */
  --couleur-encre: #F2ECDF;           /* ivoire - titres */
  --couleur-texte: #EDE7D9;           /* texte courant ivoire */
  --couleur-texte-secondaire: #B4BECF;/* texte d'appui (AA sur fond nuit) */
  --couleur-texte-discret: #93A0B5;   /* légendes, mentions */
  --couleur-sur-encre: #0E1828;       /* texte posé sur un aplat ivoire */

  /* ----- Filets & bordures ----- */
  --couleur-filet: #27384F;
  --couleur-filet-fort: #364964;

  /* ----- Accent or (le même or, qui ressort dans la pénombre) ----- */
  --couleur-accent: #C9A256;
  --couleur-accent-hover: #DAB76E;
  --couleur-accent-texte: #D6B268;
  --couleur-accent-fond: rgba(201, 162, 86, 0.14);
  --couleur-focus: #C9A256;
  --couleur-sur-accent: #14202F;

  /* ----- États ----- */
  --couleur-succes: #74C28F;
  --couleur-succes-fond: rgba(116, 194, 143, 0.14);
  --couleur-attention: #DCAC52;
  --couleur-attention-fond: rgba(220, 172, 82, 0.14);
  --couleur-danger: #E27F72;
  --couleur-danger-fond: rgba(226, 127, 114, 0.14);
  --couleur-info: #84B7E0;
  --couleur-info-fond: rgba(132, 183, 224, 0.14);

  /* ----- Profils dirigeant (variantes lisibles sur fond nuit) ----- */
  --profil-pilote: #E0897E;
  --profil-pilote-fond: rgba(224, 137, 126, 0.16);
  --profil-visionnaire: #E0B45C;
  --profil-visionnaire-fond: rgba(224, 180, 92, 0.16);
  --profil-batisseur: #7CC494;
  --profil-batisseur-fond: rgba(124, 196, 148, 0.16);
  --profil-stratege: #82B6E0;
  --profil-stratege-fond: rgba(130, 182, 224, 0.16);

  /* ----- Boutons (le principal passe à l'or sur encre) ----- */
  --bouton-principal-fond: #C9A256;
  --bouton-principal-texte: #14202F;
  --bouton-principal-fond-hover: #DAB76E;

  /* ----- Ombres (plus profondes, feutrées) ----- */
  --ombre-douce: 0 1px 2px rgba(4, 9, 18, 0.35), 0 4px 14px rgba(4, 9, 18, 0.35);
  --ombre-moyenne: 0 2px 4px rgba(4, 9, 18, 0.40), 0 10px 28px rgba(4, 9, 18, 0.45);
  --ombre-haute: 0 4px 10px rgba(4, 9, 18, 0.45), 0 20px 44px rgba(4, 9, 18, 0.55);
}

/* --------------------------------------------------------------------------
   3. Tokens communs aux deux thèmes
   -------------------------------------------------------------------------- */
:root {
  /* ----- Typographie : familles ----- */
  --police-titre: "Fraunces", Georgia, "Times New Roman", serif;
  --police-texte: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;

  /* ----- Typographie : échelle de tailles ----- */
  --taille-xs: 0.75rem;     /* 12px - mentions, tags */
  --taille-sm: 0.875rem;    /* 14px - texte d'appui, badges */
  --taille-base: 1rem;      /* 16px - texte courant */
  --taille-md: 1.125rem;    /* 18px - chapeau, intro */
  --taille-lg: 1.375rem;    /* 22px - h4 / h3 compact */
  --taille-xl: 1.75rem;     /* 28px - h3 */
  --taille-2xl: 2.25rem;    /* 36px - h2 */
  --taille-3xl: 3rem;       /* 48px - h1 */
  --taille-4xl: 3.75rem;    /* 60px - hero vitrine */

  /* ----- Typographie : graisses ----- */
  --graisse-normale: 400;
  --graisse-moyenne: 500;
  --graisse-demi: 600;
  --graisse-forte: 700;

  /* ----- Typographie : interlignages ----- */
  --interligne-titre: 1.15;
  --interligne-serre: 1.35;
  --interligne-normal: 1.6;
  --interligne-aere: 1.75;

  /* ----- Espacements ----- */
  --espace-2xs: 0.25rem;    /* 4px */
  --espace-xs: 0.5rem;      /* 8px */
  --espace-sm: 0.75rem;     /* 12px */
  --espace-md: 1rem;        /* 16px */
  --espace-lg: 1.5rem;      /* 24px */
  --espace-xl: 2rem;        /* 32px */
  --espace-2xl: 3rem;       /* 48px */
  --espace-3xl: 4.5rem;     /* 72px */
  --espace-4xl: 6rem;       /* 96px */

  /* ----- Rythme vertical (sémantique, réutilise l'échelle ci-dessus) ----- */
  --rythme-section: var(--espace-2xl);  /* 48px - entre sections de 1er niveau */
  --rythme-bloc: var(--espace-lg);      /* 24px - cartes groupées & rangées 2 colonnes */

  /* ----- Rayons ----- */
  --rayon-xs: 4px;
  --rayon-sm: 6px;
  --rayon-md: 10px;
  --rayon-lg: 16px;
  --rayon-rond: 999px;

  /* ----- Mise en page ----- */
  /* Pas de largeur max de contenu : mise en page fluide, gouttières en clamp(). */
  --largeur-texte: 42rem;       /* 672px - colonnes de lecture */
  --hauteur-entete: 4.25rem;    /* header fixe vitrine */

  /* ----- Mouvement ----- */
  --duree-rapide: 150ms;
  --duree-normale: 250ms;
  --duree-lente: 500ms;
  --courbe-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --courbe-douce: cubic-bezier(0.22, 1, 0.36, 1);
}