// @import "../_utils.scss";
// @import "./icon.scss";
// @import "./poptip.scss";
// @import "./table.scss";
// @import "./button.scss";
// @import "./tag.scss";
// @import "./checkbox.scss";
// @import "./select-dropdown.scss";
.#{$selectTable-prefix-cls} {
  display: inline-block;
  width: 100%;
  box-sizing: border-box;
  vertical-align: middle;
  color: $text-color;
  font-size: $font-size-base;
  line-height: normal;
  position: relative;

  @include theme-font-color($__selectTable_font-color);
  @include structure-font-size($__selectTable-default_font-size, 0);
  @if $--size-switch == yes {
    font-size: $--size-font-size-base;
    @include computed-line-height();
  } @else {
    height: $form-component-height;
  }

  &-selection {
    display: block;
    box-sizing: border-box;
    outline: none;
    user-select: none;
    cursor: pointer;
    background-color: $selectTable-selection-background-color;
    border-radius: $btn-border-radius;
    border: 1px solid $border-color-base;
    transition: all $transition-time $ease-in-out;

    @include theme-background-color($__selectTable-selection_background-color);
    @include theme-border-color($__selectTable-selection_border-color);


    .#{$selectTable-prefix-cls}-arrow.#{$icon-prefix-cls}-close {
      display: none;
      cursor: pointer;
    }

    &:hover {
      @include hover();
      .#{$selectTable-prefix-cls}-arrow:nth-of-type(1) {
        display: inline-block;
      }
      .#{$selectTable-prefix-cls}-arrow:nth-of-type(2) {
        display: none;
      }
    }

    .#{$css-prefix}tag {
      max-width: $selectTable-selection-h-tag-max-width;
      text-overflow: ellipsis;
      white-space: nowrap;
      padding-right: $selectTable-selection-h-tag-padding-right;
      vertical-align: middle;
      @if $--size-switch == yes {
        $tag-height: 20 + ((($--size-height-base - 20) / 4) - 1) * 2;
        $tag-margin-vertical: ($--size-height-base - 2 - $tag-height) / 2;
        height: $tag-height;
        margin-top: $tag-margin-vertical;
        margin-bottom: $tag-margin-vertical;
        @include computed-line-height();
      }
      & > i {
        margin-left: 0;
      }
    }

    .#{$tag-prefix-cls} span {
      display: inline-block;
      width: 100%;
    }

    // 扩大singleSelect和multiSelect右侧箭头点击区域
    .#{$selectTable-prefix-cls}-arrowWrapper {
      width: 24px;
      height: $input-height-base;
      line-height: $input-height-base;
      position: absolute;
      right: 0;
      top: 0;
    }
  }
  &-show-clear &-selection:hover .#{$selectTable-prefix-cls}-arrow:nth-of-type(2) {
    display: none;
  }

  &-arrow {
    @include inner-arrow();
  }

  &-visible {
    .#{$selectTable-prefix-cls}-selection {
      @include active();
    }

    .#{$selectTable-prefix-cls}-arrow.icon-unfold {
      transform: rotate(180deg);
    }
  }

  &-readonly {
    .#{$selectTable-prefix-cls}-selection {
      .#{$selectTable-prefix-cls}-arrow:nth-of-type(2) {
        display: none;
      }

      .#{$selectTable-prefix-cls}-arrow {
        @include theme-font-color($__selectTable-arrow_readonly_font-color);
      }

      &:hover {
        border-color: $border-color-base;
        box-shadow: none;
        .#{$selectTable-prefix-cls}-arrow:nth-of-type(1) {
          display: inline-block;
        }

        @include theme-border-color($__selectTable-selection_readonly_hover_border-color);
        @include theme-box-shadow($__selectTable-selection_readonly_hover_box-shadow);
      }

      @include readonly();
      opacity: $selectTable-selection-readonly-opacity;
      color: $text-color;
    }
  }

  &-disabled {
    .#{$selectTable-prefix-cls}-selection {
      .#{$selectTable-prefix-cls}-arrow:nth-of-type(2) {
        display: none;
      }
      .#{$selectTable-prefix-cls}-input {
        cursor: not-allowed;
        color: $selectTable-selection-disabled-font-color;
        @include theme-font-color($__selectTable-input_disabled_font-color);
      }

      .#{$selectTable-prefix-cls}-arrow {
        @include theme-font-color($__selectTable-arrow_disabled_font-color);
      }

      &:hover {
        border-color: $border-color-base;
        box-shadow: none;
        .#{$selectTable-prefix-cls}-arrow:nth-of-type(1) {
          display: inline-block;
        }

        @include theme-border-color($__selectTable-selection_disabled_hover_border-color);
        @include theme-box-shadow($__selectTable-selection_disabled_hover_box-shadow);
      }

      @include disabled();

      .#{$css-prefix}tag {
        color: $selectTable-selection-disabled-font-color !important;
        @include theme-font-color($__selectTable-tag_disabled_font-color, $--important);
        .#{$css-prefix}icon{
          @include theme-font-color($__selectTable-tag_disabled_font-color);
        }
      }
    }
  }

  &-single &-selection {
    height: $input-height-base;
    position: relative;
    overflow: hidden;
    .#{$selectTable-prefix-cls}-placeholder {
      color: $input-placeholder-color;

      @include theme-font-color($__selectTable-single-selection-placeholder_font-color);
    }
    @if $--size-switch == yes {
      height: $--size-height-base;
    }

    .#{$selectTable-prefix-cls}-placeholder, .#{$selectTable-prefix-cls}-selected-value {
      display: block;
      line-height: $input-height-base - 2px;
      font-size: $font-size-small;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      padding-left: $selectTable-single-selection-selected-value-padding-left;
      padding-right: $selectTable-single-selection-selected-value-padding-right;

      @include structure-font-size($__selectTable-default_font-size, 0);
      @if $--size-switch == yes {
        font-size: $--size-font-size-base;
        @include computed-height($--size-height-base - 2, 0);
        padding-right: $--size-offset-base + $font-size-base;
      } @else {
        height: $input-height-base - 2px;
      }
    }
  }

  .#{$selectTable-prefix-cls}-large.#{$selectTable-prefix-cls}-single &-selection {
    height: $input-height-large;

    .#{$selectTable-prefix-cls}-placeholder, .#{$selectTable-prefix-cls}-selected-value {
      line-height: $input-height-large - 2px;
      font-size: $font-size-base;

      @include structure-font-size($__selectTable-default_font-size, 2);
    }
  }

  .#{$selectTable-prefix-cls}-small.#{$selectTable-prefix-cls}-single &-selection {
    height: $input-height-small;
    border-radius: $btn-border-radius-small;

    .#{$selectTable-prefix-cls}-placeholder, .#{$selectTable-prefix-cls}-selected-value {
      line-height: $input-height-small - 2px;
    }
  }

  &-multiple &-selection {
    overflow-x: hidden;
    overflow-y: auto;
    height: $input-height-base;
    padding-left: $selectTable-multiple-selection-padding-left;
    padding-right: $selectTable-multiple-selection-padding-right;

    @if $--size-switch == yes {
      height: $--size-height-base;
      padding-left: 0;
      padding-right: $--size-offset-base + $font-size-base;
    }
    @include scrollbar;

    .#{$selectTable-prefix-cls}-placeholder {
      display: block;
      line-height: $input-height-base - 2px;
      color: $input-placeholder-color;
      font-size: $font-size-small;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      padding-left: $selectTable-multiple-selection-placeholder-padding-left;
      padding-right: $selectTable-multiple-selection-placeholder-padding-right;

      @include theme-font-color($__selectTable-multiple-selection-placeholder_font-color);
      @include structure-font-size($__selectTable-default_font-size, 0);
      @if $--size-switch == yes {
        font-size: $--size-font-size-base;
        @include computed-height($--size-height-base - 2, 0);
        padding-right: 0;
      } @else {
        height: $input-height-base - 2px;
      }
    }
  }

  // input
  &-input {
    display: inline-block;
    height: $input-height-base;
    line-height: $input-height-base;
    padding: $selectTable-input-padding;
    font-size: $font-size-small;
    outline: none;
    border: none;
    box-sizing: border-box;
    color: $input-color;
    background-color: transparent;
    position: relative;
    cursor: pointer;
    width: 100%;

    @include theme-font-color($__selectTable-input_font-color);
    @include theme-border-color($__selectTable-input_border-color);
    @include theme-background-color($__selectTable-input_background-color);
    @include structure-font-size($__selectTable-default_font-size, 0);
    @include placeholder();
    @if $--size-switch == yes {
      font-size: $--size-font-size-base;
      @include computed-height($--size-height-base - 2, 0);
      height: $--size-height-base - 2;
      padding-right: $--size-offset-base + $font-size-base;
    }
  }

  // bug 151241 selecttable设置showbuttom 和 filterable  搜索框的宽度不够
  // &-input {
  //   width: 100%;
  // }

  &-large &-input {
    font-size: $font-size-base;
    height: $input-height-large;
  }

  &-small &-input {
      height: $input-height-small;
  }

  &-multiple &-input {
    line-height: $input-height-base;
    padding: $selectTable-multiple-input-padding;
    vertical-align: top;
    @if $--size-switch == yes {
      @include computed-height($--size-height-base - 2, 0);
      padding-right: 0;
    } @else {
      height: $input-height-base - 3px;
    }
  }

  &-not-found {
    text-align: center;
    color: $btn-disable-color;

    @include theme-font-color($__selectTable-not-data_font-color);
  }

  &-loading {
    text-align: center;
    color: $btn-disable-color;

    @include theme-font-color($__selectTable-loading_font-color);
  }

  &-not-data {
    text-align: center;
    color: $btn-disable-color;

    @include theme-font-color($__selectTable-not-data_font-color);
  }
  &-multiple .#{css-prefix}tag {
    margin: $selectTable-multiple-tag-margin;
  }

  &-dropdown {
    &-transfer {
      z-index: $zindex-transfer;
    }
    // select-dropdown-list checkbox
    &-list {
      .#{$selectTable-prefix-cls}-item {
        position: relative;
      }
    }
  }

  &-block-loading {
    position: absolute;
    top: $selectTable-block-loading-top;
    left: $selectTable-block-loading-left;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: $selectTable-block-loading-background;
    color: $text-color;

    @include theme-background-color($__selectTable-block-loading_background);
    @include theme-font-color($__selectTable-block-loading_font-color);
  }

  &-dropdown-content {
    // max-height:$max-height;
    // padding: 0;
    // overflow:auto;
    .#{$selectTable-prefix-cls}-search {
      position: absolute;
      background: $selectTable-dropdown-content-background;
      height: $selectTable-dropdown-content-height;
      padding: $selectTable-dropdown-content-padding;
      left: 0;
      top: 0;
      z-index: 1;

      @include theme-background-color($__selectTable-search-input_background);

      input {
        // height: 32px;
        // line-height: 32px;
        padding: $selectTable-dropdown-content-input-padding;
        border: $selectTable-dropdown-content-input-border;

        @include theme-border-color($__selectTable-search-input_border-color);
      }

      input:focus {
        box-shadow: none;

        @include theme-box-shadow($__selectTable-search-input_focus_box-shadow);
      }
    }

    .#{$selectTable-prefix-cls}-dropdown-list {
      max-height: $max-height;
      overflow: auto;
      position: relative;

      @include scrollbar;

      .#{$table-prefix-cls}-wrapper {
        border: 0;
        // margin-top: 52px;
        // padding: 0 10px;
        .#{$table-prefix-cls}::after {
          width: 0;
        }

        .#{$table-prefix-cls}::before {
          background-color: $selectTable-dropdown-content-dropdown-list-table-before-background-color;

          @include theme-background-color($__selectTable-dropdown-list-table-before_background-color);
        }

        .#{$table-prefix-cls} th,
        .#{$table-prefix-cls} td {
          border-bottom: 0;
          border-top: $selectTable-dropdown-content-dropdown-list-table-border-top;

          @include theme-border-top-color($__selectTable-dropdown-list-table-th_border-top-color);
        }

        .#{$table-prefix-cls}-row-highlight td,
        .#{$table-prefix-cls}-row-checked td {
          background: $selectTable-dropdown-content-dropdown-list-table-row-checked-background;
          color: $selectTable-dropdown-content-dropdown-list-table-row-checked-color;

          @include theme-background-color($__selectTable-dropdown-list-table-td_checked_background);
          @include theme-font-color($__selectTable-dropdown-list-table-td_checked_font-color);
        }

        .#{$table-prefix-cls}-row-hover td {
          background: $background-color-select-hover;

          @include theme-background-color($__selectTable-dropdown-list-table-td_hover_background);
        }
      }
    }
    .#{$selectTable-prefix-cls}-checkHead {
      .#{$checkbox-prefix-cls}-wrapper {
        margin-left: $selectTable-dropdown-content-checkHead-margin-left;
        line-height: $selectTable-dropdown-content-checkHead-line-height;
      }
    }
  }

  &-dropdown-noline-content {
    padding: 0;

    @include scrollbar;

    .#{$selectTable-prefix-cls}-search {
      position: absolute;
      background: $selectTable-dropdown-noline-content-selectTable-search-background;
      height: $selectTable-dropdown-noline-content-selectTable-search-height;
      padding: $selectTable-dropdown-noline-content-selectTable-search-padding;
      left: 0;
      top: 0;
      z-index: 1;

      @include theme-background-color($__selectTable-search-input_background);

      input {
        border: 0;
        padding: $selectTable-dropdown-noline-content-selectTable-search-input-padding;
        border-radius: 0;
        border-bottom: $selectTable-dropdown-noline-content-selectTable-search-input-border-bottom;

        @include theme-border-bottom-color($__selectTable-dropdown-noline-search-input_border-bottom-color);
      }

      input:focus {
        box-shadow: none;

        @include theme-box-shadow($__selectTable-dropdown-noline-search-input_focus_box-shadow);
      }
    }

    .#{$selectTable-prefix-cls}-dropdown-list {
      max-height: $max-height;
      overflow: auto;
      position: relative;

      @include scrollbar;

      .#{$table-prefix-cls}-wrapper {
        border: 0;
        // margin-top: 38px;
        // padding: 0 5px;
        .#{$table-prefix-cls}::after {
          width: 0;
        }

        .#{$table-prefix-cls}::before {
          background-color: $selectTable-dropdown-noline-content-h-table-wrapper-background-color;

          @include theme-background-color($__selectTable-dropdown-noline-list-table-before_background-color);
        }

        .#{$table-prefix-cls} th {
          border-bottom: 0;
        }

        .#{$table-prefix-cls} td {
          border-bottom: 0;
        }

        .#{$table-prefix-cls}-row-highlight td,
        .#{$table-prefix-cls}-row-checked td {
          background: $selectTable-dropdown-noline-content-h-table-wrapper-row-checked-background;
          color: $selectTable-dropdown-noline-content-h-table-wrapper-row-checked-color;

          @include theme-background-color($__selectTable-dropdown-noline-list-table-td_checked_background);
          @include theme-font-color($__selectTable-dropdown-noline-list-table-td_checked_font-color);
        }

        .#{$table-prefix-cls}-row-hover td {
          background: $background-color-select-hover;

          @include theme-background-color($__selectTable-dropdown-noline-list-table-td_hover_background);
        }
      }
    }
    .#{$selectTable-prefix-cls}-checkHead {
      .#{$checkbox-prefix-cls}-wrapper {
        margin-left: 12px;
        margin-right: 5px;
        line-height: 29px;
      }
    }
  }

  &-left {
    text-align: left;
  }

  &-center {
    text-align: center;
  }

  &-right {
    text-align: right;
  }

  &-hideMultHead {
    position: relative;
    display: block;
    font-size: $font-size-small;
    padding: $selectTable-hideMultHead-padding;

    @include structure-font-size($__selectTable-default_font-size, 0);
  }

  &-hideMultHead:hover {
    cursor: pointer;
  }

  &-hideMultHead::after {
    @include h-icon();
    font-size: $selectTable-hideMultHead-after-font-size;
    content: "\E734";
    color: $no-select-color;
    position: absolute;
    top: $selectTable-hideMultHead-after-top;
    right: $selectTable-hideMultHead-after-right;

    @include theme-font-color($__selectTable-hideMultHead-after_font-color);
  }

  &-hideMultHead-select,
  &-hideMultHead-select::after {
    color: $selected-color;

    @include theme-font-color($__selectTable-hideMultHead_select_font-color);
  }

  &-selected-num {
    display: block;
    line-height: $input-height-base - 2px;
    padding-left: 8px;
    font-size: $font-size-small;

    @include structure-font-size($__selectTable-default_font-size, 0);
    @if $--size-switch == yes {
      font-size: $--size-font-size-base;
      @include computed-height($--size-height-base - 2, 0);
      padding-right: 0;
    } @else {
      height: $input-height-base - 2px;
    }
  }

  &-btnToTop {
    padding: 7px 14px;

    &-invert {
      float: right;
      margin-right: 12px;
    }
  }
  & .h-checkbox-wrapper {
    @if $--size-switch == yes { //需要去除checkbox的上下padding，否则在最小模式下的单元格会被撑开
      padding: 0;
    } 
  }
}
.#{$selectTable-prefix-cls}-checkHead {
  input {
    width: calc(100% - 45px);
  }
}

@include select-item($selectTable-prefix-cls, $selectTable-item-prefix-cls);

.#{$selectTable-prefix-cls}-multiple .#{$selectTable-item-prefix-cls} {
  &-selected {
    color: $selected-color;
    background: $selectTable-multiple-selected-background;
  }

  &-focus,
  &-selected:hover {
    color: $selected-color;
    background: $background-color-select-hover;
  }

  .#{$selectTable-item-prefix-cls}-selected.#{$selectTable-item-prefix-cls}-focus {
    color: shade($selected-color, 10%);
    background: $selectTable-multiple-selected-background;
  }
  // .#{$checkbox-prefix-cls}-wrapper {
  //     float: right;
  // }
  // &-selected:after{
  //     @include h-icon();
  //     float: right;
  //     font-size: 20px;
  //     content: "\e734";
  //     color: $selected-color;
  // }
}
.#{$selectTable-group-prefix-cls} {
  list-style: none;
  margin: 0;
  padding: 0;

  &-title {
    padding-left: $selectTable-select-group-title-padding-left;
    font-size: $selectTable-select-group-title-font-size;
    color: $legend-color;
    height: $selectTable-select-group-title-height;
    line-height: $selectTable-select-group-title-height;

    @include structure-font-size($__selectTable-default_font-size, 0);
  }
}

.#{$form-item-prefix-cls}-error {
  .#{$selectTable-prefix-cls} {
    &-selection {
      border: 1px solid $error-color;

      @include theme-border-color($__selectTable-form-selection_error_border-color);

      &:hover {
        border: 1px solid $error-color;

        @include theme-border-color($__selectTable-form-selection_error_hover_border-color);
      }

      &:focus {
        @include theme-box-shadow($__selectTable-form-selection_error_focus_box-shadow);
      }
    }

    &-arrow {
      color: $error-color;

      @include theme-font-color($__selectTable-form-arrow_error_font-color);
    }
    &-visible .#{$selectTable-prefix-cls}-selection {
      @include active-error;
    }
  }
}
.#{$form-item-prefix-cls}-changed {
  .#{$selectTable-prefix-cls} {
    &-selection {
      color: $changed-color;

      @include theme-font-color($__selectTable-form-selection_changed_font-color);
    }

    .#{$tag-prefix-cls} {
      color: $changed-color !important;

      @include theme-font-color($__selectTable-form-selection-tag_changed_font-color, $--important);
    }

    &-input {
      color: $changed-color;

      @include theme-font-color($__selectTable-form-selection-input_changed_font-color);
    }
  }
}
.#{$editgird-prefix-cls}-cell-error {
  .#{$selectTable-prefix-cls} {
    &-selection {
      border: 1px solid $error-color;

      @include theme-border-color($__selectTable-editgird-selection_error_border-color);
    }

    &-arrow {
      color: $error-color;

      @include theme-font-color($__selectTable-editgird-selection-arrow_error_font-color);
    }
    &-visible .#{$selectTable-prefix-cls}-selection {
      @include active-error;
    }
  }
}
.#{$editgird-prefix-cls}-cell {
  .#{$selectTable-prefix-cls} {
    &-dropdown {
      ul {
        user-select: none;
      }
    }
  }
}
.#{$selectTable-prefix-cls}-multiple {
  .#{$selectTable-prefix-cls} {
    &-checkall {
      border-top: $selectTable-multiple-checkall-border-top;
      text-align: right;
      padding: $selectTable-multiple-checkall-padding;
      clear: both;

      @include theme-border-top-color($__selectTable-multiple-checkall_border-top-color);
    }
  }

  .#{$tag-prefix-cls} {
    background: $selectTable-multiple-h-tag-background !important;
    border: $selectTable-multiple-h-tag-border !important;

    @include theme-background-color($__selectTable-multiple-tag_background, $--important);
    @include theme-border-color($__selectTable-multiple-tag_border-color, $--important);
  }
}
.#{$selectTable-prefix-cls}-header-slot {
  border-bottom: $selectTable-header-slot-border-bottom;

  @include theme-border-bottom-color($__selectTable-header-slot_border-bottom-color);
}
.#{$selectTable-prefix-cls}-header-slot-top {
  border-bottom: $selectTable-header-slot-border-bottom;
  margin-top: $selectTable-header-slot-margin-top;

  @include theme-border-bottom-color($__selectTable-header-slot-top_border-bottom-color);
}
.#{$css-prefix}selectTable {
  .#{$css-prefix}tag-collapsefix {
    position: relative;
    border: 1px solid  #d9d9d9 !important;
    padding: 0 20px 0 8px;
    height: 22px;
    line-height: 22px;

    @include theme-border-color($__selectTable-tag-collapsefix_border-color, $--important);
    @if $--size-switch == yes {
      $tag-height: 20 + ((($--size-height-base - 20) / 4) - 1) * 2;
      $tag-margin-vertical: ($--size-height-base - 2 - $tag-height) / 2;
      height: $tag-height;
      margin-top: $tag-margin-vertical;
      margin-bottom: $tag-margin-vertical;
      @include computed-line-height();
    } @else {
      margin-left: 2px;
      margin-right: 2px;
    }
    &>.#{$css-prefix}icon {
      position: absolute;
      right: 5px;
      color: #999;

      @include theme-font-color($__selectTable-tag-collapsefix-icon_font-color);
    }
  }
  .#{$css-prefix}tag-collapse-number {
    max-width: none;
    padding: 0 8px;
  }
}
.#{$css-prefix}select-collapse-hover {
  min-width: 224px;
  .#{$css-prefix}tag {
    height: 0;

    & .#{$poptip-prefix-cls} {
      height: 0;
    }

    & .#{$poptip-prefix-cls}-rel {
      height: inherit;
    }
  }

  &-content {
    word-break: normal;
    word-wrap: break-word;
    white-space: normal;
    max-width: 224px;
    max-height: 105px;
  }

  & .#{$poptip-prefix-cls}-body {
    padding: 6px;
  }

  & .#{$tag-prefix-cls} {
    position: relative;
    white-space: nowrap;
    text-overflow: ellipsis;
    height: 22px;
    line-height: 20px;
    padding: 0 20px 0 8px;
    margin: 2px;
    background: $select-tag-background !important;
    border: 1px solid  #d9d9d9 !important;
    max-width: 108px;

    @include theme-background-color($__select-collapse-tag_hover_background, $--important);
    @include theme-border-color($__select-collapse-tag_hover_border-color, $--important);
    vertical-align: middle;
    &>.#{$css-prefix}icon {
      position: absolute;
      right: 5px;
      color: #999;

      @include theme-font-color($__select-collapse-tag-icon_hover_font-color);
    }

    span {
      display: inline-block;
      width: 100%;
      font-size: 12px;
    }
  }
}