/* ============================================================
   CCW Portal — Badges & Pills
   ============================================================ */

/* ── Base Badge ───────────────────────────────────────────── */
.ccw-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  padding: 2px var(--space-2);
  font-size: var(--text-xs);
  font-weight: var(--font-weight-semibold);
  border-radius: var(--radius-full);
  white-space: nowrap;
  line-height: 1.5;
}

.ccw-badge--sm {
  padding: 1px 6px;
  font-size: 0.65rem;
}

.ccw-badge--lg {
  padding: var(--space-1) var(--space-3);
  font-size: var(--text-sm);
}

.ccw-badge__dot {
  width: 6px;
  height: 6px;
  border-radius: var(--radius-full);
  background-color: currentColor;
  flex-shrink: 0;
}

/* ── Status Badges ────────────────────────────────────────── */
.ccw-badge--new {
  background-color: var(--color-status-new-bg);
  color: var(--color-status-new);
}

.ccw-badge--triaged {
  background-color: var(--color-status-triaged-bg);
  color: var(--color-status-triaged);
}

.ccw-badge--investigating {
  background-color: var(--color-status-investigating-bg);
  color: var(--color-status-investigating);
}

.ccw-badge--awaiting {
  background-color: var(--color-status-awaiting-bg);
  color: var(--color-status-awaiting);
}

.ccw-badge--resolved {
  background-color: var(--color-status-resolved-bg);
  color: var(--color-status-resolved);
}

.ccw-badge--closed {
  background-color: var(--color-status-closed-bg);
  color: var(--color-status-closed);
}

.ccw-badge--escalated {
  background-color: var(--color-status-escalated-bg);
  color: var(--color-status-escalated);
}

.ccw-badge--received {
  background-color: var(--color-status-received-bg);
  color: var(--color-status-received);
}

.ccw-badge--logged {
  background-color: var(--color-status-logged-bg);
  color: var(--color-status-logged);
}

.ccw-badge--referred {
  background-color: var(--color-status-referred-bg);
  color: var(--color-status-referred);
}

/* ── Severity Badges ──────────────────────────────────────── */
.ccw-badge--low {
  background-color: var(--color-severity-low-bg);
  color: var(--color-severity-low);
}

.ccw-badge--medium {
  background-color: var(--color-severity-medium-bg);
  color: var(--color-severity-medium);
}

.ccw-badge--high {
  background-color: var(--color-severity-high-bg);
  color: var(--color-severity-high);
}

.ccw-badge--critical {
  background-color: var(--color-severity-critical-bg);
  color: var(--color-severity-critical);
}

.ccw-badge--serious {
  background-color: var(--color-severity-serious-bg);
  color: var(--color-severity-serious);
}

/* ── Category Badges ──────────────────────────────────────── */
.ccw-badge--complaint {
  background-color: var(--color-complaint-light);
  color: var(--color-complaint-dark);
}

.ccw-badge--compliment {
  background-color: var(--color-compliment-light);
  color: var(--color-compliment-dark);
}

.ccw-badge--whistleblowing {
  background-color: var(--color-whistleblowing-light);
  color: var(--color-whistleblowing);
}

/* ── Role Badges ──────────────────────────────────────────── */
.ccw-badge--staff {
  background-color: var(--color-bg-tertiary);
  color: var(--color-text-secondary);
}

.ccw-badge--handler {
  background-color: var(--color-info-bg);
  color: var(--color-info);
}

.ccw-badge--wb-handler {
  background-color: var(--color-whistleblowing-light);
  color: var(--color-whistleblowing);
}

.ccw-badge--manager {
  background-color: var(--color-warning-bg);
  color: var(--color-warning);
}

.ccw-badge--admin {
  background-color: var(--color-error-bg);
  color: var(--color-error);
}

/* ── Generic colour variants ──────────────────────────────── */
.ccw-badge--success {
  background-color: var(--color-success-bg);
  color: var(--color-success);
}

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

.ccw-badge--error {
  background-color: var(--color-error-bg);
  color: var(--color-error);
}

.ccw-badge--info {
  background-color: var(--color-info-bg);
  color: var(--color-info);
}

.ccw-badge--neutral {
  background-color: var(--color-bg-tertiary);
  color: var(--color-text-secondary);
}

/* ── SLA breach indicator ─────────────────────────────────── */
.ccw-badge--sla-breached {
  background-color: var(--color-error-bg);
  color: var(--color-error);
  animation: pulse 2s ease-in-out infinite;
}

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.65; }
}

/* ── Anonymous badge ──────────────────────────────────────── */
.ccw-badge--anonymous {
  background-color: var(--color-bg-tertiary);
  color: var(--color-text-tertiary);
  font-style: italic;
}

/* ── Count badge (notification-style) ────────────────────── */
.ccw-count-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 18px;
  height: 18px;
  padding: 0 var(--space-1);
  background-color: var(--color-error);
  color: white;
  font-size: 0.65rem;
  font-weight: var(--font-weight-bold);
  border-radius: var(--radius-full);
  line-height: 1;
}