/* ==========================================================================
   Peerly Draw — Badges & chips (Material 3)
   ========================================================================== */

.badge {
  display: inline-flex;
  align-items: center;
  gap: var(--md-sys-spacing-half);
  padding: var(--md-sys-spacing-half) var(--md-sys-spacing-1);
  border-radius: var(--md-sys-shape-sm);
  font-family: var(--md-sys-typescale-mono);
  font-size: var(--md-sys-typescale-label-medium-size);
  font-weight: 500;
  background: var(--md-sys-color-surface-container-high);
  color: var(--md-sys-color-on-surface-variant);
}

.badge--primary {
  background: var(--md-sys-color-primary-container);
  color: var(--md-sys-color-on-primary-container);
}

.badge--success {
  background: var(--md-sys-color-success-container);
  color: var(--md-sys-color-on-success-container);
}