.select_item[select]{
    /* color: #409eff;
    font-weight: 700; */
    background: #337EFF;
    color: #FFFFFF;
}
.select_item[select]::after{
    color: #FFFFFF;
}

.select_item{
    text-overflow: ellipsis;
    overflow: hidden;  
    margin-top: 8px;
}
.select_item::after{
    color: #999999;
}


.umenuShape{
    min-height: 200px;
    border-width: 1px 1px 1px 0px;
}

.scrollShape{
    max-width: 100%;
    width: var(--cascader-scroll-width);
    height: 200px;
    vertical-align: top;
}

.searchShape{
    max-width: 100%;
    width: var(--cascader-width);
    height: 200px;
    vertical-align: top;
}

.scrollShape:first-child .umenuShape{
    border-radius: 4px 0px 0px 4px;
}
.scrollShape:last-child .umenuShape{
    border-radius: 0px 4px 4px 0px;
}
.scrollShape:only-child .umenuShape{
    border-radius: 4px 4px 4px 4px;
}

.searchShape .umenuShape{
    border-radius: 4px;
}


.spinner{
    position: absolute;
    top: 0;
    right: 0;
    margin-right: calc(var(--select-arrow-right-ratio) * var(--select-padding-x));;
    width: 100%;
    height: 100%;
}

@keyframes linear-spin {
    from { transform: rotate(0deg); }
    to { transform: rotate(360deg); }
}

.spinner::after{
    position: absolute;
    display: inline-block;
    icon-font: url('../u-spinner.vue/assets/spinner.svg');
    right: calc(var(--select-arrow-right-ratio) * var(--select-padding-x) - 2px);
    top: 5px;
    color: black;
    animation: linear-spin var(--spinner-animation-duration) linear 0s infinite;
}