/* Catalogue /offres/ : la carte est le héros de la page (≥ 1024 px, pleine largeur sous l'en-tête du site), filtres et liste dessous ;
   en dessous de 1024 px, bascule liste / carte (classe ofr-vue-carte sur <html>).
   Tout est conditionné par html.js-carte : sans JavaScript la page reste la liste seule, filtres et pagination inclus. */
.ui-catalogue__carte, .ui-catalogue__bascule { display: none; }
.ui-catalogue__carte { min-width: 0; }
.ui-catalogue__carte-cadre { position: relative; }
.ui-catalogue__carte-map { width: 100%; height: 100%; min-height: 220px; background: var(--c-bg-2); overflow: hidden; }
.ui-catalogue__carte-map .ui-map__attente { margin: 16px; color: var(--c-text-2); }
.ui-catalogue__zone { position: absolute; top: 12px; left: 50%; transform: translateX(-50%); z-index: 500; max-width: calc(100% - 24px); box-shadow: var(--sh-2); }
.ui-catalogue__zone[hidden] { display: none; }

/* Titre « Nos Offres » et fil d'Ariane : une ligne au-dessus de la carte (mobile, sans JavaScript, carte repliée), en surimpression sur ordinateur */
.ofr-hero { position: relative; background: var(--c-bg); border-bottom: 1px solid var(--c-border); }
.ofr-hero__titre { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 16px; padding: 12px 16px; max-width: var(--w-max, 1280px); margin: 0 auto; }
.ofr-hero__titre .ui-breadcrumb { margin: 0; font-size: 13px; }
.ofr-hero__h1 { margin: 0; font-size: 22px; line-height: 30px; font-weight: 700; color: var(--c-text); }

@media (max-width: 1023.98px) {
    .js-carte .ui-catalogue__bascule { display: inline-flex; }
    .js-carte.ofr-vue-carte .ui-catalogue__carte { display: block; }
    .js-carte.ofr-vue-carte .ui-catalogue__carte-map { height: min(60vh, 420px); }
    .js-carte.ofr-vue-carte .ui-catalogue__results { display: none; }
    .ofr-carte__tete, .ofr-carte__rail, .ui-catalogue__carte .ui-source { display: none; }
}
@media (min-width: 1024px) {
    .js-carte .ui-catalogue__carte { display: block; position: relative; }
    .js-carte .ui-catalogue__carte-cadre { height: clamp(260px, 38vh, 340px); }
    .js-carte .ofr-hero__titre { position: absolute; z-index: 600; top: 12px; left: 16px; max-width: calc(100% - 200px); padding: 8px 14px; border-radius: var(--r-md);
        background: color-mix(in srgb, var(--c-nuit) 88%, transparent); box-shadow: var(--sh-2); flex-direction: column; gap: 0; }
    .js-carte .ofr-hero__titre .ui-breadcrumb, .js-carte .ofr-hero__titre .ui-breadcrumb a, .js-carte .ofr-hero__titre .ui-breadcrumb [aria-current] { color: #fff; }
    .js-carte .ofr-hero__h1 { color: #fff; font-size: 20px; line-height: 26px; }
    .js-carte .ofr-carte__tete { position: absolute; z-index: 600; top: 12px; right: 12px; display: flex; }
    .js-carte .ofr-carte__replier { min-height: 36px; padding: 0 12px; background: var(--c-bg); box-shadow: var(--sh-2); border-radius: var(--r-md); font-size: 14px; }
    .js-carte .ui-catalogue__carte .ui-source { position: absolute; z-index: 500; left: 12px; bottom: 6px; margin: 0; padding: 1px 6px; font-size: 11px; background: color-mix(in srgb, var(--c-bg) 85%, transparent); border-radius: 4px; }
    /* carte repliée : le titre redevient une ligne, une barre « Afficher la carte » reste sous l'en-tête */
    .js-carte.ofr-carte-repliee .ofr-hero__titre { position: static; max-width: var(--w-max, 1280px); flex-direction: row; background: none; box-shadow: none; padding: 12px 16px; align-items: baseline; gap: 2px 16px; }
    .js-carte.ofr-carte-repliee .ofr-hero__titre .ui-breadcrumb, .js-carte.ofr-carte-repliee .ofr-hero__titre .ui-breadcrumb a, .js-carte.ofr-carte-repliee .ofr-hero__titre .ui-breadcrumb [aria-current] { color: var(--c-text-2); }
    .js-carte.ofr-carte-repliee .ofr-hero__h1 { color: var(--c-text); font-size: 22px; line-height: 30px; }
    .js-carte.ofr-carte-repliee .ofr-carte__tete, .js-carte.ofr-carte-repliee .ui-catalogue__carte-cadre, .js-carte.ofr-carte-repliee .ui-catalogue__carte .ui-source { display: none; }
    .js-carte.ofr-carte-repliee .ofr-carte__rail { display: flex; align-items: center; justify-content: center; gap: 8px; width: 100%; min-height: 40px; border: 0; border-top: 1px solid var(--c-border);
        background: var(--c-bg-2); color: var(--c-text); font: 600 14px/1.2 inherit; cursor: pointer; }
    .js-carte.ofr-carte-repliee .ofr-carte__rail:hover { background: var(--c-bg); }
    .js-carte.ofr-carte-repliee .ofr-carte__rail:focus-visible { outline: 3px solid var(--c-brand); outline-offset: -3px; }
}

/* Marqueurs : pastille prix / surface, grappes, état survolé (liste et carte se répondent) */
.ofr-pin { display: inline-flex; flex-direction: column; align-items: center; justify-content: center; transform: translate(-50%, -100%); min-width: 44px; min-height: 28px; padding: 2px 8px;
    background: #fff; color: var(--c-text); border: 2px solid var(--c-brand); border-radius: 14px; font: 700 12px/1.15 inherit; white-space: nowrap; box-shadow: 0 1px 4px rgba(15, 23, 42, .35); cursor: pointer; }
.ofr-pin small { font-weight: 500; font-size: 11px; color: var(--c-text-2); }
.ofr-pin.is-hover, .ofr-pin:focus-visible { background: var(--c-brand); color: #fff; border-color: var(--c-nuit); z-index: 1000 !important; transform: translate(-50%, -100%) scale(1.12); }
.ofr-pin.is-hover small, .ofr-pin:focus-visible small { color: #fff; }
.leaflet-marker-icon.ofr-div { background: transparent; border: 0; }
.ui-offer-card.is-hover { outline: 3px solid var(--c-brand); outline-offset: 2px; }
.marker-cluster-small, .marker-cluster-medium, .marker-cluster-large { background-color: rgba(61,90,115,.35); }
.marker-cluster-small div, .marker-cluster-medium div, .marker-cluster-large div { background-color: var(--c-brand); color: #fff; font-weight: 700; }
@media (prefers-reduced-motion: reduce) { .ofr-pin { transition: none; } }
.marker-cluster.is-hover div { background-color: var(--c-nuit); outline: 3px solid #fff; }
/* 320 px : la barre « recherche + Filtres + Carte » ne tient pas avec les trois libellés ; le bouton Carte / Liste garde son pictogramme et son nom accessible */
@media (max-width: 479px) {
    .ui-catalogue__bascule { padding-left: 12px; padding-right: 12px; }
    .ui-catalogue__bascule > span { position: absolute; width: 1px; height: 1px; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}

/* Diaporama des cartes d'offre : défilement tactile natif, flèches et miniatures au-dessus du lien de la carte */
.ui-offer-card__media > .ui-offer-card__badges { z-index: 4; pointer-events: none; }
.ui-offer-card__media .sel-btn { z-index: 4; }
.ofr-badge-nouveau { background: var(--c-brand); color: #fff; box-shadow: var(--sh-1); }
.ofr-slides { position: absolute; inset: 0; z-index: 2; }
.ofr-slides__piste { display: flex; height: 100%; margin: 0; padding: 0; list-style: none; overflow-x: auto; scroll-snap-type: x mandatory; overscroll-behavior-x: contain; scrollbar-width: none; }
.ofr-slides__piste::-webkit-scrollbar { display: none; }
.ofr-slides__piste:focus-visible { outline: 3px solid var(--c-brand); outline-offset: -3px; }
.ofr-slides__vue { flex: 0 0 100%; min-width: 0; height: 100%; scroll-snap-align: center; scroll-snap-stop: always; position: relative; }
.ofr-slides__vue > a { display: block; height: 100%; }
.ui-offer-card__media .ofr-slides__vue img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ofr-slides__fl { position: absolute; top: 50%; z-index: 3; width: 36px; height: 36px; margin-top: -18px; display: inline-flex; align-items: center; justify-content: center;
    border: 0; border-radius: 50%; background: rgba(255, 255, 255, .92); color: var(--c-text); box-shadow: var(--sh-1); cursor: pointer; opacity: 0; transition: opacity .15s; }
.ofr-slides__fl--prec { left: 8px; } .ofr-slides__fl--suiv { right: 8px; }
.ofr-slides__fl[hidden], .ofr-slides__mini[hidden] { display: none; }
.ui-offer-card:hover .ofr-slides__fl, .ofr-slides__fl:focus-visible, .ofr-slides:focus-within .ofr-slides__fl { opacity: 1; }
@media (hover: none) { .ofr-slides__fl { opacity: 1; } }
.ofr-slides__mini { position: absolute; right: 8px; bottom: 8px; z-index: 3; display: flex; gap: 3px; margin: 0; padding: 3px; list-style: none; background: rgba(255, 255, 255, .92); border-radius: 6px; box-shadow: var(--sh-1); }
.ofr-slides__mini button { display: block; width: 32px; height: 20px; padding: 0; border: 2px solid transparent; border-radius: 3px; background: none; overflow: hidden; cursor: pointer; }
.ofr-slides__mini button img { position: static; width: 100%; height: 100%; object-fit: cover; display: block; }
.ofr-slides__mini button[aria-current="true"] { border-color: var(--c-brand); }
.ofr-slides__mini button:focus-visible { outline: 2px solid var(--c-brand); outline-offset: 1px; }
/* l'infobulle du mini-plan (bas gauche) et les miniatures (bas droite) se partagent le bas de la photo */
.ui-offer-card__media .vo-mini { z-index: 3; }

/* Filtres rapides, « Charger plus » et compteur */
.ofr-rapides { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0 0 16px; }
.ofr-rapides .ui-input { min-width: 0; }
@media (max-width: 479px) { .ofr-rapides { grid-template-columns: minmax(0, 1fr); } }
.ofr-plus { display: flex; flex-direction: column; align-items: center; gap: 12px; margin: 24px 0; }
.ofr-plus__compte { margin: 0; color: var(--c-text-2); font-size: 14px; }
.ofr-plus__btn[hidden] { display: none; }
.js-catalogue .ui-pagination { display: none; }   /* avec JavaScript, « Charger plus » remplace la pagination (la pagination reste dans le HTML pour les robots et sans JS) */

/* Squelettes de chargement : un halo qui glisse ; fixes si l'on a demandé de réduire les animations */
.ofr-skel { display: none; gap: 16px; grid-template-columns: minmax(0, 1fr); margin-top: 16px; }
.is-loading .ofr-skel { display: grid; }
.is-loading:not(.is-plus) .ui-offer-grid, .is-loading:not(.is-plus) .ofr-plus { display: none; }
.ofr-skel__carte { border: 1px solid var(--c-border); border-radius: var(--r-md); overflow: hidden; background: #fff; }
.ofr-skel__img { aspect-ratio: 16 / 10; }
.ofr-skel__ligne { height: 14px; margin: 14px 16px; border-radius: 7px; }
.ofr-skel__ligne--court { width: 40%; }
.ofr-skel__img, .ofr-skel__ligne { background: linear-gradient(90deg, var(--c-bg-2) 25%, #e8edf4 50%, var(--c-bg-2) 75%); background-size: 200% 100%; animation: ofr-skel 1.2s linear infinite; }
@keyframes ofr-skel { from { background-position: 200% 0; } to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .ofr-skel__img, .ofr-skel__ligne { animation: none; background: var(--c-bg-2); } }
@media (min-width: 640px) { .ofr-skel { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1024px) { .js-carte .ofr-skel { grid-template-columns: minmax(0, 1fr); } }
/* pastille longue (« À moins de 45 min en voiture de … ») : à 320 px elle passe à la ligne au lieu de déborder */
.ui-active-filters li { min-width: 0; max-width: 100%; }
.ui-active-filters .ui-pill { max-width: 100%; height: auto; min-height: 32px; padding-top: 4px; padding-bottom: 4px; white-space: normal; text-align: left; }
.ui-active-filters .ui-pill > span { min-width: 0; overflow-wrap: anywhere; }
/* miniatures en haut à droite (le bas porte le mini-plan et le bouton « garder ») ; masquées sous 480 px : flèches et glissement restent */
.ofr-slides__mini { bottom: auto; top: 8px; }
@media (max-width: 479px) { .ofr-slides__mini { display: none; } }
.ofr-rapides { grid-template-columns: repeat(auto-fit, minmax(136px, 1fr)); }
.ofr-rapides select.ui-input { padding-left: 10px; padding-right: 26px; font-size: 14px; text-overflow: ellipsis; }
@media (max-width: 479px) { .ofr-rapides { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 639px) { .ofr-rapides select.ui-input { font-size: 16px; } }

/* Page /offres/ compacte (#299) : haut de page serré, filtres et premières offres dès le premier écran */
.ui-catalogue--offres { padding-top: 16px; padding-bottom: 32px; }
.ui-catalogue--offres .ui-catalogue__grid { gap: 20px; }
.ui-catalogue--offres .ui-catalogue__panel { padding: 16px; }
.ui-catalogue--offres .ui-filters { gap: 14px; }
.ui-catalogue--offres .ui-fieldset { gap: 6px; }
.ui-catalogue--offres .ui-catalogue__head { margin-bottom: 10px; }
.ui-catalogue--offres .ui-catalogue__head .ui-h2 { font-size: 20px; line-height: 28px; }
.ui-catalogue--offres .ui-sort .ui-input, .ui-catalogue--offres .ofr-rapides .ui-input { min-height: 40px; }
.ui-catalogue--offres .ui-catalogue__bar { margin-bottom: 10px; }
.ofr-barre { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0 0 12px; }
.ofr-barre .ofr-rapides { flex: 1 1 440px; margin: 0; }
.ofr-barre .sel-alerte-cta { margin: 0; flex: 0 1 auto; }
.ofr-barre .sel-alerte-cta .ui-btn { min-height: 40px; padding-top: 4px; padding-bottom: 4px; font-size: 14px; }
.ui-catalogue--offres .ofr-rapides { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 639px) { .ui-catalogue--offres .ofr-rapides { display: none; } .ofr-barre { margin-bottom: 8px; } }

/* Grille de cartes : 1 colonne sur mobile, 2 puis 3 selon la largeur réellement disponible (liste seule ou liste + carte) */
.ui-catalogue--offres .ui-catalogue__results { container-type: inline-size; container-name: ofr; }
.ui-catalogue--offres .ui-offer-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
@container ofr (min-width: 480px) { .ui-catalogue--offres .ui-offer-grid, .js-carte .ui-catalogue--offres .ui-offer-grid, .ui-catalogue--offres .ofr-skel { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@container ofr (min-width: 740px) { .ui-catalogue--offres .ui-offer-grid, .js-carte .ui-catalogue--offres .ui-offer-grid, .ui-catalogue--offres .ofr-skel { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* Carte d'offre réduite */
.ui-catalogue--offres .ui-offer-card { box-shadow: var(--sh-1); }
.ui-catalogue--offres .ui-offer-card:hover { transform: none; box-shadow: var(--sh-2); }
.ui-catalogue--offres .ui-offer-card__media { aspect-ratio: 2 / 1; }
.ui-catalogue--offres .ui-offer-card__badges { top: 8px; left: 8px; right: 8px; gap: 4px; }
.ui-catalogue--offres .ui-offer-card__body { gap: 4px; padding: 10px 12px; }
.ui-catalogue--offres .ui-offer-card__title { font-size: 15px; line-height: 21px; }
.ui-catalogue--offres .ui-offer-card__place { font-size: 13px; line-height: 18px; }
.ui-catalogue--offres .ui-offer-card__gate { font-size: 12px; line-height: 16px; }
.ui-catalogue--offres .ui-offer-card__foot { padding-top: 6px; gap: 8px; }
.ui-catalogue--offres .ui-offer-card__surface { font-size: 15px; }
.ui-catalogue--offres .ui-offer-card__price { font-size: 13px; }
.ui-catalogue--offres .ui-offer-card .cmp-actions { padding: 0 8px 6px 12px; }
.ui-catalogue--offres .ui-offer-card .cmp-case { min-height: 36px; font-size: 13px; }
.ui-catalogue--offres .ui-offer-card .cmp-alerte { width: 36px; height: 36px; }

.ofr-carte__tete, .ofr-carte__rail { display: none; }
.ui-catalogue--offres .ui-chip input:checked + span { border-color: var(--c-brand); }
.ui-catalogue--offres .ui-chips { gap: 6px; }
.ui-catalogue--offres .ui-help { font-size: 12px; line-height: 16px; }
.ui-catalogue--offres .ui-catalogue__head { gap: 6px 12px; }
.ui-catalogue--offres .ui-sort { flex: 1 1 200px; justify-content: flex-end; white-space: nowrap; flex-wrap: nowrap; width: auto; min-width: 0; }
.ui-catalogue--offres .ui-sort .ui-input { flex: 0 1 220px; min-width: 0; max-width: none; }
.ui-catalogue--offres .ui-catalogue__bar .ui-btn { min-width: 0; padding-left: 12px; padding-right: 12px; }
.ui-catalogue--offres .ui-catalogue__bar .ui-search { flex: 1 1 0; min-width: 0; }
@media (max-width: 479px) { .ui-catalogue--offres .ui-catalogue__bar .ui-btn > span { font-size: 14px; } }

/* Panneau de filtres /offres/ : tient dans l'écran sans ascenseur interne ; compteur et « Réinitialiser » en tête, rubriques secondaires repliables */
.ofr-pli { border-top: 1px solid var(--c-border); padding-top: 10px; }
.ofr-pli__titre { display: flex; align-items: center; justify-content: space-between; min-height: 32px; cursor: pointer; list-style: none; font-size: 14px; font-weight: 600; color: var(--c-text); }
.ofr-pli__titre::-webkit-details-marker { display: none; }
.ofr-pli__titre::after { content: ""; width: 8px; height: 8px; margin-right: 4px; border-right: 2px solid var(--c-text-2); border-bottom: 2px solid var(--c-text-2); transform: rotate(45deg); transition: transform .15s; }
.ofr-pli[open] > .ofr-pli__titre::after { transform: rotate(-135deg); }
.ofr-pli[open] > .ofr-pli__titre { margin-bottom: 8px; }
.ofr-pli__titre:focus-visible { outline: 3px solid var(--c-brand); outline-offset: 2px; border-radius: 4px; }
@media (prefers-reduced-motion: reduce) { .ofr-pli__titre::after { transition: none; } }
.ui-catalogue--offres .ui-filters__bar { margin: 0 -16px -16px; padding: 12px 16px; }
@media (min-width: 1024px) {
    .ui-catalogue--offres .ui-catalogue__panel { max-height: none; overflow: visible; top: 92px; }
    .ui-catalogue--offres .ui-filters__bar { order: -1; position: static; margin: 0 0 2px; padding: 0 0 12px; border-top: 0; border-bottom: 1px solid var(--c-border); background: none; }
    .ui-catalogue--offres .ui-filters__count { font-size: 14px; }
}
@media (min-width: 1024px) and (max-height: 760px) { .ui-catalogue--offres .ui-catalogue__panel { position: static; } }
/* Hero : filtres à gauche, liste sur toute la largeur restante (3 colonnes à 1440 px via la requête de conteneur ci-dessus) */
@media (min-width: 1024px) {
    .js-carte .ui-catalogue--offres .ui-catalogue__grid { grid-template-columns: 232px minmax(0, 1fr); }
}
