@import "../core/exports";
@import "../page/page.windows";
@import "../progress/progress.windows";
@import "./slider.windows.colors";
@import "./slider";

@include exports("slider.windows") {
  .mbsc-windows {
    &.mbsc-slider .mbsc-input-wrap {
      padding: 0 .3125em;
    }

    &.mbsc-slider .mbsc-input-ic {
      top: -.0625em;
    }

    &.mbsc-slider .mbsc-progress-track {
      height: 6px;
    }

    .mbsc-slider-handle {
      top: 50%;
      width: .5em;
      border-radius: 6px;
      height: 1.5em;
      margin: -0.75em -0.25em 0 0;
    }

    .mbsc-slider-tooltip {
      height: 1.875em;
      padding: 0 .75em;
      top: -2.75em;
      line-height: 1.875em;
      text-align: center;
      transition: opacity .2s ease-in-out;
      -webkit-transform: translateX(50%);
      transform: translateX(50%);
    }

    .mbsc-slider-handle:focus ~ .mbsc-slider-tooltip,
    .mbsc-active .mbsc-slider-tooltip {
      opacity: 1;
    }

    .mbsc-slider-step {
      height: 16px;
      width: 1px;
      top: -7px;
      z-index: -1;
    }

    /* fix for first tick */
    .mbsc-progress-bar + .mbsc-slider-step {
      margin: 0;
    }

    .mbsc-slider input:disabled ~ .mbsc-progress-cont .mbsc-progress-track {
      opacity: .4;
    }

    /* Slider color presets */
    &.mbsc-slider-primary .mbsc-progress-bar {
      background: $mbsc-windows-primary;
    }

    &.mbsc-slider-secondary .mbsc-progress-bar {
      background: $mbsc-windows-secondary;
    }

    &.mbsc-slider-success .mbsc-progress-bar {
      background: $mbsc-windows-success;
    }

    &.mbsc-slider-danger .mbsc-progress-bar {
      background: $mbsc-windows-danger;
    }

    &.mbsc-slider-warning .mbsc-progress-bar {
      background: $mbsc-windows-warning;
    }

    &.mbsc-slider-info .mbsc-progress-bar {
      background: $mbsc-windows-info;
    }
  }

  @include mbsc-windows-slider(windows, (background: $mbsc-windows-background, text: $mbsc-windows-text, accent: $mbsc-windows-accent));
}
