.c-slider-root {
  @apply relative flex w-52 touch-none select-none items-center;
  @apply data-[orientation='horizontal']:h-5;
  @apply data-[orientation='vertical']:h-28 data-[orientation='vertical']:w-5 data-[orientation='vertical']:flex-col;
}

.c-slider-track {
  @apply relative grow rounded-full bg-gray-100-800;
  @apply data-[orientation='horizontal']:h-[3px];
  @apply data-[orientation='vertical']:w-[3px];
}

.c-slider-range {
  @apply absolute rounded-full bg-gray-600-300;
  @apply data-[orientation="horizontal"]:h-full;
  @apply data-[orientation="vertical"]:w-full;
}

.c-slider-range-transparent {
  @apply bg-transparent;
}

.c-slider-thumb {
  @apply block h-5 w-5 rounded-xl bg-gray-600-300 shadow;
  @apply hover:bg-gray-700-200;
  @apply focus:shadow-lg focus:outline-none;
}
