/* badge.css - Reusable badge variants and status label styles. */
/* Sections: Badge base style, semantic status variants, and compact label treatment. */

/* Core badge styles */

/* Primary style rules */

.badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 10px;
  font-size: var(--text-xs);
  font-weight: var(--fw-semibold);
  border-radius: var(--radius-full);
  line-height: 1.4;
  white-space: nowrap;
}

.badge .material-icons { font-size: 12px; }


.badge--healthy {
  background: var(--clr-success-bg);
  color: var(--clr-success-text);
}

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

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

.badge--neutral {
  background: var(--clr-surface-2);
  color: var(--clr-text-secondary);
}

.badge--brand {
  background: var(--clr-brand-medium);
  color: var(--clr-brand);
}