/* Mobile image: hidden by default on desktop */
.wp-block-cover.has-mobile-image .wp-block-cover__mobile-image {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: 0;
}

/* On mobile: show mobile image and hide the desktop one */
@media (max-width: 767px) {
	.wp-block-cover.has-mobile-image .wp-block-cover__mobile-image {
		display: block;
	}

	/* Hide the desktop background image (img tag version) */
	.wp-block-cover.has-mobile-image > .wp-block-cover__image-background:not(.wp-block-cover__mobile-image) {
		display: none;
	}

	/* Hide the desktop background image (span/div with background-image, parallax version) */
	.wp-block-cover.has-mobile-image > span.wp-block-cover__image-background:not(.wp-block-cover__mobile-image),
	.wp-block-cover.has-mobile-image > div.wp-block-cover__image-background:not(.wp-block-cover__mobile-image) {
		display: none;
	}

	/* Hide inline background-image on the cover wrapper itself (some themes set it there) */
	.wp-block-cover.has-mobile-image {
		background-image: none !important;
	}
}
