.ui-status-pill {
  align-items: center;
  background: var(--ui-status-pill-bg);
  border: 1px solid var(--ui-status-pill-border, var(--ui-border-strong));
  border-radius: var(--ui-radius-pill);
  color: var(--ui-status-pill-text);
  display: inline-flex;
  font-size: var(--ui-font-size-xs);
  font-weight: var(--ui-font-weight-semibold);
  gap: var(--ui-space-1);
  line-height: 1;
  min-height: var(--ui-status-pill-height, 1.375rem);
  padding: var(--ui-status-pill-padding, 0.1875rem var(--ui-space-2));
  vertical-align: middle;
}

.ui-status-pill--sm {
  --ui-status-pill-height: 1.125rem;
  --ui-status-pill-padding: 0 var(--ui-space-2);
}

.ui-status-pill--success {
  background: var(--ui-color-success-muted);
  border-color: var(--ui-color-success-strong);
  color: var(--ui-color-success-on-muted);
}

.ui-status-pill--warning {
  background: var(--ui-color-warning-muted);
  border-color: var(--ui-color-warning-strong);
  color: var(--ui-color-warning-on-muted);
}

.ui-status-pill--danger {
  background: var(--ui-color-danger-muted);
  border-color: var(--ui-color-danger-strong);
  color: var(--ui-color-danger-on-muted);
}

.ui-status-pill--info {
  background: var(--ui-color-info-muted);
  border-color: var(--ui-color-info-strong);
  color: var(--ui-color-info-on-muted);
}

.ui-status-pill--muted {
  background: var(--ui-surface-muted);
  border-color: var(--ui-border-subtle);
  color: var(--ui-text-muted);
}

.ui-status-pill[data-content-color] {
  background: var(--content-color-muted-bg);
  border-color: var(--content-color-border);
  color: var(--content-color-text);
}
