/* SSA Where-to-Fly v2 - map variants (shared) */
#wtf-map-wrap { position: relative; width: 100%; }
#wtf-map { width: 100%; height: 72vh; min-height: 480px; border-radius: 4px; }

/* filter bar above the map */
.wtf-break { flex-basis: 100%; height: 0; }
.wtf-mapstatus { margin: 0 0 8px !important; font-size: 0.9em; color: #4a5a68; min-height: 1em; }
.wtf-mapstatus.wtf-warn { color: #9c3a1f; }
.wtf-mapbar .wtf-zip { width: 92px; padding: 7px 8px; font-size: 0.9em; border: 1px solid #b9c3cc; border-radius: 3px; }
.wtf-mapbar .wtf-or { font-size: 0.85em; color: #7a8794; }
.wtf-mapbar .wtf-go { background: #5b6b78; }
.wtf-mapbar .wtf-go:hover { background: #47545f; }
.wtf-toggle[aria-pressed="false"] { background: #fff; color: #1c4e7d; box-shadow: inset 0 0 0 1px #1c4e7d; }

.wtf-mapbar {
    display: flex; flex-wrap: wrap; align-items: center; gap: 10px;
    padding: 10px 0 12px;
}
.wtf-mapbar select, .wtf-mapbar input[type=text] {
    padding: 7px 10px; font-size: 0.9em; border: 1px solid #b9c3cc; border-radius: 3px;
}
.wtf-legend { display: flex; align-items: center; gap: 14px; font-size: 0.88em; margin-left: auto; }
.wtf-dot { display: inline-block; width: 11px; height: 11px; border-radius: 50%; margin-right: 5px; vertical-align: -1px; }
.wtf-dot-club { background: #1c4e7d; }
.wtf-dot-comm { background: #c8102e; }
.wtf-mapbtn {
    background: #1c4e7d; color: #fff; border: 0; border-radius: 3px;
    padding: 8px 14px; font-size: 0.9em; cursor: pointer;
}
.wtf-mapbtn:hover, .wtf-mapbtn:focus-visible { background: #16405f; }
.wtf-chip {
    border: 1px solid #b9c3cc; background: #fff; color: #334; border-radius: 16px;
    padding: 6px 14px; font-size: 0.88em; cursor: pointer;
}
.wtf-chip[aria-pressed="true"] { background: #1c4e7d; border-color: #1c4e7d; color: #fff; }

/* popups (Leaflet + Google share these classnames) */
.wtf-pop { font-size: 13px; line-height: 1.5; min-width: 190px; }
.wtf-pop b { font-size: 14px; }
.wtf-pop .wtf-pop-type { display: inline-block; font-size: 11px; border-radius: 3px; padding: 1px 7px; color: #fff; margin-bottom: 4px; }
.wtf-pop .wtf-pop-type.club { background: #1c4e7d; }
.wtf-pop .wtf-pop-type.commercial { background: #c8102e; }
.wtf-pop a { color: #1c4e7d; }
.wtf-pop .wtf-pop-dir { display: inline-block; margin-top: 5px; font-weight: 600; }

/* Variant C: locator split layout */
.wtf-locator { display: flex; gap: 0; height: 72vh; min-height: 500px; border: 1px solid #d7dee4; border-radius: 4px; overflow: hidden; }
.wtf-list { width: 340px; min-width: 280px; overflow-y: auto; background: #fff; border-right: 1px solid #d7dee4; }
.wtf-locator #wtf-map { height: 100%; min-height: 0; border-radius: 0; flex: 1; }
.wtf-card { padding: 12px 14px; border-bottom: 1px solid #edf1f4; cursor: pointer; }
.wtf-card:hover { background: #f4f8fb; }
.wtf-card.active { background: #e9f1f8; box-shadow: inset 3px 0 0 #1c4e7d; }
.wtf-card h5 { margin: 0 0 3px; font-size: 14px; line-height: 1.3; }
.wtf-card p { margin: 0; font-size: 12px; color: #55636f; line-height: 1.45; }
.wtf-card .wtf-card-dist { color: #1c4e7d; font-weight: 600; }
.wtf-empty { padding: 22px 14px; font-size: 13px; color: #55636f; }

@media (max-width: 760px) {
    .wtf-locator { flex-direction: column-reverse; height: auto; }
    .wtf-locator #wtf-map { height: 46vh; min-height: 300px; }
    .wtf-list { width: 100%; max-height: 44vh; border-right: 0; border-top: 1px solid #d7dee4; }
    .wtf-legend { margin-left: 0; }
}
