/* ==========================================================================
   YAARU — DESIGN TOKENS
   Système de variables partagé par toutes les zones (public, admission,
   admin, parent, éducateur). Modifier ce fichier suffit à retexturer
   l'ensemble de la plateforme.
   ========================================================================== */

:root {
  /* ---- Couleurs principales ---- */
  --y-green-900: #12332D;
  --y-green-700: #1F5C52;
  --y-green-600: #276E62;
  --y-green-500: #33887A;
  --y-green-100: #E1EEEA;
  --y-green-50:  #F1F7F5;

  --y-gold-700: #A6741F;
  --y-gold-600: #C9922E;
  --y-gold-500: #DCA845;
  --y-gold-100: #F6E9CE;

  --y-sand-100: #F3ECDD;
  --y-sand-50:  #FAF6EE;
  --y-paper:    #FFFFFF;

  --y-ink-900: #22282A;
  --y-ink-700: #414B4A;
  --y-ink-500: #6B7472;
  --y-ink-300: #A2ACA9;
  --y-ink-100: #DDE3E0;
  --y-ink-50:  #EEF1EF;

  /* ---- Couleurs de statut ---- */
  --y-success-700: #2B6E4E;
  --y-success-100: #E1F1E7;
  --y-warning-700: #9A6A15;
  --y-warning-100: #FBEDD1;
  --y-danger-700:  #A5342A;
  --y-danger-100:  #FBE4E1;
  --y-info-700:    #2A5C8A;
  --y-info-100:    #E2ECF5;

  /* ---- Typographie ---- */
  --y-font-display: "Fraunces", "Iowan Old Style", Georgia, serif;
  --y-font-body: "Public Sans", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --y-font-mono: "IBM Plex Mono", ui-monospace, SFMono-Regular, Menlo, monospace;

  --y-fs-h1: clamp(2rem, 1.5rem + 2vw, 3.4rem);
  --y-fs-h2: clamp(1.5rem, 1.2rem + 1.2vw, 2.3rem);
  --y-fs-h3: clamp(1.2rem, 1.05rem + 0.6vw, 1.55rem);
  --y-fs-h4: 1.15rem;
  --y-fs-body-lg: 1.125rem;
  --y-fs-body: 1rem;
  --y-fs-small: 0.875rem;
  --y-fs-micro: 0.75rem;

  --y-lh-tight: 1.15;
  --y-lh-snug: 1.35;
  --y-lh-body: 1.6;

  /* ---- Espacements (échelle 4px) ---- */
  --y-sp-1: 4px;
  --y-sp-2: 8px;
  --y-sp-3: 12px;
  --y-sp-4: 16px;
  --y-sp-5: 20px;
  --y-sp-6: 24px;
  --y-sp-8: 32px;
  --y-sp-10: 40px;
  --y-sp-12: 48px;
  --y-sp-16: 64px;
  --y-sp-20: 80px;
  --y-sp-24: 96px;

  /* ---- Largeurs ---- */
  --y-maxw-content: 1180px;
  --y-maxw-narrow: 760px;
  --y-maxw-form: 640px;

  /* ---- Rayons & ombres ---- */
  --y-radius-sm: 8px;
  --y-radius-md: 14px;
  --y-radius-lg: 20px;
  --y-radius-pill: 999px;

  --y-shadow-sm: 0 1px 2px rgba(18, 51, 45, 0.06), 0 1px 1px rgba(18, 51, 45, 0.04);
  --y-shadow-md: 0 6px 20px rgba(18, 51, 45, 0.08), 0 2px 6px rgba(18, 51, 45, 0.05);
  --y-shadow-lg: 0 16px 40px rgba(18, 51, 45, 0.14);

  /* ---- Transitions ---- */
  --y-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --y-speed-fast: 120ms;
  --y-speed-base: 200ms;

  /* ---- Navigation mobile ---- */
  --y-tabbar-h: 64px;
  --y-topbar-h: 64px;
}

@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; }
}