@import '../common/index.wxss';

.van-slider {
  position: relative;
  height: 4rpx;
  height: var(--slider-bar-height,4rpx);
  border-radius: 1998rpx;
  border-radius: var(--border-radius-max,1998rpx);
  background-color: #ebedf0;
  background-color: var(--slider-inactive-background-color,#ebedf0);
}

.van-slider:before {
  position: absolute;
  right: 0;
  left: 0;
  content: "";
  top: -16rpx;
  top: -var(--padding-xs,16rpx);
  bottom: -16rpx;
  bottom: -var(--padding-xs,16rpx);
}

.van-slider__bar {
  position: relative;
  width: 100%;
  height: 100%;
  background-color: #1989fa;
  background-color: var(--slider-active-background-color,#1989fa);
  border-radius: inherit;
  transition: all .2s;
  transition: all var(--animation-duration-fast,.2s);
}

.van-slider__button {
  width: 48rpx;
  width: var(--slider-button-width,48rpx);
  height: 48rpx;
  height: var(--slider-button-height,48rpx);
  border-radius: 50%;
  border-radius: var(--slider-button-border-radius,50%);
  box-shadow: 0 2rpx 4rpx rgba(0,0,0,.5);
  box-shadow: var(--slider-button-box-shadow,0 2rpx 4rpx rgba(0,0,0,.5));
  background-color: #fff;
  background-color: var(--slider-button-background-color,#fff);
}

.van-slider__button-wrapper {
  position: absolute;
  top: 50%;
  right: 0;
  -webkit-transform: translate3d(50%,-50%,0);
  transform: translate3d(50%,-50%,0);
}

.van-slider--disabled {
  opacity: .5;
  opacity: var(--slider-disabled-opacity,.5);
}