/**
 * Quantum Animation Extension — Base Styles
 *
 * Keyframes and utility classes for block animations.
 * CSS variables are injected inline per-block by PHP.
 *
 * @package Quantum
 */

/* ─────────────────────────────────────────────────────────────
   CSS Variable Defaults
   ───────────────────────────────────────────────────────────── */

.quantum-animate {
	--animation-duration: 1s;
	--animation-delay: 0s;
	--animation-distance: 30px;
	--animation-scale: 1.05;
	--scroll-offset: -50px;
	--sequential-delay: 0.2s;
}

/* ─────────────────────────────────────────────────────────────
   Keyframes
   ───────────────────────────────────────────────────────────── */

@keyframes quantumAnimateFadeIn {
	from { opacity: 0; }
	to   { opacity: 1; }
}

@keyframes quantumAnimateFadeInUp {
	from {
		opacity: 0;
		transform: translateY(var(--animation-distance, 30px));
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes quantumAnimateFadeInDown {
	from {
		opacity: 0;
		transform: translateY(calc(var(--animation-distance, 30px) * -1));
	}
	to {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes quantumAnimateFadeInLeft {
	from {
		opacity: 0;
		transform: translateX(calc(var(--animation-distance, 30px) * -1));
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes quantumAnimateFadeInRight {
	from {
		opacity: 0;
		transform: translateX(var(--animation-distance, 30px));
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

@keyframes quantumAnimateZoomIn {
	from {
		opacity: 0;
		transform: scale(calc(1 / var(--animation-scale, 1.05)));
	}
	to {
		opacity: 1;
		transform: scale(1);
	}
}

@keyframes quantumAnimatePulse {
	0%   { transform: scale(1); }
	50%  { transform: scale(var(--animation-scale, 1.05)); }
	100% { transform: scale(1); }
}

/* ─────────────────────────────────────────────────────────────
   Non-scroll (immediate) animations
   ───────────────────────────────────────────────────────────── */

.quantum-animate-fadeIn:not(.quantum-animate-on-scroll) {
	animation: quantumAnimateFadeIn var(--animation-duration, 1s) ease-out var(--animation-delay, 0s) both;
}

.quantum-animate-fadeInUp:not(.quantum-animate-on-scroll) {
	animation: quantumAnimateFadeInUp var(--animation-duration, 1s) ease-out var(--animation-delay, 0s) both;
}

.quantum-animate-fadeInDown:not(.quantum-animate-on-scroll) {
	animation: quantumAnimateFadeInDown var(--animation-duration, 1s) ease-out var(--animation-delay, 0s) both;
}

.quantum-animate-fadeInLeft:not(.quantum-animate-on-scroll) {
	animation: quantumAnimateFadeInLeft var(--animation-duration, 1s) ease-out var(--animation-delay, 0s) both;
}

.quantum-animate-fadeInRight:not(.quantum-animate-on-scroll) {
	animation: quantumAnimateFadeInRight var(--animation-duration, 1s) ease-out var(--animation-delay, 0s) both;
}

.quantum-animate-zoomIn:not(.quantum-animate-on-scroll) {
	animation: quantumAnimateZoomIn var(--animation-duration, 1s) ease-out var(--animation-delay, 0s) both;
}

.quantum-animate-pulse:not(.quantum-animate-on-scroll) {
	animation: quantumAnimatePulse var(--animation-duration, 1s) ease-in-out var(--animation-delay, 0s) both;
}

/* ─────────────────────────────────────────────────────────────
   Scroll-triggered animations
   Initial hidden state
   ───────────────────────────────────────────────────────────── */

.quantum-animate-fadeIn.quantum-animate-on-scroll:not(.quantum-animated),
.quantum-animate-fadeInUp.quantum-animate-on-scroll:not(.quantum-animated),
.quantum-animate-fadeInDown.quantum-animate-on-scroll:not(.quantum-animated),
.quantum-animate-fadeInLeft.quantum-animate-on-scroll:not(.quantum-animated),
.quantum-animate-fadeInRight.quantum-animate-on-scroll:not(.quantum-animated),
.quantum-animate-zoomIn.quantum-animate-on-scroll:not(.quantum-animated),
.quantum-animate-pulse.quantum-animate-on-scroll:not(.quantum-animated) {
	opacity: 0;
}

/* Triggered state (JS adds .quantum-animated) */

.quantum-animate-fadeIn.quantum-animate-on-scroll.quantum-animated {
	animation: quantumAnimateFadeIn var(--animation-duration, 1s) ease-out var(--animation-delay, 0s) both;
}

.quantum-animate-fadeInUp.quantum-animate-on-scroll.quantum-animated {
	animation: quantumAnimateFadeInUp var(--animation-duration, 1s) ease-out var(--animation-delay, 0s) both;
}

.quantum-animate-fadeInDown.quantum-animate-on-scroll.quantum-animated {
	animation: quantumAnimateFadeInDown var(--animation-duration, 1s) ease-out var(--animation-delay, 0s) both;
}

.quantum-animate-fadeInLeft.quantum-animate-on-scroll.quantum-animated {
	animation: quantumAnimateFadeInLeft var(--animation-duration, 1s) ease-out var(--animation-delay, 0s) both;
}

.quantum-animate-fadeInRight.quantum-animate-on-scroll.quantum-animated {
	animation: quantumAnimateFadeInRight var(--animation-duration, 1s) ease-out var(--animation-delay, 0s) both;
}

.quantum-animate-zoomIn.quantum-animate-on-scroll.quantum-animated {
	animation: quantumAnimateZoomIn var(--animation-duration, 1s) ease-out var(--animation-delay, 0s) both;
}

.quantum-animate-pulse.quantum-animate-on-scroll.quantum-animated {
	animation: quantumAnimatePulse var(--animation-duration, 1s) ease-in-out var(--animation-delay, 0s) both;
}

/* ─────────────────────────────────────────────────────────────
   Hover animations
   ───────────────────────────────────────────────────────────── */

.quantum-animate-scaleOnHover {
	transition: transform var(--animation-duration, 0.4s) ease;
	transform-origin: center center;
}

.quantum-animate-scaleOnHover:hover {
	transform: scale(var(--animation-scale, 1.05));
}

/* Zoom background on hover (Cover block) */

.quantum-animate-zoomBackgroundOnHover {
	overflow: hidden;
}

.quantum-animate-zoomBackgroundOnHover .wp-block-cover__image-background,
.quantum-animate-zoomBackgroundOnHover .wp-block-cover__video-background {
	transition: transform var(--animation-duration, 0.6s) ease;
}

.quantum-animate-zoomBackgroundOnHover:hover .wp-block-cover__image-background,
.quantum-animate-zoomBackgroundOnHover:hover .wp-block-cover__video-background {
	transform: scale(var(--animation-scale, 1.1));
}

/* ─────────────────────────────────────────────────────────────
   Sequential animation (children stagger)
   ───────────────────────────────────────────────────────────── */

.quantum-animate-sequentially > * {
	opacity: 0;
	animation: none;
}

.quantum-animate-sequentially.quantum-animated > * {
	animation: quantumAnimateFadeInUp var(--animation-duration, 0.6s) ease-out both;
}

/* ─────────────────────────────────────────────────────────────
   Editor preview — prevent hiding blocks in editor
   ───────────────────────────────────────────────────────────── */

.editor-styles-wrapper .quantum-animate-on-scroll:not(.quantum-animated) {
	opacity: 1 !important;
}

.editor-styles-wrapper .quantum-animate-sequentially > * {
	opacity: 1 !important;
}