/* NOTE: Landkarte / Map */

.page-id-49160 h2 {margin-top: 0 !important;}
.leaflet-marker-icon {
    background-color: transparent; /* Sicherstellen, dass die Marker-Icons korrekt dargestellt werden */
}
.leaflet-container.leaflet-touch-drag {z-index:0 !important; margin-bottom: 20px;}
.map-popup {min-width: 100px; text-align: center; font-family: 'brandon-regular', sans-serif;}
.map-thnail {display: block; margin: 0 auto 10px; max-width: 100%; border-radius: 8px;}
.map-titel {font-family: 'Apris', serif; font-weight:bold; font-size: large;}

/* Cluster-Text */
.marker-cluster-small div,
.marker-cluster-medium div,
.marker-cluster-large div {
    font-family: var(--cp-font-body);
    font-size: 12px;
    line-height: 24px;
    text-align: center;
}
.leaflet-popup-content-wrapper {
    background-color: white; /* Hintergrundfarbe */
    border-radius: 8px; /* Abgerundete Ecken */
    padding: 10px; /* Innenabstand */
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2); /* Schatten für bessere Lesbarkeit */
}

.leaflet-popup-content:not(.cp-map-popup__title) {
    color: #333; /* Textfarbe */
    font-family: var(--cp-font-body); /* Standardschrift für Popups */
}

.leaflet-popup-content b, .leaflet-popup-content__title {
    font-family: var(--cp-font-heading); /* Standardschrift für Titel */
    font-size: 18px;
}
.leaflet-popup-content a {
    margin-top: 5px; /* Abstand oberhalb des Links */
    display: block; /* Link als Blockelement, damit der Abstand wirksam wird */
    text-align: center; /* Optional: Zentrierung des Links */
    color: var(--cppink); /* Optional: Linkfarbe */
    text-decoration: none; /* Optional: Entfernt Unterstreichung */
}

.leaflet-popup-content a:hover {
    text-decoration: underline; /* Optional: Unterstreichung bei Hover */
}
/* Cluster-Styling
.marker-cluster-small {
    background-color: rgba(248, 69, 177, 0.6);
    border: 2px solid #f845b1;
    border-radius: 50%;
    color: white;
}

.marker-cluster-medium {
    background-color: rgba(248, 69, 177, 0.8);
    border: 2px solid #f845b1;
    border-radius: 50%;
    color: white;
}

.marker-cluster-large {
    background-color: rgba(248, 69, 177, 1);
    border: 2px solid #f845b1;
    border-radius: 50%;
    color: white;
} */

@media (max-width: 768px) {
    .leaflet-popup-content-wrapper {
        font-size: 14px; /* Kleinere Schriftgröße für Mobilgeräte */
        max-width: 225px !important;
    }

    .marker-cluster-small,
    .marker-cluster-medium,
    .marker-cluster-large {
        font-size: 10px; /* Kleinere Cluster-Textgröße */
    }
}