.badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  padding: var(--space-xs) var(--space-sm);
  border-radius: var(--radius-sm);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  line-height: 1.2;
  white-space: nowrap;
  background: var(--color-gray-20);
  color: var(--color-gray-70);
}

.badge--state-received {
  background: var(--color-gray-20);
  color: var(--color-gray-70);
}

.badge--state-matched,
.badge--state-waiting_for_am {
  background: var(--color-info-bg);
  color: var(--color-info-text);
}

.badge--state-accepted,
.badge--state-code_sent {
  background: var(--color-success-bg);
  color: var(--color-success-text);
}

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

.badge--state-rejected,
.badge--state-disputed {
  background: var(--color-danger-light);
  color: var(--color-danger-text);
}

.badge--state-closed {
  background: var(--color-gray-10);
  color: var(--color-gray-50);
}

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

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

.badge--direction {
  background: var(--color-primary-light);
  color: var(--color-primary);
}

.badge--sla-overdue {
  background: var(--color-danger-light);
  color: var(--color-danger-text);
}

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

.badge--sla-tacit {
  background: var(--color-primary-light);
  color: var(--color-primary-hover);
}

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

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

.reply-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-left: var(--space-xs);
  padding: 0;
  border: none;
  border-radius: 50%;
  vertical-align: middle;
  background: var(--color-warning);
  cursor: pointer;
}

.reply-dot:hover {
  transform: scale(1.4);
}

.badge--action {
  border: none;
  font-family: inherit;
  cursor: pointer;
}

.pa-chip {
  display: inline-flex;
  align-items: center;
  gap: var(--space-xs);
  padding: 2px var(--space-sm);
  border-radius: var(--radius-sm);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
  white-space: nowrap;
  background: hsl(var(--pa-hue), 65%, 94%);
  color: hsl(var(--pa-hue), 55%, 28%);
}

.pa-chip__dot {
  flex: none;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: hsl(var(--pa-hue), 60%, 50%);
}

.pa-chip__label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.table--compact .pa-chip {
  max-width: 140px;
}

.badge--pending {
  background: var(--color-primary);
  color: white;
  border-radius: 999px;
  padding: 1px 7px;
}

.badge--kind-request,
.badge--kind-other {
  background: var(--color-gray-20);
  color: var(--color-gray-70);
}

.badge--kind-reply,
.badge--kind-ack {
  background: var(--color-info-bg);
  color: var(--color-info-text);
}

.badge--kind-accept,
.badge--kind-code_sent {
  background: var(--color-success-bg);
  color: var(--color-success-text);
}

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

.badge--kind-reject {
  background: var(--color-danger-light);
  color: var(--color-danger-text);
}
