.filterable-select{
    position:relative;
    width:100%;
}

.filterable-select-input{
    width:100%;
    padding-right:38px;
}

.filterable-select-toggle{
    position:absolute;
    top:1px;
    right:1px;
    width:36px;
    height:calc(100% - 2px);
    max-height:42px;
    border:0;
    border-left:1px solid #E5E7EB;
    border-radius:0 7px 7px 0;
    background:#fff;
    color:var(--text-soft);
    cursor:pointer;
    z-index:3;
}

.filterable-select-toggle:disabled{
    cursor:not-allowed;
    opacity:.5;
}

.filterable-select-native{
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    padding:0 !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0,0,0,0) !important;
    white-space:nowrap !important;
    border:0 !important;
    opacity:0 !important;
    pointer-events:none !important;
}

.filterable-select-menu,
.filterable-select-empty{
    position:absolute;
    z-index:90;
    top:calc(100% + 4px);
    left:0;
    right:0;
    max-height:min(320px,45vh);
    overflow:auto;
    border:1px solid var(--border);
    border-radius:9px;
    background:#fff;
    box-shadow:0 12px 30px rgba(15,23,42,.15);
}

.filterable-select-menu{
    padding:5px;
}

.filterable-select-empty{
    padding:11px 12px;
    color:var(--text-soft);
    font-size:13px;
}

.filterable-select-option{
    display:block;
    width:100%;
    border:0;
    border-radius:6px;
    padding:9px 10px;
    background:transparent;
    color:var(--text);
    text-align:left;
    line-height:1.25;
    cursor:pointer;
}

.filterable-select-option:hover,
.filterable-select-option:focus{
    outline:none;
    background:var(--hw-light-blue);
    color:var(--hw-navy);
}

.filterable-select-option.is-selected{
    background:var(--hw-light-blue);
    color:var(--hw-navy);
    font-weight:800;
}

.filterable-select.is-open{
    z-index:95;
}

@media(max-width:640px){
    .filterable-select-menu,
    .filterable-select-empty{
        max-height:42vh;
    }

    .filterable-select-option{
        padding:11px 10px;
        min-height:42px;
    }
}
