/* ---------------------------------------------------------------------------
 * Territoires — correctifs d'affichage mobile. (TK-20260908-0580)
 *
 * Constat avant correctif, sur un écran de 390 px de large :
 *   - la barre « Rechercher par nom / Filtrer par » est en flex nowrap :
 *     477 px de contenu dans 310 px disponibles ;
 *   - les cartes réclament 341 px parce que les adresses e-mail et les URL sont
 *     des « mots » insécables (largeur min-content).
 *   Résultat : le document entier mesurait 517 px → défilement horizontal,
 *   colonne de droite coupée, page « cassée ».
 *
 * Le point de rupture 780 px est celui du thème (règle .grid-cols-md-2).
 * ------------------------------------------------------------------------- */
@media (max-width: 779.98px) {

    /* 1. Barre de filtres : retour à la ligne autorisé, champs pleine largeur. */
    .wpfilters .wp-block-group.is-layout-flex {
        flex-wrap: wrap;
        row-gap: 12px;
    }

    .wpfilters .wp-block-group.is-layout-flex > * {
        min-width: 0;
    }

    .wpfilters .facet-wrap,
    .wpfilters .facetwp-facet,
    .wpfilters .facetwp-input-wrap {
        display: block;
        width: 100%;
    }

    .wpfilters input.facetwp-search {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }

    .wpfilters .js-territory-filter {
        max-width: 100%;
    }

    /* 2. Cartes territoire — socle : aucune carte ne dépasse la largeur de
     *    l'écran, quitte à couper un mot trop long (e-mail, URL).
     *    Pas de flex-wrap général ici : le retour à la ligne laisserait les
     *    icônes téléphone/e-mail seules sur leur ligne (testé). */
    .js-territory-item .wp-block-group,
    .js-territory-item .wp-block-group > * {
        min-width: 0;
    }

    .js-territory-item p,
    .js-territory-item a {
        overflow-wrap: anywhere;
    }

    .js-territory-item figure,
    .js-territory-item img {
        max-width: 100%;
        height: auto;
    }

    /* 3. Affinage sur les navigateurs qui gèrent :has() (Chrome 105+,
     *    Safari 15.4+, Firefox 121+) : les lignes SANS icône — c'est-à-dire
     *    « code postal + ville » — passent à la ligne au lieu d'être
     *    compressées. Sans cela « 01000 » s'affiche coupé en « 010 / 00 ».
     *    Les lignes AVEC icône (téléphone, e-mail, site) gardent leur icône
     *    collée à leur texte. Ailleurs, le socle du point 2 s'applique seul :
     *    la page reste correcte, seuls quelques nombres peuvent être coupés. */
    @supports selector(:has(i)) {
        .js-territory-item .wp-block-group.is-nowrap:not(:has(i)) {
            flex-wrap: wrap;
        }

        .js-territory-item p {
            overflow-wrap: normal;
        }
    }
}