/* hp-rogon.de – Online-Terminmodal (Fancybox iframe)
   Ziel: auf Mobilgeraeten nahezu die komplette sichtbare Browserhoehe nutzen,
   auf Desktop gross genug fuer die Buchungsschritte bleiben und internes
   Scrollen des externen Terminmoduls nicht abschneiden. */

.termin-fancybox .fancybox-slide--iframe {
  padding: 54px 18px 18px;
}

.termin-fancybox .fancybox-slide--iframe .fancybox-content {
  width: 680px !important;
  height: 860px !important;
  max-width: calc(100vw - 36px) !important;
  max-height: calc(100vh - 72px) !important;
  max-height: calc(100dvh - 72px) !important;
  padding: 0 !important;
  overflow: hidden !important;
  border-radius: 12px;
  background: #fff;
}

.termin-fancybox .fancybox-iframe {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  border: 0 !important;
  background: #fff;
}

/* Schliessen bleibt unabhaengig vom iframe oben rechts erreichbar. */
.termin-fancybox .fancybox-toolbar {
  top: max(4px, env(safe-area-inset-top));
  right: max(4px, env(safe-area-inset-right));
}

.termin-fancybox .fancybox-button--close {
  width: 46px;
  height: 46px;
}

@media (max-width: 767.98px) {
  .termin-fancybox .fancybox-slide--iframe {
    padding-top: calc(50px + env(safe-area-inset-top));
    padding-right: max(8px, env(safe-area-inset-right));
    padding-bottom: max(8px, env(safe-area-inset-bottom));
    padding-left: max(8px, env(safe-area-inset-left));
  }

  .termin-fancybox .fancybox-slide--iframe .fancybox-content {
    width: 100% !important;
    height: calc(100vh - 58px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
    height: calc(100dvh - 58px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
    max-width: none !important;
    max-height: none !important;
    border-radius: 10px;
  }

  .termin-fancybox .fancybox-bg {
    opacity: .94;
  }
}

@media (max-height: 620px) and (orientation: landscape) {
  .termin-fancybox .fancybox-slide--iframe {
    padding-top: calc(46px + env(safe-area-inset-top));
    padding-bottom: max(6px, env(safe-area-inset-bottom));
  }

  .termin-fancybox .fancybox-slide--iframe .fancybox-content {
    height: calc(100vh - 52px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
    height: calc(100dvh - 52px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
  }
}