@import "./base/var";
@import "./mixins/index.scss";

@include c(tree) {
    background-color: $--color-white;
    position: relative;

    @include e(empty) {
        width: 100%;
        height: 100%;
        min-height: 60px;
        text-align: center;
        display: flex;
        align-items: center;
        justify-content: center;
        color: $--color-text-empty;
        font-size: $--font-size-default;
    }
}


@include c(tree-node) {
    @include e(item) {

    }
    @include e(title) {
        display: flex;
        align-items: center;
        height: 28px;
        line-height: normal;
        cursor: pointer;
        color: $--color-text-default;
        border-radius: $--border-radius-default;
        background-color: $--color-white;
        transition: background-color $--animation-time;

        &:not(.is-disabled):hover {
            background-color: $--background-color-hover;
        }

        @include when(expand) {
            @include e(expand-icon, false) {
                i {
                    transform: rotate(90deg);
                }
            }
        }
        @include when(disabled) {
            cursor: not-allowed;
            color: $--color-text-disabled;
        }
    }

    @include e(label) {
        flex: 1;
        @include utils-ellipsis();
    }

    @include e(expand-icon) {
        width: 26px;
        text-align: center;
        flex: none;
        i {
            font-size: 12px;
            //font-weight: bold;
            transition: all $--animation-time;
        }
    }
    @include e(checkbox) {
        margin-right: 10px;
        flex: none;
    }
}
