.awp-has-background-media {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

.awp-has-background-media > :not(.awp-background-media):not(.awp-group-shape) {
	position: relative;
	z-index: 1;
}

/* Core constrained layouts also constrain direct children. The media layer
   belongs to the owning surface, so it must keep the surface's geometry. */
.awp-has-background-media > .awp-background-media,
.awp-section.awp-has-background-media > .awp-background-media {
	width: auto;
	max-width: none;
	margin-inline: 0;
}

.awp-background-media {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	overflow: hidden;
}

.awp-background-media__layer,
.awp-background-media__video,
.awp-background-media__playlist,
.awp-background-media__overlay {
	position: absolute;
	inset: 0;
}

.awp-background-media__layer {
	background-repeat: no-repeat;
}

.awp-background-media__video {
	width: 100%;
	height: 100%;
	opacity: 0;
}

.awp-background-media__video--is-visible {
	opacity: 1;
}

.awp-background-media__poster {
	transition: opacity 180ms linear;
}

.awp-has-background-media[data-awp-background-state="video-active"] .awp-background-media__poster {
	opacity: 0;
}

.awp-background-media__overlay {
	z-index: 2;
}

.awp-has-background-media-fixed .awp-background-media__layer--image {
	background-attachment: fixed;
}

/* Gutenberg has no front-end render filter, so the editor uses the same
   attachment, focal point, fit and overlay data on the block wrapper. This
   selector intentionally works inside both iframed and legacy canvases. */
.awp-has-background-media-preview {
	position: relative;
	isolation: isolate;
	background-image: linear-gradient(var(--awp-background-media-preview-overlay, transparent), var(--awp-background-media-preview-overlay, transparent)), var(--awp-background-media-preview-image, none);
	background-position: center, var(--awp-background-media-preview-position, 50% 50%);
	background-repeat: no-repeat, no-repeat;
	background-size: cover, var(--awp-background-media-preview-fit, cover);
}
.awp-has-background-media-preview > * { position: relative; z-index: 1; }

@media (hover: none), (pointer: coarse), (prefers-reduced-motion: reduce) {
	.awp-has-background-media-fixed .awp-background-media__layer--image {
		background-attachment: scroll !important;
	}
}