/* Reusable Tom Select integration. Keep this after the vendor stylesheet. */
.searchable-select {
    position: relative;
    min-width: 0;
}

.searchable-select .ts-wrapper {
    width: 100%;
    padding-block: 0;
}

.searchable-select .ts-wrapper.single .ts-control,
.searchable-select .ts-wrapper.single.input-active .ts-control {
    min-height: 40px;
    padding: .5rem 2.5rem .5rem .75rem !important;
    border: 1px solid #212529;
    border-radius: 0;
    background: #fff;
    box-shadow: none;
    color: #212529;
    font-family: inherit;
    font-size: 1rem;
    line-height: 1.5;
    align-items: center;
}

.searchable-select .ts-wrapper.single .ts-control input {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit;
    color: inherit;
}

.searchable-select .ts-wrapper.focus .ts-control {
    outline: 2px solid #444;
    outline-offset: 2px;
}

.searchable-select.is-filtered .ts-wrapper.single .ts-control,
.searchable-select.is-filtered .ts-wrapper.single.input-active .ts-control {
    background: #212529;
    color: #fff;
}

.searchable-select.is-filtered .ts-wrapper.single .ts-control input {
    color: #fff;
}

.searchable-select.is-filtered .ts-wrapper.single .ts-control:after {
    border-top-color: #fff;
}

.searchable-select.is-filtered .ts-wrapper.single.dropdown-active .ts-control:after {
    border-top-color: transparent;
    border-bottom-color: #fff;
}

.searchable-select .ts-dropdown {
    max-width: 100%;
    border: 1px solid #212529;
    border-radius: 0;
    box-shadow: 0 5px 12px rgb(0 0 0 / 12%);
    color: #212529;
    font-family: inherit;
    font-size: 1rem;
    z-index: 1050;
}

.searchable-select .ts-dropdown-content {
    max-height: 20rem;
}

.searchable-select .ts-dropdown .option {
    padding: .6rem .75rem;
    color: #212529;
    background: #fff;
}

.searchable-select .ts-dropdown .option.active,
.searchable-select .ts-dropdown .option:hover {
    color: #212529;
    background: #f1f1f1;
}

.searchable-select .ts-dropdown .option.selected {
    font-weight: 600;
}

.searchable-select .searchable-select__label {
    min-width: 0;
    overflow-wrap: anywhere;
}

.searchable-select .ts-dropdown .no-results {
    padding: .75rem;
}

.searchable-select--filter {
    width: 100%;
}

@media (min-width: 992px) {
    .searchable-select--filter {
        width: 22rem;
    }
}

/* Optional visible search field at the top of the dropdown_input menu. */
.searchable-select .ts-wrapper.plugin-dropdown_input .dropdown-input-wrap {
    padding: .625rem .75rem;
    background: #fff;
    border-bottom: 1px solid #dee2e6;
}

.searchable-select .ts-wrapper.plugin-dropdown_input .dropdown-input {
    display: block;
    box-sizing: border-box;
    width: 100%;
    min-height: 40px;
    padding: .5rem .75rem;
    border: 1px solid #adb5bd;
    border-radius: 0;
    box-shadow: none;
    background: #fff;
    color: #212529;
    font: inherit;
}

.searchable-select .ts-wrapper.plugin-dropdown_input .dropdown-input:focus {
    outline: 2px solid #444;
    outline-offset: 1px;
    border-color: #212529;
}

.searchable-select .ts-wrapper.plugin-dropdown_input .dropdown-input::placeholder {
    color: #6c757d;
    opacity: 1;
}