/**
 * Recherche d'objets immobiliers — styles scopés (.fti-archive).
 * Base neutre moderne, couleurs FTI en variables (à harmoniser avec la fiche objet).
 * Regroupe : barre de recherche (onglets + champs), modale des critères avancés, résultats
 * (compteur + tri + grille + cartes), spinner et pagination.
 * NB : les styles de carte et de boutons communs avec la fiche objet sont redéclarés ici pour le contexte de recherche.
 */

/* =============================================================================
 * POINTS DE RUPTURE (breakpoints) — SOURCE DE VÉRITÉ
 * Les media queries CSS ne peuvent pas lire une var() : les valeurs sont donc en
 * dur. À garder synchronisées ici ET côté JS (matchMedia dans archive-property.js
 * et ftimmo-map.js), qui partagent la même définition de « mobile ».
 *   • Mobile   : max-width 767px   (aligné sur le breakpoint mobile d'Elementor)
 *   • Tablette : max-width 1024px  (aligné sur le breakpoint tablette d'Elementor)
 * Le panneau de liste de la carte apparaît à partir de min-width 1024px.
 * ============================================================================= */

.fti-archive {
	/* ---- Palette (surchargeable par le thème pour adapter le design du site) ---- */

	/* Couleurs de marque (tokens Figma) */
	--fti-primary: #3889ff;            /* bleu FTI : boutons, éléments actifs */
	--fti-primary-dark: color-mix(in srgb, var(--fti-primary) 82%, #000); /* survol / pressed (dérivé du primaire) */
	--fti-primary-ink: #ffffff;        /* texte sur fond primary */
	--fti-tag: color-mix(in srgb, var(--fti-primary) 70%, #fff);         /* déclinée du primaire (pastille de filtre) */
	--fti-tag-soft: color-mix(in srgb, var(--fti-primary) 30%, #fff);    /* déclinée du primaire (badge select + pastille reset) */
	--fti-primary-wash: color-mix(in srgb, var(--fti-primary) 5%, #fff); /* survol des items de menu */
	--fti-filet: #c3c3c3;              /* filets / séparateurs */
	--fti-filet-soft: #e2e2e2;         /* filets internes plus clairs (zones à padding) */

	/* Neutres */
	--fti-text: #1f2933;
	--fti-ink: #000000;                /* aplat noir */
	--fti-navy: #123347;               /* bleu foncé : aplat actif des commutateurs + filet de la barre */
	--fti-muted: #606775;         /* gris de libellés : assombri de #6b7280 (teinte identique) pour passer WCAG AA sur le panneau beige */
	--fti-border: #e5e7eb;
	--fti-field-border: #c8c8c8;       /* bordure des champs / selects + filet interne (Figma) */
	--fti-bg-soft: #f7f8f9;            /* fonds doux (cartes, vignettes, survols) */
	--fti-warm-gray: #ece8e1;          /* gris chaud (beige) : fond du panneau de recherche — même ton que la carte contact de la fiche */
	--fti-surface: #ffffff;           /* champs, cartes */
	--fti-focus: rgba(56, 137, 255, .18); /* halo de focus (rgb du primary #3889ff) */
	--fti-scroll-offset: 70px;         /* décalage haut au scroll de pagination (hauteur d'en-tête Elementor sticky) — à caler par le thème */
	--fti-card-border: #d3d3d3;        /* filet de carte (contour + séparateur annonceur) */
	--fti-card-secondary: #3889ff;     /* bleu clair : libellé transaction sur la carte */

	/* Rayons */
	--fti-radius: 5px;
	--fti-radius-sm: 6px;
	--fti-radius-md: 8px;
	--fti-radius-lg: 14px;
	--fti-radius-pill: 999px;

	/* Espacements */
	--fti-gap: 20px;
	--fti-gap-sm: 12px;
	--fti-gap-xs: 6px;

	/* Typographie */
	--fti-font: Aptos, Arial, Helvetica, sans-serif;
	--fti-fs: 1.25rem;
	--fti-lh: 1.50;

	color: var(--fti-text);
	font-family: var(--fti-font);
	font-size: var(--fti-fs);
	line-height: var(--fti-lh);

	/* Contexte de positionnement de l'overlay AJAX desktop : le voile se limite au bloc recherche+résultats,
	   sans couvrir le logo ni le titre de page (qui sont HORS de .fti-archive, fournis par Elementor). */
	position: relative;
}
.fti-archive *, .fti-archive *::before, .fti-archive *::after { box-sizing: border-box; }
/* Les contrôles de formulaire n'héritent pas de la police du parent : on la rétablit (Aptos & Cie). */
.fti-archive button, .fti-archive input, .fti-archive select, .fti-archive textarea { font-family: inherit; }

/* L'attribut `hidden` doit TOUJOURS masquer (convention). Nécessaire car nos feuilles se chargent après
   le reset du thème : sans cette garde, une règle `display:…` d'un composant (ex. .fti-badge) l'emporte,
   à spécificité égale, sur le `[hidden]{display:none}` du reset → l'élément resterait visible (ex. la
   pastille de compteur affichant « 0 »). Le `!important` couvre aussi tout composant futur. */
.fti-archive [hidden] { display: none !important; }

/* ============ Focus & états (politique unifiée) ============ */
/* Le reset.css du thème (Hello Elementor) colore en mauve (#c36) tout <button>/[type=submit] nu — au
   repos et surtout en :hover/:focus. Nos composants ont chacun leur habillage ; plutôt que de
   neutraliser ce mauve élément par élément (l'ancienne approche, à coups de !important dispersés), on
   le fait ICI une fois pour toutes, et on unifie le focus clavier.

   1) Neutralisation du mauve : aucun <button> de nos vues ne reprend le fond/bordure du thème en
      survol/focus souris. Spécificité (0,2,0) via :where() → tout composant réel (.fti-archive .fti-…,
      ≥ 0,3,0) reste prioritaire ; seuls les boutons « oubliés » retombent sur ce défaut neutre. Ainsi
      un contrôle nouvellement ajouté est correct par défaut, sans nouvelle règle défensive.
   2) Focus clavier : UN seul halo doux (var(--fti-focus)), via :focus-visible uniquement — jamais au
      clic souris. Les champs (input/select/textarea) le montrent aussi, ce qui est attendu à la saisie. */
.fti-archive :where(button, [type="button"], [type="submit"]):hover,
.fti-archive :where(button, [type="button"], [type="submit"]):focus {
	background-color: transparent; border-color: transparent; color: inherit;
}
.fti-archive :where(a, button, [type="button"], [type="submit"], input, select, textarea, [tabindex]):focus-visible {
	outline: none; box-shadow: 0 0 0 3px var(--fti-focus);
}

/* Wrapper sans marge/padding ni largeur imposée : la mise en page (largeur, gouttières) est déléguée à
   la page hôte (Elementor). */
.fti-archive__container { max-width: none; margin: 0; padding: 0; }

/* Gabarit d'ARCHIVE du plugin (hors Elementor) : c'est nous qui capons la largeur de page et centrons,
   à l'identique de la fiche détail. Le wrapper fluide porte le padding latéral (responsive) ; l'enfant
   `.fti-archive__container` cape à --fti-cmax (= --site-width-max) et se centre. En contexte shortcode
   (dans Elementor), ce modificateur est absent → la largeur reste déléguée au conteneur hôte. */
.fti-archive--page {
	--fti-pad: var(--site-padding-lg, 40px);
	--fti-cmax: var(--site-width-max, 1400px);
	padding-left: var(--fti-pad);
	padding-right: var(--fti-pad);
	/* Respiration avant le pied de page — uniquement en contexte gabarit d'archive (le shortcode laisse
	   l'espacement bas à son conteneur Elementor hôte). */
	margin-bottom: 70px;
}
@media (max-width: 1024px) { .fti-archive--page { --fti-pad: var(--site-padding-md, 30px); } }
@media (max-width: 767px)  { .fti-archive--page { --fti-pad: var(--site-padding-sm, 20px); } }
.fti-archive--page .fti-archive__container { max-width: var(--fti-cmax); margin: 0 auto; }

.fti-archive__title {
	font-size: 43px;
	font-weight: 700;
	color: var(--fti-navy);
	letter-spacing: -0.3px;
	margin: 70px 0 50px;
}
@media (max-width: 1024px) { .fti-archive__title { font-size: 36px; } }
@media (max-width: 767px)  { .fti-archive__title { font-size: 24px; } }

/* ============ Barre de recherche ============ */
.fti-archive__bar {
	background: var(--fti-warm-gray);
	border: 0;
	border-radius: 40px;
	padding: 70px 30px;
	margin-bottom: 70px;
}
/* Rayon du panneau : adouci par palier (desktop → tablette → mobile). Valeurs en dur (les media queries
   ne lisent pas var()), alignées sur nos breakpoints 1024 / 767. */
@media (max-width: 1024px) { .fti-archive__bar { border-radius: 30px; } }
@media (max-width: 767px)  { .fti-archive__bar { border-radius: 20px; } }

/* Barre posée seule ([ftimmo_recherche_barre]) : pas de panneau — fond, marge et gouttières sont
   fournis par le conteneur hôte (Elementor). */
.fti-archive--bar .fti-archive__bar {
	background: transparent;
	border: 0;
	border-radius: 0;
	padding: 0;
	margin: 0;
}

/* Rangée haute : onglets à gauche, actions (Filtres avancés…) à droite */
.fti-archive__bartop { display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin-bottom: 0; }
.fti-archive__actions { display: flex; align-items: center; gap: var(--fti-gap-sm); }

/* Filet séparateur sous la rangée haute (scopé : passe devant les styles hr du thème). */
.fti-archive .fti-archive__sep {
	height: 0; border: 0; border-top: 1px solid #b0aaa2; background: none; margin: 30px 0;
}

/* Onglets Achat / Location */
.fti-tabs { display: inline-flex; background: var(--fti-surface); border: 1px solid var(--fti-border); border-radius: var(--fti-radius-pill); padding: 5px; user-select: none; -webkit-user-select: none; }
.fti-tab { position: relative; cursor: pointer; }
.fti-tab input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.fti-tab span {
	display: block; padding: 11px 40px; border-radius: var(--fti-radius-pill); font-weight: 500; color: var(--fti-muted);
	transition: background .15s, color .15s; white-space: nowrap;
}
.fti-tab.is-active span { background: var(--fti-navy); color: var(--fti-primary-ink); font-weight: 700; }
/* Focus clavier visible : le radio réel est masqué (opacity:0), on porte le halo sur le libellé. */
.fti-tab:focus-within span { box-shadow: 0 0 0 3px var(--fti-focus); }
.fti-tab:hover span { color: var(--fti-primary); }
.fti-tab.is-active:hover span { color: #fff; }

/* Rangée des champs principaux. min-height : réserve la hauteur AVANT l'init de Tom Select (évite le
   flash de recomposition quand les selects deviennent des wrappers TS). */
.fti-archive__primary { display: flex; flex-wrap: wrap; gap: 20px; align-items: flex-end; min-height: 79px; }

.fti-field { display: flex; flex-direction: column; gap: 6px; font-size: .82rem; color: var(--fti-muted); }
.fti-field--inline { min-width: 0; }
.fti-field__label { font-weight: 600; font-size: 0.9375rem; }
.fti-field__control {
	/* #c8c8c8 : bordure de saisie perceptible (≈3:1, WCAG 1.4.11) — le #e5e7eb précédent était trop clair.
	   Seule la modale (prix) l'affiche ; la barre met border-color:transparent par-dessus. */
	padding: 10px 12px; border: 1px solid #c8c8c8; border-radius: var(--fti-radius);
	background: #fff; color: var(--fti-text); font-size: 0.9375rem; min-width: 200px;
}
/* iOS zoome sur un champ dont la police fait moins de 16px au focus (d'où un zoom + scroll horizontal,
   typiquement quand la validation met le focus sur un champ vide). Sur appareil tactile, on force 16px pour
   l'empêcher — sans toucher au meta viewport (qui bloquerait le zoom manuel, mauvais pour l'accessibilité). */
@media (pointer: coarse) { .fti-field__control { font-size: 16px; } }
.fti-archive__primary .fti-field { flex: 1 1 200px; gap: 10px; }
.fti-archive__more-btn, .fti-archive__submit { flex: 0 0 auto; }

/* Champs de la barre : pas d'encadré (fond blanc seul sur le fond gris), même gabarit que le Tom
   Select (hauteur 42px). La bordure n'apparaît qu'au focus. */
.fti-archive__primary .fti-field__control {
	min-height: 42px; padding: 8px 12px; border-color: transparent;
}
.fti-archive__primary .fti-field__control:focus {
	outline: none; border-color: var(--fti-primary); box-shadow: 0 0 0 3px var(--fti-focus);
}
/* Anti-FOUC : les 2 selects de la barre deviennent des Tom Select. On les masque dès le premier rendu
   (le wrapper TS prend le relais à l'init) pour éviter le flash de redimensionnement. Repli sans JS :
   ils sont réaffichés via <noscript> dans le template (search-bar.php). */
.fti-archive__primary select.fti-field__control { display: none; }

/* ===== Tom Select : « valeur + badge | croix | filet | chevron » (au plus près du wireframe) ===== */
/* Apparition en fondu une fois le wrapper construit (classe is-ready posée en JS) : masque le flash de
   recomposition. La place est déjà réservée par .fti-archive__primary { min-height }. */
.fti-archive .ts-wrapper { min-width: 220px; border: 0; background: none; padding: 0; box-shadow: none; opacity: 0; transition: opacity .35s ease; }
.fti-archive .ts-wrapper.is-ready { opacity: 1; }
.fti-archive .ts-control {
	position: relative;
	display: flex; align-items: center; gap: 0;
	min-height: 54px; padding: 12px 74px 12px 15px;
	background: var(--fti-surface); color: var(--fti-text);
	border: 1px solid var(--fti-field-border); border-radius: var(--fti-radius);
	font-size: 1.125rem; box-shadow: none;
}
.fti-archive .ts-control:focus-within { border-color: var(--fti-primary); box-shadow: 0 0 0 3px var(--fti-focus); }
.fti-archive .ts-control > input {
	flex: 1 1 40px; min-width: 40px; width: auto !important; margin: 0 !important;
	border: 0; background: transparent; color: var(--fti-text); font-size: 1.125rem;
}
/* Placeholder de la zone (« Toutes ») en 16px noir, comme la valeur par défaut du type. */
.fti-archive .ts-control > input::placeholder { color: var(--fti-text); font-size: 1.125rem; opacity: 1; }
/* Valeur choisie : plus de pilule — texte simple à gauche, badge de compteur poussé à droite. */
.fti-archive .ts-control .item { flex: 1 1 auto; max-width: 100%; background: none; color: var(--fti-text); padding: 0; font-weight: 400; }
/* Valeur choisie : on masque le champ de saisie interne (sinon curseur résiduel à droite de la valeur).
   `!important` car Tom Select force `display:inline-block!important` + `min-width:7rem` sur cet input. */
.fti-archive .ts-wrapper.has-items .ts-control > input { display: none !important; }
.fti-archive .fti-ts-item { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 1.125rem; }
.fti-archive .fti-ts-text { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fti-archive .fti-ts-badge {
	flex: 0 0 auto; min-width: 30px; text-align: center;
	background: var(--fti-tag-soft); color: var(--fti-text);
	font-size: .875rem; font-weight: 700; border-radius: var(--fti-radius-pill); padding: 3px 7px;
}
/* Pastille de compteur masquée dans la valeur sélectionnée (le nombre vit dans le compteur de
   résultats), conservée dans le dropdown pour guider le choix. */
.fti-archive .ts-control .fti-ts-badge { display: none; }

/* Chrome à droite du contrôle : croix d'effacement | filet | chevron. */
.fti-archive .fti-ts-actions { position: absolute; top: 0; bottom: 0; right: 12px; display: flex; align-items: center; gap: 10px; }
.fti-archive .fti-ts-clear { display: inline-flex; align-items: center; width: 16px; height: 16px; padding: 0; border: 0; background: none; color: var(--fti-muted); cursor: pointer; }
.fti-archive .fti-ts-clear svg { width: 16px; height: 16px; }
.fti-archive .fti-ts-clear:hover { background: none; color: var(--fti-primary); }
.fti-archive .fti-ts-sep { width: 1px; height: 16px; background: var(--fti-field-border); }
.fti-archive .fti-ts-caret { display: inline-flex; align-items: center; width: 24px; height: 24px; color: var(--fti-muted); cursor: pointer; }
.fti-archive .fti-ts-caret svg { width: 24px; height: 24px; }
/* Croix et filet masqués tant qu'aucune valeur n'est choisie (seul le chevron reste). */
.fti-archive .ts-wrapper:not(.has-items) .fti-ts-clear,
.fti-archive .ts-wrapper:not(.has-items) .fti-ts-sep { display: none; }

/* Liste déroulante */
.fti-archive .ts-dropdown { border: 1px solid var(--fti-field-border); border-radius: var(--fti-radius); box-shadow: 0 12px 28px rgba(0, 0, 0, .12); }
/* Hauteur d'option homogène (44px, padding compris) : « Tous/Toutes » n'a pas de pastille (compteur),
   qui donne sa hauteur aux autres options → on fixe la même hauteur pour tout aligner. */
.fti-archive .ts-dropdown .option { display: flex; align-items: center; min-height: 44px; box-sizing: border-box; padding: 10px 15px; }
.fti-archive .ts-dropdown .option.active,
.fti-archive .ts-dropdown .option:hover { background: var(--fti-primary-wash); color: var(--fti-text); }
.fti-archive .ts-dropdown .optgroup-header {
	padding: 10px 15px 4px; color: var(--fti-primary); font-weight: 700; font-size: .82rem;
	text-transform: uppercase; letter-spacing: .04em;
}
/* En-tête vide (groupe de reset « Toutes ») : masqué. */
.fti-archive .ts-dropdown .optgroup-header:empty { display: none; }
/* Entrée « Tous / Toutes » : détachée des vraies valeurs par un filet doux. */
.fti-archive .ts-dropdown .option[data-value="__all__"] { border-bottom: 1px solid var(--fti-filet-soft); }

/* Dropdowns harmonisés à l'ouverture : même plafond de hauteur (le type tient sans scroll, la zone défile). */
.fti-archive .ts-dropdown .ts-dropdown-content { max-height: 400px; }
/* Mobile : dropdown borné à 6 items (option min-height 44px → 264px), pour qu'il tienne au-dessus du clavier
   virtuel quand le select est amené à 20px du haut du viewport (cf. keepDropdownInView). */
@media (max-width: 767px) { .fti-archive .ts-dropdown .ts-dropdown-content { max-height: 264px; } }
/* Zones d'activités en capitales — dropdown ET valeur affichée dans le contrôle (les communes gardent leur
   casse). Vaut pour la barre de recherche comme pour la modale « Ajouter des critères » de l'alerte : les
   deux sont sous .fti-archive et la classe --zone n'est posée (renderValue) que sur les options de zone.
   text-transform (purement visuel) : ni la valeur ni la recherche ne sont altérées. */
.fti-archive .fti-ts-item--zone .fti-ts-text { text-transform: uppercase; }
/* Même logique pour les pastilles de filtre : une zone d'activités s'affiche en capitales (commune inchangée). */
.fti-archive .fti-chip--zone { text-transform: uppercase; }
/* Select « Type » : valeur par défaut « Tous » tant que rien n'est sélectionné. */
.fti-archive .ts-wrapper.fti-ts--type:not(.has-items) .ts-control::before {
	content: 'Tous'; color: var(--fti-text); font-size: 1.125rem;
}
/* Select sans input AVEC placeholder (ex. la zone sur tactile, controlInput:null) : on affiche le
   placeholder (data-ph, posé par le JS) tant qu'aucune valeur n'est choisie — équivalent du « Tous » ci-dessus. */
.fti-archive .ts-wrapper.fti-ts--ph:not(.has-items) .ts-control::before {
	content: attr(data-ph); color: var(--fti-text); font-size: 1.125rem;
}
/* Modale d'alerte : placeholder du select d'objets = « Tous les objets » (barre inchangée). */
.fti-archive .fti-alert-crit .ts-wrapper.fti-ts--type:not(.has-items) .ts-control::before {
	content: 'Tous les objets';
}
/* Objet : aucune saisie possible → curseur pointer partout (jamais le curseur texte de Tom Select). */
.fti-archive .fti-ts--type,
.fti-archive .fti-ts--type .ts-control,
.fti-archive .fti-ts--type .ts-control > input,
.fti-archive .fti-ts--type .ts-control * { cursor: pointer !important; }
/* Message « aucun résultat » (recherche de zone sans correspondance) : 16px, francisé via le JS. */
.fti-archive .ts-dropdown .no-results { padding: 10px 15px; font-size: 1.125rem; color: var(--fti-muted); }

/* Supprime le bouton d'auto-remplissage « contact » de Safari/WebKit (icône utilisateur). */
.fti-archive input::-webkit-contacts-auto-fill-button {
	visibility: hidden;
	display: none !important;
	pointer-events: none;
	position: absolute;
	right: 0;
}

/* Badge de compteur de filtres avancés */
.fti-badge {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 20px; height: 20px; padding: 0 6px; margin-left: 4px;
	background: var(--fti-primary); color: var(--fti-primary-ink); border-radius: var(--fti-radius-pill); font-size: .75rem; font-weight: 700;
}
/* Badge posé sur le bouton bleu « Filtres avancés » : inversion pour le contraste. */
.fti-archive__more-btn .fti-badge { background: var(--fti-surface); color: var(--fti-primary); }

/* « Rechercher » : fallback sans JavaScript. Masqué quand le JS est actif (recherche instantanée). */
.fti-archive.fti-js .fti-archive__submit { display: none; }

/* ============ Modale des critères avancés ============ */
.fti-modal { position: fixed; inset: 0; z-index: 9999; display: flex; align-items: center; justify-content: center; }
.fti-modal[hidden] { display: none; }
.fti-modal__backdrop { position: absolute; inset: 0; background: rgba(15,25,35,.5); }
.fti-modal__panel {
	position: relative; background: #fff; border-radius: 14px; width: min(760px, 94vw);
	max-height: 88vh; overflow-y: auto; box-shadow: 0 24px 60px rgba(0,0,0,.28);
}
/* Bloc supérieur collant (titre + pastilles + compteur) ; le pied l'est aussi. Sur mobile,
   seule la zone centrale (filtres) défile. */
.fti-modal__top { position: sticky; top: 0; z-index: 2; background: #eef5ff; border-radius: 14px 14px 0 0; }
/* Modale « Créer une alerte » : léger filet gris sous l'en-tête (pas de bloc compteur ici). */
.fti-alert .fti-modal__top { border-bottom: 1px solid var(--fti-filet); }
.fti-modal__header {
	display: flex; align-items: center; justify-content: space-between; padding: 30px 30px 24px;
}
/* Scopé sous .fti-modal (spécificité 0,2,0) pour primer sur le kit Elementor, qui stylise les titres
   nus (.elementor-kit-6 h2 : 58 px, Aptos, #123347…) et écraserait sinon ce <h2>. On réaffirme aussi
   la police / couleur / interligne hérités, que le kit force. */
.fti-modal .fti-modal__title { margin: 0; font-size: 1.75rem; font-weight: 600; line-height: 1.2; letter-spacing: -0.3px; font-family: inherit; color: inherit; }
/* Mobile : titre de modale réduit (toutes les modales). */
@media (max-width: 767px) { .fti-modal .fti-modal__title { font-size: 1.5rem; } }
/* Croix 15 px ; le padding forme une cible de clic élargie (invisible). Le mauve du reset et le focus
   clavier (halo) sont gérés par la politique « Focus & états » ; ici, seule la couleur du glyphe. */
.fti-archive .fti-modal__close {
	border: 0; background: none; -webkit-appearance: none; appearance: none;
	line-height: 0; cursor: pointer; color: var(--fti-ink); padding: 12px; margin: -12px;
}
/* Survol / focus clavier : glyphe en primaire. Au clic souris, il reste ink (repos ci-dessus). */
.fti-archive .fti-modal__close:hover,
.fti-archive .fti-modal__close:focus-visible { color: var(--fti-primary); }
.fti-modal__close svg { display: block; width: 25px; height: 25px; }
.fti-modal__body { padding: 24px 30px 30px; }
.fti-modal__footer {
	position: sticky; bottom: 0; z-index: 2; background: #eef5ff; border-radius: 0 0 14px 14px;
	display: flex; justify-content: space-between; gap: 12px; padding: 20px 30px; border-top: 1px solid var(--fti-filet);
}
.fti-modal__footer-right { display: flex; align-items: center; gap: 15px; }
body.fti-modal-open { overflow: hidden; }

/* Passage entre les deux modales d'alerte : fondu + léger pop. Le scale porte sur un WRAPPER autour du
   panneau (.fti-modal__pop), et non sur le panneau — un transform sur le conteneur de défilement casserait
   le position:sticky du pied (saut). Sur un simple ancêtre, le sticky interne n'est pas affecté. */
.fti-modal__pop { display: flex; max-height: 88vh; transition: transform .25s ease, opacity .25s ease; }
.fti-modal__pop.fti-pop-enter { transform: scale(1.04); opacity: 0; }
@media (prefers-reduced-motion: reduce) { .fti-modal__pop { transition: none; } }

/* Indice de zone scrollable : fondus haut/bas révélés selon la position (classes posées en JS).
   Portés par l'en-tête et le pied collants (position sticky = positionné) → ils restent aux bords. */
.fti-modal__top::after,
.fti-modal__footer::before {
	content: ''; position: absolute; left: 0; right: 0; height: 52px;
	pointer-events: none; opacity: 0; transition: opacity .25s ease; z-index: 1;
}
.fti-modal__top::after { bottom: -53px; background: linear-gradient(to bottom, #fff 0%, #fff 28%, rgba(255, 255, 255, 0) 100%); }
.fti-modal__footer::before { top: -53px; background: linear-gradient(to top, #fff 0%, #fff 28%, rgba(255, 255, 255, 0) 100%); }
.fti-modal__panel.has-fade-top .fti-modal__top::after { opacity: 1; }
.fti-modal__panel.has-fade-bottom .fti-modal__footer::before { opacity: 1; }

/* Pastilles de filtres actifs reprises en tête de modale (synchronisées avec la barre). */
.fti-modal__chips { display: flex; flex-wrap: wrap; gap: 10px; padding: 0 30px 20px; }
.fti-modal__chips:empty { display: none; }

/* Compteur d'aperçu live + indicateur de calcul. */
.fti-modal__count {
	position: relative;
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	padding: 14px 30px; font-weight: 700; font-size: 1.2rem; color: var(--fti-ink);
	border-bottom: 1px solid var(--fti-filet);
}
/* Filet supérieur (sous les pastilles) inséré pour respecter le padding de 30px. */
.fti-modal__count::before {
	content: ''; position: absolute; top: 0; left: 30px; right: 30px; height: 1px; background: #c2cfe0;
}
.fti-modal__spinner {
	width: 20px; height: 20px; border: 2px solid var(--fti-field-border);
	border-top-color: var(--fti-primary); border-radius: 50%; animation: fti-modal-spin .7s linear infinite;
}
.fti-modal__spinner[hidden] { display: none; }
/* Pendant le décompte : le libellé du nombre passe à 30% (valeur temporairement invalide), transition douce. */
#fti-modal-count { transition: opacity .35s ease; color: var(--fti-primary); font-weight: 700; }
#fti-modal-count.is-pending { opacity: .3; }

/* ===== Alertes (modales « Créer une alerte » / « Choix des critères » / succès) ===== */
/* L'espacement autour des filets est porté par le <hr> (24/24). Chaque bloc finit « à ras » pour que
   le 24 au-dessus du filet soit exact, et le 24 en dessous mène pile au sous-titre (marge en bas seule). */
.fti-alert__section { margin-bottom: 0; }
.fti-alert__section > *:last-child { margin-bottom: 0; }
.fti-alert__row { display: flex; gap: 12px; margin-bottom: 16px; }
.fti-alert__row .fti-alert__field { flex: 1; min-width: 0; margin-bottom: 0; }
/* Scopé .fti-modal (idem titres) : ce <h3> serait sinon capté par .elementor-kit-6 h3 (40 px, Aptos). */
.fti-modal .fti-alert__h { margin: 0 0 14px; font-weight: 700; font-size: 1.125rem; line-height: 1.3; font-family: inherit; color: inherit; }
.fti-alert__chips { display: flex; flex-wrap: wrap; gap: 8px; }
/* Lien-action « Ajouter des critères ». Mauve du reset + halo clavier : gérés par « Focus & états ». */
.fti-archive .fti-alert__add {
	display: inline-flex; align-items: center; gap: 8px; margin-top: 14px;
	padding: 0; border: 0; background: none; -webkit-appearance: none; appearance: none;
	color: var(--fti-primary); font-size: 1rem; line-height: 1.2; cursor: pointer;
}
.fti-archive .fti-alert__add:hover { color: var(--fti-primary-dark); }
.fti-archive .fti-alert__add svg { width: 20px; height: 20px; }
.fti-alert__sep { border: 0; border-top: 1px solid var(--fti-filet-soft); margin: 24px 0; }
/* Corps de « Créer une alerte » en flex column : écart strict de 24px de part et d'autre de chaque filet
   (les marges ne fusionnent plus). La marge propre du <hr> est neutralisée (elle s'ajouterait au gap). */
.fti-alert .fti-modal__body { display: flex; flex-direction: column; gap: 24px; }
.fti-alert .fti-alert__sep { margin: 0; }
/* -6px sous le bloc « Ajouter des critères » (1re section) : réduit le gap flex de 24 à 18. */
.fti-alert .fti-modal__body > .fti-alert__section:first-child { margin-bottom: -6px; }
.fti-alert__field { display: flex; flex-direction: column; gap: 6px; margin-bottom: 16px; }
.fti-alert__field:last-child { margin-bottom: 0; }
.fti-alert__label { font-weight: 600; font-size: 0.9375rem; }
.fti-alert .fti-alert__field .fti-field__control { width: 100%; min-width: 0; }
.fti-alert__rythme { display: flex; flex-wrap: wrap; gap: 14px 24px; }
.fti-alert__contract { display: flex; flex-wrap: wrap; gap: 14px 24px; padding-top: 6px; margin-bottom: 16px; }
.fti-alert__footer { flex-direction: column; align-items: stretch; gap: 0; }
.fti-alert__notice { margin: 0 0 14px; color: var(--fti-muted); font-size: 0.9375rem; line-height: 1.5; }
.fti-alert__error { margin: 0 0 21px; color: #c0392b; font-size: 0.9375rem; font-weight: 700; }
.fti-alert__req { color: var(--fti-primary); }
/* Champ obligatoire en erreur : bord rouge (et focus rouge). */
.fti-alert .fti-field__control.is-error { border-color: #c0392b; }
.fti-alert .fti-field__control.is-error:focus { border-color: #c0392b; box-shadow: 0 0 0 3px rgba(192, 57, 43, .18); }
.fti-alert__actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.fti-alert__okmsg { margin: 0; font-size: 1.125rem; line-height: 1.6; }
/* Modale de confirmation : 40px au-dessus/au-dessous du texte, pied sur fond blanc. */
.fti-alert-ok .fti-modal__body { padding-top: 40px; padding-bottom: 40px; }
.fti-alert-ok .fti-modal__footer { background: #fff; }

/* Éditeur de critères : type + secteur côte à côte. */
.fti-alert__selects { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
@media ( max-width: 767px ) { .fti-alert__selects { grid-template-columns: 1fr; } }

/* Bouton « Créer une alerte » dans le pied de la modale filtres. */
.fti-modal__alert { display: inline-flex; align-items: center; gap: 8px; }
.fti-modal__alert svg { width: 20px; height: 20px; }
/* Mobile : pied de la modale filtres épuré — le « Fermer » disparaît (la croix en haut suffit) ; « Créer une
   alerte » se réduit à sa cloche (libellé masqué, bouton compact) et reste calé à droite (footer en
   space-between : « Voir les N objets » à gauche, l'alerte à droite). */
@media (max-width: 767px) {
	#fti-filters-modal .fti-modal__footer [data-fti-close-filters] { display: none; }
	#fti-filters-modal .fti-modal__alert > span { display: none; }
	/* Réduit à sa cloche : bouton PARFAITEMENT rond (carré 46×46, sans padding), l'icône centrée. La taille
	   46px correspond à la hauteur des boutons de pied (padding 12 + icône 20 + bordure 2). */
	#fti-filters-modal .fti-modal__alert {
		width: 46px;
		height: 46px;
		padding: 0;
		gap: 0;
		border-radius: 50%;
		flex: 0 0 auto;
	}
}
@keyframes fti-modal-spin { to { transform: rotate(360deg); } }

.fti-group { border: 0; margin: 0; padding: 0; }
/* Filet léger au-dessus de chaque bloc sauf le premier : 10px au-dessus (margin) / 10px dessous (padding). */
.fti-group + .fti-group { border-top: 1px solid var(--fti-filet-soft); margin-top: 13px; padding-top: 7px; }
/* +6px SOUS le filet du bloc « Nouveaux projets » (7 + 6) ; le dessus reste à 13px comme les autres. */
.fti-group + .fti-group--sep { padding-top: 13px; }
/* float + width:100% : sort la légende du rendu « posée sur la bordure » (sinon le filet part à droite
   du libellé). Le filet supérieur du bloc redevient pleine largeur AU-DESSUS du libellé. */
.fti-group__title { float: left; width: 100%; font-weight: 700; font-size: 1rem; padding: 0; margin-bottom: 3px; color: #123347; text-transform: uppercase; }
.fti-group__title + * { clear: both; }
.fti-group__options { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px 16px; }
/* Champs prix : deux colonnes égales occupant toute la largeur (override du min-width des champs). */
.fti-group__row { display: flex; gap: 16px; }
.fti-group__row .fti-field { flex: 1 1 0; min-width: 0; gap: 10px; }
.fti-group__row .fti-field__control { min-width: 0; width: 100%; }
.fti-check { position: relative; display: flex; align-items: center; gap: 10px; font-size: 0.9375rem; color: var(--fti-text); cursor: pointer; }
/* Radios (rythme d'alerte) : même traitement que les checkbox (cercle primaire rempli, point blanc). */
.fti-check input[type="radio"] {
	-webkit-appearance: none; appearance: none; margin: 0; flex: 0 0 auto;
	width: 20px; height: 20px; border: 1.5px solid #9aa4b2; border-radius: 50%; background: #fff;
	display: inline-grid; place-content: center; cursor: pointer;
	transition: background .2s ease, border-color .2s ease;
}
.fti-check input[type="radio"]::before {
	content: ''; width: 8px; height: 8px; border-radius: 50%; background: #fff;
	transform: scale(0); transition: transform .2s ease;
}
.fti-check:hover input[type="radio"] { border-color: var(--fti-primary); }
.fti-check input[type="radio"]:checked { background: var(--fti-primary); border-color: var(--fti-primary); }
.fti-check input[type="radio"]:checked::before { transform: scale(1); }
.fti-check input[type="radio"]:focus-visible { box-shadow: 0 0 0 3px var(--fti-focus); }
/* Checkbox personnalisée (variante A) : input natif masqué, case + coche SVG tracée au cochage. */
.fti-check input[type="checkbox"] { position: absolute; opacity: 0; width: 0; height: 0; margin: 0; }
.fti-check__box { flex: 0 0 auto; width: 20px; height: 20px; border-radius: 6px; border: 1.5px solid #9aa4b2; display: inline-flex; align-items: center; justify-content: center; transition: background .2s ease, border-color .2s ease; }
.fti-check__box svg { width: 15px; height: 15px; fill: none; stroke: #fff; stroke-width: 3.5; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 24; stroke-dashoffset: 24; transition: stroke-dashoffset .28s ease .02s; }
.fti-check:hover .fti-check__box { border-color: var(--fti-primary); }
.fti-check input[type="checkbox"]:checked ~ .fti-check__box { background: var(--fti-primary); border-color: var(--fti-primary); }
.fti-check input[type="checkbox"]:checked ~ .fti-check__box svg { stroke-dashoffset: 0; }
.fti-check input[type="checkbox"]:focus-visible ~ .fti-check__box { box-shadow: 0 0 0 3px var(--fti-focus); }

/* ============ Résultats ============ */
/* Pas de position:relative ici : l'overlay AJAX (#fti-spinner, enfant) doit se caler sur .fti-archive
   (barre + résultats), pas seulement sur la zone de résultats. */
.fti-archive__results { scroll-margin-top: var(--fti-scroll-offset, 70px); }
.fti-archive__resulthead { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 30px; }

/* Bascule Liste / Carte : même pilule que les onglets, plus petite (42 px) → hiérarchie visuelle. */
.fti-viewtabs { height: 42px; align-items: stretch; border-color: #686868; }
.fti-viewtabs .fti-tab { display: flex; }
.fti-viewtabs .fti-tab span { display: flex; align-items: center; padding: 0 34px; font-size: 1.125rem; }

/* Compteur centré ; nombre et transaction en gras (le reste en gris). */
.fti-archive__count { flex: 1; text-align: center; margin: 0; color: var(--fti-muted); font-size: 1.25rem; letter-spacing: -.01em; white-space: nowrap; }
.fti-archive__count strong { color: var(--fti-ink); font-weight: 700; }

/* Tri : select natif restylé (250 × 42, filet #c8c8c8, chevron custom). */
.fti-archive__sort { position: relative; display: inline-flex; align-items: center; width: 250px; }
/* En vue Carte, le tri reste visible là où la liste d'adresses est affichée (desktop / tablette paysage) :
   il trie liste + marqueurs. Il n'est masqué qu'en portrait étroit (carte pleine largeur, pas de liste) —
   cf. la règle dans le bloc max-width:1024. */
.fti-sort__select {
	width: 100%; height: 42px; padding: 0 42px 0 15px; margin: 0;
	border: 1px solid var(--fti-field-border); border-radius: 5px; background: #fff;
	color: var(--fti-text); font-size: 1.125rem; line-height: normal; cursor: pointer;
	-webkit-appearance: none; -moz-appearance: none; appearance: none;
}
.fti-sort__select:focus { outline: none; border-color: var(--fti-primary); box-shadow: 0 0 0 3px var(--fti-focus); }
.fti-sort__caret { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); pointer-events: none; color: var(--fti-muted); line-height: 0; }
.fti-sort__caret svg { display: block; width: 24px; height: 24px; }

/* Vue Carte : conteneur Leaflet. */
.fti-archive__mapview { position: relative; }
.fti-archive__mapcanvas { aspect-ratio: 1.77; width: 100%; border: 1px solid var(--fti-card-border); border-radius: 10px; overflow: hidden; background: var(--fti-bg-soft); }
/* Spinner superposé pendant une recherche/pagination en vue Carte (voile léger + spinner centré). */
.fti-archive__mapspinner { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(255,255,255,.45); border-radius: 10px; z-index: 500; pointer-events: none; }
.fti-archive__mapspinner[hidden] { display: none; }

/* Panneau de liste à gauche de la carte. Masqué par défaut (mobile / tablette portrait) : la carte
   occupe toute la largeur et les biens restent accessibles via l'onglet « Liste ». Affiché en desktop /
   tablette paysage / plein écran (voir la règle min-width plus bas et la règle :fullscreen). */
.fti-archive__maplist { display: none; }
/* Ligne compacte (~113 px) : vignette 85 + corps (badge surface, zone en gras, type, prix). C'est un
   bouton (l'action « situer sur la carte » n'est pas une navigation) : reset des styles natifs. */
.fti-maprow { display: flex; align-items: center; gap: 15px; width: 100%; margin: 0; padding: 11.25px 20px 11.25px 11.25px; text-align: left; background: none; border: 0; border-bottom: 1px solid var(--fti-filet-soft); font: inherit; font-size: .875rem; line-height: 1.3; color: var(--fti-text); cursor: pointer; }
.fti-maprow:hover { background: var(--fti-bg-soft); }
.fti-maprow.is-active { background: color-mix( in srgb, var(--fti-primary) 8%, #fff ); }
.fti-maprow__img { flex: 0 0 85px; width: 85px; height: 85px; border-radius: 8px; background: var(--fti-bg-soft) center / cover no-repeat; }
.fti-maprow__body { display: flex; flex-direction: column; justify-content: center; gap: 0; min-width: 0; }
.fti-maprow__badge { align-self: flex-start; margin-bottom: 7px; padding: 2px 10px; border: 1px solid var(--fti-primary); border-radius: 999px; color: var(--fti-primary); font-size: .8rem; font-weight: 700; }
.fti-maprow__zone { font-weight: 700; text-transform: uppercase; color: #000; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fti-maprow__type { color: #000; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* line-height 1 sur la dernière ligne : supprime le talon d'interligne sous le prix, sinon le bloc de
   texte paraît décalé vers le haut (pastille collée au sommet de l'image, vide sous le prix). */
.fti-maprow__price { font-weight: 700; line-height: 1; }

/* Tooltip « carte du bien » (maquette Figma) : image arrondie à gauche, corps à droite
 * (surface + croix, type + prix, filet, zone + rue + localité). Base 14px = .875rem, interligne 18px. */
.fti-archive .fti-mappop { display: flex; align-items: center; padding: 10px; box-sizing: border-box; background: #fff; border: 1px solid var(--fti-card-border); border-radius: 40px; width: min( 430px, 92vw ); }
.fti-archive .fti-mappop__img { flex: 0 0 139px; width: 139px; height: 139px; border-radius: 30px; background-size: cover; background-position: center; background-color: var(--fti-bg-soft); display: block; }
.fti-archive .fti-mappop__body { position: relative; flex: 1 1 0; min-width: 0; padding: 0 10px 0 20px; }
/* Cible tactile élargie (~31px, WCAG 2.5.8) sans déplacer le glyphe 15px : padding + offset compensé. */
.fti-archive .fti-mappop__close { position: absolute; top: -8px; right: -2px; padding: 8px; width: 15px; height: 15px; box-sizing: content-box; display: flex; align-items: center; justify-content: center; border: 0; background: transparent !important; color: var(--fti-ink); cursor: pointer; line-height: 0; }
.fti-archive .fti-mappop__close svg { display: block; width: 15px; height: 15px; }
/* Survol / focus clavier : glyphe primaire (le mauve du reset est neutralisé par « Focus & états »). */
.fti-archive .fti-mappop__close:hover,
.fti-archive .fti-mappop__close:focus-visible { color: var(--fti-primary); background: transparent; }
.fti-archive .fti-mappop__link { display: block; text-decoration: none; color: var(--fti-ink); }
/* Paragraphe unique surface + objet + prix (interligne 18px, pas d'espace intermédiaire). */
.fti-archive .fti-mappop__info { display: block; font-size: .875rem; line-height: 18px; color: var(--fti-ink); letter-spacing: -0.28px; padding-right: 22px; }
.fti-archive .fti-mappop__addr { display: block; font-size: .875rem; line-height: 18px; color: var(--fti-ink); letter-spacing: -0.28px; }
/* Chaque champ = 1 ligne mono-ligne : garantit toujours 6 lignes ; troncature à l'ellipse si trop long. */
.fti-archive .fti-mappop__l { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fti-archive .fti-mappop__surface { font-weight: 700; color: var(--fti-primary); }
.fti-archive .fti-mappop__price { font-weight: 700; }
.fti-archive .fti-mappop__sep { display: block; height: 1px; background: var(--fti-card-border); margin: 10px 0; }
.fti-archive .fti-mappop__zone { font-weight: 700; text-transform: uppercase; }
/* Popup Leaflet : neutraliser habillage par défaut, la .fti-mappop porte la carte visible. Flèche du bas conservée. */
.ftimmo-map-popup .leaflet-popup-content-wrapper { background: transparent; box-shadow: none; padding: 0; border-radius: 0; }
/* display:flex + justify-content:center : centre le box (bloc à largeur fixe) dans le contenu Leaflet,
   qui est lui-même centré sur le marqueur → le box est parfaitement centré sous la flèche (sinon, aligné
   à gauche par défaut, il paraissait légèrement décalé à droite par rapport à la flèche). */
.ftimmo-map-popup .leaflet-popup-content { margin: 0; width: auto !important; display: flex; justify-content: center; }
.ftimmo-map-popup .leaflet-popup-tip { background: #fff; border: 1px solid var(--fti-card-border); }

/* Libellé accessible masqué visuellement. */
.fti-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

/* Pagination explicite (remplace l'infinite scroll) — pastilles rondes.
   Styles forcés (!important) pour battre le reset.css du thème sur les <button>. */
.fti-archive__pagination { margin-top: 50px; }
.fti-archive__pagination:empty { display: none; }
.fti-archive .fti-pagination { display: flex; justify-content: center; align-items: center; gap: 8px; flex-wrap: wrap; }
.fti-archive .fti-pagination .fti-page {
	display: inline-flex; align-items: center; justify-content: center; width: 50px; height: 50px; padding: 0;
	border: 1px solid var(--fti-field-border) !important; border-radius: 50% !important;
	background: #fff !important; color: var(--fti-text) !important; font-size: 1.125rem; font-weight: 500;
	cursor: pointer; transition: background .15s, color .15s, border-color .15s;
}
.fti-archive .fti-pagination .fti-page:hover,
.fti-archive .fti-pagination .fti-page:focus-visible {
	background: var(--fti-primary-wash) !important; border-color: var(--fti-primary) !important; color: var(--fti-primary) !important;
}
.fti-archive .fti-pagination .fti-page.is-current,
.fti-archive .fti-pagination .fti-page.is-current:hover,
.fti-archive .fti-pagination .fti-page.is-current:focus-visible {
	/* Bleu foncé (pas le primaire) : évite le conflit visuel avec la couleur des clusters. */
	background: var(--fti-navy) !important; border-color: var(--fti-navy) !important; color: #fff !important; cursor: default;
}
.fti-archive .fti-pagination .fti-page:disabled { opacity: .4 !important; cursor: default; }
.fti-archive .fti-pagination .fti-page:disabled:hover {
	background: #fff !important; border-color: var(--fti-field-border) !important; color: var(--fti-text) !important;
}
.fti-archive .fti-pagination .fti-page--nav svg { display: block; width: 20px; height: 20px; }
.fti-archive .fti-pagination .fti-page--gap {
	width: 24px; height: 50px; border: 0 !important; background: none !important; color: var(--fti-muted) !important; cursor: default;
}

/* Pager flottant DANS la carte, ancré en bas au centre : n'apparaît qu'en plein écran (piloté en JS),
   là où la pagination sous la carte est masquée par l'API Fullscreen. Reprend le style .fti-pagination
   dans une pastille lisible par-dessus le fond cartographique. Puces un peu plus compactes (44 px). */
.fti-archive #fti-map { position: relative; }
.fti-archive .fti-map-pager {
	position: absolute; left: 50%; bottom: 18px; transform: translateX(-50%); z-index: 1000;
	max-width: calc( 100% - 24px ); padding: 8px 12px; box-sizing: border-box;
	background: rgba( 255, 255, 255, .96 ); border-radius: 999px; box-shadow: 0 4px 18px rgba( 0, 0, 0, .2 );
}
.fti-archive .fti-map-pager[hidden] { display: none; }
.fti-archive .fti-map-pager .fti-pagination { gap: 6px; }
.fti-archive .fti-map-pager .fti-pagination .fti-page { width: 44px; height: 44px; font-size: 1rem; }
.fti-archive .fti-map-pager .fti-pagination .fti-page--gap { width: 20px; height: 44px; }
/* Cartouche des critères de recherche, en haut d'écran (plein écran) : contrepoint de la navigation en
   bas. Critères séparés par des points centraux, Aptos 1.25rem noir ; zones en capitales (fournies déjà
   en CAP par le JS). Cartouche blanche pleine, arrondie, comme la pastille du pager. */
.fti-archive .fti-map-crit {
	position: absolute; left: 50%; top: 10px; transform: translateX(-50%); z-index: 1000;
	/* Largeur bornée : ~200px réservés de chaque côté pour dégager les contrôles de la carte (zoom à gauche,
	   onglets à droite, plus larges en plein écran) — le cartouche étant centré, la marge doit être symétrique.
	   Plancher à 160px pour ne pas disparaître sur très petit écran. Au-delà, le JS tronque en « +N autres ». */
	max-width: max( 160px, calc( 100% - 400px ) ); padding: 15px 24px; box-sizing: border-box;
	background: #fff; border-radius: 999px; box-shadow: 0 4px 18px rgba( 0, 0, 0, .2 );
	font-family: 'Aptos', 'Segoe UI', system-ui, -apple-system, sans-serif; font-size: 1.25rem; color: #000;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-align: center;
}
.fti-archive .fti-map-crit[hidden] { display: none; }
.fti-archive .fti-map-crit__more { color: var(--fti-muted); } /* résumé des critères tronqués (« +N autres »). */

.fti-archive__empty { text-align: center; color: var(--fti-muted); padding: 48px 0; }

.fti-archive__grid {
	display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px;
	transition: opacity .3s ease;
}
.fti-archive__grid.is-loading { opacity: .45; pointer-events: none; }

/* Overlay AJAX (quittance de tâche).
   Desktop : voile ABSOLU limité au bloc .fti-archive (barre de recherche + résultats). Le logo et le titre
   de page (fournis par Elementor, HORS de .fti-archive) ne sont PAS couverts — ce n'est pas une modale.
   Le glyphe est en position FIXE centré viewport → visible même sur un petit écran (h=768), sans dépendre
   de la hauteur de la liste. pointer-events:none = purement visuel (le flag `loading` bloque déjà les
   requêtes concurrentes). Sous la modale (z-index 9999).
   Tablette/mobile (≤1024) : le voile bascule en FIXE plein écran (cf. media query) — plein écran assumé
   sur petit écran tactile. */
.fti-archive__spinner { position: absolute; inset: 0; z-index: 900; background: rgba(255,255,255,.5); pointer-events: none; }
.fti-archive__spinner[hidden] { display: none; }
/* Centrage par marges négatives (demi-taille du glyphe = 42px) et NON par transform : `transform` reste
   libre pour l'animation de rotation (sinon translate et rotate se remplacent → glissement au lieu de tourner). */
.fti-archive__spinner .fti-spinner { position: fixed; top: 50%; left: 50%; margin: -42px 0 0 -42px; }
.fti-spinner {
	width: 84px; height: 84px; border-radius: 50%;
	border: 8px solid var(--fti-focus); border-top-color: var(--fti-primary);
	animation: fti-spin .8s linear infinite;
}
@keyframes fti-spin { to { transform: rotate(360deg); } }


/* ============ Boutons / liens ============ */
/* Scopés sous .fti-archive : un thème restyle volontiers les <button> (coins carrés) avec une
   spécificité qui battrait un simple .fti-btn ; le préfixe la fait passer devant. */
.fti-archive .fti-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	padding: 12px 24px; border-radius: var(--fti-radius-pill);
	font-weight: 500; text-decoration: none; cursor: pointer; border: 1px solid transparent;
	transition: background .15s, color .15s, border-color .15s; font-size: 1.125rem; line-height: 1.2;
}
.fti-archive .fti-btn svg { width: 20px; height: 20px; flex: 0 0 auto; }
.fti-archive .fti-btn--primary { background: var(--fti-primary); color: var(--fti-primary-ink); }
.fti-archive .fti-btn--primary:hover { background: var(--fti-primary-dark); color: var(--fti-primary-ink); }
.fti-archive .fti-btn--primary:disabled { opacity: .6; cursor: default; }
.fti-archive .fti-btn--ghost { background: transparent; color: var(--fti-primary); border-color: var(--fti-primary); }
.fti-archive .fti-btn--ghost:hover { background: var(--fti-focus); color: var(--fti-primary); border-color: var(--fti-primary); }
.fti-archive .fti-btn--dark { background: #123347; color: #fff; border-color: #123347; }
.fti-archive .fti-btn--dark:hover { background: var(--fti-primary); color: #fff; border-color: var(--fti-primary); }
.fti-archive .fti-btn--dark:disabled { opacity: .4; cursor: default; }
.fti-archive .fti-btn--dark:disabled:hover { background: #123347; border-color: #123347; }
/* Boutons du pied : padding latéral élargi. */
.fti-archive .fti-modal__footer .fti-btn { padding-left: 30px; padding-right: 30px; font-size: 1rem; font-weight: 600; }

/* « Filtres avancés » : contour bleu sur fond transparent par défaut ; ne passe en bleu plein que
   lorsqu'au moins un filtre est actif (classe is-filtered posée au rendu et par le JS). */
.fti-archive .fti-archive__more-btn { background: transparent; color: var(--fti-primary); border-color: var(--fti-primary); }
.fti-archive .fti-archive__more-btn:hover { background: var(--fti-focus); color: var(--fti-primary); border-color: var(--fti-primary); }
.fti-archive .fti-archive__more-btn.is-filtered { background: var(--fti-primary); color: var(--fti-primary-ink); }
.fti-archive .fti-archive__more-btn.is-filtered:hover { background: var(--fti-primary-dark); color: var(--fti-primary-ink); border-color: var(--fti-primary-dark); }
/* Mobile, filtres actifs : pas la place pour icône + libellé + badge. Le badge prend la place de l'ICÔNE
   (avant le libellé, via order) et l'icône se masque. Filtres retirés (plus de .is-filtered) : l'icône
   revient et le badge se cache (attribut [hidden] posé par le JS). */
@media (max-width: 767px) {
	.fti-archive .fti-archive__more-btn.is-filtered > svg { display: none; }
	.fti-archive .fti-archive__more-btn.is-filtered .fti-badge { order: -1; margin-left: 0; }
}
/* Focus souris (restauré à la fermeture de la modale) : l'aspect de repos est conservé et le mauve du
   reset neutralisé par « Focus & états » ; le focus clavier ajoute le halo. Plus de règle dédiée ici. */

/* ============ Pastilles de filtres actifs (sous la barre) ============ */
.fti-archive__chips { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.fti-archive__chips:empty { display: none; margin-top: 0; }
.fti-archive .fti-chip {
	display: inline-flex; align-items: center; gap: 10px; line-height: 1.2;
	padding: 8px 20px; border: 0; border-radius: var(--fti-radius-pill);
	background: var(--fti-tag); color: #fff; font-size: .9375rem; font-weight: 500; cursor: pointer;
}
.fti-archive .fti-chip:hover { background: color-mix(in srgb, var(--fti-tag) 88%, #000); color: #fff; }
.fti-archive .fti-chip__x { display: inline-flex; width: 14px; height: 14px; }
.fti-archive .fti-chip__x svg { width: 14px; height: 14px; }
.fti-archive .fti-chip__icon { display: inline-flex; width: 16px; height: 16px; }
.fti-archive .fti-chip__icon svg { width: 16px; height: 16px; }
/* Pastille de réinitialisation : teinte plus douce + icône, pour la démarquer. */
.fti-archive .fti-chip--reset { background: var(--fti-tag-soft); color: var(--fti-text); }
.fti-archive .fti-chip--reset:hover { background: color-mix(in srgb, var(--fti-tag-soft) 88%, #000); color: var(--fti-text); }
/* Pastille de contexte (objet / zone) : lecture seule, teinte primaire pleine, non interactive. */
.fti-archive .fti-chip--context,
.fti-archive .fti-chip--context:hover { background: var(--fti-primary); color: #fff; cursor: default; }
.fti-link { color: var(--fti-primary); font-weight: 600; text-decoration: none; }
.fti-link:hover { text-decoration: underline; }

/* ============ Carte objet ============ */
.fti-card {
	display: flex; flex-direction: column; height: 100%; background: #fff;
	border: 1px solid var(--fti-card-border); border-radius: 40px; overflow: hidden;
	transition: box-shadow .18s;
}
.fti-card:hover { box-shadow: 0 10px 24px rgba(0, 0, 0, .08); }

/* Media : swiper photo (hauteur fixe). */
.fti-card__media { position: relative; height: 220px; overflow: hidden; background: var(--fti-bg-soft); flex: 0 0 auto; }
.fti-card__swiper { height: 100%; }
/* Repli avant l'init Swiper (ou si Swiper.js est absent) : n'afficher que la première photo. */
.fti-card__swiper:not(.swiper-initialized) .swiper-slide:not(:first-child) { display: none; }
/* Hauteur + cover forcés : le thème impose souvent `img { height: auto }`, ce qui casserait le remplissage. */
.fti-card__img { display: block; width: 100%; height: 220px !important; object-fit: cover !important; }
/* Fondu à l'apparition : atténue le « pop » quand plusieurs photos se chargent. Gated `.fti-js` →
   sans JavaScript, les images sont visibles d'emblée. `is-loaded` posé au chargement (JS). */
.fti-js .fti-card__img { opacity: 0; transition: opacity .35s ease; }
.fti-js .fti-card__img.is-loaded { opacity: 1; }
/* Spinner de chargement de la vignette (mode JS) : tourne tant que l'image n'est pas chargée. La classe
   `.is-loading` est posée en PHP (média avec photos) puis retirée par le JS au 'load'/'error' de l'image
   (fadeInImages). Sur les cartes sans photo, la classe n'est pas posée → pas de spinner. */
.fti-js .fti-card__media.is-loading::before {
	content: "";
	position: absolute;
	z-index: 1;
	left: 50%;
	top: 50%;
	width: 26px;
	height: 26px;
	margin: -13px 0 0 -13px;
	border-radius: 50%;
	border: 3px solid color-mix( in srgb, var( --fti-primary, #3889ff ) 22%, #fff );
	border-top-color: var( --fti-primary, #3889ff );
	animation: fti-spin 0.7s linear infinite;
	pointer-events: none;
}
.fti-card__medialink { display: block; width: 100%; height: 100%; } /* rend le média cliquable (image unique / placeholder). */
.fti-card__noimg { display: flex; align-items: center; justify-content: center; height: 100%; color: var(--fti-muted); }
.fti-card__noimg svg { width: 40px; height: 40px; }

/* Flèches du swiper : ronds translucides. Révélées au survol sur desktop (persistantes en tablette/mobile, cf. responsive). */
.fti-archive .fti-card__nav {
	position: absolute; top: 50%; transform: translateY(-50%); z-index: 2;
	display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; padding: 0;
	border: 0 !important; border-radius: 50%; background: rgba(255, 255, 255, .6) !important; color: var(--fti-text) !important;
	cursor: pointer; box-shadow: 0 1px 4px rgba(0, 0, 0, .2); opacity: 0;
	transition: opacity .15s, background .15s, color .15s;
}
.fti-archive .fti-card__nav svg { width: 24px; height: 24px; display: block; }
.fti-archive .fti-card__nav--prev { left: 10px; }
.fti-archive .fti-card__nav--next { right: 10px; }
/* Survol / focus clavier : cercle opaque + chevron primaire. Clic (actif) : fond primaire + chevron blanc. */
.fti-archive .fti-card__nav:hover,
.fti-archive .fti-card__nav:focus-visible { background: rgba(255, 255, 255, 1) !important; color: var(--fti-primary) !important; }
.fti-archive .fti-card__nav:active { background: var(--fti-primary) !important; color: #fff !important; }
/* Révélation : au survol du media sur desktop ; persistantes en tablette/mobile (cf. responsive).
   Latence de 250 ms sur la seule opacité → un survol rapide des cartes ne déclenche pas les flèches
   (le retrait reste immédiat, et le feedback fond/chevron au survol de la flèche reste instantané). */
.fti-archive .fti-card__media:hover .fti-card__nav { opacity: 1; transition-delay: .25s, 0s, 0s; }

/* Points de pagination du carrousel (base — à styler ensuite). Révélés avec les flèches ; point actif
   en primaire. Position : Swiper les place en bas-centre du media. */
.fti-archive .fti-card__dots { opacity: 0; transition: opacity .15s; }
.fti-archive .fti-card__media:hover .fti-card__dots { opacity: 1; transition-delay: .25s; }
.fti-archive .fti-card__dots .swiper-pagination-bullet { background: #fff; opacity: .7; }
.fti-archive .fti-card__dots .swiper-pagination-bullet-active { background: var(--fti-primary); opacity: 1; }

/* Contenu = colonne flex qui occupe la hauteur restante (flex:1). Deux blocs : le corps (contenu réel)
   et l'annonceur, ce dernier chassé en bas (margin-top:auto). Le blanc de compensation d'une carte
   forcée en hauteur (grille liste) tombe donc entre les deux, jamais sous l'annonceur. */
.fti-card__content { position: relative; display: flex; flex-direction: column; gap: 20px; padding: 30px; flex: 1 1 auto; }
.fti-card__body { display: flex; flex-direction: column; gap: 20px; }
.fti-card__advert { display: flex; flex-direction: column; gap: 20px; margin-top: auto; }
/* Lien étiré : toute la zone de contenu est cliquable vers la fiche (le media reste au swiper). */
.fti-card__link { position: absolute; inset: 0; z-index: 1; cursor: pointer; }
/* Curseur « doigt » sur toute la carte (lien étiré) — le média a son propre tap-to-open. */
.fti-archive .fti-card__content, .fti-archive .fti-card__media { cursor: pointer; }
.fti-card__content > *:not(.fti-card__link) { position: relative; z-index: 0; pointer-events: none; }
.fti-card__row1 { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; }
.fti-card__surface {
	display: inline-block; /* pastille : le padding/bordure vertical ne rend pas sur un span inline. */
	color: var(--fti-primary);
	font-weight: 700;
	font-size: 1rem;
	white-space: nowrap;
	border: 1px solid var(--fti-primary);
	border-radius: 999px;
	padding: 2px 15px;
	letter-spacing: -0.2px;
}
.fti-card__contract { color: var(--fti-card-secondary); font-weight: 700; font-size: .875rem; text-transform: uppercase; white-space: nowrap; }
.fti-card__row2 { display: flex; flex-direction: column; gap: 0; margin-top: -8px; }
.fti-card__zone { margin: 0; font-weight: 700; font-size: 1.25rem; color: #000; text-transform: uppercase; }
.fti-card__commune { margin: -3px 0 0; font-weight: 700; font-size: 1.125rem; color: #000; }
.fti-card__types { margin: -6px 0 0; font-size: 1.125rem; color: #000; }
.fti-card__price { margin: -6px 0 -2px; font-weight: 700; font-size: 1.25rem; color: #000; }
/* Annonceur + filet toujours calés en bas : margin-top:auto absorbe l'espace libre (le blanc de
   compensation d'une carte forcée en hauteur passe donc AU-DESSUS du filet, pas en dessous). */
.fti-card__filet { width: 100%; margin: 0; border: 0; border-top: 1px solid var(--fti-card-border); }
.fti-card__advertiser { margin: 0; font-size: .9375rem; color: #656565; }

/* ============ Responsive ============ */
/* Tablette : 2 colonnes + flèches du swiper persistantes (plus de survol au doigt). */
@media (max-width: 1024px) {
	.fti-archive__grid { grid-template-columns: repeat(2, 1fr); }
	.fti-archive .fti-card__nav, .fti-archive .fti-card__dots { opacity: 1; }
	/* Vue Carte : ratio plus haut (5:4) qu'en desktop (16:9), mieux adapté aux écrans étroits. */
	.fti-archive__mapcanvas { aspect-ratio: 1.25; }
	/* Tablette/mobile : le voile AJAX passe en FIXE plein écran (assumé sur petit écran tactile) ; le glyphe
	   reste fixe centré viewport (règle de base). */
	.fti-archive__spinner { position: fixed; }
	/* Le voile jumeau de la barre est inutile en mobile : le voile des résultats couvre déjà tout l'écran
	   (plein écran). On le masque pour éviter deux voiles fixes superposés (double opacité). */
	.fti-archive__spinner--bar { display: none; }
	/* Vue Carte : même traitement plein écran (sinon le spinner ne couvre que la zone carte, trop bas). */
	.fti-archive__mapspinner { position: fixed; inset: 0; z-index: 900; background: rgba(255,255,255,.5); border-radius: 0; }
	/* Barre de résultats : la bascule (gauche) et le tri (droite) tiennent sur une même ligne, et le
	   compteur passe DESSOUS, centré, séparé par un filet — sinon le compteur (long, nowrap) repoussait
	   le tri à la ligne. On réordonne en flex sans toucher au markup. */
	.fti-archive__resulthead { flex-wrap: wrap; justify-content: space-between; align-items: center; row-gap: 0; }
	.fti-archive__resulthead .fti-viewtabs { order: 1; }
	.fti-archive__sort { order: 2; }
	/* Vue Carte sous 1024 (carte pleine largeur, pas de liste à trier) : le tri disparaît. Sans lui,
	   `space-between` laisserait la bascule seule à gauche avec un grand vide à droite → on recentre la
	   bascule. (Au-dessus de 1024, la liste est là et le tri reste affiché — cf. règle de base.) */
	.fti-archive__resulthead:has( .fti-archive__sort.is-mapview ) { justify-content: center; }
	.fti-archive__resulthead:has( .fti-archive__sort.is-mapview ) .fti-archive__sort { display: none; }
	.fti-archive__count {
		order: 3; flex: 1 1 100%; width: 100%;
		margin: 24px 0 0; padding-top: 16px; border-top: 1px solid var(--fti-filet);
		white-space: normal;
	}
}
/* Mobile : 1 colonne. */
@media (max-width: 767px) {
	.fti-archive__grid { grid-template-columns: 1fr; }
	.fti-archive__primary { flex-direction: column; align-items: stretch; }
	/* En colonne, le `flex: 1 1 200px` des champs applique 200px sur l'axe VERTICAL → champs géants et
	   énorme écart. On repasse à une hauteur naturelle (flex auto) ; la largeur est gérée juste en dessous. */
	.fti-archive__primary .fti-field { flex: 0 0 auto; }
	.fti-archive__primary .fti-field, .fti-archive .ts-wrapper, .fti-field__control { min-width: 0; width: 100%; }
	.fti-tabs { display: flex; width: 100%; }
	.fti-tab { flex: 1; }
	.fti-tab span { text-align: center; }
	/* View-tabs (Liste/Carte) : le span (display:flex) doit REMPLIR sa moitié et centrer son texte, sinon il
	   se dimensionne au contenu → les deux onglets paraissent inégaux (a fortiori l'actif, en gras). */
	.fti-viewtabs .fti-tab span { flex: 1; justify-content: center; }
	.fti-archive__resulthead { align-items: stretch; }
	/* Trop étroit pour bascule + tri côte à côte : le tri passe en pleine largeur, sous la bascule, aéré de 20px. */
	.fti-archive__sort { width: 100%; margin-top: 20px; }
	/* Décompte des résultats en 1.125rem sur mobile. */
	.fti-archive__count { font-size: 1.125rem; }
	/* Pagination : pastilles réduites (40px) + gouttière serrée → 6 pages + précédent/suivant tiennent
	   sur une ligne sur la plupart des mobiles ; au-delà, ça s'enroule proprement (flex-wrap déjà posé). */
	.fti-archive .fti-pagination { gap: 6px; }
	.fti-archive .fti-pagination .fti-page { width: 40px; height: 40px; font-size: 1rem; }
	.fti-archive .fti-pagination .fti-page--gap { width: 16px; height: 40px; }
	.fti-archive .fti-pagination .fti-page--nav svg { width: 18px; height: 18px; }
	/* Popup carte (mobile) : plus compact — largeur plafonnée à 86vw, coins et vignette arrondis à 20px,
	   image réduite à 100px et calée en haut à gauche (au lieu du centrage vertical). */
	.fti-archive .fti-mappop { max-width: 86vw; border-radius: 20px; align-items: flex-start; }
	.fti-archive .fti-mappop__img { flex: 0 0 100px; width: 100px; height: 100px; border-radius: 10px; }
	/* Barre haute empilée : les actions (Filtres avancés / Créer une alerte) passent AU-DESSUS des onglets
	   Achat/Location, alignées aux deux extrémités (l'une à gauche, l'autre à droite). Police et icônes
	   réduites pour tenir sur un petit écran. */
	.fti-archive__bartop { flex-direction: column; align-items: stretch; gap: 12px; }
	.fti-archive__actions { order: -1; justify-content: space-between; }
	.fti-archive__actions .fti-btn { font-size: 0.9375rem; }
	.fti-archive__actions .fti-btn svg { width: 16px; height: 16px; }
	/* Onglets Achat/Location (barre haute uniquement, pas Liste/Carte) : un peu d'air au-dessus + police réduite. */
	.fti-archive__bartop .fti-tabs { margin-top: 10px; }
	.fti-archive__bartop .fti-tab span { font-size: 1.125rem; }
	/* Cases de filtres : 2 colonnes au lieu de 3 (3 cases serrées illisibles sur petit écran). */
	.fti-group__options { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Très petits écrans (≤ 410 px) : dans la barre haute, « Créer une alerte » et « Filtres avancés » ne
   tiennent plus côte à côte avec leurs libellés. « Créer une alerte » se réduit à sa cloche, en bouton
   PARFAITEMENT rond (carré 44 × 44 = hauteur du bouton frère), tandis que « Filtres avancés » garde son
   libellé. */
@media (max-width: 410px) {
	.fti-archive .fti-archive__alert-btn > span { display: none; }
	.fti-archive .fti-archive__alert-btn {
		width: 44px;
		height: 44px;
		padding: 0;
		gap: 0;
		border-radius: 50%;
		flex: 0 0 auto;
	}
	.fti-archive .fti-archive__alert-btn svg { width: 18px; height: 18px; }
}

/* Respect de la préférence « mouvement réduit » : on neutralise animations/transitions non essentielles
   (les spinners restent, mais sans rotation infinie agressive) et les défilements deviennent instantanés. */
@media (prefers-reduced-motion: reduce) {
	.fti-archive *, .fti-archive *::before, .fti-archive *::after,
	.ftimmo-map *, .ftimmo-map *::before, .ftimmo-map *::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
		scroll-behavior: auto !important;
	}
}

/* ============ Vue Carte deux colonnes (desktop / tablette paysage) ============ */
/* min-width:1024 → inclut la tablette paysage (iPad 1024) ; placée APRÈS le bloc max-width:1024 pour
   l'emporter exactement à 1024 px. Le conteneur porte une hauteur stable ; la liste et la carte la
   remplissent, la liste défile en interne. En deçà : liste masquée, carte pleine largeur. */
@media (min-width: 1024px) {
	.fti-archive__mapview { display: flex; gap: 0; height: clamp(520px, 68vh, 760px); }
	/* Liste et carte accolées (sans gouttière) : arrondis conservés seulement sur les bords externes —
	   coin gauche pour la liste, coin droit pour la carte —, jointure droite au centre. */
	.fti-archive__maplist { display: block; flex: 0 0 400px; height: 100%; overflow-y: auto; overscroll-behavior: contain; border: 1px solid var(--fti-card-border); border-right: 0; border-radius: 10px 0 0 10px; background: #fff; }
	.fti-archive__mapcanvas { aspect-ratio: auto; width: auto; flex: 1 1 0; height: 100%; border-radius: 0 10px 10px 0; }
}

/* ============ Vue Carte en plein écran (le wrapper englobe liste + carte) ============ */
/* La cible du plein écran est #fti-mapview : la liste reste donc à gauche, en deux colonnes plein cadre.
   :fullscreen et :-webkit-full-screen restent dans des règles SÉPARÉES (une seule inconnue ferait tomber
   toute la règle groupée). En portrait étroit, la liste s'efface (carte pleine) — règle plus bas. */
.fti-archive__mapview:fullscreen { display: flex; gap: 0; width: 100%; height: 100%; padding: 12px; box-sizing: border-box; background: #fff; }
.fti-archive__mapview:-webkit-full-screen { display: flex; gap: 0; width: 100%; height: 100%; padding: 12px; box-sizing: border-box; background: #fff; }
.fti-archive__mapview:fullscreen .fti-archive__maplist { display: block; flex: 0 0 400px; height: 100%; overflow-y: auto; overscroll-behavior: contain; border: 1px solid var(--fti-card-border); border-right: 0; border-radius: 10px 0 0 10px; background: #fff; }
.fti-archive__mapview:-webkit-full-screen .fti-archive__maplist { display: block; flex: 0 0 400px; height: 100%; overflow-y: auto; overscroll-behavior: contain; border: 1px solid var(--fti-card-border); border-right: 0; border-radius: 10px 0 0 10px; background: #fff; }
.fti-archive__mapview:fullscreen .fti-archive__mapcanvas { flex: 1 1 0; width: auto; height: 100%; aspect-ratio: auto; border-radius: 0 10px 10px 0; }
.fti-archive__mapview:-webkit-full-screen .fti-archive__mapcanvas { flex: 1 1 0; width: auto; height: 100%; aspect-ratio: auto; border-radius: 0 10px 10px 0; }

/* Plein écran en portrait étroit : pas de place pour deux colonnes → liste masquée, carte pleine. */
@media (max-width: 767px) and (orientation: portrait) {
	.fti-archive__mapview:fullscreen .fti-archive__maplist { display: none; }
	.fti-archive__mapview:-webkit-full-screen .fti-archive__maplist { display: none; }
}