/*
 * Galerie de la fiche annonce (fork MGM).
 *
 * ListingPro laissait le fichier image décider du cadre : cinq cibles
 * aq_resize() selon le nombre de photos (1170x400 pour une seule, 350x450 à
 * partir de cinq), et aucune règle de dimension côté CSS. Une fiche était un
 * bandeau panoramique, la suivante une rangée de portraits.
 *
 * Un seul cadre désormais : un carré, rempli par recadrage, avec un cadrage
 * remonté pour garder les visages. Le nombre de vignettes visibles est figé
 * dans main.js — 4, puis 2, puis 1 —, donc la hauteur de la bande ne dépend
 * plus du nombre de photos.
 *
 * Ceinture et bretelles : la cible aq_resize() étant carrée elle aussi, un
 * navigateur qui ignore `aspect-ratio` affiche des vignettes déjà au bon
 * format. Et si le redimensionnement échoue, aq_resize() renvoie l'original —
 * le cadre ci-dessous le rattrape au lieu de laisser passer une pleine taille.
 *
 * La lightbox prettyPhoto reçoit l'original et n'est pas concernée.
 */

/* Le cadre. `width: 100%` + `aspect-ratio` : la hauteur se déduit de la
   largeur que slick pose en ligne sur la slide. La place est donc réservée
   avant le chargement de l'image, sans attribut width/height dans le HTML. */
.listing-second-view .listing-slide .slide > a {
    display: block;
}

.listing-second-view .listing-slide .slide img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: 50% 30%;
}

/* Moins de photos que de vignettes visibles : slick donne à la piste la
   largeur de ses seules slides et la laisse à gauche. On la centre — ce
   `margin: auto` reste sans effet dès que la piste dépasse la fenêtre, donc
   le défilement n'est pas affecté. */
.listing-second-view .listing-slide .slick-track {
    margin-left: auto;
    margin-right: auto;
}

/* Galerie qui tient entiere dans la bande : slick affiche ses fleches mais
   refuse de defiler. La classe est posee par main.js, a l'init et a chaque
   recalcul de position. */
.listing-second-view .listing-slide.mgm-sans-defilement .slick-arrow {
    display: none;
}

/* La galerie est posee dans une .row Bootstrap sans colonne : ses marges
   negatives de 15 px debordent de part et d'autre, et l'overflow: hidden du
   conteneur rogne d'autant la premiere et la derniere vignette. Et sous
   768 px, responsive.css ajoute 2 px de marge a chaque slide, que slick ne
   compte pas dans sa largeur de piste. On remet la piste a la largeur de la
   bande, pour que le carre soit visible en entier. */
.listing-second-view .single-page-slider-container .row {
    margin-left: 0;
    margin-right: 0;
}

.listing-second-view .listing-slide .slick-slide {
    margin-left: 0 !important;
    margin-right: 0 !important;
}
