/* ASGC Manager — jetons de conception (SPECS §13)
   Charte validée : bleu foncé principal, or en accent, blanc en fond. */

:root {
  /* Couleurs de marque */
  --bleu-nuit: #0d2b6b;
  --bleu-nuit-clair: #163a86;
  --bleu-vif: #1746a2;
  --bleu-pale: #e8effb;
  --or: #e8a400;
  --or-clair: #fdf3dc;
  --blanc: #ffffff;

  /* Fonds et textes */
  --fond: #f4f7fc;
  --surface: #ffffff;
  --bordure: #dfe6f2;
  --bordure-forte: #c3cfe4;
  --texte: #1b2436;
  --texte-doux: #5a6784;
  --texte-faible: #8794ad;

  /* Statuts */
  --vert-ok: #1e8e3e;
  --vert-fond: #e6f4ea;
  --orange-attention: #c2660a;
  --orange-fond: #fdf0e2;
  --rouge-alerte: #c5221f;
  --rouge-fond: #fce8e6;
  --bleu-info: #1746a2;
  --bleu-info-fond: #e8effb;
  --violet: #6b3fa0;
  --violet-fond: #f0e9f9;

  /* Formes */
  --rayon: 12px;
  --rayon-petit: 8px;
  --rayon-pastille: 999px;
  --ombre: 0 2px 8px rgb(13 43 107 / 8%);
  --ombre-forte: 0 8px 24px rgb(13 43 107 / 14%);

  /* Espacements */
  --espace-xs: 4px;
  --espace-s: 8px;
  --espace-m: 16px;
  --espace-l: 24px;
  --espace-xl: 32px;

  /* Typographie */
  --police: 'Segoe UI', system-ui, -apple-system, 'Helvetica Neue', Arial, sans-serif;
  --largeur-menu: 232px;
}

/* L'attribut `hidden` doit l'emporter sur les classes qui posent un display
   (`.alerte { display:flex }`, `.confirmation { display:grid }`…), sans quoi un
   bloc masqué reste visible sous forme de cadre vide. */
[hidden] {
  display: none !important;
}

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

html,
body {
  margin: 0;
  padding: 0;
  height: 100%;
}

body {
  font-family: var(--police);
  background: var(--fond);
  color: var(--texte);
  font-size: 15px;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
}

h1,
h2,
h3,
h4 {
  margin: 0;
  color: var(--bleu-nuit);
  font-weight: 700;
}

a {
  color: var(--bleu-vif);
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

button {
  font-family: inherit;
  font-size: inherit;
  cursor: pointer;
}

/* Accessibilité : l'anneau de focus reste visible au clavier. */
:focus-visible {
  outline: 3px solid var(--or);
  outline-offset: 2px;
  border-radius: var(--rayon-petit);
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}