// // Select - JS // —————————————- .dark {

.form-select-js {
  position: relative;
  cursor: default;

  .form-select-js-choice {
    background-color: $select-bgr-color;
    border-color: $select-border-color;
    color: $select-font-color;
  }

  &.focus .form-select-js-choice ,
  &:focus .form-select-js-choice {
    background-color: hsv-lighten($select-bgr-color, 21%, true);
  }

  &.hover .form-select-js-choice ,
  &:hover .form-select-js-choice {
    background-color: hsv-lighten($select-bgr-color, 7%, true);
  }

  &.selected .form-select-js-choice ,
  &:selected .form-select-js-choice {
    background-color: hsv-darken($select-bgr-color, -15%, true);
  }

  &.active .form-select-js-choice ,
  &:active .form-select-js-choice {
    background-color: hsv-lighten($select-bgr-color, 15%, true);
  }

  &[aria-disabled=true] .form-select-js-choice {
    background-color: $select-disabled-bgr-color;
    border-color: $select-disabled-border-color;
    color: $select-disabled-font-color;
  }
}

.form-select-js-option-scroll-wrapper {

  background-color: $select-options-bgr-color;
  border: 0;
  color: $select-font-color-dropdown;

  .form-select-js-options {

    > li {

      &.focus,
      &:focus {
        background-color: hsv-darken($select-options-bgr-color, 15%, true);
      }

      &.hover { // do hover only by javascript to prevent hover after key event
        background-color: hsv-darken($select-options-bgr-color, 7%, true);
      }

      &.active,
      &:active {
        background-color: hsv-darken($select-options-bgr-color, 15%, true);
      }

      &[aria-disabled=true] {
        background-color: inherit;
        color: #eee;
      }

      &.selected {
        background-color: $select-options-active-bgr-color;
        color: $select-font-color-dropdown;

        &.focus,
        &:focus {
          background-color: hsv-darken($select-options-active-bgr-color, 15%, true);
        }

        &.hover { // do hover only by javascript to prevent hover after key event
          background-color: hsv-darken($select-options-active-bgr-color, 7%, true);
        }

        &.active,
        &:active {
          background-color: hsv-darken($select-options-active-bgr-color, 15%, true);
        }
      }
    }
  }
}

}