//
// Copyright (c) Tiny Technologies, Inc. All rights reserved.
// Licensed under the LGPL or a commercial license.
// For LGPL see License.txt in the project root for license information.
// For commercial licenses see https://www.tiny.cloud/
//

//
// Select
//

@selectbox-disabled-background-color: darken(@background-color, 5%);
@selectbox-disabled-text-color: fade(@text-color, 85%);

.tox {
  .tox-selectfield {
    cursor: pointer;
    position: relative;
  }

  .tox-selectfield select[disabled] {
    background-color: @selectbox-disabled-background-color;
    color: @selectbox-disabled-text-color;
    cursor: not-allowed;
  }

  .tox-selectfield select {
    &:extend(.tox .tox-textfield);
  }

  // Hide OS rendered chevrons
  .tox-selectfield select::-ms-expand {
    display: none;
  }

  .tox-selectfield select:focus {
    &:extend(.tox .tox-textfield:focus);
  }

  .tox-selectfield svg {
    pointer-events: none;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
  }
}

.tox:not([dir=rtl]) {
  // Don't add the padding to select boxes with visible values that, do not have the down-arrow icon
  .tox-selectfield {
    select[size="0"],
    select[size="1"] {
      padding-right: @pad-lg;
    }

    svg {
      right: @pad-sm;
    }
  }
}

// RTL
.tox[dir=rtl] {
  // Don't add the padding to select boxes with visible values that, do not have the down-arrow icon
  .tox-selectfield {
    select[size="0"],
    select[size="1"] {
      padding-left: @pad-lg;
    }

    svg {
      left: @pad-sm;
    }
  }
}