@import '../../style/default.less';
@import './defalut.less';

.scatter-cascader {
    width: 100%;
    color: @scatter-cascader-color;
    .ant-select-clear {
        top: 53%;
    }
    &.ant-select-multiple {
        .ant-select-selector {
            max-height: 132px;
            overflow: auto;
        }
    }
    &.ant-select-disabled {
        .scatter-cascader-select-item {
            &.ant-tag-has-color,
            &.ant-tag-has-color a,
            &.ant-tag-has-color a:hover,
            &.ant-tag-has-color .anticon-close,
            &.ant-tag-has-color .anticon-close:hover {
                color: @disabled-color;
            }
        }
    }
    &-select-item {
        display: flex;
        align-items: center;
        font-size: 12px;
        padding: 0 8px;
        margin-top: 1.5px;
        margin-bottom: 1.5px;
        margin-right: 4px;
        &.ant-tag > .anticon + span,
        &.ant-tag > span + .anticon {
            margin-left: 4px;
        }
        &.ant-tag-has-color,
        &.ant-tag-has-color a,
        &.ant-tag-has-color a:hover,
        &.ant-tag-has-color .anticon-close,
        &.ant-tag-has-color .anticon-close:hover {
            color: @scatter-cascader-color;
        }
        &.ant-tag-hidden {
            display: none;
        }
    }

    &-dropdown {
        min-width: @scatter-cascader-menu-min-width !important;
        color: @scatter-cascader-color;
        height: @scatter-cascader-menu-height;
    }
    &-menus {
        display: flex;
        flex-wrap: nowrap;
        align-items: flex-start;
        margin: -4px;
    }
    &-menu {
        min-width: @scatter-cascader-menu-min-width;
        max-width: @scatter-cascader-menu-max-width;
        padding: 4px 0;
        margin: -4px 0;
        color: @scatter-cascader-color;
        border-right: 1px solid rgba(0, 0, 0, 0.05);
        &-virtual {
            min-width: @scatter-cascader-menu-max-width;
        }
        .ant-menu-item,
        .ant-menu-item:not(:last-child) {
            margin: 0;
            height: 48px;
            line-height: 48px;
            display: flex;
            flex-wrap: nowrap;
            align-items: center;
        }
        .ant-menu-item {
            .ant-menu-title-content {
                display: flex;
            }
            &-active,
            &:hover {
                color: @scatter-cascader-color;
                background: @scatter-cascader-menu-item-hover-background;

            }
        }
        &-item {
            margin: 4px;
            height: 48px;
            line-height: 48px;
            padding: 0 16px;
            display: flex;
            flex-wrap: nowrap;
            align-items: center;
            border-radius: 4px;
            cursor: pointer;
            &:hover:not(&-active):not(&-disabled) {
                color: @scatter-cascader-color;
                background: @scatter-cascader-menu-item-hover-background;
            }
            &-active {
                color: @scatter-cascader-color;
                background: @scatter-cascader-menu-item-active-background;
            }
            &-disabled {
                cursor: not-allowed;
            }
            &-content {
                flex: auto;
                white-space: nowrap;
                overflow: hidden;
                text-overflow: ellipsis;
                font-size: @font-size-base;
            }
            &-expand-icon {
                margin-left: 4px;
            }
        }
    }
    &-search-menu {
        min-width: @scatter-cascader-menu-max-width;
        max-width: @scatter-cascader-search-menu-max-width;
        &-virtual {
            min-width: @scatter-cascader-search-menu-max-width;
        }
    }
    &-checkbox {
        top: 0;
        margin-right: 8px;
    }
}