$tree-prefix-cls: "#{$css-prefix}tree";
.#{$tree-prefix-cls} {
  ul {
    list-style: none;
    margin: $tree-ul-margin;
    padding: $tree-ul-padding;
    font-size: $font-size-small;

    li {
      list-style: none;
      margin: $tree-ul-li-margin;
      padding: $tree-ul-li-padding;
      white-space: nowrap;
      outline: none;
      user-select: none;
    }
  }

  li {
    ul {
      margin: $tree-li-margin;
      padding: $tree-li-padding;
    }
  }

  &-title {
    display: inline-block;
    margin: $tree-title-margin;
    height: 28px;//****************************
    line-height: 28px;//****************************
    padding: $tree-title-padding;
    border-radius: $btn-border-radius-small;
    cursor: pointer;
    vertical-align: $tree-title-vertical-align;
    color: $text-color;
    font-size: $tree-title-font-size;
    transition: all $transition-time $ease-in-out;

    &:hover {
      background-color: $tree-title-hover-bgcolor;
      color: $tree-title-hover-color;
    }

    &-selected,
    &-selected:hover {
      // background-color: lighten($primary-color, 40%);
      background-color: $tree-title-selected-bgcolor;
      color: $tree-title-selected-color;
    }

    &-filterable {
      color: darken($error-color, 10%);
    }

    &-focus {
      background-color: $tree-title-focus-bgcolor;
      color: $tree-title-focus-color;
    }

    &-disabled {
      color: #bbb;

      &:hover {
        color: #bbb;
        background-color: transparent;
        cursor: auto;
      }
    }
  }

  &-arrow {
    cursor: pointer;
    min-width: $tree-arrow-min-width;
    text-align: center;
    display: inline-block;

    i {
      font-size: $tree-arrow-i-font-size;
      display: inline-block;
      transition: all $transition-time $ease-in-out;
    }

    &-open {
      i {
        transform: rotate(90deg);
      }
    }

    &-hidden {
      cursor: auto;

      i {
        display: none;
      }
    }

    &-disabled {
      cursor: $cursor-disabled;
    }
  }

  &-empty {
    padding: $tree-empty-padding;
  }

  &-isBoxRight {
    .h-checkbox-wrapper {
      float: right;
      margin-top: $tree-isBoxRight-checkbox-margin-top;
    }
  }
}
.#{$tree-prefix-cls}-item {
  white-space: nowrap;
}
.#{$tree-prefix-cls}-item:focus {
  outline: none;
}