/* Ova Väsen Tour — Bootstrap 5 base, 100% responsive */

:root {
    --pin-color: #0d6efd;
}

html {
    font-size: 1rem;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

.map-page-main {
    padding: 10px;
}

.map-container {
    width: 100%;
    min-height: 0;
    background: #ffffff;
    border: none;
    box-shadow: none;
    outline: none;
}

.map-container-fixed {
    min-height: 320px;
    height: 50vh;
}

@media (min-width: 576px) {
    .map-container-fixed {
        height: 55vh;
        min-height: 400px;
    }
}

@media (min-width: 992px) {
    .map-container-fixed {
        height: 65vh;
        min-height: 480px;
    }
}

#map-home,
#map-pin {
    width: 100%;
    height: 100%;
    min-height: 0;
    overflow: hidden;
    position: relative;
}
.map-pin-click-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 400;
    cursor: pointer;
    pointer-events: auto;
}

#map-home svg,
#map-pin svg {
    background: #ffffff;
    border: none;
}

#map-home .province,
#map-pin .province {
    transition: fill 0.2s ease;
}

#map-home .pin,
#map-pin .pin {
    cursor: default;
    pointer-events: none;
}

#map-pin .province {
    cursor: pointer;
}

/* Leaflet: alleen NL-kaart, witte achtergrond (na leaflet.css laden) */
.leaflet-container {
    background: #fff !important;
}
#map-home.leaflet-container,
#map-pin.leaflet-container,
#map-home.leaflet-container:focus,
#map-pin.leaflet-container:focus,
#map-home.leaflet-container *,
#map-pin.leaflet-container * {
    box-shadow: none !important;
    outline: none !important;
}
.leaflet-container.leaflet-dragging,
.leaflet-container.leaflet-dragging *,
.leaflet-pane,
.leaflet-map-pane,
.leaflet-map-pane *,
.leaflet-map-pane canvas,
.leaflet-map-pane svg,
.leaflet-overlay-pane,
.leaflet-zoom-animated {
    box-shadow: none !important;
    outline: none !important;
}
.leaflet-tile-pane {
    display: none;
}
.leaflet-overlay-pane svg {
    filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.12));
}
.leaflet-dragging .leaflet-overlay-pane svg,
.leaflet-zoom-anim .leaflet-overlay-pane svg {
    filter: none;
}
.leaflet-pin-icon {
    background: none !important;
    border: none !important;
}
.leaflet-pin-icon .pin-marker {
    display: block;
    width: 16px;
    height: 16px;
    margin: -8px 0 0 -8px;
    background: #198754;
    border: 1px solid #333;
    border-radius: 50%;
    box-sizing: border-box;
}
.leaflet-pin-icon-home .pin-marker {
    width: 12px;
    height: 12px;
    margin: -6px 0 0 -6px;
    background: var(--pin-color, #0d6efd);
}

/* Admin: keep responsive */
.admin-card {
    max-width: 100%;
}

@media (min-width: 768px) {
    .admin-card {
        max-width: 32rem;
    }
}

/* Touch-friendly buttons on small screens */
@media (max-width: 575.98px) {
    .btn {
        min-height: 44px;
        padding: 0.5rem 1rem;
    }
}