/* ============================================================
   DiveLog DS — Component: Badge
   Etichette inline per stati, categorie, tags.
   Estratto da: wac-components.css + log_immersioni.css
   Token: --color-success, --color-warning, --color-error,
          --color-info, --color-primary, --color-tertiary,
          --color-border, --color-text-secondary,
          --color-surface-container, --radius-pill,
          --space-1, --space-2, --space-3, --weight-medium,
          --font-label-large
   ============================================================ */

.badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  padding: var(--space-1) var(--space-3);
  border-radius: var(--radius-pill);
  font-size: var(--font-label-large);
  font-weight: var(--weight-medium);
  line-height: 1;
  white-space: nowrap;
  background: var(--color-surface-container);
  border: 1px solid var(--color-border);
  color: var(--color-text-secondary);
}

.badge--success {
  color: var(--color-success);
  border-color: var(--color-success);
}

.badge--warning {
  color: var(--color-warning);
  border-color: var(--color-warning);
}

.badge--error {
  color: var(--color-error);
  border-color: var(--color-error);
}

.badge--info {
  color: var(--color-primary);
  border-color: var(--color-primary);
}

.badge--neutral {
  color: var(--color-text-secondary);
  border-color: var(--color-border);
}

.badge--course {
  color: var(--color-tertiary);
  border-color: var(--color-tertiary);
}

/* ── Didattica ── */
.badge--cmas {
  color: var(--color-primary);
  border-color: var(--color-primary);
}

.badge--pss {
  color: var(--color-error);
  border-color: var(--color-error);
}

/* ── Ruoli utente ── */
.badge--sub {
  color: var(--color-info);
  border-color: var(--color-info);
}

.badge--istruttore {
  color: var(--color-primary);
  border-color: var(--color-primary);
}

.badge--admin {
  color: var(--color-warning);
  border-color: var(--color-warning);
}

.badge--divelog-admin {
  color: var(--color-success);
  border-color: var(--color-success);
  font-weight: var(--weight-bold);
  text-transform: uppercase;
}

/* ── Badge compatto (densi contesti tabella) ── */
.badge--compact {
  font-size: 0.75rem;
}

/* ── Counter badge (section header notification count) ── */
.badge--counter {
  min-width: 24px;
  height: 24px;
  padding: 0 var(--space-2);
  border-radius: var(--radius-pill);
  background: var(--color-error);
  color: var(--color-on-error);
  font-size: var(--font-label-large);
  font-weight: var(--weight-bold);
  justify-content: center;
  border: none;
}