
@import "@core/scss/theme/config.scss";

.cd-cascade-select-layer {
    position: absolute;
    z-index: 9;
    display: flex;
    border-radius: 2px;
    box-shadow: 0 0 12px 0 rgba(0,0,0,0.20);
    background-color: #fff;
    min-width: 100px;
    height: 180px;

    .cd-cascade-select-menu {
        flex: 0 0 auto;
        border-left: 1px solid $colorLineLight;
        width: 96px;
        max-height: 100%;
        overflow-y: auto;

        &:first-child {
            border-left: none;
        }
    }

    .cd-cascade-select-menu-loading {
        border-left: 1px solid $colorLineLight;
        width: 120px;
        height: 100%;
    }

    .cd-cascade-select-item {
        padding: 0 10px;
        //width: 100px;
        height: 30px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        cursor: pointer;

        &.cd-cascade-select-more {

            &:after {
                content: ' ';
                border-top: 1px solid $colorNormal;
                border-right: 1px solid $colorNormal;
                width: 5px;
                height: 5px;
                transform: rotate(45deg);
            }
        }

        &:hover, &.cd--selected {
            background-color: #fff6ef;

            .cd-cascade-select-text {
                color: $colorBrand;
            }
        }
    }
    .cd-cascade-select-text {
        font-size: $fontSizeSmall;
        color: $colorBlack;
        @include ellipse();
    }

    .cd-cascade-select-empty {
        padding: 0 10px;
        width: 100px;
        height: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
    }
}
