.location-picker {
    border: 1px solid rgb(var(--color-light-gray));
    border-radius: 15px;
    padding: 16px;
    background: rgb(var(--color-seasalt));
}

.location-picker--missing {
    border-color: rgb(var(--color-danger));
}

.location-picker__row {
    display: flex;
    gap: 8px;
    align-items: stretch;
}

.location-picker__row .form-control {
    flex: 1;
    min-width: 0;
}

.location-picker__button {
    white-space: nowrap;
}

.location-picker__status {
    margin-top: 8px;
    font-size: 0.875rem;
    color: rgb(var(--color-dark) / 0.75);
}

.location-picker__status--error {
    color: rgb(var(--color-danger));
}

.location-picker__results {
    margin-top: 8px;
    list-style: none;
    padding: 0;
    border: 1px solid rgb(var(--color-light-gray));
    border-radius: 10px;
    background: rgb(var(--color-light));
    box-shadow: 0 6px 18px rgb(var(--color-dark-blue) / 0.12);
    max-height: 280px;
    overflow-y: auto;
}

.location-picker__results li + li {
    border-top: 1px solid rgb(var(--color-light-gray));
}

.location-picker__option {
    display: block;
    width: 100%;
    text-align: left;
    padding: 10px 14px;
    font-size: 0.875rem;
    line-height: 1.35;
    color: rgb(var(--color-dark));
    background: transparent;
    cursor: pointer;
}

.location-picker__option:hover,
.location-picker__option:focus-visible {
    background: rgb(var(--color-light-blue) / 0.35);
    outline: none;
}

.location-picker__selected {
    margin-top: 10px;
    padding: 10px 14px;
    border-radius: 10px;
    font-size: 0.875rem;
    color: rgb(var(--color-success));
    background: rgb(var(--color-success) / 0.08);
    border: 1px solid rgb(var(--color-success) / 0.35);
}

.location-picker__selected-title {
    font-weight: 700;
    margin-right: 4px;
}

@media (max-width: 520px) {
    .location-picker__row {
        flex-direction: column;
    }
}