.BaseToggle {
  @apply inline-flex;
  @apply items-center;
  @apply justify-center;
  @apply rounded-full;
  @apply font-ctas;
  @apply transition-colors;
  @apply px-3;
  @apply py-1;
  @apply tracking-wider;

  @apply hover:bg-accent;
  @apply hover:text-accent-foreground;

  @apply focus-visible:outline-none;
  @apply focus-visible:ring-1;
  @apply focus-visible:ring-stone-950;
  @apply disabled:pointer-events-none;
  @apply disabled:opacity-50;

  @apply data-[state=on]:bg-primary;
  @apply data-[state=on]:text-primary-foreground;
}

/* :global(.dark) .BaseToggle {
  @apply bg-transparent;
} */

.default {
  @apply bg-transparent;
}

.outline {
  @apply border;
  @apply border-stone-200;
  @apply bg-transparent;
  @apply shadow-sm;
}

.size-default {
  @apply h-9 px-3;
}

.size-sm {
  @apply h-8 px-2;
}

.size-lg {
  @apply h-10 px-3;
}
