/*
 * Intrinsic video aspect ratio — overrides Plyr 3.7.8:
 * .plyr__video-embed { aspect-ratio: 16/9 }
 */

.laf-vimeo-player,
.laf-lightbox-container {
	aspect-ratio: var(--laf-video-aspect-ratio);
	max-height: 90vh;
	width: 100%;
}

.wp-block-laf-vimeo-player.laf-vimeo-player,
.laf-vimeo-player {
	position: relative;
	height: auto;
	overflow: hidden;
	background-color: #000;
}

.laf-lightbox-container {
	position: relative;
	width: min(90vw, 960px);
	height: auto;
}

.laf-lightbox-iframe-wrap {
	position: relative;
	width: 100%;
	height: auto;
}

/* Beat Plyr’s 16:9 embed rule when --laf-video-aspect-ratio is set on an ancestor. */
.laf-vimeo-player .plyr.plyr--video,
.laf-vimeo-player .plyr__video-embed,
.laf-vimeo-player .plyr__video-wrapper,
.laf-lightbox-iframe-wrap .plyr.plyr--video,
.laf-lightbox-iframe-wrap .plyr__video-embed,
.laf-lightbox-iframe-wrap .plyr__video-wrapper {
	aspect-ratio: var(--laf-video-aspect-ratio) !important;
	padding-bottom: 0 !important;
	height: auto !important;
	max-height: 90vh;
	margin: 0 auto;
}

.laf-vimeo-player .plyr--full-ui .plyr__video-embed > .plyr__video-embed__container,
.laf-lightbox-iframe-wrap .plyr--full-ui .plyr__video-embed > .plyr__video-embed__container {
	/*padding-bottom: 0 !important;*/
	/*transform: none !important;*/
	position: relative !important;
	height: 100% !important;
}

.laf-vimeo-player .plyr__video-wrapper,
.laf-lightbox-iframe-wrap .plyr__video-wrapper {
	width: 100%;
}

.laf-vimeo-player .plyr iframe,
.laf-lightbox-iframe-wrap .plyr iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	border: 0;
}

.laf-lightbox-iframe-wrap .laf-plyr-wrap,
.laf-lightbox-iframe-wrap .plyr {
	width: 100%;
	max-height: 90vh;
}

/* --------------------------------------------------------------------------
 * Fullscreen: drop embed constraints so vertical (9:16) Vimeo fills the viewport.
 * (Inline aspect-ratio from JS is cleared on enterfullscreen; these rules back that up.)
 * -------------------------------------------------------------------------- */

.plyr:fullscreen,
.plyr:-webkit-full-screen,
.plyr--fullscreen-fallback {
	width: 100% !important;
	height: 100% !important;
	max-height: none !important;
	aspect-ratio: unset !important;
}

.plyr:fullscreen .plyr__video-wrapper,
.plyr:-webkit-full-screen .plyr__video-wrapper,
.plyr--fullscreen-fallback .plyr__video-wrapper,
.plyr:fullscreen .plyr__video-embed,
.plyr:-webkit-full-screen .plyr__video-embed,
.plyr--fullscreen-fallback .plyr__video-embed,
.plyr:fullscreen .plyr__video-embed__container,
.plyr:-webkit-full-screen .plyr__video-embed__container,
.plyr--fullscreen-fallback .plyr__video-embed__container {
	width: 100% !important;
	height: 100% !important;
	max-height: none !important;
	aspect-ratio: unset !important;
	padding-bottom: 0 !important;
	transform: none !important;
}

.plyr:fullscreen iframe,
.plyr:-webkit-full-screen iframe,
.plyr--fullscreen-fallback iframe {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.laf-vimeo-player:has(.plyr:fullscreen),
.laf-vimeo-player:has(.plyr:-webkit-full-screen),
.laf-vimeo-player:has(.plyr--fullscreen-fallback),
.laf-lightbox-container:has(.plyr:fullscreen),
.laf-lightbox-container:has(.plyr:-webkit-full-screen),
.laf-lightbox-container:has(.plyr--fullscreen-fallback) {
	aspect-ratio: unset !important;
	max-height: none !important;
	height: 100% !important;
	overflow: visible;
}
