/* ============================================================
   FISS — variables.css
   Toutes les variables CSS globales
   ============================================================ */

:root {
  /* ── Couleurs principales FISS ── */
  --bg:         #F0F4FA;
  --bg2:        #E2EAF5;
  --surface:    #FFFFFF;
  --surface2:   #F7F9FD;
  --ink:        #0D1B2E;
  --ink2:       #2C3E5A;
  --ink3:       #6B7F9A;

  --accent:     #D4001A;   /* rouge FISS */
  --accent2:    #4A90D9;   /* bleu clair */
  --accent3:    #1A3A6B;
  --accent4:    #0A2352;

  --dark-navy:  #0A2352;
  --mid-blue:   #1A4A8A;
  --light-blue: #4A90D9;
  --red:        #D4001A;

  --border:     #C8D8EE;
  --shadow:     0 2px 12px rgba(10,35,82,0.08);
  --shadow-lg:  0 8px 32px rgba(10,35,82,0.14);
  --radius:     12px;
  --radius-sm:  8px;
  --radius-md:  10px;

  /* ── Couleurs sémantiques ── */
  --green:      #1A6B45;
  --gold:       #C9860A;
  --success:    #1A6B45;

  /* ── Alias — un grand nombre de pages et scripts utilisent ces noms de
     variables (--primary, --navy, --blue...) qui n'ont jamais existé dans
     ce fichier. Résultat : texte invisible ou couleurs manquantes un peu
     partout dans l'appli, le même bug que celui trouvé dans le chat, mais
     généralisé. Plutôt que de corriger des dizaines de fichiers un par un
     (risqué sur un site en production), on définit ici les alias manquants
     une seule fois — tout se répare d'un coup, sans toucher au reste. ── */
  --primary:       var(--dark-navy);
  --primary-light: var(--mid-blue);
  --navy:          var(--dark-navy);
  --blue:          var(--mid-blue);
  --ink1:          var(--ink);
  --font:          var(--font-body);
  --font-main:     var(--font-body);

  /* ── Houses ── */
  --toronto:    #D4001A;
  --monaco:     #1A4A8A;
  --guizeh:     #C9860A;

  /* ── Typographie ── */
  --font-display: 'Poppins', system-ui, sans-serif;
  --font-body:    'Poppins', system-ui, sans-serif;
  --font-mono:    'DM Mono', 'Courier New', monospace;

  /* ── Transitions ── */
  --transition: 0.15s ease;
  --transition-slow: 0.3s ease;

  /* ── Z-index ── */
  --z-sidebar:  100;
  --z-topbar:   50;
  --z-modal:    200;
  --z-toast:    9999;
}

/* ── Icônes Material Symbols ──
   Hébergée nous-mêmes plutôt que via Google Fonts : la police variable
   complète (tous poids/graisses confondus) pèse ~5,3 Mo, ce qui échouait
   silencieusement sur mobile (surtout en PWA) et affichait le nom brut de
   l'icône ("edit", "restaurant"...) à la place du glyphe. Cette version
   statique, figée sur le seul style utilisé ici (FILL 1, wght 500,
   opsz 24), ne pèse que ~500 Ko et charge de façon fiable. */
@font-face {
  font-family: 'Material Symbols Rounded';
  font-style: normal;
  font-weight: 500;
  font-display: block;
  src: url('../assets/fonts/material-symbols-rounded.woff2') format('woff2');
}
.ms {
  font-family: 'Material Symbols Rounded';
  font-weight: normal;
  font-style: normal;
  font-size: 18px;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  font-variation-settings: 'FILL' 1, 'wght' 500, 'GRAD' 0, 'opsz' 24;
  vertical-align: -3px;
  color: var(--mid-blue);
  margin-right: 4px;
}
.ms-lg { font-size: 22px; vertical-align: -5px; }
.ms-sm { font-size: 15px; vertical-align: -2px; margin-right: 3px; }
.ms-accent { color: var(--accent); }
.ms-green  { color: #1A6B45; }
.ms-gold   { color: #C9860A; }

/* ── Mode sombre (préparation future) ── */
@media (prefers-color-scheme: dark) {
  /* Désactivé pour l'instant — charte FISS prioritaire */
}