/* ──────────────────────────────────────────────────────────────────
   Pharma Sales – vet/human dataset selector
   Style the RadioItems buttons to match the timeline-pill look.
   ────────────────────────────────────────────────────────────────── */

/* Base (unselected) — match .timeline-pill */
.btn-check + .btn.metric-btn {
  background: var(--gray-050, #f8f9fa);
  border: 1px solid var(--gray-200, #e5e7eb);
  color: var(--gray-700, #374151);
  border-radius: 0.25rem;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.10);
  font-size: 0.85rem;
  font-weight: 500;
  padding: 0.25rem 0.65rem;
  transition: background-color 120ms ease-out, border-color 120ms ease-out;
}

/* Hover */
.btn-check + .btn.metric-btn:hover {
  background-color: var(--gray-100, #f1f5f9);
  border-color: var(--gray-300, #d1d5db);
}

/* Checked / active — match .timeline-pill--current */
.btn-check:checked + .btn.metric-btn,
.btn.metric-btn.active {
  background: var(--blue-100, #dbeafe) !important;
  border-color: var(--blue-600, #2563eb) !important;
  color: var(--blue-700, #1557a2) !important;
  font-weight: 600;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.10);
}

/* Focus ring */
.btn-check:focus + .btn.metric-btn,
.btn.metric-btn:focus-visible {
  outline: 0;
  box-shadow: 0 0 0 0.20rem rgba(37, 99, 235, 0.25);
}
