/*
 * Offer Map component — container and Leaflet override styles for the
 * geolocation map on the offer single page.
 */

.tv-offer-map__title {
    font-family: var(--tv-font-heading);
    font-size: 1.75rem;
    color: var(--tv-color-green-dark);
    margin: 0 0 var(--tv-space-6);
}

.tv-offer-map__canvas {
    width: 100%;
    height: 400px;
    overflow: hidden;
    background: var(--tv-color-cream);
}

.tv-offer-map__fallback {
    margin: 0;
    padding: var(--tv-space-6);
    text-align: center;
    background: var(--tv-color-cream);
    border-radius: var(--tv-radius-md);
    font-family: var(--tv-font-body);
    color: var(--tv-color-text);
}

/* Leaflet popup tweaks — match the site typography. */
.tv-offer-map__canvas .leaflet-popup-content {
    font-family: var(--tv-font-body);
    color: var(--tv-color-text);
    margin: var(--tv-space-3) var(--tv-space-4);
}

.tv-offer-map__canvas .leaflet-popup-content strong {
    display: block;
    font-family: var(--tv-font-heading);
    color: var(--tv-color-green-dark);
    margin-bottom: var(--tv-space-1);
}

@media (max-width: 768px) {
    .tv-offer-map {
        padding: 0 var(--tv-space-4);
    }

    .tv-offer-map__canvas {
        height: 300px;
    }
}