/* Badge — la pastille de statut, en lecture seule.
   Référence : docs/design-system.md. */

.badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  height: 22px;
  padding: 0 var(--space-2);
  border-radius: var(--radius-sm);
  font-size: var(--text-11);
  font-weight: var(--weight-medium);
  line-height: normal; /* centré par la boîte, pas par la ligne — raison dans count.css (#232) */
  white-space: nowrap;
  background: var(--badge-bg, var(--badge-neutral-bg));
  color: var(--badge-text, var(--badge-neutral-text));

  /* une bordure sans toucher la boîte : la couleur du texte à 35 % par défaut
     (#356 — sur une ligne de table teintée, le fond pastel est à la luminance
     de la ligne et la pastille n'avait plus de forme) ; --badge-border la
     remplace pour une couleur libre */
  box-shadow: inset 0 0 0 1px var(--badge-border, color-mix(in srgb, currentcolor 35%, transparent));
}

/* --- Taille et forme --- */
.badge--sm {
  height: 18px;
  padding: 0 var(--space-1-5);
  font-size: var(--text-10);
}

/* Le portail client met ses badges en capitales (décision du 18/09/2026). */
.badge--caps {
  text-transform: uppercase;
  letter-spacing: 0.03em;
}

/* --- Tons : les valeurs sont en fin de feuille --- */
:is(.badge--success, .badge--warning, .badge--danger, .badge--info, .badge--primary) {
  background: var(--tone-bg);
  color: var(--tone-text);
}

.badge--outline {
  background: transparent;
  border: 1px solid var(--color-border);
  color: var(--color-text-secondary);
  box-shadow: none; /* sa bordure est une vraie bordure */
}

/* Fond plein, texte inverse : la couleur vient du rôle, ou de --badge-bg
   pour une couleur libre. Le contraste d'une couleur libre n'est pas garanti. */
.badge--solid {
  background: var(--badge-bg, var(--color-text-secondary));
  color: var(--color-text-inverse);
  box-shadow: none; /* un fond plein a déjà sa forme */
}

.badge--solid:is(.badge--success, .badge--warning, .badge--danger, .badge--info, .badge--primary) {
  background: var(--tone-solid);
}

/* --- Le compteur : un nombre dans une pastille ronde, à côté d'un libellé (non
   lus, cartes d'une colonne) ; vide, il disparaît. Ex-famille count (lot S-4). --- */
.badge--count {
  justify-content: center;
  min-width: 20px;
  height: 20px;
  padding: 0 var(--space-1-5);
  border-radius: var(--radius-pill);
  background: var(--color-count-bg, var(--color-bg-hover));
  color: var(--color-count-text, var(--color-text-secondary));
  font-weight: var(--weight-semibold);
  box-shadow: none;
}

.badge--count:empty {
  display: none;
}

.badge--count:is(.badge--primary, .badge--danger) {
  background: var(--tone-solid);
  color: var(--color-text-inverse);
}

/* Sur un fond de couleur (la barre latérale) : un voile clair. */
.badge--ghost {
  background: color-mix(in srgb, var(--color-surface) 25%, transparent);
  color: inherit;
  box-shadow: none;
}

/* --- Statuts de projet : une couleur par statut (décision du 18/09/2026),
   les sept seuls modifiers nommés par une valeur métier de la famille.
   Posés par Projet.badge_class. Acté et Terminé ont deux verts, Brouillon
   et Archivé deux gris : les nuances sont dans tokens.css. --- */
.badge--brouillon {
  background: var(--badge-neutral-bg);
  color: var(--badge-neutral-text);
}

.badge--en-attente {
  background: var(--badge-warning-bg);
  color: var(--badge-warning-text);
}

.badge--acte {
  background: var(--badge-acte-bg);
  color: var(--badge-acte-text);
}

.badge--en-cours {
  background: var(--badge-info-bg);
  color: var(--badge-info-text);
}

.badge--termine {
  background: var(--badge-termine-bg);
  color: var(--badge-termine-text);
}

.badge--archive {
  background: var(--badge-archive-bg);
  color: var(--badge-archive-text);
}

.badge--annule {
  background: var(--badge-danger-bg);
  color: var(--badge-danger-text);
}

/* --- Tons (sortis de tone.css au passage au harness 0.13) : chaque ton pose les seules
   propriétés `--tone-*` que ce composant lit, d'après les tokens du ton. --- */

.badge--success {
  --tone-bg: var(--badge-success-bg);
  --tone-text: var(--badge-success-text);
  --tone-solid: var(--color-success);
}

.badge--warning {
  --tone-bg: var(--badge-warning-bg);
  --tone-text: var(--badge-warning-text);
  --tone-solid: var(--color-warning);
}

.badge--danger {
  --tone-bg: var(--badge-danger-bg);
  --tone-text: var(--badge-danger-text);
  --tone-solid: var(--color-danger);
}

.badge--info {
  --tone-bg: var(--badge-info-bg);
  --tone-text: var(--badge-info-text);
  --tone-solid: var(--color-info);
}

.badge--primary {
  --tone-bg: var(--color-primary-bg);
  --tone-text: var(--color-primary);
  --tone-solid: var(--color-primary);
}