/* ═══ HOTFIX 2026-08-12 — POPUP MAP COMPACTE MOBILE (P4.1) ═══
   La popup des markers (InfoBox, construit par mapfunctions.js:531) couvrait
   l'essentiel de la carte sur mobile. Sur mobile : une carte compacte
   (thumb + titre 2 lignes + prix), badges/taxonomie/détails masqués.
   Desktop : inchangé. Ne modifie aucune donnée de listing. */
@media (max-width: 767px) {

    .gm-style .mybox .info_details,
    .mybox .info_details {
        max-width: 85vw !important;
        width: 85vw !important;
        max-height: 140px !important;
        min-height: 0 !important;
        height: auto !important;
        overflow: hidden !important;
        box-sizing: border-box !important;
        padding: 10px 34px 10px 10px !important;
        display: flex !important;
        flex-wrap: wrap;
        align-items: center;
        align-content: center;
        gap: 4px 10px;
        border-radius: 10px;
    }

    /* image → petite thumbnail (96px) */
    .mybox .infoimage {
        width: 96px !important;
        max-width: 96px !important;
        height: 96px !important;
        flex: 0 0 96px;
        border-radius: 8px;
        background-size: cover !important;
        background-position: center !important;
    }
    .mybox .infogradient { display: none !important; }

    /* titre : 2 lignes max avec ellipsis */
    .mybox #infobox_title {
        flex: 1 1 calc(100% - 120px);
        min-width: 0;
        font-size: 13px !important;
        line-height: 1.3 !important;
        font-weight: 600 !important;
        display: -webkit-box !important;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden !important;
        white-space: normal !important;
    }

    /* prix */
    .mybox .prop_pricex {
        flex: 0 0 auto;
        font-size: 16px !important;
        font-weight: 700 !important;
    }

    /* masquer : badges status, taxonomie longue, détails (lits/guests) */
    .mybox .property_status_wrapper_infobox,
    .mybox .property_status,
    .mybox .prop_detailsx,
    .mybox .infodetails,
    .mybox #infoguest,
    .mybox #inforoom,
    .mybox .custom_infobox_icon {
        display: none !important;
    }

    /* bouton X : accessible, bien placé */
    .mybox #infocloser {
        width: 26px !important;
        height: 26px !important;
        top: 6px !important;
        right: 6px !important;
        z-index: 2;
        background-size: 14px 14px !important;
        background-position: center !important;
        background-repeat: no-repeat !important;
    }
}
