.location-picker-field {
    padding: 16px;
    border: 1px solid #dce5e9;
    border-radius: 18px;
    background: linear-gradient(180deg, #fbfeff, #f5fafb);
}
.location-picker-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}
.location-picker-heading > div { display: grid; gap: 4px; }
.location-current-button,
.location-search-row button {
    min-height: 44px;
    border: 0;
    border-radius: 12px;
    padding: 9px 14px;
    color: #fff;
    background: #169fc6;
    font-weight: 900;
    cursor: pointer;
    transition: transform .15s ease, opacity .15s ease, background .15s ease;
}
.location-current-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    white-space: nowrap;
}
.location-current-button:hover,
.location-search-row button:hover { transform: translateY(-1px); background: #108db1; }
.location-current-button:disabled,
.location-search-row button:disabled { opacity: .55; cursor: wait; transform: none; }
.location-search-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    margin-top: 14px;
}
.location-search-row input { min-height: 48px; }
.location-search-results {
    max-height: 230px;
    overflow: auto;
    display: grid;
    gap: 7px;
    margin-top: 8px;
    padding: 8px;
    border: 1px solid #dce5e9;
    border-radius: 13px;
    background: #fff;
    box-shadow: 0 14px 34px rgba(23, 52, 61, .10);
}
.location-result-button {
    width: 100%;
    min-height: 48px;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    align-items: center;
    gap: 9px;
    border: 0;
    border-radius: 10px;
    padding: 9px 11px;
    color: #293237;
    text-align: start;
    background: #f5f8f9;
    cursor: pointer;
}
.location-result-button:hover { background: #eaf9fd; }
.location-result-button span { color: #169fc6; font-size: 19px; }
.location-result-button strong { font-size: 12px; line-height: 1.45; }
.location-results-empty { margin: 0; padding: 10px; color: #737b84; font-size: 12px; }
.location-map-shell {
    position: relative;
    overflow: hidden;
    min-height: 310px;
    margin-top: 12px;
    border: 1px solid #dce5e9;
    border-radius: 16px;
    background: #e9eef0;
}
.location-map { width: 100%; height: 310px; z-index: 1; }
.location-map.is-unavailable { display: grid; place-items: center; padding: 20px; color: #737b84; text-align: center; }
.location-map-center {
    position: absolute;
    z-index: 450;
    inset: 50% auto auto 50%;
    width: 16px;
    height: 16px;
    transform: translate(-50%, -50%);
    pointer-events: none;
    opacity: .68;
}
.location-map-center span {
    display: block;
    width: 16px;
    height: 16px;
    border: 2px solid rgba(22, 159, 198, .72);
    border-radius: 50%;
    background: rgba(255,255,255,.75);
}
.location-map-loading {
    position: absolute;
    z-index: 600;
    inset: auto 12px 12px;
    padding: 9px 12px;
    border-radius: 11px;
    color: #fff;
    background: rgba(23, 52, 61, .88);
    text-align: center;
    font-size: 12px;
    font-weight: 850;
    backdrop-filter: blur(8px);
}
.location-selected-card {
    display: grid;
    grid-template-columns: 34px minmax(0,1fr) 34px;
    align-items: center;
    gap: 10px;
    margin-top: 10px;
    padding: 10px;
    border: 1px solid #bce7d7;
    border-radius: 13px;
    background: #eaf8f2;
}
.location-selected-icon {
    width: 32px;
    height: 32px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    color: #fff;
    background: #16875f;
    font-weight: 900;
}
.location-selected-card div { min-width: 0; display: grid; gap: 2px; }
.location-selected-card small { color: #39705e; font-size: 10px; font-weight: 850; }
.location-selected-card strong { overflow: hidden; color: #17342d; font-size: 12px; line-height: 1.45; text-overflow: ellipsis; }
.location-selected-card button {
    width: 32px;
    height: 32px;
    border: 0;
    border-radius: 50%;
    color: #607078;
    background: rgba(255,255,255,.8);
    font-size: 20px;
    cursor: pointer;
}
.location-picker-message { min-height: 18px; margin: 8px 0 0; color: #737b84; font-size: 11px; }
.location-picker-message[data-type="success"] { color: #16875f; }
.location-picker-message[data-type="warning"] { color: #a15c00; }
.location-picker-message[data-type="error"] { color: #b42318; font-weight: 850; }
.location-picker-message[data-type="info"] { color: #087795; }
.location-picker-field.has-location { border-color: rgba(22, 135, 95, .38); }
.location-picker-field .leaflet-control-attribution { font-size: 9px; }
[dir="rtl"] .location-result-button { text-align: right; }

@media (max-width: 700px) {
    .location-picker-field { margin-inline: -8px; padding: 12px; border-radius: 15px; }
    .location-picker-heading { display: grid; grid-template-columns: 1fr; }
    .location-current-button { width: 100%; }
    .location-search-row { grid-template-columns: minmax(0,1fr) 70px; }
    .location-map-shell, .location-map { min-height: 265px; height: 265px; }
}
