/* Charte IntiFlex : jetons et bases web. Référence : charte/CHARTE-WEB.md.
   À copier tel quel dans un projet (avec polices/ à côté), puis utiliser les variables --intiflex-*. */

@font-face { font-family: "Source Sans 3"; font-weight: 400; font-display: swap;
  src: url("polices/source-sans-3-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-weight: 600; font-display: swap;
  src: url("polices/source-sans-3-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Source Sans 3"; font-weight: 700; font-display: swap;
  src: url("polices/source-sans-3-latin-700-normal.woff2") format("woff2"); }

:root {
  /* Couleurs officielles */
  --intiflex-vert-msu: #123B45;      /* fonds sombres, texte principal sur fond clair */
  --intiflex-bleu: #0388A6;          /* Palatinate Blue : couleur principale, aplats, boutons */
  --intiflex-turquoise: #57D1C2;     /* Medium Turquoise : accents, jamais en texte sur blanc */
  --intiflex-blanc: #FFFFFF;

  /* Teintes dérivées (interface uniquement, jamais sur le logo) */
  --intiflex-bleu-fonce: #026F88;    /* survol des boutons, liens sur blanc (contraste ≥ 4,5:1) */
  --intiflex-turquoise-clair: #E6F7F5; /* fonds de cartes, lignes sélectionnées */
  --intiflex-fond: #F4F8F9;          /* fond de page */
  --intiflex-bordure: #D3E1E5;
  --intiflex-texte: #123B45;
  --intiflex-texte-doux: #4A6871;

  /* États (hors charte, à n'utiliser que pour un statut) */
  --intiflex-ok: #2E8B57;
  --intiflex-alerte: #C98A00;
  --intiflex-erreur: #C0392B;

  /* Graphiques : ordre des séries */
  --intiflex-serie-1: #0388A6;
  --intiflex-serie-2: #57D1C2;
  --intiflex-serie-3: #123B45;
  --intiflex-serie-4: #8FA9B0;

  /* Typographie : Acumin (Adobe Fonts) si disponible, sinon Source Sans 3 auto-hébergée */
  --intiflex-police: "Acumin Pro", "Source Sans 3", "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --intiflex-police-titre: "Impasse", var(--intiflex-police);

  --intiflex-rayon: 6px;
  --intiflex-ombre: 0 1px 3px rgba(18, 59, 69, .12);
}

body {
  font-family: var(--intiflex-police);
  color: var(--intiflex-texte);
  background: var(--intiflex-fond);
}
h1, .intiflex-titre {
  font-family: var(--intiflex-police-titre);
  text-transform: uppercase;
  letter-spacing: .06em;
  font-weight: 700;
}
h2, h3 { font-weight: 700; }
a { color: var(--intiflex-bleu-fonce); }

/* En-tête : fond MSU Green, logo Light (texte blanc). Hauteur du logo ≥ 32 px. */
.intiflex-entete {
  background: var(--intiflex-vert-msu);
  color: var(--intiflex-blanc);
  display: flex; align-items: center; gap: 16px;
  padding: 10px 16px;
}
.intiflex-entete img.intiflex-logo { height: 36px; width: auto; display: block; }

.intiflex-bouton {
  background: var(--intiflex-bleu); color: var(--intiflex-blanc);
  border: 0; border-radius: var(--intiflex-rayon);
  padding: 8px 14px; font: 600 15px var(--intiflex-police); cursor: pointer;
}
.intiflex-bouton:hover { background: var(--intiflex-bleu-fonce); }
.intiflex-bouton:focus-visible { outline: 3px solid var(--intiflex-turquoise); outline-offset: 2px; }
.intiflex-bouton.secondaire {
  background: var(--intiflex-blanc); color: var(--intiflex-vert-msu);
  border: 1px solid var(--intiflex-bleu);
}