/* Iluguard — jetons de design. Thème sombre par défaut, [data-theme="light"] pour le clair. */
/* Polices chargées par index.html (Geist, Geist Mono). Source : handoff Claude Design. */

:root {
  /* Surfaces (sombre) */
  --ig-bg: #080B0D;
  --ig-surface: #0E1316;
  --ig-raised: #141A1E;
  --ig-modal: #1A2227;
  --ig-line: #1F292F;
  --ig-line-soft: #1A2227;
  --ig-border: #2C3840;
  --ig-inset: #0B1013;
  --ig-text: #E7EDF0;
  --ig-text-2: #A3B0B8;
  --ig-text-3: #7D8B94;
  --ig-text-off: #4A575F;
  --ig-lamp: #7FE0EE;          /* accent de marque : vivant, focus, diagnostic */
  --ig-lamp-hover: #B8F1F8;
  --ig-grid-line: rgba(140,175,195,.045); /* grille de fond 32 px */

  /* États (texte/icône sur surface sombre) */
  --ig-down: #FF6B5E;      --ig-down-text: #FF8A80;   --ig-down-strong: #FFB3AC;
  --ig-degraded: #F4B740;  --ig-degraded-text: #F8CF7E;
  --ig-unknown: #C2A8FF;
  --ig-maint: #8C9BFF;
  --ig-up: #3DDC97;
  --ig-paused: #93A1A9;
  /* fond de pastille = couleur + 14 (≈8 % alpha), bordure = couleur + 4D (≈30 % alpha) */

  /* Typo */
  --ig-font-sans: 'Geist', system-ui, sans-serif;
  --ig-font-mono: 'Geist Mono', ui-monospace, monospace;
  --ig-font-serif: 'Newsreader', Georgia, serif; /* rapport client seulement */

  /* Espacements (grille de 4) */
  --ig-s1: 4px; --ig-s2: 8px; --ig-s3: 12px; --ig-s4: 16px;
  --ig-s5: 24px; --ig-s6: 32px; --ig-s7: 48px; --ig-s8: 64px;

  /* Rayons */
  --ig-r-field: 4px;  /* champs : 6px dans les maquettes de formulaire */
  --ig-r-btn: 8px;
  --ig-r-card: 12px;
  --ig-r-pill: 999px;

  /* Élévations / lueurs */
  --ig-e0: 0 0 0 1px var(--ig-line);
  --ig-e2: 0 0 0 1px var(--ig-border), 0 16px 40px -12px rgba(0,0,0,.8);
  --ig-glow-down: 0 0 0 1px rgba(255,107,94,.45), 0 0 24px -10px rgba(255,107,94,.5);
  --ig-glow-degraded: 0 0 0 1px rgba(244,183,64,.35);
  --ig-focus: 0 0 0 2px var(--ig-surface), 0 0 0 4px var(--ig-lamp);
}

[data-theme="light"] {
  --ig-bg: #F4F5F2;
  --ig-surface: #FFFFFF;
  --ig-raised: #FAFAF8;
  --ig-modal: #FFFFFF;
  --ig-line: #E1E4E0;
  --ig-line-soft: #EEF0EC;
  --ig-border: #C9CFCB;
  --ig-inset: #EEF0EC;
  --ig-text: #12181B;
  --ig-text-2: #3F4A50;
  --ig-text-3: #56636B;
  --ig-lamp: #0A7F94;
  --ig-lamp-hover: #075E6E;

  --ig-down: #C2362B;      --ig-down-text: #C2362B;   --ig-down-strong: #C2362B;
  --ig-degraded: #8F5A00;  --ig-degraded-text: #8F5A00;
  --ig-unknown: #6B4FC4;
  --ig-maint: #3F4FD0;
  --ig-up: #0E7A52;
  --ig-paused: #5F6B72;
  --ig-focus: 0 0 0 2px #FFFFFF, 0 0 0 4px var(--ig-lamp);
}

/* Cases de calendrier du rapport (thème clair) */
:root {
  --ig-cal-ok-bg: #E3F3EA;    --ig-cal-ok-fg: #0E5C3E;    --ig-cal-ok-bd: #CBE8D7;    --ig-band-ok: #7FCBA3;
  --ig-cal-slow-bg: #FBE7B8;  --ig-cal-slow-fg: #5E3B00;  --ig-cal-slow-bd: #F1D48A;  --ig-band-slow: #E8A92C;
  --ig-cal-down-bg: #C2362B;  --ig-cal-down-fg: #FFFFFF;                              --ig-band-down: #C2362B;
  --ig-cal-maint: repeating-linear-gradient(135deg,#DCE0FF 0 3px,#EEF0FF 3px 6px); --ig-cal-maint-fg: #2F3BA8; --ig-cal-maint-bd: #C3C9FA;
  --ig-cal-future-bg: #F4F5F2; --ig-cal-future-fg: #7A858B; /* bordure 1px dashed #C9CFCB */
  --ig-pill-down-bg: #FBE9E7; --ig-reassure-bg: #EEF6F1; --ig-incident-bg: #FDF6F5; --ig-incident-bd: #F0D3CF;
}

@keyframes igPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(61,220,151,.45) } 50% { box-shadow: 0 0 0 5px rgba(61,220,151,0) } }
@keyframes igBeam { 0%,80%,100% { opacity: .2 } 88% { opacity: 1 } }
@keyframes igArrive {
  0% { opacity: 0; transform: translateY(-8px) }
  40% { opacity: 1; transform: none; box-shadow: 0 0 0 1px #FF6B5E, 0 0 40px -6px rgba(255,107,94,.7) }
  100% { opacity: 1; box-shadow: var(--ig-glow-down) }
}
@keyframes igReveal { from { opacity: 0; transform: translateY(4px) } to { opacity: 1; transform: none } }
@keyframes igScan { from { transform: translateX(-100%) } to { transform: translateX(100%) } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important } }