/* ========================================
   Slider Components
   ======================================== */

 .slider-root {
  @apply relative flex items-center w-full h-5;
  @apply select-none touch-none;
}

 .slider-track {
  @apply relative h-1.5 w-full bg-surface-secondary rounded-full;
}

 .slider-range {
  @apply absolute h-full bg-primary rounded-full;
}

 .slider-thumb {
  @apply block w-4 h-4 bg-white border-2 border-primary rounded-full;
  @apply shadow-sm;
  @apply focus:outline-none focus:ring-2 focus:ring-primary focus:ring-offset-2;
  @apply hover:bg-surface-secondary;
}
