/* =========================================================================
   SOLIS — jetons de design
   -------------------------------------------------------------------------
   Direction : moderne, sobre, élégant. Fond clair, beaucoup de blanc, UNE
   seule couleur d'accent (#2f6bff), pas de dégradés, pas d'ombres appuyées,
   typographie sans empattement, chiffres tabulaires, clair + sombre d'emblée.

   RÈGLE NON NÉGOCIABLE : aucune couleur, aucun rayon, aucune espace écrits
   à la main dans les composants. Tout passe par un jeton défini ici.
   ========================================================================= */

:root {
  /* ---------------------------------------------------------- couleur */
  --solis-accent: #2f6bff;
  --solis-accent-actif: #1f52d6;
  --solis-accent-doux: #eaf0ff;
  --solis-accent-contraste: #ffffff;

  --solis-fond: #ffffff;
  --solis-fond-secondaire: #f7f8fa;
  --solis-fond-survol: #f0f2f5;
  --solis-surface: #ffffff;

  --solis-texte: #14161a;
  --solis-texte-secondaire: #5a6070;
  --solis-texte-tertiaire: #878d9c;
  --solis-texte-inverse: #ffffff;

  --solis-bordure: #e3e6ec;
  --solis-bordure-forte: #c9cdd6;

  /* États. Employés avec parcimonie : le succès ne se peint pas en vert
     partout, il se prouve. */
  --solis-succes: #12805c;
  --solis-succes-doux: #e6f4ef;
  --solis-attention: #9a6200;
  --solis-attention-doux: #fdf3e2;
  --solis-refus: #c02b2b;
  --solis-refus-doux: #fdeaea;
  --solis-info: var(--solis-accent);
  --solis-info-doux: var(--solis-accent-doux);

  /* Bandeau « serveur ancien en mémoire » — le seul rouge plein toléré. */
  --solis-alerte-version-fond: #c02b2b;
  --solis-alerte-version-texte: #ffffff;

  /* ---------------------------------------------- typographie & mesure */
  --solis-police: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
  --solis-police-chiffres: "Inter", "Segoe UI", system-ui, sans-serif;
  --solis-police-code: "JetBrains Mono", "Cascadia Code", ui-monospace, monospace;

  --solis-taille-xs: 0.75rem;
  --solis-taille-s: 0.8125rem;
  --solis-taille-m: 0.9375rem;
  --solis-taille-l: 1.125rem;
  --solis-taille-xl: 1.5rem;
  --solis-taille-xxl: 2rem;

  --solis-graisse-normale: 400;
  --solis-graisse-moyenne: 500;
  --solis-graisse-forte: 600;

  --solis-interligne: 1.55;
  --solis-interligne-titre: 1.25;

  /* --------------------------------------------------------- espacement */
  --solis-espace-1: 0.25rem;
  --solis-espace-2: 0.5rem;
  --solis-espace-3: 0.75rem;
  --solis-espace-4: 1rem;
  --solis-espace-5: 1.5rem;
  --solis-espace-6: 2rem;
  --solis-espace-7: 3rem;
  --solis-espace-8: 4rem;

  /* ------------------------------------------------ formes & élévation */
  --solis-rayon-s: 4px;
  --solis-rayon-m: 8px;
  --solis-rayon-l: 12px;
  --solis-rayon-rond: 999px;

  /* Élévation discrète : une ombre doit se deviner, pas se voir. */
  --solis-ombre-0: none;
  --solis-ombre-1: 0 1px 2px rgba(20, 22, 26, 0.06);
  --solis-ombre-2: 0 4px 12px rgba(20, 22, 26, 0.08);

  --solis-focus: 0 0 0 3px var(--solis-accent-doux), 0 0 0 1px var(--solis-accent);

  --solis-transition: 120ms ease;
  --solis-largeur-contenu: 76rem;
}

/* ------------------------------------------------------------- sombre */
:root[data-theme="sombre"],
:root[data-theme="dark"] {
  --solis-accent: #6a95ff;
  --solis-accent-actif: #87aaff;
  --solis-accent-doux: #1a2440;
  --solis-accent-contraste: #0b0d12;

  --solis-fond: #0f1116;
  --solis-fond-secondaire: #151821;
  --solis-fond-survol: #1c202b;
  --solis-surface: #161a23;

  --solis-texte: #e9ecf2;
  --solis-texte-secondaire: #a2a9b8;
  --solis-texte-tertiaire: #767d8d;
  --solis-texte-inverse: #0f1116;

  --solis-bordure: #262b36;
  --solis-bordure-forte: #3a4050;

  --solis-succes: #4bbf95;
  --solis-succes-doux: #12241e;
  --solis-attention: #d9a441;
  --solis-attention-doux: #2a2113;
  --solis-refus: #f07171;
  --solis-refus-doux: #2c1616;

  --solis-ombre-1: 0 1px 2px rgba(0, 0, 0, 0.4);
  --solis-ombre-2: 0 4px 12px rgba(0, 0, 0, 0.45);
}

/* Suit le système tant que l'utilisateur n'a pas choisi explicitement. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="clair"]):not([data-theme="light"]) {
    color-scheme: dark;
    --solis-accent: #6a95ff;
    --solis-accent-actif: #87aaff;
    --solis-accent-doux: #1a2440;
    --solis-accent-contraste: #0b0d12;
    --solis-fond: #0f1116;
    --solis-fond-secondaire: #151821;
    --solis-fond-survol: #1c202b;
    --solis-surface: #161a23;
    --solis-texte: #e9ecf2;
    --solis-texte-secondaire: #a2a9b8;
    --solis-texte-tertiaire: #767d8d;
    --solis-texte-inverse: #0f1116;
    --solis-bordure: #262b36;
    --solis-bordure-forte: #3a4050;
    --solis-succes: #4bbf95;
    --solis-succes-doux: #12241e;
    --solis-attention: #d9a441;
    --solis-attention-doux: #2a2113;
    --solis-refus: #f07171;
    --solis-refus-doux: #2c1616;
  }
}

/* --------------------------------------------------------- base sobre */
*,
*::before,
*::after {
  box-sizing: border-box;
}

body {
  margin: 0;
  background: var(--solis-fond);
  color: var(--solis-texte);
  font-family: var(--solis-police);
  font-size: var(--solis-taille-m);
  line-height: var(--solis-interligne);
  -webkit-font-smoothing: antialiased;
}

/* Les montants s'alignent : chiffres tabulaires obligatoires. */
.solis-montant,
.solis-tableau td,
.solis-reference {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

.solis-reference {
  font-family: var(--solis-police-code);
  letter-spacing: 0.01em;
}

:focus-visible {
  outline: none;
  box-shadow: var(--solis-focus);
  border-radius: var(--solis-rayon-s);
}

/* Bandeau affiché quand VERSION_UI ≠ VERSION. */
.solis-alerte-version {
  background: var(--solis-alerte-version-fond);
  color: var(--solis-alerte-version-texte);
  padding: var(--solis-espace-2) var(--solis-espace-4);
  font-weight: var(--solis-graisse-forte);
  text-align: center;
}

@media (prefers-reduced-motion: reduce) {
  * {
    transition: none !important;
    animation: none !important;
  }
}