/* Kuma — fiabilité de l'IA (US-3.10) : tendance en mini-graphique, alerte de refermeture
 * automatique (« kc- »)
 *
 * S'appuie sur les jetons et composants de `kc-admin.css` et les teintes déjà posées par
 * `ecrans-tableaux-de-bord.css` (`.kc-chart-segment--*`). Cette feuille n'ajoute que ce qui
 * est propre à la mini-tendance et à la carte d'alerte.
 *
 * CSP stricte : aucun style en ligne.
 */

/* ====================== Mini-tendance (sparkline) ====================== */

.kc-chart-figure--sparkline {
  max-width: 14rem;
}

.kc-chart-svg--sparkline {
  display: block;
  height: 2.25rem !important;
  width: 100%;
}

/* Une ligne brisée n'est jamais remplie, même quand elle réutilise une teinte pensée pour un
   segment plein (`.kc-chart-segment--*` pose `fill` autant que `stroke`). */
.kc-chart-ligne {
  fill: none;
  stroke-width: 2;
  vector-effect: non-scaling-stroke;
}

/* Repère de seuil, partagé par la mini-tendance et la barre de taux unique : un trait
   pointillé neutre, jamais une teinte de ton (ni ok ni danger) pour qu'il reste lisible
   quelle que soit la couleur de la série qu'il croise. */
.kc-chart-repere-seuil {
  stroke: var(--kc-color-text-soft);
  stroke-width: 1;
  stroke-dasharray: 3 2;
  vector-effect: non-scaling-stroke;
}

/* Légende min/seuil/max : trois valeurs, jamais en retour à la ligne forcé sur un petit
   écran (`gap` suffit, `kc-chart-legende` de base gère déjà le `flex-wrap`). */
.kc-chart-legende--bornes {
  justify-content: space-between;
}

/* ====================== Barre de taux unique (tendance trop courte) ====================== */

.kc-chart-figure--barre-taux {
  max-width: 14rem;
}

.kc-chart-barre-taux {
  display: flex;
  flex-direction: column;
  gap: var(--kc-space-2);
}

/* ====================== Carte d'alerte (refermeture automatique) ====================== */

/* Plus d'accent de bordure (règle 3 du système de surfaces : réservé à `.kc-page-header`) —
   le ton s'y lit par le titre teinté ci-dessous, comme tout autre état sur une carte. */
.kc-card--alerte .kc-card__title {
  color: var(--kc-color-danger);
}

/* ====================== Écran Modes d'IA (modes_ia.html) ====================== */

.ecran-modes-ia .kc-card__body > * + * {
  margin-top: var(--kc-space-2);
}

/* `.kc-grid--3` (palier hérité, `kc-admin.css`) est fluide (`auto-fit`/`minmax`) : à 1536 et
   1440 px, les six cartes (une par `missions.models.FonctionIA`, toujours six — #146, #156,
   #200) y tiennent à quatre par rangée, laissant deux pistes vides en dernière rangée
   (contrôle visuel `outils_qualite/controle_visuel.py`, règle (c)). Six cartes, toujours six : un
   palier figé à 1/2/3 colonnes ne laisse jamais de reste, à aucune largeur. */
.ecran-modes-ia .kc-grid--3 {
  grid-template-columns: repeat(1, 1fr);
}

@media (min-width: 640px) {
  .ecran-modes-ia .kc-grid--3 {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .ecran-modes-ia .kc-grid--3 {
    grid-template-columns: repeat(3, 1fr);
  }
}