@mixin setup-light-slider {
  $--slider-rail-background-color: (
    'default': rgba(0, 0, 0, .2),
    'hover': rgba(0, 0, 0, .15)
  ) !global;
  $--slider-rail-fill-background-color: (
    'default': $--primary-6,
    'hover': $--primary-5
  ) !global;
  $--slider-handle-background-color: white !global;
  $--slider-handle-box-shadow: (
    'default': inset 0 0 0 2px $--primary-6,
    'hover': inset 0 0 0 2px $--primary-5,
    'active': (inset 0 0 0 2px $--primary-5, 0 0 0 3px change-color($--primary-6, $alpha: .2)),
    'focus': (inset 0 0 0 2px $--primary-6, 0 0 0 3px change-color($--primary-6, $alpha: .2))
  ) !global;
  $--slider-indicator-background-color: $--alpha-neutral-2 !global;
  $--slider-indicator-box-shadow: 0px 2px 12px 0px rgba(0, 0, 0, 0.18) !global;
  $--slider-indicator-color: white !global;
  $--slider-dot-box-shadow: (
    'default': inset 0 0 0 2px $--primary-6,
    'active': inset 0 0 0 2px $--primary-5
  ) !global;
}