.teal-reporter.outline-button {
  position: relative;
  padding: 0.3em;
  border-radius: 5px;
  background: transparent;
}

.teal-reporter.outline-button.disabled,
.teal-reporter.outline-button:disabled {
  pointer-events: none;
  opacity: 0.65;
}

.teal-reporter.outline-button.primary {
  color: var(--bs-primary);
  border: solid 1px var(--bs-primary);
}

.teal-reporter.outline-button.primary:hover:not(:disabled) {
  background: var(--bs-primary-bg-subtle);
}

.teal-reporter.outline-button.danger {
  color: var(--bs-danger);
  border: solid 1px var(--bs-danger);
}

.teal-reporter.outline-button.danger:hover:not(:disabled) {
  background: var(--bs-danger-bg-subtle);
}

.teal-reporter.outline-button .badge {
  position: absolute;
  top: -1em;
  right: -0.5em;
}

.teal-reporter.outline-button.secondary {
  color: var(--bs-secondary);
  border: solid 1px var(--bs-secondary);
}

.teal-reporter.outline-button.secondary:hover:not(:disabled) {
  background: var(--bs-secondary-bg-subtle);
}