/* Galerie photo des appartements : grande photo qui défile (glisser au doigt, flèches, vignettes),
   compteur, et visionneuse plein écran en haute définition. Script : script/galerie.js */
.zonePhoto, .galerie { min-width: 0; }   /* sinon la grille de la page s'élargit avec la bande de photos */
.galerie { --g-accent: #3f6f93; position: relative; }
.galerie-scene { position: relative; border-radius: 10px; overflow: hidden; background: #1b2329; }
.galerie-piste { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth;
  scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.galerie-piste::-webkit-scrollbar { display: none; }
.galerie-diapo { flex: 0 0 100%; margin: 0; scroll-snap-align: center; aspect-ratio: 4 / 3; }
.galerie-diapo a { display: block; width: 100%; height: 100%; cursor: zoom-in; }
.galerie-diapo img { width: 100%; height: 100%; object-fit: cover; display: block; max-height: none; }

.galerie-btn { position: absolute; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; border: 0;
  border-radius: 50%; background: rgba(15, 20, 25, .55); color: #fff; font-size: 26px; line-height: 44px;
  text-align: center; padding: 0; cursor: pointer; opacity: .85; transition: opacity .2s, background .2s; z-index: 2; }
.galerie-btn:hover, .galerie-btn:focus-visible { opacity: 1; background: rgba(15, 20, 25, .8); outline: none; }
.galerie-btn[disabled] { opacity: 0; pointer-events: none; }
.galerie-prec { left: 12px; }
.galerie-suiv { right: 12px; }
.galerie-compteur, .galerie-plein { position: absolute; bottom: 12px; z-index: 2; background: rgba(15, 20, 25, .6);
  color: #fff; border-radius: 14px; font-size: 13px; line-height: 1; padding: 6px 10px; }
.galerie-compteur { left: 12px; pointer-events: none; }
.galerie-plein { right: 12px; border: 0; cursor: pointer; font-size: 15px; }
.galerie-plein:hover { background: rgba(15, 20, 25, .85); }

.galerie-vignettes { display: flex; gap: 6px; margin-top: 8px; overflow-x: auto; scrollbar-width: thin; padding-bottom: 4px; }
.galerie-vignette { flex: 0 0 auto; width: 92px; aspect-ratio: 4 / 3; padding: 0; border: 2px solid transparent;
  border-radius: 6px; overflow: hidden; cursor: pointer; background: none; opacity: .65; transition: opacity .2s, border-color .2s; }
.galerie-vignette img { width: 100%; height: 100%; object-fit: cover; display: block; }
.galerie-vignette:hover { opacity: 1; }
.galerie-vignette.active { opacity: 1; border-color: var(--g-accent); }

@media (hover: none) { .galerie-btn { display: none; } }   /* écran tactile : on glisse au doigt */
@media (max-width: 600px) { .galerie-scene { border-radius: 0; } .galerie-vignette { width: 72px; } }

/* visionneuse plein écran */
.visionneuse { position: fixed; inset: 0; z-index: 5000; background: rgba(8, 11, 14, .96); display: flex;
  align-items: center; justify-content: center; touch-action: pan-y; }
.visionneuse[hidden] { display: none; }
.visionneuse img { max-width: 100vw; max-height: 100vh; object-fit: contain; user-select: none; -webkit-user-drag: none; }
.visionneuse .galerie-btn { width: 52px; height: 52px; line-height: 52px; font-size: 30px; background: rgba(255,255,255,.14); }
.visionneuse .galerie-btn:hover { background: rgba(255,255,255,.28); }
.visionneuse .v-fermer { position: absolute; top: 14px; right: 14px; width: 44px; height: 44px; border: 0; border-radius: 50%;
  background: rgba(255,255,255,.12); color: #fff; font-size: 24px; line-height: 44px; cursor: pointer; padding: 0; }
.visionneuse .v-fermer:hover { background: rgba(255,255,255,.25); }
.visionneuse .galerie-compteur { bottom: 18px; left: 50%; transform: translateX(-50%); }
body.visionneuse-ouverte { overflow: hidden; }
