.flodz-region-map {
    --map-surface: var(--flodz-surface, #fff);
    --map-text: var(--flodz-text, #142033);
    --map-muted: var(--flodz-muted, #5d6678);
    --map-border: var(--flodz-border, #dde5ef);
    --map-accent: var(--flodz-accent, #b3261e);
    --map-blue: var(--flodz-blue, #123c69);
    color: var(--map-text);
    container-type: inline-size;
    margin: 1.5rem 0;
    max-width: 100%;
}

.flodz-map-filters,
.flodz-map-results-wrap {
    background: var(--map-surface);
    border: 1px solid var(--map-border);
    border-radius: 16px;
    box-shadow: 0 8px 20px rgba(20, 35, 60, .06);
    margin-bottom: 14px;
    overflow: clip;
}

.flodz-map-filters > summary,
.flodz-map-results-wrap > summary {
    cursor: pointer;
    font-weight: 800;
    min-height: 44px;
    padding: 12px 16px;
}

.flodz-map-filter-grid {
    align-items: end;
    border-top: 1px solid var(--map-border);
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr));
    padding: 16px;
}

.flodz-map-field label {
    display: block;
    font-size: .82rem;
    font-weight: 800;
    margin-bottom: 5px;
}

.flodz-map-field input,
.flodz-map-field select,
.flodz-map-reset {
    border: 1px solid var(--map-border);
    border-radius: 11px;
    box-sizing: border-box;
    font: inherit;
    min-height: 44px;
    width: 100%;
}

.flodz-map-field input,
.flodz-map-field select {
    background: #fff;
    color: var(--map-text);
    padding: 9px 11px;
}

.flodz-map-search-help {
    color: var(--map-muted);
    display: block;
    font-size: .78rem;
    line-height: 1.35;
    margin-top: 5px;
}

.flodz-map-reset {
    background: var(--map-blue);
    color: #fff;
    cursor: pointer;
    font-weight: 800;
    padding: 9px 14px;
    width: 100%;
}

.flodz-map-reset:hover,
.flodz-map-reset:focus-visible {
    background: #0d2c4d;
}

.flodz-map-field input:focus-visible,
.flodz-map-field select:focus-visible,
.flodz-map-reset:focus-visible,
.flodz-map-canvas:focus-visible {
    outline: 3px solid rgba(18, 60, 105, .3);
    outline-offset: 2px;
}

.flodz-map-status {
    color: var(--map-muted);
    font-weight: 700;
    margin: 10px 2px;
}

.flodz-region-map.is-error .flodz-map-status {
    color: #9f1d18;
}

.flodz-map-canvas {
    background: #e9f1f9;
    border: 1px solid var(--map-border);
    border-radius: 18px;
    box-shadow: 0 12px 28px rgba(20, 35, 60, .1);
    height: clamp(440px, 68vh, 720px);
    max-width: 100%;
    overflow: hidden;
    width: 100%;
}

.flodz-map-stage { position: relative; }
.flodz-map-fullscreen {
    background: var(--map-surface);
    border: 1px solid var(--map-border);
    border-radius: 9px;
    box-shadow: 0 2px 8px rgba(20, 32, 51, .22);
    color: var(--map-text);
    cursor: pointer;
    font: inherit;
    font-size: .84rem;
    font-weight: 800;
    min-height: 42px;
    padding: 8px 12px;
    position: absolute;
    right: 12px;
    top: 12px;
    z-index: 1000;
}
.flodz-map-fullscreen:focus-visible,
.flodz-map-show-marker:focus-visible { outline: 3px solid rgba(18, 60, 105, .3); outline-offset: 2px; }
.flodz-map-stage:fullscreen,
.flodz-map-stage.is-fallback-fullscreen {
    background: var(--map-surface);
    height: 100dvh;
    width: 100vw;
}
.flodz-map-stage.is-fallback-fullscreen {
    inset: 0;
    position: fixed;
    z-index: 99999;
}
.flodz-map-stage:fullscreen .flodz-map-canvas,
.flodz-map-stage.is-fallback-fullscreen .flodz-map-canvas {
    border-radius: 0;
    height: 100%;
    max-height: none;
    width: 100%;
}

.flodz-map-marker-wrap {
    background: transparent;
    border: 0;
}

.flodz-map-marker {
    background: #5d6678;
    border: 3px solid #fff;
    border-radius: 50% 50% 50% 8px;
    box-shadow: 0 3px 10px rgba(20, 32, 51, .35);
    display: block;
    height: 28px;
    transform: rotate(-45deg);
    width: 28px;
}

.flodz-map-marker--business { background: #123c69; }
.flodz-map-marker--institution { background: #6f3fa0; }
.flodz-map-marker--historic { background: #a64920; }
.flodz-map-marker--museum { background: #b3261e; }
.flodz-map-marker--nature { background: #176b45; }
.flodz-map-marker--technical { background: #58616f; }
.flodz-map-marker--place { background: #bd7d05; }

.flodz-map-popup-title,
.flodz-map-popup-meta {
    display: block;
    margin-bottom: 6px;
}

.flodz-map-popup-title { font-size: 1rem; line-height: 1.3; }
.flodz-map-popup-meta { color: #5d6678; font-size: .82rem; }
.flodz-map-popup p { margin: 7px 0; }
.flodz-map-popup-link { font-weight: 800; }

.flodz-map-results-wrap { margin-top: 14px; }
.flodz-map-results {
    border-top: 1px solid var(--map-border);
    column-count: 2;
    column-gap: 30px;
    list-style: none;
    margin: 0;
    padding: 10px 18px 18px;
}

.flodz-map-results li {
    break-inside: avoid;
    border-bottom: 1px solid var(--map-border);
    padding: 9px 0;
}

.flodz-map-results a { font-weight: 750; }
.flodz-map-results span { color: var(--map-muted); display: block; font-size: .84rem; }
.flodz-map-show-marker {
    background: transparent;
    border: 0;
    color: var(--map-blue);
    cursor: pointer;
    font: inherit;
    font-size: .84rem;
    font-weight: 800;
    padding: 3px 0;
    text-decoration: underline;
    text-underline-offset: 3px;
}

.flodz-region-map .marker-cluster-small div,
.flodz-region-map .marker-cluster-medium div,
.flodz-region-map .marker-cluster-large div {
    background: var(--map-blue);
    color: #fff;
    font-weight: 800;
}

.flodz-region-map .marker-cluster-small,
.flodz-region-map .marker-cluster-medium,
.flodz-region-map .marker-cluster-large {
    background: rgba(18, 60, 105, .28);
}

@container (min-width: 620px) {
    .flodz-map-field-search { grid-column: span 2; }
}

@media (max-width: 720px) {
    .flodz-map-filter-grid { grid-template-columns: 1fr; padding: 13px; }
    .flodz-map-field-search { grid-column: auto; }
    .flodz-map-reset { width: 100%; }
    .flodz-map-canvas { border-radius: 13px; height: 62vh; min-height: 390px; }
    .flodz-map-results { column-count: 1; }
    .flodz-region-map .leaflet-control-zoom a { height: 42px; line-height: 42px; width: 42px; }
}

@media (prefers-reduced-motion: reduce) {
    .flodz-region-map *,
    .flodz-region-map *::before,
    .flodz-region-map *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
    }
}

