/* WakeUp Elements featured-video replacement. */
.wue-featured-video {
	position: relative;
	width: 100%;
	max-width: 100%;
	min-width: 0;
	margin: 0;
	background: #0b0d12;
	border-radius: inherit;
	overflow: hidden;
	isolation: isolate;
}

.wue-featured-video__ratio {
	position: relative;
	width: 100%;
	aspect-ratio: var(--wue-video-ratio, 16 / 9);
	min-height: 0;
	overflow: hidden;
	background: #0b0d12;
}

.wue-featured-video__ratio > iframe,
.wue-featured-video__ratio > video,
.wue-featured-video__ratio > embed,
.wue-featured-video__ratio > object,
.wue-featured-video__ratio > .wp-video,
.wue-featured-video__ratio > .wp-video-shortcode,
.wue-featured-video__ratio > div:only-child {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	max-width: none !important;
	max-height: none !important;
	margin: 0 !important;
	border: 0 !important;
}

.wue-featured-video__ratio video,
.wue-featured-video__ratio iframe,
.wue-featured-video__ratio embed,
.wue-featured-video__ratio object {
	display: block;
	width: 100% !important;
	height: 100% !important;
	border: 0 !important;
}

/* X/Instagram official blockquote embeds need their own natural content box. */
.wue-featured-video.is-provider-x .wue-featured-video__ratio:has(blockquote),
.wue-featured-video.is-provider-instagram .wue-featured-video__ratio:has(blockquote),
.wue-featured-video.is-provider-facebook .wue-featured-video__ratio:has(.fb-video) {
	aspect-ratio: auto;
	min-height: 360px;
	overflow: auto;
}

.wue-featured-video.is-provider-x .wue-featured-video__ratio > blockquote,
.wue-featured-video.is-provider-instagram .wue-featured-video__ratio > blockquote,
.wue-featured-video.is-provider-facebook .wue-featured-video__ratio > .fb-video {
	width: 100% !important;
	max-width: 100% !important;
	margin: 0 auto !important;
}

.wue-featured-video.is-single,
.wue-featured-video.is-elementor,
.wue-featured-video.is-builder,
.wue-featured-video.is-block,
.wue-featured-video.is-editorial {
	border-radius: 8px;
}

.wue-featured-video.is-single.is-ratio-9-16,
.wue-featured-video.is-single.is-ratio-4-5,
.wue-featured-video.is-single.is-ratio-1-1 {
	width: min(100%, 620px);
	margin-inline: auto;
}

html.dark-mode .wue-featured-video,
html.dark-mode .wue-featured-video__ratio {
	background: #111318 !important;
}

/* Sticky player: the same DOM/player is repositioned, therefore playback does not restart. */
.wue-featured-video__placeholder {
	display: none;
	width: 100%;
	background: transparent;
}

@media (min-width: 768px) {
	.wue-featured-video.is-single.is-wue-sticky {
		position: fixed !important;
		right: max(22px, env(safe-area-inset-right)) !important;
		bottom: max(22px, env(safe-area-inset-bottom)) !important;
		left: auto !important;
		top: auto !important;
		z-index: 2147482000 !important;
		width: min(420px, calc(100vw - 44px)) !important;
		max-height: min(72vh, 520px) !important;
		margin: 0 !important;
		border-radius: 12px !important;
		box-shadow: 0 22px 65px rgba(0,0,0,.42), 0 0 0 1px rgba(255,255,255,.12) !important;
		animation: wueVideoFloatIn .22s ease-out both;
	}
	.wue-featured-video.is-single.is-wue-sticky.is-ratio-9-16,
	.wue-featured-video.is-single.is-wue-sticky.is-ratio-4-5 {
		width: min(280px, calc(100vw - 44px)) !important;
	}
	.wue-featured-video.is-single.is-wue-sticky .wue-featured-video__ratio {
		max-height: min(72vh, 520px);
	}
}

@media (max-width: 767px) {
	/* Keep article content below the fixed mobile player instead of hiding it underneath. */
	body.wue-has-sticky-video-mobile {
		padding-top: calc(var(--wue-body-base-padding-top, 0px) + var(--wue-sticky-video-height, 0px)) !important;
	}
	.wue-featured-video,
	.wue-featured-video__ratio {
		width: 100%;
		max-width: 100%;
	}
	.wue-featured-video.is-single.is-wue-sticky {
		position: fixed !important;
		top: 0 !important;
		left: 0 !important;
		right: 0 !important;
		bottom: auto !important;
		z-index: 2147482000 !important;
		width: 100vw !important;
		max-width: 100vw !important;
		margin: 0 !important;
		border-radius: 0 !important;
		box-shadow: 0 10px 30px rgba(0,0,0,.28) !important;
		animation: wueVideoMobileIn .2s ease-out both;
	}
	.wue-featured-video.is-single.is-wue-sticky.is-ratio-9-16,
	.wue-featured-video.is-single.is-wue-sticky.is-ratio-4-5 {
		width: min(58vw, 330px) !important;
		left: 50% !important;
		right: auto !important;
		transform: translateX(-50%);
	}
}

@keyframes wueVideoFloatIn { from { opacity: 0; transform: translateY(14px) scale(.97); } to { opacity: 1; transform: none; } }
@keyframes wueVideoMobileIn { from { opacity: 0; transform: translateY(-12px); } to { opacity: 1; transform: none; } }

/* Archive/card players are opt-in and retain the exact media slot. */
.wue-featured-video.is-card,
.wue3-image .wue-featured-video,
.wakeup-elements-dynamic-image .wue-featured-video,
.wakeup-elements-image .wue-featured-video,
.wue212-media .wue-featured-video,
.wue24-story-media .wue-featured-video {
	width: 100%;
	height: 100%;
	border-radius: inherit;
}

.wue3-image .wue-featured-video__ratio,
.wakeup-elements-dynamic-image .wue-featured-video__ratio,
.wakeup-elements-image .wue-featured-video__ratio,
.wue212-media .wue-featured-video__ratio,
.wue24-story-media .wue-featured-video__ratio {
	height: 100%;
	aspect-ratio: inherit;
}

.wue212-card-image-link.has-video,
.wue212-lead-media.has-video,
.wue212-archive-slide-media.has-video,
.wue212-single-media:has(.wue-featured-video),
.wue24-story-media.has-video,
.wue26-contextual-media.has-video,
.wue3-editorial-image.has-video,
.wue3-recipe-image.has-video {
	position: relative;
	display: block;
	min-width: 0;
	overflow: hidden;
	background: #0b0d12;
}

.wue212-card-image-link.has-video,
.wue212-card-image-link.has-video .wue-featured-video,
.wue212-card-image-link.has-video .wue-featured-video__ratio,
.wue212-lead-media.has-video .wue-featured-video,
.wue212-lead-media.has-video .wue-featured-video__ratio,
.wue212-archive-slide-media.has-video .wue-featured-video,
.wue212-archive-slide-media.has-video .wue-featured-video__ratio,
.wue212-single-media .wue-featured-video,
.wue212-single-media .wue-featured-video__ratio,
.wue24-story-media.has-video .wue-featured-video,
.wue24-story-media.has-video .wue-featured-video__ratio,
.wue26-contextual-media.has-video .wue-featured-video,
.wue26-contextual-media.has-video .wue-featured-video__ratio,
.wue3-editorial-image.has-video .wue-featured-video,
.wue3-editorial-image.has-video .wue-featured-video__ratio,
.wue3-recipe-image.has-video .wue-featured-video,
.wue3-recipe-image.has-video .wue-featured-video__ratio {
	width: 100%;
	height: 100%;
	aspect-ratio: auto;
	border-radius: inherit;
}

.wue212-card-image-link.has-video { position: absolute; inset: 0; }
.wue212-lead-media.has-video,
.wue212-lead-media.has-video .wue-featured-video { position: absolute; inset: 0; }
.wue212-lead-slide:has(.wue212-lead-media.has-video) .wue212-lead-overlay { pointer-events: none; }
.wue212-lead-slide:has(.wue212-lead-media.has-video) .wue212-lead-overlay a,
.wue212-lead-slide:has(.wue212-lead-media.has-video) .wue212-lead-overlay button { pointer-events: auto; }
.wue212-single-media:has(.wue-featured-video),
.wue212-archive-slide-media.has-video { min-height: 0; aspect-ratio: var(--wue-video-ratio,16 / 9); }
.wue24-story-media.has-video::after,
.wue210-video-showcase .wue24-story-media.has-video::after,
.wue211-video-block .wue24-story-media.has-video::after { display: none !important; }
.wue26-contextual-media.has-video iframe,
.wue26-contextual-media.has-video video { pointer-events: none; }
.wue212-card-media > .wue212-badge,
.wue24-story-media > .wue24-card-badge,
.wue3-editorial-image.has-video > .wue3-section-badge,
.wue3-recipe-image.has-video > .wue3-section-badge { position: absolute; z-index: 3; }

.wue212-single-media:has(.wue-featured-video.is-ratio-9-16),
.wue212-single-media:has(.wue-featured-video.is-ratio-4-5),
.wue212-single-media:has(.wue-featured-video.is-ratio-1-1) {
	aspect-ratio: auto;
	display: grid;
	place-items: center;
}


/* -------------------------------------------------------------------------
 * Videó tartalomtípus-jelölő a főkép-alapú kártyákon és blokkokon.
 * A jelölő nem gomb: a meglévő kép/cikk linkje marad a kattintható felület.
 * ---------------------------------------------------------------------- */
.wue-video-thumbnail {
	position: relative;
	display: block;
	width: 100%;
	height: 100%;
	min-width: 0;
	overflow: hidden;
}

.wue-video-thumbnail > a {
	display: block;
	width: 100%;
	height: 100%;
}

.wue-video-thumbnail img,
.wue-video-thumbnail picture,
.wue-video-thumbnail picture img {
	display: block;
	width: 100%;
}

.wue-video-background-thumbnail {
	position: relative;
}

.wue-video-background-thumbnail > .wue-video-play-badge {
	z-index: 6;
}

/* A régebbi, blokkspecifikus play pszeudoikon helyett csak az egységes jelölő maradjon. */
.wue210-video-showcase .wue24-story-media:has(.wue-video-play-badge)::after,
.wue211-video-block .wue24-story-media:has(.wue-video-play-badge)::after {
	display: none !important;
}

.wue-video-play-badge {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 12;
	display: grid;
	place-items: center;
	width: clamp(42px, 12%, 68px);
	aspect-ratio: 1;
	border: 1px solid rgba(255,255,255,.72);
	border-radius: 999px;
	background: rgba(8,10,15,.78);
	color: #fff;
	box-shadow: 0 8px 28px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.08);
	transform: translate(-50%, -50%);
	transition: transform .18s ease, background-color .18s ease, box-shadow .18s ease;
	pointer-events: none;
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
}

.wue-video-play-badge svg {
	display: block;
	width: 43%;
	height: 43%;
	fill: currentColor;
	transform: translateX(5%);
}

.wue-video-thumbnail:hover .wue-video-play-badge,
a:hover > .wue-video-thumbnail .wue-video-play-badge,
[role="link"]:hover .wue-video-play-badge {
	background: rgba(0,0,0,.9);
	box-shadow: 0 10px 34px rgba(0,0,0,.4), inset 0 0 0 1px rgba(255,255,255,.16);
	transform: translate(-50%, -50%) scale(1.06);
}

/* Thumbnail méretű oldalsávokban ne takarja ki a képet. */
.wue212-sidebar-image .wue-video-play-badge,
.wue26-contextual-media .wue-video-play-badge,
.wue-smart-search-results .wue-video-play-badge {
	width: clamp(30px, 34%, 44px);
}

@media (max-width: 767px) {
	.wue-video-play-badge {
		width: clamp(38px, 14%, 58px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.wue-video-play-badge {
		transition: none;
	}
}
