@reference "../../../../styles/index.css";

.facetTabsWrapper {
  @apply mb-2
    overflow-x-auto
    pt-2;

  &::-webkit-scrollbar {
    @apply hidden;
  }
}

.facetTabItem {
  @apply flex
    cursor-pointer
    items-center
    gap-2
    rounded-3xl
    border
    border-neutral-200
    px-3
    py-1
    text-sm
    focus:outline-none
    focus-visible:bg-neutral-300
    motion-safe:transition-colors
    dark:border-neutral-900
    dark:focus-visible:bg-neutral-900;
}

.facetTabItemSelected {
  @apply border-brand-600
    dark:border-brand-400
    border-2;
}

.facetTabsList {
  @apply flex
    w-max
    items-center
    gap-2
    overflow-x-auto;

  &::-webkit-scrollbar {
    @apply hidden;
  }
}

.facetTabItemCount {
  @apply text-neutral-700;
}
