.wpvid-video-slide {
	position: relative;
	background: #000;
	cursor: pointer;
}

/* La vignette est une vraie balise <img>, dimensionnée exactement comme
   les autres images de la galerie (nécessaire pour que le carrousel du
   thème calcule correctement la taille de ce slide). */
.wpvid-poster-img {
	display: block;
	width: 100%;
	height: auto;
}

.wpvid-play-btn {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 64px;
	height: 64px;
	padding: 0;
	border: none;
	background: transparent;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
}

.wpvid-play-btn svg {
	width: 100%;
	height: 100%;
	filter: drop-shadow(0 2px 6px rgba(0, 0, 0, 0.4));
}

.wpvid-play-btn:hover svg circle {
	fill: rgba(0, 0, 0, 0.75);
}

/* Badge caméra affiché quand la vignette par défaut (image principale du
   produit) est utilisée, pour signaler clairement "ceci est la vidéo". */
.wpvid-camera-badge {
	position: absolute;
	top: 8px;
	left: 8px;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.6);
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
}

/* Même badge, réappliqué en plus petit sur la miniature générée
   automatiquement par FlexSlider dans la bande du bas (voir
   frontend-gallery.js, qui ajoute cette classe après coup). */
.flex-control-thumbs li {
	position: relative;
}

.flex-control-thumbs .wpvid-thumb-badge {
	position: absolute;
	top: 2px;
	left: 2px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.65);
	display: flex;
	align-items: center;
	justify-content: center;
	pointer-events: none;
}

.flex-control-thumbs .wpvid-thumb-badge svg {
	width: 10px;
	height: 10px;
}

/* Une fois la vidéo lancée, le lecteur natif remplace la vignette. */
.wpvid-player {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
	background: #000;
	object-fit: contain;
}

.wpvid-fallback-wrapper {
	margin: 16px 0;
	max-width: 100%;
}

.wpvid-fallback-wrapper .wpvid-player {
	aspect-ratio: 16 / 9;
	border-radius: 4px;
}
