.danmission-stift-map-container {
    background-color: transparent;
    border-radius: 8px;
    overflow: hidden;
}

.leaflet-control-attribution {
    display: none !important;
}

.leaflet-container {
    background: transparent !important;
    cursor: default !important;
}

.stift-polygon {
    transition: filter 0.3s ease;
    cursor: pointer !important;
}

.stift-hovered {
    filter: brightness(1.08) saturate(1.1);
}

/* NUCLEAR FIX: Ensure no invisible Leaflet panes block clicks */
.leaflet-pane,
.leaflet-tile-pane,
.leaflet-shadow-pane,
.leaflet-marker-pane,
.leaflet-tooltip-pane,
.leaflet-popup-pane,
.leaflet-overlay-pane {
    pointer-events: none !important;
}

/* The SVG container MUST allow pointer events so they reach the <path> elements */
.leaflet-overlay-pane svg {
    pointer-events: auto !important;
}

/* Only the actual polygons should catch clicks */
.leaflet-interactive,
.stift-polygon,
path.leaflet-interactive {
    pointer-events: all !important;
    cursor: pointer !important;
}

/* Tooltip */
.danmission-tooltip {
    background: #ffffff;
    border: none;
    border-left: 3px solid #6BA700;
    border-radius: 6px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
    color: #1a1a1a;
    font-family: inherit;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.01em;
    padding: 7px 14px;
    pointer-events: none;
    white-space: nowrap;
}

.danmission-tooltip::before {
    border-top-color: #ffffff;
    filter: drop-shadow(0 2px 3px rgba(0, 0, 0, 0.1));
}

/* ── Responsive: phones — height matches Denmark's 1.33:1 geographic aspect ratio ── */
@media (max-width: 768px) {
    .danmission-stift-map-container {
        height: 70vw !important;
        min-height: 240px;
    }
}

/* ── Responsive: phones (landscape) ── */
@media (max-width: 768px) and (orientation: landscape) {
    .danmission-stift-map-container {
        height: 50vw !important;
        min-height: 200px;
    }
}