@import '../Checkbox/mixin.less';

@icecream-tree-prefix: ~'@{icecream-prefix}-tree';

.@{icecream-tree-prefix} {

  &-treenode {
    white-space: nowrap;
    outline: none;
    display: flex;
    align-items: center;

    .@{icecream-tree-prefix}-node-content-wrapper {
      position: relative;
      padding: 5px 4px;
      display: inline-flex;
      align-items: center;
      cursor: default;
    }

    .@{icecream-tree-prefix}-switcher,
    .@{icecream-tree-prefix}-checkbox,
    .@{icecream-tree-prefix}-iconEle {
      display: inline-block;
      width: 14px;
      height: 14px;
      line-height: 14px;
      margin-right: @icecream-gap-xs;
      background: center no-repeat transparent;
      cursor: pointer;
    }

    .@{icecream-tree-prefix}-switcher {
      color: @icecream-color-grey-8;
      font-size: @icecream-font-size-sm;
      display: inline-flex;
      align-items: center;
      justify-content: center;

      &.@{icecream-tree-prefix}-switcher-noop {
        cursor: auto;
        background: none;
      }
    }

    .@{icecream-tree-prefix}-checkbox {
      .normalUncheckedBox();

      &:hover {
        .hoveredBox();
      }

      &-checked {
        .checkedBox();

        &::after {
          .checkedIcon();
        }
      }

      &-indeterminate {
        .checkedBox();

        &::after {
          .partialCheckedIcon();
        }
      }

      &-disabled {
        cursor: not-allowed;
        .disabledBox();

        &.@{icecream-tree-prefix}-checkbox-checked::after,
        &.@{icecream-tree-prefix}-checkbox-indeterminate::after {
          .disabledIcon();
        }
      }
    }
  }

  &-clickable {
    .@{icecream-tree-prefix}-node-content-wrapper {
      cursor: pointer;
    }
  }

  &-node-selected {
    color: @icecream-primary-color;
    background: rgba(0, 170, 231, 0.1);
  }

  &-indent-unit {
    display: inline-block;
    width: @icecream-gap-md;
  }
}