/**
 * [fas_map] / [fas_search] / single-listing map — Leaflet container, pins, clusters,
 * popup. Re-skin Surface 4 (v0.13.15): styled through --fas-* tokens (fas-map.css
 * depends on fas-lake-tokens) — no hardcoded hexes. Shared by all three map surfaces,
 * so the brand palette applies everywhere. Loads alongside vendored leaflet + cluster.
 */

.fas-map-wrap {
    margin: 1.5rem 0;
}

.fas-map {
    width: 100%;
    min-height: 320px;
    border-radius: var(--fas-radius-md);
    overflow: hidden;
    z-index: 0; /* keep tiles/controls under sticky theme headers */
}

.fas-map__empty {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    min-height: 320px;
    color: var(--fas-text-muted);
}

.fas-map__meta {
    margin: 0.5rem 0 0;
    font-size: 0.85em;
    color: var(--fas-text-faint);
}

.fas-map__notice {
    margin: 1rem 0;
    padding: 0.75rem 1rem;
    border: 1px dashed var(--fas-border);
    border-radius: var(--fas-radius-sm);
    color: var(--fas-text-muted);
}

/* Pin — brand blue (was the WP-admin blue) with a white ring. */
.fas-map-pin__dot {
    display: block;
    width: 16px;
    height: 16px;
    margin: 4px;
    background: var(--fas-primary);
    border: 2px solid var(--fas-surface);
    border-radius: 50%;
    box-shadow: var(--fas-shadow-sm);
}

/* Active pin — swapped in while its list card is hovered (6b.5b-ii-a). Larger dot +
   the accent colour so the hovered listing stands out on the map. */
.fas-map-pin--active .fas-map-pin__dot {
    width: 20px;
    height: 20px;
    margin: 5px;
    background: var(--fas-pin-active);
    box-shadow: var(--fas-shadow-sm);
}

/* Centroid pin — a town-center floor (Lake Fix 1), NOT the exact address. A hollow,
   muted dot with a dashed ring reads as "approximate" — distinct from the solid brand
   pins without alarming (not red = no error signal). Paired with the popup caveat. */
.fas-map-pin--centroid .fas-map-pin__dot {
    background: transparent;
    border: 2px dashed var(--fas-text-muted);
    box-shadow: var(--fas-shadow-sm);
    opacity: 0.9;
}

/* Cluster */
.fas-map-cluster {
    background: transparent;
}

.fas-map-cluster__inner {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    color: var(--fas-surface);
    font-size: 13px;
    font-weight: 700;
    background: var(--fas-primary);
    border: 2px solid var(--fas-surface);
    box-shadow: var(--fas-shadow-md);
}

.fas-map-cluster--md .fas-map-cluster__inner {
    width: 46px;
    height: 46px;
}

.fas-map-cluster--lg .fas-map-cluster__inner {
    width: 54px;
    height: 54px;
    font-size: 14px;
}

/* Leaflet popup wrapper — token-styled to match the card chrome (Ziti). */
.fas-map .leaflet-popup-content-wrapper {
    background: var(--fas-surface);
    border-radius: var(--fas-radius-lg);
    box-shadow: var(--fas-shadow-card);
}

.fas-map .leaflet-popup-tip {
    background: var(--fas-surface);
}

/* Popup content */
.fas-map-popup__media img {
    display: block;
    width: 100%;
    height: 140px;
    object-fit: cover;
    border-radius: var(--fas-radius-sm) var(--fas-radius-sm) 0 0;
}

.fas-map-popup__body {
    padding: 0.5rem 0.25rem 0.25rem;
}

.fas-map-popup__price {
    font-weight: 700;
    font-size: 1.05em;
    color: var(--fas-text);
}

.fas-map-popup__title {
    margin-top: 0.1rem;
}

.fas-map-popup__meta {
    margin-top: 0.25rem;
    font-size: 0.9em;
    color: var(--fas-text-muted);
}

/* Caveat shown only on centroid (town-center floored) pins. Muted + italic so it
   reads as a clarifying note, not an error. */
.fas-map-popup__approx {
    margin-top: 0.3rem;
    font-size: 0.82em;
    font-style: italic;
    color: var(--fas-text-muted);
}
