/*
 * Design system du hub — source unique des tokens.
 *
 * Repris du design system de marque « Graines d'Amiand » (artifact claude.ai) : palette,
 * rôles de couleur, fond (lueur + nid d'abeille), rayons, typographie web (Inter).
 * Servi tel quel depuis public/ : lié par les pages statiques (<link href="/brand.css">)
 * et par app/layout.tsx. Ne pas recopier ces valeurs ailleurs : utiliser var(--…).
 * Seule exception, les contextes qui ne lisent pas le CSS (canvas, props Recharts) :
 * lib/brand.ts, dont la concordance avec ce fichier est vérifiée par lib/brand.test.ts.
 *
 * Règles d'usage (contrastes calculés WCAG 2.x) :
 * - Texte courant en --ink (13,2:1 sur navy), secondaire en --ink-muted (9,4:1).
 * - --accent (or) en texte : 5,5:1 sur navy mais 3,4:1 sur la lueur indigo du coin haut
 *   gauche. Sous 24px, l'or ne s'écrit que sur --surface-card (6,7:1). Sur le fond de page,
 *   un lien de texte reste en --ink, souligné en --accent.
 * - Aplat --accent : texte en --on-accent (navy, 5,5:1). Jamais de blanc sur or (2,4:1).
 * - --violet et --indigo ne portent jamais de texte.
 * - Aucune ombre portée.
 */

/* Inter (SIL OFL 1.1, voir /fonts/Inter-OFL.txt), hébergée sur le hub : aucun appel tiers. */
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("/fonts/inter-latin-wght-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304,
    U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "Inter";
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url("/fonts/inter-latin-ext-wght-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308,
    U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113,
    U+2C60-2C7F, U+A720-A7FF;
}

:root {
  /* Palette de marque */
  --navy: #1a237e;
  --indigo: #3d46aa;
  --violet: #6c5ce7;
  --gold: #cba135;
  --white: #ffffff;
  --lavender: #d3d7ff;

  /* Rôles (design system de marque) */
  --surface: var(--navy);
  --surface-raised: var(--white);
  --ink: var(--white);
  --ink-muted: var(--lavender);
  --ink-on-raised: var(--navy);
  --accent: var(--gold);
  --on-accent: var(--navy);

  /* Extension hub : absente du DS de marque (qui ne décrit que des visuels), propre à
     l'interface web. Dérivée de la palette, pas de nouvelle teinte. */
  --surface-card: #121858; /* navy assombri de 30 % : cartes, champs. ink 16,2:1, ink-muted 11,5:1, accent 6,7:1 */
  --line: #3f4798; /* lavender à 20 % sur navy : filets, contours décoratifs */
  --line-strong: #6d74b8; /* lavender à 45 % : contour des champs (3:1 sur navy, 3,7:1 sur surface-card) */
  --danger: #ffb0b0; /* erreurs : 4,8:1 jusque sur la lueur, 7,6:1 sur navy, 9,3:1 sur surface-card */
  --success: #6ee89e; /* réussite : 5,4:1 jusque sur la lueur, 8,6:1 sur navy */

  /* Fond de marque : lueur indigo en haut à gauche, nid d'abeille violet à 18 % */
  --gradient-ground: linear-gradient(142deg, #3a43a6 0%, #1a237e 41%);
  --gradient-band: linear-gradient(90deg, #cba135 3%, #ffffff 88%);
  --motif-hex: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='79.28' height='137.34'%3E%3Cpath d='M39.64 0 L79.28 22.89 V68.67 L39.64 91.56 L0 68.67 V22.89 Z M39.64 91.56 V137.34' fill='none' stroke='%236c5ce7' stroke-opacity='0.18' stroke-width='1.33'/%3E%3C/svg%3E");
  --motif-hex-size: 79.28px 137.34px;

  /* Typographie : le DS prévoit SF Pro Display sur Mac, Inter partout en ligne */
  --font-sans: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-display: var(--font-sans);
  --tracking-title: -0.02em;
  --tracking-display: -0.04em;

  /* Rayons */
  --radius-button: 9px;
  --radius-card: 11px;
  --radius-band: 29px;

  /* Focus clavier : contour blanc plein, 13,2:1 sur navy */
  --focus-ring: 2px solid var(--white);
  --focus-offset: 2px;
}

/* Base commune : chaque page hérite du fond et de la typo, sans les redéclarer.
   Pas de fond sur html : celui de body se propage alors à toute la fenêtre, même quand une
   page donne un max-width à body. */
body {
  margin: 0;
  min-height: 100vh;
  background-color: var(--surface);
  background-image: var(--motif-hex), var(--gradient-ground);
  background-size: var(--motif-hex-size), cover;
  background-attachment: fixed, fixed;
  color: var(--ink);
  font-family: var(--font-sans);
}

/* Un lien sans style propre ne doit pas garder le bleu du navigateur (1,2:1 sur navy). */
a {
  color: var(--ink);
  text-decoration-color: var(--accent);
}

:focus-visible {
  outline: var(--focus-ring);
  outline-offset: var(--focus-offset);
}
