.searchable-select { position: relative; width: 100%; min-width: 0; }

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

.searchable-select-input {
    width: 100%; min-width: 0; padding: .75rem 2.3rem .75rem .75rem;
    border: 1px solid var(--border); border-radius: .5rem;
    background: var(--surface) linear-gradient(45deg, transparent 50%, var(--text-secondary) 50%) calc(100% - 1rem) 52% / .42rem .42rem no-repeat, linear-gradient(135deg, var(--text-secondary) 50%, transparent 50%) calc(100% - .63rem) 52% / .42rem .42rem no-repeat;
    color: var(--text); font: inherit; font-weight: 500; cursor: text;
}

.searchable-select-input:focus { outline: none; border-color: var(--primary); box-shadow: 0 0 0 3px rgba(37, 99, 235, .12); }
.searchable-select.is-disabled .searchable-select-input { cursor: not-allowed; opacity: .6; }

.searchable-select-options {
    position: absolute; z-index: 10001; top: calc(100% + .25rem); left: 0; width: 100%;
    max-height: min(18rem, 45vh); overflow: auto; padding: .35rem; border: 1px solid var(--border);
    border-radius: .6rem; background: var(--surface); box-shadow: 0 12px 28px rgba(15, 23, 42, .18);
}

.searchable-select-option, .searchable-select-empty {
    display: block; width: 100%; padding: .6rem .7rem; border: 0; border-radius: .4rem;
    background: transparent; color: var(--text); font: inherit; text-align: left; overflow-wrap: anywhere;
}

.searchable-select-option { cursor: pointer; }
.searchable-select-option:hover, .searchable-select-option.is-selected { background: rgba(37, 99, 235, .1); color: var(--primary); }
.searchable-select-option:disabled { cursor: not-allowed; opacity: .45; }
.searchable-select-empty { color: var(--text-secondary); }
.searchable-select:has(.status-inline-select), .searchable-select:has(.filter-select) { width: auto; }
.searchable-select-input.status-inline-select { min-height: 0; border: 0; padding: .3rem 1.5rem .3rem .75rem; border-radius: 9999px; }
.searchable-select-input.filter-select { min-width: 200px; }
@media (max-width: 640px) { .searchable-select-options { max-height: 40vh; } }
