/*
 * Shop/category result transitions. The data hook is emitted around
 * WooCommerce's existing loop by Toga_Catalog_Interactions; no archive
 * template is overridden. Cross-document View Transitions enhance browsers
 * that support them, while catalog-interactions.js supplies a small fallback.
 */

@view-transition {
	navigation: auto;
}

.toga-catalog-results {
	view-transition-name: toga-catalog-results;
}

@media (prefers-reduced-motion: no-preference) {
	.toga-catalog-results {
		transition:
		opacity var(--toga-duration-base) var(--toga-ease),
		transform var(--toga-duration-base) var(--toga-ease);
	}

	.toga-catalog-results.is-leaving {
		pointer-events: none;
		opacity: 0;
		transform: translateY(var(--toga-space-2));
	}

	.toga-catalog-results.is-entering {
		opacity: 0;
		transform: translateY(calc(-1 * var(--toga-space-2)));
	}

	::view-transition-group(toga-catalog-results),
	::view-transition-old(toga-catalog-results),
	::view-transition-new(toga-catalog-results) {
		animation-duration: var(--toga-duration-base);
		animation-timing-function: var(--toga-ease);
	}
}

@media (prefers-reduced-motion: reduce) {
	.toga-catalog-results {
		view-transition-name: none;
	}
}