/*
 * dashboard-tokens.css — Instrument Bulletin design tokens (M4)
 * Source : tasks/refonte-plan.md section B.1
 * Scope : variables CSS chargées en plus de style.css, scopées à .ib-dashboard
 *         pour ne pas casser les pages publiques (landing utilise déjà ses propres tokens).
 */

:root,
.ib-dashboard {
  /* === Base === */
  --ib-bg:           #0A0E14;
  --ib-surface:      #131820;
  --ib-surface-2:    #0D1219;
  --ib-border:       #1F2630;
  --ib-border-hi:    #2E3D4A;
  --ib-text:         #E8ECEF;             /* 16.4:1 vs bg — AAA */
  --ib-text-mute:    #8A95A0;             /* 6.42:1 vs bg — AA */
  --ib-text-faint:   #747F8C;             /* 4.75:1 vs bg — AA (bumped depuis #6A7480 qui faisait 4.07:1) */

  /* === Accents === */
  --ib-vital:        #4A8C7E;             /* 4.92:1 vs bg — AA */
  --ib-vital-dim:    rgba(74, 140, 126, 0.12);
  --ib-alert:        #D45050;             /* 4.66:1 vs bg — AA (bumped depuis #C84545 qui faisait 4.05:1) */
  --ib-alert-dim:    rgba(212, 80, 80, 0.08);
  --ib-data:         #6B8FB5;             /* 5.79:1 vs bg — AA */
  --ib-data-dim:     rgba(107, 143, 181, 0.12);

  /* === Severity === */
  --ib-sev-info:     var(--ib-data);      /* alias explicite pour éviter la double-source de vérité */
  --ib-sev-info-dim: var(--ib-data-dim);  /* M5-M9 prep */
  --ib-sev-warn:     #B58A3C;
  --ib-sev-warn-dim: rgba(181, 138, 60, 0.08);
  --ib-sev-critical: var(--ib-alert);     /* alias explicite (même hex que alert avant et après bump) */
  --ib-sev-critical-dim: var(--ib-alert-dim);

  /* === États === */
  --ib-focus-ring:   0 0 0 2px rgba(107,143,181,.25), 0 0 0 1px #6B8FB5;
  --ib-hover-bg:     rgba(232,236,239,.03);
  --ib-active-bg:    rgba(232,236,239,.06);

  /* === Typo === */
  --ib-ff-serif:     "Newsreader", Georgia, serif;
  --ib-ff-sans:      "Geist", system-ui, sans-serif;
  --ib-ff-mono:      "JetBrains Mono", ui-monospace, monospace;

  /* === Spacing 4px base === */
  --ib-sp-1: 4px;  --ib-sp-2: 8px;  --ib-sp-3: 12px; --ib-sp-4: 16px;
  --ib-sp-5: 20px; --ib-sp-6: 24px; --ib-sp-8: 32px; --ib-sp-12: 48px;
  --ib-sp-16: 64px;
}

/* === Reset arrondis sur dashboard (overridable au cas par cas) === */
.ib-dashboard *,
.ib-dashboard *::before,
.ib-dashboard *::after {
  border-radius: 0;
}
/* Exceptions : pastilles statut, LED, avatars (ils gardent leur rond) */
.ib-dashboard .ib-status-dot,
.ib-dashboard .ib-vital-led,
.ib-dashboard .cam-tg-chip[data-initials],
.ib-dashboard .ib-led-circle {
  border-radius: 50%;
}

/* === Utilities signature === */

/* Eyebrow : petit label discret au-dessus d'un titre */
.ib-eyebrow {
  font-family: var(--ib-ff-mono);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--ib-text-faint);
  margin-bottom: var(--ib-sp-2);
}

/* Données numériques en mono tabular */
.ib-data-mono {
  font-family: var(--ib-ff-mono);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0;
}

/* LED pulse — vert vital quand active */
.ib-vital-led {
  display: inline-block;
  width: 8px; height: 8px;
  background: var(--ib-vital);
  box-shadow: 0 0 0 0 var(--ib-vital);
  animation: ib-pulse-vital 2s ease-out infinite;
  vertical-align: middle;
}

@keyframes ib-pulse-vital {
  0%   { box-shadow: 0 0 0 0 rgba(74,140,126,0.5); }
  70%  { box-shadow: 0 0 0 8px rgba(74,140,126,0); }
  100% { box-shadow: 0 0 0 0 rgba(74,140,126,0); }
}

/* Variantes pour autres severities (utilisées ponctuellement) */
.ib-led-alert {
  background: var(--ib-alert);
  animation-name: ib-pulse-alert;
}
@keyframes ib-pulse-alert {
  0%   { box-shadow: 0 0 0 0 rgba(200,69,69,0.6); }
  70%  { box-shadow: 0 0 0 10px rgba(200,69,69,0); }
  100% { box-shadow: 0 0 0 0 rgba(200,69,69,0); }
}

/* Stack vertical réutilisable */
.ib-stack { display: flex; flex-direction: column; }
.ib-stack-2 > * + * { margin-top: var(--ib-sp-2); }
.ib-stack-4 > * + * { margin-top: var(--ib-sp-4); }
.ib-stack-6 > * + * { margin-top: var(--ib-sp-6); }

/* Cluster horizontal */
.ib-cluster {
  display: flex;
  flex-wrap: wrap;
  gap: var(--ib-sp-3);
  align-items: center;
}

/* Border-left severity (pattern AlertCard à venir M6) */
.ib-border-left-sev {
  border-left: 3px solid var(--ib-sev-info);
  padding-left: var(--ib-sp-4);
}
.ib-border-left-sev[data-sev="warn"]     { border-left-color: var(--ib-sev-warn); }
.ib-border-left-sev[data-sev="critical"] { border-left-color: var(--ib-sev-critical); }