.badge {
  padding: var(--inline-space-half) var(--inline-space);
  border-radius: 8px;
}

.badge-asset {
  color: var(--color-account-asset);
  background: var(--color-account-asset-soft);
}

.badge-liability {
  color: var(--color-account-liability);
  background: var(--color-account-liability-soft);
}

.badge-equity {
  color: var(--color-account-equity);
  background: var(--color-account-equity-soft);
}

.badge-revenue {
  color: var(--color-account-revenue);
  background: var(--color-account-revenue-soft);
}

.badge-expense {
  color: var(--color-account-expense);
  background: var(--color-account-expense-soft);
}

.badge-secondary {
  color: var(--color-ink-muted);
  background: var(--color-border-light);
}

.badge-pending {
  color: var(--color-status-pending);
  background: var(--color-status-pending-soft);
}

.badge-success {
  color: var(--color-status-success);
  background: var(--color-status-success-soft);
}

.badge-ignored {
  color: var(--color-status-ignored);
  background: var(--color-status-ignored-soft);
}

.badge--pending {
  background-color: var(--color-status-pending-soft);
  color: var(--color-status-pending);
}

.badge--booked {
  background-color: var(--color-warning-soft);
  color: var(--color-warning);
}

.badge--paid {
  background-color: var(--color-status-success-soft);
  color: var(--color-status-success);
}

.badge--cancelled {
  background-color: var(--color-border);
  color: var(--color-ink-muted);
}

.badge--overdue {
  background-color: var(--color-negative-soft);
  color: var(--color-negative);
}