@import url(../var.less);
@import url(./button.less);
@import url(./popper.less);

@dropdown-prefix: ~"@{prefix}dropdown";

.@{dropdown-prefix}{
  display: inline-block;
  position: relative;
  color: @dropdown-font-color;
  font-size: @dropdown-font-size;

  .w-button-group {
    display: block;
    .w-button {
      float: none;
    }
  }

  & .w-dropdown__caret-button {
    padding-left: 5px;
    padding-right: 5px;
    position: relative;
    // border-left: none;

    // &::before {
    //   @gap: 5px;

    //   content: '';
    //   position: absolute;
    //   display: block;
    //   width: 1px;
    //   top: @gap;
    //   bottom: @gap;
    //   left: 0;
    //   background: mix(white, transparent, 50%);
    // }

    &.w-button--default::before {
      background: mix(@button-border-color, transparent, 50%);
    }

    &:hover {
      &:not(.is-disabled)::before {
        top: 0;
        bottom: 0;
      }
    }

    & .w-dropdown__icon {
      padding-left: 0;
    }
  }

  &__icon {
    font-size: 12px;
    margin: 0 3px;
  }

  .w-dropdown-selfdefine { // 自定义
    &:focus:active, &:focus:not(.focusing) {
      outline-width: 0;
    }
  }

  [disabled] {
    cursor: not-allowed;
    color: @disabled-font-color;
  }
}

.@{dropdown-prefix}-contextmenu {
  display: block;
}