@import "../../../index";

.bi-single-slider-button {
  & .slider-button {
    cursor: ew-resize;
    border-width: 2px;
    border-style: solid;
    .border-radius(8px);
    background-color: @color-bi-background-default;
    height: 16px;
    width: 16px;
    top: 6px;
    left: -8px;
    &:hover, &.hover {
      .border-radius(10px);
      background-color: @color-bi-background-normal;
      width: 20px;
      height: 20px;
      top: 4px;
      left: -10px;
    }
    &.disabled {
      border-color: @color-bi-border-disabled;
      &:hover, &.hover {
        background-color: @color-bi-background-normal;
        width: 16px;
        height: 16px;
        top: 6px;
        left: -8px;
      }
    }
  }
}

.bi-theme-dark {
  .bi-single-slider-button {
    & .slider-button {
      background-color: @color-bi-background-default-theme-dark;
      &:hover, &.hover {
        background-color: @color-bi-background-normal-theme-dark;
      }
      &.disabled {
        &:hover, &.hover {
          background-color: @color-bi-background-normal-theme-dark;
        }
      }
    }
  }
}