/* ==========================================================================
   Cartes Leaflet — popup, épingle, message de zoom.
   Chargé uniquement par les vues qui affichent une carte (@section('extraCss')).

   ⚠️ Ce fichier n'est PAS dans paths.styles.src du gulpfile, et ne doit pas y
   entrer : purgecss y supprimerait toutes les classes .leaflet-* / .maplibregl-*
   (le DOM de la carte est créé en JS, donc absent des vues Blade scannées).
   Il est chargé tel quel par asset(), sans concaténation ni minification.

   On ne réutilise AUCUNE classe Bootstrap dans le HTML de popup : leaflet.css
   pose `.leaflet-container a { color: #0078A8 }` (spécificité 0,2,0), qui
   écraserait le blanc d'un .btn-primary (0,1,0) — bouton illisible. Et comme
   site-map.js n'est pas scanné par purgecss, une classe du thème utilisée là
   serait de toute façon supprimée de app.min.css.
   ========================================================================== */

/* -- Épingle : neutralise le carré blanc bordé de .leaflet-div-icon -- */
.site-map-pin {
    background: none;
    border: 0;
}

/* -- Contenu de la popup -- */
.site-map-popup {
    font-family: 'Manrope', Arial, sans-serif;
    line-height: 1.4;
    text-align: center;
    padding: 2px 0;
}

.site-map-popup-title {
    display: block;
    margin: 0 0 3px;
    font-size: 15px;
    font-weight: 700;
    color: #3a2a38;
}

.site-map-popup-meta {
    display: block;
    margin: 0 0 8px;
    font-size: 13px;
    color: #555e72;
}

/* Ciblé par nom de balise pour passer devant `.leaflet-container a`,
   quel que soit l'ordre de chargement des feuilles. */
.leaflet-popup-content a.site-map-popup-link {
    display: inline-block;
    padding: 6px 14px;
    border-radius: 6px;
    background: #c5936d;
    color: #ffffff;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    text-decoration: none;
}

.leaflet-popup-content a.site-map-popup-link:hover,
.leaflet-popup-content a.site-map-popup-link:focus {
    background: #3a2a38;
    color: #ffffff;
    text-decoration: none;
}

/* -- Leaflet : reprend le gabarit de l'ancienne InfoWindow -- */
.leaflet-container {
    font-family: 'Manrope', Arial, sans-serif;
    background: #f4f4f4;
}

.leaflet-popup-content-wrapper {
    /* Padding symétrique et assez large pour que la croix de fermeture
       ne colle pas au titre. */
    padding: 10px 26px;
    border-radius: 10px;
    box-shadow: 0 3px 14px rgba(0, 0, 0, 0.15);
}

.leaflet-popup-content {
    margin: 0;
    font-size: inherit;
    line-height: inherit;
}

.leaflet-popup-tip {
    background: #fff;
}

.leaflet-container a.leaflet-popup-close-button {
    width: 24px;
    height: 24px;
    padding: 4px 0 0 0;
    font-size: 16px;
    color: #555e72;
}

.leaflet-container a.leaflet-popup-close-button:hover {
    color: #3a2a38;
}

.leaflet-control-attribution {
    font-size: 10px;
    background: rgba(255, 255, 255, 0.75);
}

.leaflet-control-attribution a {
    color: #555e72;
}

/* Le conteneur de la fiche annonce est arrondi côté thème : on clippe la carte
   pour que les tuiles n'en débordent pas aux angles. */
#map-single {
    overflow: hidden;
}

/* -- Message « Ctrl + molette pour zoomer », équivalent du gestureHandling -- */
.site-map-hint {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 800; /* au-dessus des panes Leaflet (max 700) */
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding: 16px;
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    background: rgba(58, 42, 56, 0.6);
    pointer-events: none;
    opacity: 0;
    -webkit-transition: opacity 0.25s ease;
    transition: opacity 0.25s ease;
}

.site-map-hint.is-visible {
    opacity: 1;
}
