.#{$select-prefix-cls} {
  position: relative;
  display: inline-block;
  width: 100%;
  vertical-align: middle;
  outline: none;

  i[data-ani-icon] {
    transition: all $transition-time;
    transform: rotate(0deg);
  }

  &__selection {
    @extend .#{$input-prefix-cls};
    position: relative;
    display: block;
    padding: 0 !important;
    cursor: pointer;
  }

  &__placeholder {
    color: $input-color-placeholder;
  }

  // 避免覆盖后面的图标按钮
  &__selected-value,
  &__input,
  .list-inline,
  &__placeholder {
    padding-right: $select-sm-selection-icon-font-size + $select-selection-icon-spacer * 4;
    padding-left: $select-padding-x;
  }

  &__placeholder,
  &__selected-value {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  &__selection-icon {
    position: absolute;
    top: 50%;
    right: $select-padding-x;
    transform: translateY(-50%);

    & .#{$icon-prefix}-chevron-down-outline,
    & .#{$icon-prefix}-chevron-up-outline {
      font-size: $select-selection-icon-font-size;
    }

    & .#{$icon-prefix}-close-circle {
      font-size: $select-clear-icon-font-size;
    }
  }

  .list-inline-item {
    max-width: 100%;
    line-height: 1;
    //.#{$tag-prefix-cls} {
    //  max-width: 100%;
    //  white-space: nowrap;
    //  height: 20px;
    //  &__title {
    //    @include text-truncate;
    //    max-width: 85%;
    //  }
    //  &__clear {
    //    margin-left: 0;
    //    font-size: 12px;
    //  }
    //}
    .#{$tag-prefix-cls} {
      margin-right: 6px
    }
    .#{$tag-prefix-cls}__title {
      margin-right: 2px
    }
  }

  &__input {
    @extend .#{$input-prefix-cls};
    height: $input-height - $border-width * 2;
    line-height: $input-height - $border-width * 2;
    cursor: text;
    background: transparent;
    border: none;

    &:focus {
      background: transparent;
      box-shadow: none;
    }
  }

  .list-inline {
    padding-top: ($input-height - $border-width*2 - $tag-height - $tag-margin-y*2) / 2 !important;
    padding-bottom: ($input-height - $border-width*2 - $tag-height - $tag-margin-y*2) / 2 !important;
    margin-bottom: 0;
    line-height: 1;
    &:empty {
      padding: 0 !important;
    }

    &-item {
      margin-right: 0;//overwrite default 5px
    }
  }

  &__menu {
    @extend .#{$dropdown-prefix-cls}__menu;
    max-height: $pre-scrollable-max-height;
    overflow-y: auto;
  }

  // 结构生成在select下
  .#{$select-prefix-cls}__menu {
    display: none;
    min-width: 100%;
  }

  &__tips {
    display: block;
    width: 100%;
    min-width: $dropdown-item-min-width;
    padding: $dropdown-item-padding-y $dropdown-item-padding-x;
    clear: both;
    font-weight: $font-weight-normal;
    color: $dropdown-link-color;
    text-align: inherit;
    white-space: nowrap;
    background-color: $dropdown-bg;
    border: 0;
    cursor: pointer;
    text-align: center;
    @include box-shadow($dropdown-box-shadow);
    @include border-radius($border-radius);
  }

  &--focus {
    .#{$select-prefix-cls}__selection {
      border-color: $input-border-focus;
      box-shadow: $input-box-shadow-focus;
    }
  }

  &--disabled {
    .#{$select-prefix-cls}__selection {
      @extend .#{$input-prefix-cls}--disabled;
    }
    .tag__clear {
      cursor: $cursor-disabled;
      filter: alpha(opacity=45);
      opacity: .45;
    }
  }

  &--multiple {
    .#{$select-prefix-cls}__selection {
      height: auto !important;
      min-height: $input-height;
      // line-height: $input-height - $border-width * 2;

      &--lg {
        min-height: $input-height-lg;
      }

      &--sm {
        min-height: $input-height-sm;
      }
    }
    //checked
    .#{$select-prefix-cls}__item {
      @include checked-active {
        padding-right: $dropdown-item-padding-x + $font-size-sm * 1.2;
        color: $dropdown-link-check-icon-color;
        background-color: transparent;

        &::after {
          @extend %aid-icon;
          position: absolute;
          right: $dropdown-item-padding-x;
          color: $dropdown-link-check-icon-color;
          content: "\f27b";
          transform: scale(1.2) translate(0, 0);
        }
      }
      @include hover-focus {
        background-color: $dropdown-link-hover-bg;
      }
    }
  }

  &--open {
    .#{$select-prefix-cls}__selection {
      border-color: $input-border-focus;
      box-shadow: $input-box-shadow-focus;
    }

    > .#{$select-prefix-cls}__menu {
      display: block;
    }
    // Remove the outline when :focus is triggered
    > a {
      outline: 0;
    }

    i.#{$icon-prefix}-chevron-down-outline {
      transition: all $transition-time;
      transform: rotate(180deg);
    }
  }

  &--select-none {
    -moz-user-select: none;
    -o-user-select:none;
    -khtml-user-select:none;
    -webkit-user-select:none;
    -ms-user-select:none;
    user-select:none;
  }

  //
  //size
  //

  &--sm {
    .#{$select-prefix-cls}__selected-value,
    .#{$select-prefix-cls}__input,
    .list-inline,
    .#{$select-prefix-cls}__placeholder {
      padding-right: $select-sm-selection-icon-font-size + $select-selection-icon-spacer * 4;
      padding-left: $select-padding-x;
    }

    .#{$select-prefix-cls}__selection-icon {
      right: $select-padding-x;

      & .#{$icon-prefix}-chevron-down-outline,
      & .#{$icon-prefix}-chevron-up-outline {
        font-size: $select-sm-selection-icon-font-size;
      }

      & .#{$icon-prefix}-close-circle {
        font-size: $select-sm-clear-icon-font-size;
      }
    }

    .#{$select-prefix-cls}__selection,
    .#{$select-prefix-cls}__input {
      @extend .#{$input-prefix-cls}--sm;
    }

    .#{$select-prefix-cls}__selection {
      min-height: $input-height-sm;
    }

    .#{$select-prefix-cls}__input {
      height: $input-height-sm - $border-width * 2;
      min-height: $input-height-sm - $border-width * 2;
      line-height: $input-height-sm - $border-width * 2;
    }

    .list-inline-item {
      max-width: 100%;
      line-height: 1;
      //.#{$tag-prefix-cls} {
      //  max-width: 100%;
      //  white-space: nowrap;
      //  height: 20px;
      //  margin-right: 6px;
      //  &__title {
      //    @include text-truncate;
      //    max-width: 85%;
      //    position: relative;
      //    top:-1px;
      //  }
      //  &__clear {
      //    margin-left: 0;
      //    font-size: 12px;
      //    position: relative;
      //    top:-1px;
      //  }
      //}
    }

    .list-inline {
      line-height: 1;
      padding-top: ($input-height-sm - $border-width * 2 - $tag-height - $tag-margin-y * 2) / 2 !important;
      padding-bottom: ($input-height-sm - $border-width * 2 - $tag-height - $tag-margin-y * 2) / 2 !important;
    }
  }

  &--lg {
    .#{$select-prefix-cls}__selected-value,
    .#{$select-prefix-cls}__input,
    .list-inline,
    .#{$select-prefix-cls}__placeholder {
      padding-right: $select-lg-selection-icon-font-size + $select-selection-icon-spacer * 6;
      padding-left: $select-padding-x;
    }

    .#{$select-prefix-cls}__selection-icon {
      right: $select-padding-x;

      & .#{$icon-prefix}-chevron-down-outline,
      & .#{$icon-prefix}-chevron-up-outline {
        font-size: $select-lg-selection-icon-font-size;
      }

      & .#{$icon-prefix}-close-circle {
        font-size: $select-lg-clear-icon-font-size;
      }
    }

    .#{$select-prefix-cls}__selection,
    .#{$select-prefix-cls}__input {
      @extend .#{$input-prefix-cls}--lg;
    }

    .#{$select-prefix-cls}__selection {
      min-height: $input-height-lg;
    }

    .#{$select-prefix-cls}__input {
      height: $input-height-lg - $border-width * 2;
      min-height: $input-height-lg - $border-width * 2;
      line-height: $input-height-lg - $border-width * 2;
    }

    .list-inline-item {
      max-width: 100%;
      line-height: 1;
      //.#{$tag-prefix-cls} {
      //  max-width: 100%;
      //  white-space: nowrap;
      //  height: 24px;
      //  padding-top: 1px;
      //  &__title {
      //    position: static;
      //    top: 0;
      //  }
      //  &__clear {
      //    position: static;
      //    top: 0;
      //  }
      //}
    }

    .list-inline {
      line-height: 1;
      padding-top: ($input-height-lg - $border-width * 2 - $tag-height - $tag-margin-y * 2) / 2 !important;
      padding-bottom: ($input-height-lg - $border-width * 2 - $tag-height - $tag-margin-y * 2) / 2 !important;
    }
  }
}