/* ===================================================================
   Fiche voiture : bandes "Annonces similaires" et "Vehicules du vendeur" (fiche/similaries.php) - 19/10/2026
   Reprend les cartes et les fleches de l'accueil (templatecss/home-bas.css, classes hb-*), sans la classe .hb
   (elle declenche la mesure clic_accueil). Surcharge les anciennes regles par id (style.css, resp.css).
   =================================================================== */
#annonces-similaires.fb-bloc,#stock-vendeur-pro.fb-bloc{float:none!important;clear:both;width:auto!important;margin:18px 10px 0!important;padding:0!important;border:0!important;font-family:Arial,Helvetica,sans-serif;color:#222}
.fb-bloc *{box-sizing:border-box}
.fb-bloc .hb-s{margin:0}
.fb-bloc .hb-h #titre-annonces-similaires,.fb-bloc .hb-h #titre-stock-vendeur{background:none!important;float:none!important;width:auto!important;height:auto!important;min-height:0!important;padding:0!important;margin:0!important;border-radius:0!important;font:bold 18px/1.2 Arial,Helvetica,sans-serif!important;color:#1f2a37!important;text-transform:none}
.fb-bloc .hb-st a.stock-vendeur-garage{display:inline;margin:0;font-size:13.5px;font-weight:bold;color:#1f63bd;text-decoration:none;white-space:normal}
.fb-bloc .hb-st a.stock-vendeur-garage:hover{text-decoration:underline}
/* cartes : 3 par ligne dans la colonne de la fiche */
.fb-bloc .hb-rail>.hb-card{flex:0 0 calc((100% - 24px)/3)}
.fb-bloc .hb-card{color:#222}
.fb-bloc .hb-ph img{float:none;margin:0;border-radius:0}
.fb-bloc .fb-ver{color:#3d4654}
.fb-bloc .hb-l{line-height:1.35}
.fb-bloc .fb-pm{display:block;margin-top:4px}
.fb-bloc .fb-pm span{display:inline-block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:top;font-size:11px;font-weight:600;padding:1px 6px;border-radius:8px}
/* badges (dans home-bas.css ils sont scopes .hb) */
.fb-bloc .badge-nouveau{display:inline-block;background:#2a9d5c;color:#fff;font-size:10px;font-weight:bold;padding:1px 5px;border-radius:3px;text-transform:uppercase;letter-spacing:.5px;line-height:1.5}
.fb-bloc .res-photo-badge{position:absolute;bottom:4px;left:4px;top:auto;background:rgba(0,0,0,.55);color:#fff;font-size:11px;padding:2px 5px;border-radius:3px;display:inline-flex;align-items:center;gap:3px;z-index:2;pointer-events:none}
.fb-bloc .res-photo-badge svg{width:12px;height:12px;stroke:#fff;fill:none;stroke-width:1.5}
.fb-bloc .sim-heart-btn{top:6px;right:6px}
/* lien "Voir toutes les annonces" : bouton contour bleu pleine largeur (charte : action secondaire) */
.fb-bloc .sim-voir-tout{text-align:left;padding:0;margin-top:12px}
.fb-bloc .sim-voir-tout a{display:flex;align-items:center;justify-content:center;width:100%;height:42px;border:1px solid #2977dc;border-radius:8px;background:#fff;color:#1f63bd;font:bold 14px Arial,Helvetica,sans-serif;text-decoration:none;transition:background-color .15s}
.fb-bloc .sim-voir-tout a:hover{background:#f5f8fd;text-decoration:none}
.fb-bloc a:focus-visible,.fb-bloc button:focus-visible{outline:2px solid #1f63bd;outline-offset:2px}
/* tablette */
@media (max-width:980px){
 #annonces-similaires.fb-bloc,#stock-vendeur-pro.fb-bloc{margin:16px 6px 0!important}
}
/* mobile : une carte et demie visible (la suivante depasse = on comprend qu'on peut faire glisser) */
@media (max-width:700px){
 .fb-bloc .hb-rail>.hb-card{flex:0 0 58%}
 .fb-bloc .hb-h #titre-annonces-similaires,.fb-bloc .hb-h #titre-stock-vendeur{font-size:17px!important}
}
/* ===================================================================
   Fleches photo precedente / suivante (19/10/2026, essai ?fp2=1) : un seul modele partout
   (grande photo ordinateur fiche/photos.php, carrousel telephone fiche/is.not.sold.php, grand diaporama #lb-prev / #lb-next).
   Choix du gerant : discretes (la photo est l'element le plus regarde et porte deja partage, coeur, compteur, badges) :
   rond transparent sombre, chevron blanc, fond plus fonce au survol (pas d agrandissement : il decalait le chevron, vu par le gerant) ; decolle du bord ; zone de clic >= 40 px ;
   chevron dessine (le caractere ❮ n'est pas centre). Les styles en ligne des liens sont surcharges (!important).
   Les bandes de cartes gardent le rond blanc (fond blanc, pas de photo derriere).
   =================================================================== */
a[onclick^="previmage"],a[onclick^="nextimage"],a[onclick^="mySwiper.slidePrev"],a[onclick^="mySwiper.slideNext"],#fiche-lightbox #lb-prev,#fiche-lightbox #lb-next{
 width:40px;height:40px;padding:0!important;border-radius:50%!important;background:rgba(0,0,0,.28)!important;color:#fff!important;
 box-shadow:none;font-size:0!important;line-height:0!important;display:flex!important;align-items:center;justify-content:center;
 text-decoration:none!important;transition:background-color .15s,transform .15s;-webkit-tap-highlight-color:transparent}
a[onclick^="previmage"],a[onclick^="mySwiper.slidePrev"],#fiche-lightbox #lb-prev{left:10px!important}
a[onclick^="nextimage"],a[onclick^="mySwiper.slideNext"],#fiche-lightbox #lb-next{right:10px!important}
a[onclick^="previmage"]:before,a[onclick^="nextimage"]:before,a[onclick^="mySwiper.slidePrev"]:before,a[onclick^="mySwiper.slideNext"]:before,#fiche-lightbox #lb-prev:before,#fiche-lightbox #lb-next:before{
 content:"";width:9px;height:9px;border:solid currentColor;border-width:0 0 2.5px 2.5px;filter:drop-shadow(0 0 1px rgba(0,0,0,.6))}
a[onclick^="previmage"]:before,a[onclick^="mySwiper.slidePrev"]:before,#fiche-lightbox #lb-prev:before{transform:rotate(45deg);margin-left:4px}
a[onclick^="nextimage"]:before,a[onclick^="mySwiper.slideNext"]:before,#fiche-lightbox #lb-next:before{transform:rotate(-135deg);margin-right:4px}
@media (hover:hover){
 a[onclick^="previmage"]:hover,a[onclick^="nextimage"]:hover,a[onclick^="mySwiper.slidePrev"]:hover,a[onclick^="mySwiper.slideNext"]:hover{background:rgba(0,0,0,.55)!important}
}
a[onclick^="previmage"]:focus-visible,a[onclick^="nextimage"]:focus-visible,#fiche-lightbox #lb-prev:focus-visible,#fiche-lightbox #lb-next:focus-visible{outline:2px solid #fff;outline-offset:2px}
/* grand diaporama (fond noir) : rond blanc transparent, un peu plus grand, plus loin du bord */
#fiche-lightbox #lb-prev,#fiche-lightbox #lb-next{width:48px;height:48px;background:rgba(255,255,255,.12)!important}
#fiche-lightbox #lb-prev{left:16px!important}#fiche-lightbox #lb-next{right:16px!important}
#fiche-lightbox #lb-prev:before,#fiche-lightbox #lb-next:before{width:11px;height:11px;filter:none}
@media (hover:hover){#fiche-lightbox #lb-prev:hover,#fiche-lightbox #lb-next:hover{background:rgba(255,255,255,.28)!important}}
/* telephone : a 8 px du bord (on fait surtout glisser du doigt) */
@media (max-width:700px){
 a[onclick^="mySwiper.slidePrev"],#fiche-lightbox #lb-prev{left:8px!important}
 a[onclick^="mySwiper.slideNext"],#fiche-lightbox #lb-next{right:8px!important}
 #fiche-lightbox #lb-prev,#fiche-lightbox #lb-next{width:40px;height:40px}
 #fiche-lightbox #lb-prev:before,#fiche-lightbox #lb-next:before{width:9px;height:9px}
}
@media (prefers-reduced-motion:reduce){.fb-bloc *,#fiche-lightbox #lb-prev,#fiche-lightbox #lb-next{transition:none!important}}
/* Miniatures des photos (19/10/2026, essai ?fp2=1) : la photo affichee est encadree en bleu #2977dc 3 px, les autres estompees.
   Le JS met toujours la bordure orange en ligne + la classe .is-on (photos.php syncDeskThumb / lbSyncThumb, is.not.sold.php syncThumb) ;
   le cadre est dessine par un outline sur l'image (pas de changement de taille). */
#thumb-strip>span,[id^="dthumb-"],.lb-thumb{border-color:transparent!important}
#thumb-strip>span img,[id^="dthumb-"] img,.lb-thumb img{opacity:.6;transition:opacity .15s}
#thumb-strip>span.is-on img,[id^="dthumb-"].is-on img,.lb-thumb.is-on img{opacity:1;outline:3px solid #2977dc;outline-offset:-3px}
@media (hover:hover){#thumb-strip>span:hover img,[id^="dthumb-"]:hover img,.lb-thumb:hover img{opacity:1}}