/* REV9 - Mobile Events viewing space fix (scoped to Events pages only).
   The event picker scrolls normally. Booking and directions are inline, not fixed.
   Portrait video is fully contained in a viewport-aware stage. */
@media (max-width:767px) {
  .events-page { padding-bottom: 0; }

  /* Keep the picker next to its player in normal document flow;
     no extra sticky panel competing with the navigation header. */
  .events-page .events-picker-shell {
    position: static;
    top: auto;
    z-index: auto;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    background: transparent;
    border-bottom: 0;
    margin: 0 0 16px;
    padding: 0;
  }

  /* Full portrait frame stays visible without cropping.
     52vh fallback is for older browsers lacking small viewport units. */
  .events-page .events-detail-media {
    width: 100%;
    height: min(52vh, 440px);
    max-height: 440px;
    min-height: 0;
    overflow: hidden;
    margin-inline: auto;
    scroll-margin-top: calc(var(--events-nav-height) + 12px);
  }
  .events-page .events-detail-media video,
  .events-page .events-detail-media img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 0;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
  }
  /* Restore quick actions at the end of event content, rather than covering
     the media and text at the bottom of every mobile viewport. */
  .events-page .events-mobile-actions {
    position: static;
    inset: auto;
    z-index: auto;
    width: 100%;
    box-shadow: none;
    border-top: 0;
    padding: 14px max(16px, env(safe-area-inset-right)) 18px max(16px, env(safe-area-inset-left));
  }
}
@supports (height: 1svh) {
  @media (max-width:767px) {
    .events-page .events-detail-media { height: min(52svh, 440px); }
  }
}
