/* tokens.css — variables globales du design system, portees du theme FR (relevé 2026-09-11).
   Reprend les NOMS de variables FullStack pour reutiliser base.css et le CSS des composants sans reecriture.
   Source des valeurs : settings_data.json FR (voir docs/portage-fr/01-design-system.md). */

:root {
  /* Polices (poids reels 400 : le "200" du FR n'a aucun effet, fichiers Regular) */
  --font-heading--family: var(--wp--preset--font-family--heading, "Noto Serif", Georgia, serif);
  --font-heading--style: normal;   --font-heading--weight: 400;
  --font-subheading--family: "Avenir Next Cyr", "Instrument Sans", system-ui, sans-serif;
  --font-subheading--style: normal; --font-subheading--weight: 500;
  --font-body--family: "Avenir Next Cyr", "Instrument Sans", system-ui, sans-serif;
  --font-body--style: normal;      --font-body--weight: 400;

  --letter-spacing--heading-tight: -0.03em; --letter-spacing--heading-normal: 0; --letter-spacing--heading-loose: 0.03em;
  --letter-spacing--body-tight: -0.03em;    --letter-spacing--body-normal: 0;    --letter-spacing--body-loose: 0.03em;
  --line-height--heading-tight: 1.15; --line-height--heading-normal: 1.25; --line-height--heading-loose: 1.35;
  --line-height--body-tight: 1.2;     --line-height--body-normal: 1.4;     --line-height--body-loose: 1.6;

  /* Echelle typo : h1..h3 heading (Noto Serif), h4..h6 subheading (corps) */
  --font-h1--family: var(--font-heading--family); --font-h1--style: normal; --font-h1--weight: var(--font-heading--weight);
  --font-h1--size: 4.5rem; --font-h1--line-height: var(--line-height--heading-normal); --font-h1--letter-spacing: 0; --font-h1--case: none;
  --font-h2--family: var(--font-heading--family); --font-h2--style: normal; --font-h2--weight: var(--font-heading--weight);
  --font-h2--size: 3rem; --font-h2--line-height: var(--line-height--heading-normal); --font-h2--letter-spacing: 0; --font-h2--case: none;
  --font-h3--family: var(--font-heading--family); --font-h3--style: normal; --font-h3--weight: var(--font-heading--weight);
  --font-h3--size: 2rem; --font-h3--line-height: var(--line-height--heading-normal); --font-h3--letter-spacing: 0; --font-h3--case: none;
  --font-h4--family: var(--font-subheading--family); --font-h4--style: normal; --font-h4--weight: var(--font-subheading--weight);
  --font-h4--size: 1.5rem; --font-h4--line-height: var(--line-height--heading-normal); --font-h4--letter-spacing: 0; --font-h4--case: none;
  --font-h5--family: var(--font-subheading--family); --font-h5--style: normal; --font-h5--weight: var(--font-subheading--weight);
  --font-h5--size: 1.25rem; --font-h5--line-height: var(--line-height--heading-normal); --font-h5--letter-spacing: 0; --font-h5--case: none;
  --font-h6--family: var(--font-subheading--family); --font-h6--style: normal; --font-h6--weight: var(--font-subheading--weight);
  --font-h6--size: 1.125rem; --font-h6--line-height: var(--line-height--heading-normal); --font-h6--letter-spacing: 0; --font-h6--case: none;
  --font-body--size-small: 0.78125rem; --font-body--size: 0.875rem; --font-body--size-emphasized: 0.9375rem;
  --font-body--line-height: var(--line-height--body-normal); --font-body--letter-spacing: 0;

  /* General */
  --small-multiplier: 0.7; --big-multiplier: 1.5; --backdrop-opacity: 0.25;

  /* Mise en page */
  --page-width: 1300px; --page-margin-desktop: 40px; --page-margin-mobile: 20px;

  /* Rayons (DA carree : tout a 0) */
  --inputs-border-radius: 0px; --checkbox-border-radius: 0px; --badge-border-radius: 0px;
  --button-border-radius: 0px; --card-border-radius: 0px;

  /* Conteneurs, bordures, separateur */
  --container-border-width: 1px; --separator-border-width: 0.5px;
  --card-padding: 15px;

  /* Icones */
  --icon-fill: 0; --icon-weight: 300; --icon-size: 24;

  /* Boutons */
  --button-font-size: 0.875rem; --button-letter-spacing: 0.025rem;
  --button-padding-vertical: 10px; --button-padding-horizontal: 20px;
  --button-primary-border-width: 0px; --button-primary-font-weight: 400; --button-primary-text-transform: none;
  --button-secondary-border-width: 1px; --button-secondary-font-weight: 400; --button-secondary-text-transform: none;

  /* Badges */
  --badge-letter-spacing: 0.05rem; --badge-padding-vertical: 10px; --badge-padding-horizontal: 20px;
  --badge-font-weight: 400; --badge-text-transform: none;
  --badge-primary-border-width: 0px; --badge-secondary-border-width: 1px;

  /* Animations */
  --animation-speed: 0.25s; --animation-speed-medium: 0.15s; --animation-speed-fast: 0.1s;
  --animation-easing: ease-in-out; --animation-link-hover: opacity var(--animation-speed-medium) var(--animation-easing);
  --opacity-link-hover: 0.75;

  /* Marges, paddings, gaps */
  --margin-xs: 0.33rem; --margin-sm: 0.5rem; --margin-md: 1rem; --margin-lg: 1.5rem; --margin-xl: 3rem; --margin-xxl: 5rem;
  --padding-xxxs: 0.25rem; --padding-xxs: 0.33rem; --padding-xs: 0.5rem; --padding-sm: 0.75rem; --padding-md: 1rem;
  --padding-lg: 2.5rem; --padding-xl: 4rem; --padding-xxl: 6rem;
  --gap-xxs: 0.25rem; --gap-xs: 0.33rem; --gap-sm: 0.5rem; --gap-md: 1rem; --gap-lg: 2rem; --gap-xl: 3rem;
  --grid-gap-horizontal: var(--gap-md); --grid-gap-vertical: var(--gap-md);

  /* Inputs */
  --inputs-min-height: 50px; --inputs-min-width: 120px; --inputs-font-size: 0.875rem;
  --inputs-border-width: 1px; --inputs-padding: 14px;

  /* Variantes, onglets, checkbox, swatches */
  --variant-button-min-height: 40px; --variant-button-min-width: 40px; --variant-button-font-size: 0.875rem;
  --variant-button-padding-vertical: 10px; --variant-button-padding-horizontal: 10px; --variant-button-border-width: 1px;
  --tab-button-min-height: 30px; --tab-button-min-width: 70px; --tab-button-font-size: 0.875rem;
  --tab-button-border-width: 1px; --tab-button-padding-vertical: 10px; --tab-button-padding-horizontal: 15px;
  --checkbox-size: 20px;
  --swatches-small-outline-offset: 1px; --swatches-outline-offset: 2px; --swatches-big-outline-offset: 3px;
  --swatches-size: 30px; --swatches-border-width: 1px;

  /* Modales, toasts */
  --modal-shadow: 0px 4px 20px rgba(var(--color-shadow)); --modal-width: 42rem; --modal-max-height: 65dvh;
  --toast-notification-icon-size: 24px; --toast-notification-min-width: 300px; --toast-notification-z-index: 10001;
  --toast-notification-background-color--error: #f9e7e7; --toast-notification-color--error: #9f3a38;
  --toast-notification-background-color--success: #f0f9eb; --toast-notification-color--success: #2d6a4f;
  --toast-notification-background-color--warning: #fff4e5; --toast-notification-color--warning: #7f5a1e;
  --toast-notification-background-color--info: #e6f7ff; --toast-notification-color--info: #1890ff;
  --toast-notification-transition-duration: 500ms;
}

@media (width < 750px) {
  :root {
    --font-h1--size: 3rem; --font-h2--size: 2rem; --font-h3--size: 1.5rem;
    --font-h4--size: 1.25rem; --font-h5--size: 1.125rem; --font-h6--size: 1rem;
  }
}
@media (width > 750px) {
  :root { --card-padding: 20px; }
}