// TDropdown组件样式

.#{$dropdown-prefix-cls} {
  $root: #{&};
  position: relative;
  display: inline-block;
  outline: none;
  height: inherit;
  cursor: pointer;
  div{
    display: flex;
    align-items: center;
    height: 100%;
  }
  #{$root}__menu{
    height: auto;
  }
  &__content{
    margin: $dropdown-margin-top 0;
    z-index: $zindex-dropdown;
    box-shadow: $dropdown-box-shadow;
    border-radius: $border-radius;
    .#{$menu-prefix-cls} {
      border-radius: $border-radius;
      &--light {
        &:after {
          display: none;
        }
        .#{$menu-prefix-cls}__item--checked {
          border-color: transparent;
        }
      }
      &__item:first-child {
        border-top-left-radius: $border-radius;
        border-top-right-radius: $border-radius;
      }
      &__item:last-child {
        border-bottom-left-radius: $border-radius;
        border-bottom-right-radius: $border-radius;
      }
    }
  }

  //toggle
  &__toggle {
    // Generate the caret automatically
    &::after {
      content: "\F8BE";
      @extend %aid-icon;
      transform: scale(1) translate(0, 0);
    }
    @include input-hover;
    &:disabled{
      border-color: transparent;
    }
  }

  i.#{$icon-prefix}-arrow-down-drop {
    transition: $transition-base;
  }

  //menu
  // &__menu {
  //   position: absolute;
  //   top: auto;
  //   left: 0;
  //   z-index: $zindex-dropdown;
  //   float: left;
  //   padding: $dropdown-padding-y 0;
  //   margin: $dropdown-margin-top 0 0; // override default ul
  //   font-size: $font-size-sm; // Redeclare because nesting can cause inheritance issues
  //   color: $body-color;
  //   text-align: left; // Ensures proper alignment if parent has it changed (e.g., modal footer)
  //   list-style: none;
  //   background-color: $dropdown-bg;
  //   background-clip: padding-box;
  //   border: $dropdown-border-width solid $dropdown-border-color;
  //   // 用户自己按实际情况添加超过设定高度 加滚动条
  //   //max-height: $pre-scrollable-max-height;
  //   //overflow-y: auto;
  //   @include border-radius($border-radius);
  //   @include box-shadow($dropdown-box-shadow);

  //   // Menu positioning
  //   &--right {
  //     right: 0;
  //     left: auto; // Reset the default from `.dropdown-menu`
  //   }
  //   &--left {
  //     right: auto;
  //     left: 0;
  //   }
  //   &--top {
  //     top: auto;
  //     bottom: 100%;
  //     margin:0 0 $dropdown-margin-top 0;
  //   }
  //   ul {
  //     padding: 0;
  //     margin: 0;
  //     li {
  //       list-style: none;
  //     }
  //   }
  // }

  // #{$root}__menu{// 只有dropdown下的是默认隐藏
  //   top: 100%;
  //   display: none; // none by default, but block on "open" of the menu
  //   min-width:100%;
  // }

  // item
  &__item{
    display: block;
    width: 100%; // For `<button>`s
    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; // For `<button>`s
    white-space: nowrap; // prevent links from randomly breaking onto new lines
    background: none; // For `<button>`s
    border: 0; // For `<button>`s
    cursor: pointer;

    @include hover-focus {
      color: $dropdown-link-hover-color;
      text-decoration: none;
      background-color: $dropdown-link-hover-bg;
    }

    //focus
    //响应‘↑’ ‘↓’ 键
    &--focus {
      color: $dropdown-link-hover-color;
      text-decoration: none;
      background-color: $dropdown-link-hover-bg;
    }

    //disabled
    @include status-disabled {
      color: $dropdown-link-disabled-color;
      background-color: transparent;
      @if $enable-gradients {
        background-image: none;
      }
    }

    //checked
    @include checked-active {
      color: $dropdown-link-hover-color;
      text-decoration: none;
      background-color:$dropdown-link-active-bg;
    }
    i{
      vertical-align: middle;
    }

    // 二级菜单
    .popover-wrap{
      width:calc(100% + #{$dropdown-item-padding-x}*2);
      margin-left:-$dropdown-item-padding-x;
      padding-left:$dropdown-item-padding-x;
    }
    // #{$root}__menu{
    //   margin-top: -$dropdown-item-padding-y;
    // }

    .#{$icon-prefix}-chevron-right {
      margin-right: $dropdown-item-padding-x;
      float: right;
    }
  }

  //dropdown-group
  &-group {
    list-style: none;
    padding-left: 0;
    ul {
      list-style: none;
      padding-left: 0;
      margin:0;
    }
    span {
      display: block;
      width: 100%; // For `<button>`s
      padding: $dropdown-group-title-padding-y $dropdown-item-padding-x;
      clear: both;
      font-weight: $font-weight-normal;
      color: $dropdown-group-title-color;
      font-size: $dropdown-group-title-font-size;
      white-space: nowrap; // prevent links from randomly breaking onto new lines
    }
    .#{$dropdown-prefix-cls}__item {
      padding-left: $dropdown-item-padding-x*2;
      padding-right: $dropdown-item-padding-x*2;
    }
  }

  //dropdown--open
  &--open{
    // >#{$root}__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);
    }
  }
}