/* DT Grid WooCommerce · Video destacado (grilla y ficha del producto). */

/* Ficha del producto: la capa de video cubre la primera imagen de la galería. */
.woocommerce-product-gallery__image.dtgw-con-video { position: relative; }
.dtgw-con-video > .dtgw-video {
	position: absolute;
	inset: 0;
	z-index: 3;
	background: #000;
}

/* Portada + botón de reproducir (común) */
.dtgw-video { overflow: hidden; }
.dtgw-video .dtgw-video-play {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: #111;
	cursor: pointer;
	box-shadow: none;
}
.dtgw-video .dtgw-video-poster {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	margin: 0;
	border-radius: 0;
	object-fit: cover;
	transition: transform .3s ease, opacity .2s ease;
}
.dtgw-video .dtgw-video-play::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, .35));
	pointer-events: none;
}
/* Botón «Ver video»: píldora en la esquina inferior derecha, para no tapar el título de la portada. */
.dtgw-video .dtgw-video-cta {
	--dtgw-play: var(--dt-secondary, #a855f7);
	position: absolute;
	right: 14px;
	bottom: 14px;
	z-index: 1;
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 5px 16px 5px 5px;
	border-radius: 999px;
	background: #fff;
	color: var(--dt-dark, #1b0d34);
	font-family: inherit;
	font-size: 15px;
	font-weight: 700;
	line-height: 1;
	letter-spacing: .01em;
	white-space: nowrap;
	box-shadow: 0 8px 24px rgba(0, 0, 0, .35), 0 0 0 3px rgba(255, 255, 255, .35);
	transition: transform .18s ease, background-color .18s ease, color .18s ease;
}
.dtgw-video .dtgw-video-icono {
	position: relative;
	display: grid;
	place-items: center;
	flex: none;
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background: var(--dtgw-play);
}
/* Pulso para llamar la atención */
.dtgw-video .dtgw-video-icono::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 50%;
	background: var(--dtgw-play);
	opacity: .55;
	animation: dtgw-pulso 1.8s ease-out infinite;
}
.dtgw-video .dtgw-video-icono svg { position: relative; width: 18px; height: 18px; margin-left: 3px; fill: #fff; }
@keyframes dtgw-pulso {
	0% { transform: scale(1); opacity: .55; }
	100% { transform: scale(1.9); opacity: 0; }
}
.dtgw-video .dtgw-video-play:hover .dtgw-video-cta,
.dtgw-video .dtgw-video-play:focus-visible .dtgw-video-cta { transform: scale(1.06); background: var(--dtgw-play); color: #fff; }
.dtgw-video .dtgw-video-play:hover .dtgw-video-icono,
.dtgw-video .dtgw-video-play:focus-visible .dtgw-video-icono { background: #fff; }
.dtgw-video .dtgw-video-play:hover .dtgw-video-icono svg,
.dtgw-video .dtgw-video-play:focus-visible .dtgw-video-icono svg { fill: var(--dtgw-play); }
.dtgw-video .dtgw-video-play:hover .dtgw-video-poster { transform: scale(1.03); }
.dtgw-video .dtgw-video-play:focus-visible { outline: 3px solid var(--dt-primary, #7c3aed); outline-offset: -3px; }

.dtgw-video .dtgw-video-player {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	max-width: none;
	margin: 0;
	border: 0;
	background: #000;
	object-fit: contain;
}

/* Móvil: botón más compacto */
@media (max-width: 560px) {
	.dtgw-video .dtgw-video-cta { right: 10px; bottom: 10px; gap: 8px; padding: 4px 13px 4px 4px; font-size: 14px; }
	.dtgw-video .dtgw-video-icono { width: 34px; height: 34px; }
	.dtgw-video .dtgw-video-icono svg { width: 15px; height: 15px; }
}
@media (prefers-reduced-motion: reduce) {
	.dtgw-video .dtgw-video-poster, .dtgw-video .dtgw-video-cta { transition: none; }
	.dtgw-video .dtgw-video-icono::before { animation: none; display: none; }
}