/* DELPHI 025: mobil Hinweise im sichtbaren Viewport am oberen Rand statt in Seitenmitte. */
@media (max-width: 767px) {
  .seasonal-popup:not([hidden]),
  .event-detail-overlay:not([hidden]) {
    position: fixed !important;
    inset: 0 !important;
    width: 100% !important;
    height: 100vh !important;
    height: 100dvh !important;
    display: flex !important;
    justify-content: center !important;
    align-items: flex-start !important;
    box-sizing: border-box !important;
    padding: max(12px, env(safe-area-inset-top, 0px)) 12px calc(16px + env(safe-area-inset-bottom, 0px)) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
  .seasonal-popup[hidden], .event-detail-overlay[hidden] { display: none !important; }
  .seasonal-popup-backdrop, .event-detail-shade {
    position: fixed !important;
    inset: 0 !important;
  }
  .seasonal-popup-dialog, .event-detail-panel {
    position: relative;
    margin: 0 auto;
    width: min(100%, 460px);
    flex: 0 1 460px;
    max-height: calc(100dvh - 24px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
  }
  .seasonal-popup-media { min-height: 130px; }
  .seasonal-popup-copy { padding: 18px 18px 20px; }
  .seasonal-popup-close { position: absolute; top: 8px; right: 8px; }
}