/* Layout shared by the native fallback and the lazy Video.js custom elements. */
.fapyx-player-shell { position: relative; width: 100%; height: 100%; min-width: 0; background: #000; color: #fff; }
.fapyx-player-shell media-i18n,
.fapyx-player-shell fapyx-video-player { display: contents; }
.fapyx-video-skin { display: block; width: 100%; height: 100%; --media-accent-color: #ff4d8d; --media-accent-text-color: #fff; --media-border-radius: 0; }
.fapyx-player-shell video { display: block; width: 100%; height: 100%; object-fit: contain; }
.fapyx-gallery-video { width: 100%; height: min(78vh, 540px); min-height: 220px; background: #000; }
.gslide-inline:has(.fapyx-gallery-video) { max-width: calc(100vw - 32px); background: #000; }
.gslide-inline:has(.fapyx-gallery-video) .ginlined-content { padding: 0; overflow: visible; }
/* Keep gallery controls composited above WebKit's video layer after a slide change. */
.glightbox-container .gslider { isolation: isolate; }
.glightbox-container:has(.fapyx-gallery-video) .gnext,
.glightbox-container:has(.fapyx-gallery-video) .gprev,
.glightbox-container:has(.fapyx-gallery-video) .gclose { transform: translateZ(0); }
.glightbox-container:has(.fapyx-gallery-video) .glightbox-counter { transform: translateX(-50%) translateZ(0); }
@media (max-width: 600px) {
  .fapyx-gallery-video { height: 70vh; }
  .gslide-inline:has(.fapyx-gallery-video) { max-width: 100vw; }
  .glightbox-container:has(.fapyx-gallery-video) .gnext,
  .glightbox-container:has(.fapyx-gallery-video) .gprev { top: auto; bottom: 12px; }
}