/**
 * World-Map Screen - nur einzigartige Styles für diesen Screen.
 * Größere Kartenfläche; Hover-Vergrößerung der Gerichtebilder (Klasse per JS bei Hover).
 */

.leaflet-map-container-world-map {
    min-height: 70vh;
}

.leaflet-marker-icon.world-map-marker-icon {
    pointer-events: auto;
}

.world-map-marker-preview-outer {
    transition: transform 0.2s ease;
}

.world-map-marker-image-wrap {
    transition: none;
    transform-origin: center center;
}

.world-map-marker-icon-raised {
    z-index: 2147483647;
    overflow: visible;
}

/* Hover-Preview: Bild mindestens 4x so groß (Scale 12 = 144px), gut sichtbar */
.world-map-marker-preview-outer.world-map-marker-image-wrap-base-hover {
    transform: scale(12);
}

/* Details-Button unter dem Kreis, komplett sichtbar, bewusst klein */
.world-map-marker-details-btn {
    display: none;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    height: 5px;
    margin: 0;
    padding: 0 2px;
    font-size: 5px;
    line-height: 1;
    white-space: nowrap;
    cursor: pointer;
    border: none;
    border-radius: 2px;
    background: var(--color-button-standard-bg);
    color: var(--color-button-standard-text);
    box-sizing: border-box;
}
.world-map-marker-preview-outer.world-map-marker-image-wrap-base-hover .world-map-marker-details-btn {
    display: block;
    /* Gegen-Scale damit Button klein bleibt trotz großem Preview */
    transform: scale(0.2);
    transform-origin: top center;
}

/* Statistik-Zeile unter der Headline dezent hervorheben */
.world-map-stats-line {
    font-weight: 600;
    color: var(--color-content-strong);
}

/* AJAX-geladene Kacheln: maximale verfügbare Breite der Spalte nutzen */
.world-map-restaurant-info-column,
.world-map-restaurant-info {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}
.world-map-restaurant-info .dl-detail-wrap,
.world-map-restaurant-info .dl-detail-hero,
.world-map-restaurant-info .dl-detail-grid,
.world-map-restaurant-info .dl-section {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}
.world-map-restaurant-info .dl-detail-wrap {
    margin: 0;
}
/* Grid auf eine Spalte, damit Beschreibung/Speisekarte so breit wie Hero-Kachel sind */
.world-map-restaurant-info .dl-detail-grid {
    grid-template-columns: 1fr;
}
.world-map-restaurant-info .dl-detail-grid > div {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}