/* Karelle Isoardo, systeme de tokens a deux couches.
   Couche 1, primitives : valeurs brutes de la palette Ocean Sunset. Hex canonique, OKLCH en commentaire.
   Couche 2, semantique : roles. Les composants n'utilisent que la couche semantique.
   Theme clair uniquement (cf DESIGN.md). */

:root{
  /* ---------- Couche 1 : primitives ---------- */

  /* Marine et encre */
  --p-navy-900:#1E282F;   /* oklch(27% 0.02 240) */
  --p-navy-700:#2F4858;   /* oklch(38.8% 0.041 237) */

  /* Bleus de soutien */
  --p-blue-600:#33658A;   /* oklch(48.9% 0.080 243) */
  --p-blue-300:#86BBD8;   /* oklch(76.5% 0.069 233) */

  /* Orange (action) et ambre */
  --p-orange-600:#C44400; /* oklch(56% 0.175 40.3) ; 4.84:1 sur --p-paper-0, 4.59:1 sur --p-paper-1 (AA) */
  --p-orange-500:#F26419; /* oklch(67.4% 0.191 43) */
  --p-amber-400:#F6AE2D;  /* oklch(80% 0.156 76) */

  /* Neutres teintes vers le marine (teinte ~237) */
  --p-paper-0:#F8FBFD;    /* oklch(98.6% 0.004 237) */
  --p-paper-1:#F1F5F7;    /* oklch(96.8% 0.005 237) */
  --p-paper-2:#FBFDFF;    /* oklch(99.3% 0.003 237) */
  --p-line-200:#DADFE1;   /* oklch(90% 0.006 237) */
  --p-ink-600:#545F68;    /* oklch(48% 0.02 240) */
  --p-ink-400:#666F75;    /* oklch(53.6% 0.014 237) ; 4.93:1 sur --p-paper-0, 4.67:1 sur --p-paper-1 (AA) */

  /* Neutres clairs sur fond marine */
  --p-fog-300:#C4CFD6;    /* oklch(84% 0.012 237) ; 6.05:1 sur --p-navy-700 */
  --p-fog-400:#AFB7BD;    /* oklch(77.5% 0.012 237) ; 4.72:1 sur --p-navy-700 (AA), reste sous fog-300 */

  /* Lavis orange : la bande de contact */
  --p-orange-050:#FDEFE6;
  --p-orange-100:#F7D9C6;

  /* Type */
  --p-font-serif:'Fraunces', Georgia, serif;
  --p-font-sans:'Instrument Sans', system-ui, -apple-system, sans-serif;

  /* Espacement, base 8 */
  --p-space-1:4px; --p-space-2:8px; --p-space-3:12px; --p-space-4:16px;
  --p-space-5:24px; --p-space-6:32px; --p-space-7:48px; --p-space-8:64px; --p-space-9:96px;

  /* Rayons */
  --p-radius-1:6px; --p-radius-2:10px; --p-radius-3:16px; --p-radius-pill:999px;

  /* ---------- Couche 2 : semantique (theme clair) ---------- */

  --color-bg:var(--p-paper-0);
  --color-surface:var(--p-paper-1);
  --color-surface-raised:var(--p-paper-2);
  --color-border:var(--p-line-200);

  --color-text:var(--p-navy-900);
  --color-text-muted:var(--p-ink-600);
  --color-text-faint:var(--p-ink-400);

  --color-ink:var(--p-navy-700);          /* marine identitaire, titres, sections profondes */
  --color-on-dark:var(--p-paper-0);       /* texte pose sur une section marine */
  --color-on-dark-muted:var(--p-fog-300);
  --color-on-dark-faint:var(--p-fog-400); /* mentions discretes sur marine, AA tenu */

  --color-accent:var(--p-orange-500);     /* action, liens, fil */
  --color-accent-strong:var(--p-orange-600);
  --color-accent-2:var(--p-amber-400);    /* accent secondaire rare */
  --color-accent-wash:var(--p-orange-050);        /* aplat tres clair : bande de contact */
  --color-accent-wash-border:var(--p-orange-100);
  --color-support:var(--p-blue-600);
  --color-support-soft:var(--p-blue-300);
  --color-on-accent:var(--p-navy-900);    /* texte encre sur aplat orange, contraste 4.72 (AA) */

  --font-display:var(--p-font-serif);
  --font-body:var(--p-font-sans);
}