.vida-video-player {
	position: relative;
	width: 100%;
	max-width: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: #000;
	border-radius: 8px;
}

.vida-video-player__video {
	position: relative;
	z-index: 2;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	background: transparent;
}

.vida-video-player__blur {
	display: none;
	position: absolute;
	inset: -30px;
	z-index: 1;
	background-position: center;
	background-size: cover;
	background-repeat: no-repeat;
	filter: blur(28px) brightness(0.55);
	transform: scale(1.12);
	pointer-events: none;
}

.vida-video-player.is-vertical .vida-video-player__blur {
	display: block;
}

.vida-video-player.is-vertical .vida-video-player__video {
	object-fit: contain;
}

.vida-video-player.is-square {
	aspect-ratio: 1 / 1;
}

.vida-video-player.is-horizontal {
	aspect-ratio: 16 / 9;
}

@media (max-width: 768px) {
	.vida-video-player {
		border-radius: 0;
	}

	.vida-video-player.is-vertical {
		aspect-ratio: 16 / 9;
	}
}

@media (orientation: landscape) and (max-height: 600px) {
	.vida-video-player {
		max-height: 100vh;
	}
}

@media (min-width: 1024px) {
	.vida-video-player {
		width: 85%;
		margin-left: auto;
		margin-right: auto;
	}
}

@media (max-width: 1023px) {
	.vida-video-player {
		width: 100%;
	}
}

.vida-video-player__title {
	width: 85%;
	margin: 14px auto 0;
	font-size: 28px;
	line-height: 1.2;
	font-weight: 700;
}

@media (max-width: 1023px) {
	.vida-video-player__title {
		width: 100%;
		font-size: 22px;
		padding: 0 12px;
	}
}

.page-id-28 .entry-title,
.page-id-28 .page-title {
	display: none !important;
}

.single-post .vida-video-player {
	width: 100%;
	margin-left: 0;
	margin-right: 0;
}

.single-post .vida-video-player__title {
	width: 100%;
	margin-left: 0;
	margin-right: 0;
}

@media (min-width: 1024px) {
	.single-post .vida-video-player {
		width: 100%;
		height: calc(100dvh - 160px);
		max-height: 720px;
		aspect-ratio: auto;
		margin-left: 0;
		margin-right: 0;
	}

	.single-post .vida-video-player__video {
		width: 100%;
		height: 100%;
		object-fit: contain;
	}
}

.vida-video-player__quality-wrap {
	position: absolute;
	right: 12px;
	bottom: 52px;
	z-index: 5;
}

.vida-video-player__quality {
	min-width: 82px;
	height: 32px;
	padding: 0 8px;
	border: 1px solid rgba(255, 255, 255, 0.35);
	border-radius: 6px;
	background: rgba(0, 0, 0, 0.72);
	color: #fff;
	font-size: 14px;
	cursor: pointer;
}

.vida-video-player__quality:focus {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

@media (max-width: 768px) {
	.vida-video-player__quality-wrap {
		right: 8px;
		bottom: 48px;
	}

	.vida-video-player__quality {
		min-width: 74px;
		height: 30px;
		font-size: 13px;
	}
}

.vida-video-player__controls {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 10;
	padding: 8px 14px 10px;
	background: linear-gradient(
		to top,
		rgba(0,0,0,.88),
		rgba(0,0,0,.28),
		transparent
	);
	color: #fff;
}

.vida-video-player__progress-wrap {
	width: 100%;
	margin-bottom: 6px;
}

.vida-video-player__progress {
	display: block;
	width: 100%;
	height: 4px;
	margin: 0;
	cursor: pointer;
	accent-color: #fff;
}

.vida-video-player__controls-row,
.vida-video-player__controls-left,
.vida-video-player__controls-right {
	display: flex;
	align-items: center;
}

.vida-video-player__controls-row {
	justify-content: space-between;
	gap: 12px;
}

.vida-video-player__controls-left,
.vida-video-player__controls-right {
	gap: 10px;
}

.vida-video-player__controls button {
	border: 0;
	padding: 4px;
	background: transparent;
	color: #fff;
	font-size: 18px;
	line-height: 1;
	cursor: pointer;
}

.vida-video-player__back10,
.vida-video-player__forward10 {
	font-size: 14px !important;
}

.vida-video-player__time {
	white-space: nowrap;
	font-size: 14px;
	font-weight: 500;
}

.vida-video-player__quality {
	width: auto;
	min-width: 58px;
	height: 30px;
	padding: 0 4px;
	border: 0;
	background: transparent;
	color: #fff;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}

.vida-video-player__quality option {
	background: #111;
	color: #fff;
}

@media (max-width: 768px) {
	.vida-video-player__controls {
		padding: 7px 9px 9px;
	}

	.vida-video-player__controls-left,
	.vida-video-player__controls-right {
		gap: 7px;
	}

	.vida-video-player__controls button {
		font-size: 16px;
	}

	.vida-video-player__time,
	.vida-video-player__quality {
		font-size: 12px;
	}
}

/* Vida Video: normalización visual entre navegadores */
.vida-video-player {
	color-scheme: dark;
}

.vida-video-player button,
.vida-video-player input,
.vida-video-player select {
	font: inherit;
	box-sizing: border-box;
}

.vida-video-player__controls {
	color-scheme: dark;
}

.vida-video-player__quality {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;

	min-width: 74px;
	height: 30px;
	margin: 0;
	padding: 0 24px 0 8px;

	border: 1px solid rgba(255,255,255,.28);
	border-radius: 6px;

	background-color: rgba(20,20,20,.92);
	color: #fff;

	font-family: inherit;
	font-size: 14px;
	font-weight: 600;
	line-height: 30px;

	cursor: pointer;

	background-image:
		linear-gradient(45deg, transparent 50%, #fff 50%),
		linear-gradient(135deg, #fff 50%, transparent 50%);
	background-position:
		calc(100% - 11px) 12px,
		calc(100% - 7px) 12px;
	background-size: 4px 4px, 4px 4px;
	background-repeat: no-repeat;
}

.vida-video-player__quality:hover {
	background-color: rgba(32,32,32,.96);
}

.vida-video-player__quality:focus {
	outline: 2px solid rgba(255,255,255,.9);
	outline-offset: 2px;
}

.vida-video-player__quality option {
	background: #181818;
	color: #fff;
	font-family: inherit;
}


/* =========================================================
   Vida Video — progreso visual + controles automáticos
   ========================================================= */

.vida-video-player {
	--vida-player-accent: #168cff;
	--vida-player-track: rgba(255,255,255,.28);
}

/*
 * Transición de los controles.
 */
.vida-video-player__controls {
	opacity: 1;
	visibility: visible;
	transform: translateY(0);
	transition:
		opacity .22s ease,
		visibility .22s ease,
		transform .22s ease;
}

/*
 * Durante la reproducción, al no existir actividad,
 * player.js añade esta clase.
 */
.vida-video-player--controls-hidden
.vida-video-player__controls {
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	pointer-events: none;
}

/*
 * También ocultamos el cursor cuando la interfaz
 * desaparece para dejar el video completamente limpio.
 */
.vida-video-player--controls-hidden {
	cursor: none;
}

/*
 * Barra de progreso base.
 */
.vida-video-player__progress {
	--vida-progress: 0%;

	-webkit-appearance: none;
	appearance: none;

	display: block;
	width: 100%;
	height: 4px;
	margin: 0;
	padding: 0;

	border: 0;
	border-radius: 999px;

	background:
		linear-gradient(
			to right,
			var(--vida-player-accent) 0%,
			var(--vida-player-accent) var(--vida-progress),
			var(--vida-player-track) var(--vida-progress),
			var(--vida-player-track) 100%
		);

	cursor: pointer;
	outline: none;
}

/*
 * Chrome / Edge / Safari.
 */
.vida-video-player__progress::-webkit-slider-runnable-track {
	width: 100%;
	height: 4px;
	border: 0;
	border-radius: 999px;
	background: transparent;
}

.vida-video-player__progress::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;

	width: 14px;
	height: 14px;
	margin-top: -5px;

	border: 2px solid #fff;
	border-radius: 50%;

	background: var(--vida-player-accent);

	box-shadow: 0 1px 5px rgba(0,0,0,.45);

	cursor: pointer;

	transition:
		transform .15s ease,
		box-shadow .15s ease;
}

.vida-video-player__progress:hover::-webkit-slider-thumb {
	transform: scale(1.12);
	box-shadow: 0 1px 7px rgba(0,0,0,.55);
}

/*
 * Firefox.
 */
.vida-video-player__progress::-moz-range-track {
	height: 4px;
	border: 0;
	border-radius: 999px;
	background: var(--vida-player-track);
}

.vida-video-player__progress::-moz-range-progress {
	height: 4px;
	border-radius: 999px;
	background: var(--vida-player-accent);
}

.vida-video-player__progress::-moz-range-thumb {
	width: 11px;
	height: 11px;

	border: 2px solid #fff;
	border-radius: 50%;

	background: var(--vida-player-accent);

	box-shadow: 0 1px 5px rgba(0,0,0,.45);

	cursor: pointer;
}

/*
 * En dispositivos táctiles damos una zona ligeramente
 * mayor para poder desplazar el progreso cómodamente.
 */
@media (pointer: coarse) {
	.vida-video-player__progress {
		height: 5px;
	}

	.vida-video-player__progress::-webkit-slider-runnable-track {
		height: 5px;
	}

	.vida-video-player__progress::-moz-range-track,
	.vida-video-player__progress::-moz-range-progress {
		height: 5px;
	}
}


/* =========================================================
   Vida Video — VAST pre-roll
   ========================================================= */

.vida-video-player__ad-ui {
	position: absolute;
	z-index: 12;
	top: 12px;
	left: 12px;
	right: 12px;

	display: flex;
	align-items: center;
	justify-content: space-between;

	pointer-events: none;
}

.vida-video-player__ad-ui[hidden] {
	display: none !important;
}

.vida-video-player__ad-label {
	display: inline-flex;
	align-items: center;
	min-height: 27px;
	padding: 4px 9px;

	border: 1px solid rgba(255,255,255,.22);
	border-radius: 5px;

	background: rgba(0,0,0,.72);
	color: #fff;

	font-size: 12px;
	font-weight: 600;
	line-height: 1;

	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
}

.vida-video-player__ad-skip {
	pointer-events: auto;

	min-height: 34px;
	padding: 0 13px;

	border: 1px solid rgba(255,255,255,.35);
	border-radius: 6px;

	background: rgba(0,0,0,.78);
	color: #fff;

	font-size: 13px;
	font-weight: 600;

	cursor: pointer;

	backdrop-filter: blur(5px);
	-webkit-backdrop-filter: blur(5px);
}

.vida-video-player__ad-skip:hover:not(:disabled) {
	background: rgba(20,20,20,.96);
	border-color: rgba(255,255,255,.7);
}

.vida-video-player__ad-skip:disabled {
	opacity: .75;
	cursor: default;
}

.vida-video-player__ad-click {
	position: absolute;
	z-index: 7;
	inset: 0;

	cursor: pointer;
}

.vida-video-player__ad-click[hidden] {
	display: none !important;
}

/*
 * Mientras se reproduce publicidad, ocultar los
 * controles del contenido principal.
 */
.vida-video-player--ad-playing
.vida-video-player__controls,

.vida-video-player--ad-loading
.vida-video-player__controls {
	opacity: 0 !important;
	visibility: hidden !important;
	pointer-events: none !important;
}

/*
 * El video del anuncio ocupa exactamente el mismo
 * espacio que el contenido principal.
 */
.vida-video-player--ad-playing
.vida-video-player__video {
	cursor: pointer;
}

/*
 * Indicador mientras se resuelve el servidor VAST.
 */
.vida-video-player--ad-loading::after {
	content: "Cargando publicidad…";

	position: absolute;
	z-index: 11;
	left: 50%;
	top: 50%;

	transform: translate(-50%, -50%);

	padding: 7px 11px;

	border-radius: 5px;

	background: rgba(0,0,0,.68);
	color: #fff;

	font-size: 13px;
	font-weight: 500;

	pointer-events: none;
}

@media (max-width: 768px) {
	.vida-video-player__ad-ui {
		top: 8px;
		left: 8px;
		right: 8px;
	}

	.vida-video-player__ad-label {
		font-size: 11px;
	}

	.vida-video-player__ad-skip {
		min-height: 32px;
		padding: 0 10px;
		font-size: 12px;
	}
}