/* ---------------------------------------------------------------------------
   PS-PIT — habillage de l'espace Pilotage.

   Fichier propre au fork : le produit n'en a pas besoin et ne doit pas le
   recevoir lors d'une remontée. Tout est porté sous .pspit-pilotage pour
   qu'aucune règle ne déborde sur les écrans du produit.

   Les teintes d'indicateur passent par des classes et non par un attribut
   style : un style en ligne gagne contre la feuille du mode sombre, et les
   pastilles restaient blanches sur fond noir.
   --------------------------------------------------------------------------- */

/* ── Teintes d'indicateur : pastille d'icône et badge ────────────────────── */
.pspit-teinte { box-shadow: inset 0 0 0 1px var(--pspit-trait); background: var(--pspit-fond); color: var(--pspit-encre); }
.pspit-badge  { background: var(--pspit-fond); color: var(--pspit-encre); }

.pspit-bleu    { --pspit-fond: #eff6ff; --pspit-trait: #dbeafe; --pspit-encre: #1d4ed8; }
.pspit-vert    { --pspit-fond: #ecfdf5; --pspit-trait: #d1fae5; --pspit-encre: #047857; }
.pspit-orange  { --pspit-fond: #fff7ed; --pspit-trait: #ffedd5; --pspit-encre: #c2410c; }
.pspit-ambre   { --pspit-fond: #fffbeb; --pspit-trait: #fef3c7; --pspit-encre: #b45309; }
.pspit-violet  { --pspit-fond: #f5f3ff; --pspit-trait: #ede9fe; --pspit-encre: #6d28d9; }
.pspit-rouge   { --pspit-fond: #fef2f2; --pspit-trait: #fee2e2; --pspit-encre: #b91c1c; }
.pspit-ardoise { --pspit-fond: #f8fafc; --pspit-trait: #e9edf3; --pspit-encre: #475569; }

/* En sombre, la teinte devient un voile coloré sur le fond de la carte, et
   l'encre passe dans la gamme claire. Le rapport de contraste reste tenu. */
html.dark .pspit-bleu    { --pspit-fond: rgba(59,130,246,.14);  --pspit-trait: rgba(59,130,246,.26);  --pspit-encre: #93c5fd; }
html.dark .pspit-vert    { --pspit-fond: rgba(16,185,129,.14);  --pspit-trait: rgba(16,185,129,.26);  --pspit-encre: #6ee7b7; }
html.dark .pspit-orange  { --pspit-fond: rgba(249,115,22,.14);  --pspit-trait: rgba(249,115,22,.26);  --pspit-encre: #fdba74; }
html.dark .pspit-ambre   { --pspit-fond: rgba(245,158,11,.14);  --pspit-trait: rgba(245,158,11,.26);  --pspit-encre: #fcd34d; }
html.dark .pspit-violet  { --pspit-fond: rgba(139,92,246,.16);  --pspit-trait: rgba(139,92,246,.28);  --pspit-encre: #c4b5fd; }
html.dark .pspit-rouge   { --pspit-fond: rgba(239,68,68,.14);   --pspit-trait: rgba(239,68,68,.28);   --pspit-encre: #fca5a5; }
html.dark .pspit-ardoise { --pspit-fond: rgba(148,163,184,.14); --pspit-trait: rgba(148,163,184,.26); --pspit-encre: #cbd5e1; }

/* ── Pastilles de statut, planning, risque et gravité ────────────────────── */
/* En clair elles gardent les classes Tailwind. En sombre on les rattrape,
   sinon elles restent des pilules vives sur fond noir. */
html.dark .pspit-pilotage .pspit-chip { border-color: transparent !important; }
html.dark .pspit-pilotage .pspit-chip.bg-emerald-50 { background: rgba(16,185,129,.14) !important; color: #6ee7b7 !important; }
html.dark .pspit-pilotage .pspit-chip.bg-blue-50    { background: rgba(59,130,246,.14) !important; color: #93c5fd !important; }
html.dark .pspit-pilotage .pspit-chip.bg-red-50     { background: rgba(239,68,68,.14)  !important; color: #fca5a5 !important; }
html.dark .pspit-pilotage .pspit-chip.bg-amber-50   { background: rgba(245,158,11,.14) !important; color: #fcd34d !important; }
html.dark .pspit-pilotage .pspit-chip.bg-gray-50    { background: rgba(148,163,184,.12) !important; color: #c9d1d9 !important; }

/* ── Lignes de tableau ───────────────────────────────────────────────────── */
/* .bg-gray-50 est repris par le mode sombre, mais pas sa variante :hover. */
html.dark .pspit-pilotage tbody tr:hover { background-color: #1c2128 !important; }

/* ── Bulle d'explication ─────────────────────────────────────────────────── */
.pspit-bulle { background: #111827; color: #f3f4f6; box-shadow: 0 12px 32px -12px rgba(16,24,40,.55), 0 2px 6px rgba(16,24,40,.20); }
html.dark .pspit-bulle { background: #1c2128; color: #e6edf3; box-shadow: 0 0 0 1px #30363d, 0 20px 50px rgba(0,0,0,.6); }

/* ── Barre d'avancement ──────────────────────────────────────────────────── */
html.dark .pspit-pilotage .bg-gray-100 { background-color: #21262d !important; }

/* ── Carte de pilotage ───────────────────────────────────────────────────── */
/* Fond sombre obtenu par filtre sur les tuiles : aucune clé d'API en jeu. */
html.dark .pspit-carte .leaflet-tile-pane { filter: invert(1) hue-rotate(180deg) brightness(.92) contrast(.92) saturate(.75); }
html.dark .pspit-carte .leaflet-container { background: #0d1117; }

/* ── Marqueurs et fiches de la carte de pilotage ─────────────────────────── */
/* La grappe est un anneau découpé au prorata des directions qu'elle contient.
   Le fond conique est posé par le contrôleur, la couleur n'est donc jamais
   choisie arbitrairement quand plusieurs directions se superposent. */
.pspit-grappe {
  width: 100%; height: 100%;
  display: flex; align-items: center; justify-content: center;
  border-radius: 9999px;
  box-shadow: 0 1px 4px rgba(16, 24, 40, .35);
}
.pspit-grappe-noyau {
  width: calc(100% - 11px); height: calc(100% - 11px);
  display: flex; align-items: center; justify-content: center;
  border-radius: 9999px;
  background: #ffffff;
  color: #1f2937; font-weight: 700; font-size: 12px;
  font-variant-numeric: tabular-nums;
}
html.dark .pspit-grappe-noyau { background: #161b22; color: #e6edf3; }

.pspit-survol-titre { font-weight: 600; font-size: 12px; max-width: 260px; }
.pspit-survol-note  { font-size: 11px; opacity: .7; margin-top: 2px; }
.pspit-survol-part {
  display: flex; align-items: center; gap: 6px;
  font-size: 11px; margin-top: 3px;
}
.pspit-survol-part strong { margin-left: auto; font-variant-numeric: tabular-nums; }
.pspit-survol-puce { width: 8px; height: 8px; border-radius: 9999px; flex-shrink: 0; }

.pspit-fiche-titre { font-weight: 600; font-size: 13px; line-height: 1.35; margin-bottom: 6px; }
.pspit-fiche-direction {
  display: inline-block; font-size: 11px; font-weight: 600; margin-bottom: 8px;
  padding: 2px 8px; border-radius: 9999px;
  color: var(--pspit-couleur); box-shadow: inset 0 0 0 1px var(--pspit-couleur);
}
.pspit-fiche-ligne { display: flex; justify-content: space-between; gap: 12px; font-size: 12px; padding: 3px 0; border-top: 1px solid rgba(148,163,184,.22); }
.pspit-fiche-ligne span { opacity: .65; }
html.dark .pspit-popup .leaflet-popup-content-wrapper,
html.dark .pspit-popup .leaflet-popup-tip { background: #1c2128; color: #e6edf3; }