/* H2O - photos et visite 360 des annonces : plein ecran sur telephone - v1 */

/* --- Visite 360 etiree sur tout l'ecran (demande par la page du cadre) ---
   Toutes largeurs : c'est le cadre qui decide, selon l'appareil. */
iframe.h2o-360-plein {
  position: fixed !important; top: 0 !important; left: 0 !important;
  width: 100vw !important; height: 100% !important; height: 100dvh !important;
  max-width: none !important; margin: 0 !important; border: 0 !important;
  z-index: 2147483647 !important; background: #1d2b44;
}
html.h2o-360-ouvert, html.h2o-360-ouvert body { overflow: hidden !important; }

@media (max-width: 1024px) {

  /* Le plein ecran de Fotorama est « absolu » dans la page : sur iPhone il suit le
     defilement et laisse voir le site dessous. Fixe = colle a l'ecran. */
  .fotorama--fullscreen { position: fixed !important; height: 100% !important; }

  /* L'icone d'origine (32 px, gris sur la photo) est remplacee par nos boutons. */
  .fotorama-custom .fotorama__fullscreen-icon { display: none !important; }

  /* Compteur « 3 / 16 » en haut a gauche de la photo. */
  .h2o-gal-compteur {
    position: absolute; left: 10px; top: 10px; z-index: 12;
    background: rgba(0, 0, 0, .55); color: #fff; font: 600 13px/1 Poppins, Arial, sans-serif;
    padding: 8px 10px; border-radius: 14px; pointer-events: none; letter-spacing: .02em;
  }

  /* Bouton « Plein ecran » en haut a droite de la photo (en bas, il passait sous les
     boutons flottants « retour en haut » et « ? » de la page). */
  .h2o-gal-plein {
    position: absolute; right: 10px; top: 10px; z-index: 12;
    display: inline-flex; align-items: center; gap: 7px; height: 36px; padding: 0 14px 0 11px;
    border: 0; border-radius: 18px; background: rgba(0, 0, 0, .6); color: #fff;
    font: 500 14px/1 Poppins, Arial, sans-serif; cursor: pointer; -webkit-tap-highlight-color: transparent;
  }
  /* Le theme colore les boutons (rose au toucher) : on impose le notre dans tous les etats. */
  .h2o-gal-plein:hover, .h2o-gal-plein:focus, .h2o-gal-plein:active, .h2o-gal-plein:focus-visible {
    background: rgba(0, 0, 0, .6) !important; color: #fff !important; outline: 0; box-shadow: none;
  }
  .h2o-gal-plein svg { width: 18px; height: 18px; fill: none; stroke: #fff; stroke-width: 2.2; stroke-linecap: round; }
  .h2o-gal-plein .h2o-gal-fermer { display: none; }

  /* En plein ecran : le meme bouton devient une croix ronde en haut a droite. */
  .fotorama--fullscreen .h2o-gal-plein {
    width: 44px; height: 44px; padding: 0; justify-content: center; border-radius: 50%;
  }
  .fotorama--fullscreen .h2o-gal-plein .h2o-gal-libelle,
  .fotorama--fullscreen .h2o-gal-plein .h2o-gal-ouvrir { display: none; }
  .fotorama--fullscreen .h2o-gal-plein .h2o-gal-fermer { display: block; width: 20px; height: 20px; }
  .fotorama--fullscreen .h2o-gal-compteur { top: 18px; left: 12px; }
}