/* Keep core's image controls and sizing; animate the complete visible surface. */
.wp-lightbox-overlay.vaula-lightbox.zoom.active {
	animation: vaula-lightbox-in .3s ease-out both;
}
.wp-lightbox-overlay.vaula-lightbox.zoom.active .lightbox-image-container {
	animation: vaula-lightbox-image-in .3s ease-out both;
}
.wp-lightbox-overlay.vaula-lightbox.zoom .scrim {
	animation: none;
}
.wp-lightbox-overlay.vaula-lightbox.zoom.show-closing-animation:not(.active) {
	animation: vaula-lightbox-out .22s ease-in both;
	pointer-events: none;
}
.wp-lightbox-overlay.vaula-lightbox.zoom.show-closing-animation:not(.active) .lightbox-image-container {
	animation: vaula-lightbox-image-out .22s ease-in both;
}
/* Reveal the inline image when the returning enlarged image reaches it. */
.wp-lightbox-container img.show {
	animation-duration: .22s;
}
@keyframes vaula-lightbox-in {
	from { opacity: 0; }
	to { opacity: 1; }
}
@keyframes vaula-lightbox-out {
	from { opacity: 1; visibility: visible; }
	to { opacity: 0; visibility: hidden; }
}
@keyframes vaula-lightbox-image-in {
	from { transform: translate(calc((-100vw + var(--wp--lightbox-scrollbar-width))/2 + var(--wp--lightbox-initial-left-position)), calc(-50vh + var(--wp--lightbox-initial-top-position))) scale(var(--wp--lightbox-scale)); }
	to { transform: translate(-50%, -50%) scale(1); }
}
@keyframes vaula-lightbox-image-out {
	from { transform: translate(-50%, -50%) scale(1); }
	to { transform: translate(calc((-100vw + var(--wp--lightbox-scrollbar-width))/2 + var(--wp--lightbox-initial-left-position)), calc(-50vh + var(--wp--lightbox-initial-top-position))) scale(var(--wp--lightbox-scale)); }
}
@media (prefers-reduced-motion: reduce) {
	.wp-lightbox-overlay.vaula-lightbox.zoom.active,
	.wp-lightbox-overlay.vaula-lightbox.zoom.active .lightbox-image-container,
	.wp-lightbox-overlay.vaula-lightbox.zoom.show-closing-animation:not(.active),
	.wp-lightbox-overlay.vaula-lightbox.zoom.show-closing-animation:not(.active) .lightbox-image-container {
		animation: none;
	}
	.wp-lightbox-overlay.vaula-lightbox.zoom.show-closing-animation:not(.active) {
		visibility: hidden;
	}
}

/* Scale the image independently; page scale and close controls stay fixed. */
.wp-lightbox-overlay.vaula-lightbox .lightbox-image-container {
	touch-action: none;
	cursor: zoom-in;
}
.wp-lightbox-overlay.vaula-lightbox .lightbox-image-container > figure {
	transform: translate(var(--vaula-image-x, 0px), var(--vaula-image-y, 0px)) scale(var(--vaula-image-scale, 1));
	transform-origin: center;
}
.wp-lightbox-overlay.vaula-lightbox.vaula-image-zoomed .lightbox-image-container {
	overflow: visible;
	cursor: grab;
}
.vaula-lightbox-zoom {
	position: absolute;
	left: 50%;
	bottom: calc(16px + env(safe-area-inset-bottom, 0px));
	transform: translateX(-50%);
	z-index: 5000000;
	display: flex;
	align-items: center;
	gap: .25rem;
	padding: .25rem;
	border-radius: .65rem;
	background: rgba(255, 255, 255, .08);
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
}
.wp-lightbox-overlay .vaula-lightbox-zoom button {
	min-width: 44px;
	min-height: 44px;
	padding: .35rem .65rem;
	border: 0;
	border-radius: .45rem;
	background: transparent;
	color: inherit;
	font: inherit;
	font-size: 1rem;
	font-variant-numeric: tabular-nums;
	cursor: pointer;
}
.wp-lightbox-overlay .vaula-lightbox-zoom button:hover,
.wp-lightbox-overlay .vaula-lightbox-zoom button:focus-visible {
	background: rgba(255, 255, 255, .1);
	outline: 2px solid var(--wp--preset--color--accent-2, #67ff71);
	outline-offset: -2px;
}
.wp-lightbox-overlay .vaula-lightbox-zoom button:disabled {
	opacity: .35;
	cursor: default;
}
