/**
 * Subtiele beweging voor de hele site (28-09-2026).
 * Alleen transform/opacity (compositor-vriendelijk), geen extra bibliotheken, geen scroll-reveal.
 * Alles staat binnen prefers-reduced-motion: no-preference; base.css neutraliseert het daarnaast.
 */
:root {
	--oz-duration-fast: .16s;
	--oz-duration: .24s;
	--oz-duration-slow: .32s;
	--oz-ease: cubic-bezier(.2, .7, .2, 1);
	--oz-ease-out: cubic-bezier(.16, 1, .3, 1);
}

/* Losse translate/scale-eigenschappen: bestaande transforms (zoals het centreren van het mega-menu met translateX(-50%)) blijven intact. */
@keyframes oz-disclose { from { opacity: 0; translate: 0 -.35rem; } to { opacity: 1; translate: 0 0; } }
@keyframes oz-fade-in { from { opacity: 0; } to { opacity: 1; } }
@keyframes oz-drop-in { from { opacity: 0; translate: 0 -.5rem; } to { opacity: 1; translate: 0 0; } }
@keyframes oz-slide-in-right { from { translate: 100% 0; } to { translate: 0 0; } }
@keyframes oz-pop-in { from { opacity: 0; translate: 0 -.75rem; scale: .985; } to { opacity: 1; translate: 0 0; scale: 1; } }
@keyframes oz-bump { 0% { scale: 1; } 35% { scale: 1.22; } 65% { scale: .94; } 100% { scale: 1; } }

@media (prefers-reduced-motion: no-preference) {
	/* ---------- Accordeons (alle <details>) ---------- */
	details > :not(summary) { transform-origin: top; }
	details[open] > :not(summary) { animation: oz-disclose var(--oz-duration) var(--oz-ease); }
	summary { transition: background-color var(--oz-duration-fast) ease, color var(--oz-duration-fast) ease; }
	.oz-faq__indicator { display: inline-block; transition: transform var(--oz-duration) var(--oz-ease); }
	/* Browsers met ::details-content schuiven ook in hoogte, bij openen én sluiten. */
	@supports selector(::details-content) {
		:root { interpolate-size: allow-keywords; }
		details::details-content { block-size: 0; overflow: clip; transition: block-size var(--oz-duration) var(--oz-ease), content-visibility var(--oz-duration) allow-discrete; }
		details[open]::details-content { block-size: auto; }
	}

	/* ---------- Menu's en panelen (JS wisselt [hidden]; alleen een binnenkomst-animatie) ---------- */
	.oz-submenu:not([hidden]) { animation: oz-drop-in var(--oz-duration) var(--oz-ease-out); }
	.oz-footer-panel:not([hidden]) { animation: oz-disclose var(--oz-duration) var(--oz-ease); }
	.oz-mobile-drawer:not([hidden]) { animation: oz-slide-in-right var(--oz-duration-slow) var(--oz-ease-out); }
	.oz-drawer-overlay:not([hidden]) { animation: oz-fade-in var(--oz-duration) ease; }
	.oz-search-panel[open] { animation: oz-pop-in var(--oz-duration) var(--oz-ease-out); }
	.oz-search-panel[open]::backdrop { animation: oz-fade-in var(--oz-duration) ease; }
	#oz-account-navigation:not([hidden]) { animation: oz-disclose var(--oz-duration) var(--oz-ease); }

	/* ---------- Knoppen ---------- */
	:is(.oz-button, .elementor-button, .button, .wp-element-button, .single_add_to_cart_button, .add_to_cart_button) {
		transition: background-color var(--oz-duration-fast) ease, border-color var(--oz-duration-fast) ease, color var(--oz-duration-fast) ease, box-shadow var(--oz-duration-fast) ease, translate var(--oz-duration-fast) var(--oz-ease), scale var(--oz-duration-fast) var(--oz-ease);
	}
	:is(.oz-button, .elementor-button, .button, .wp-element-button, .single_add_to_cart_button, .add_to_cart_button):active:not(:disabled) { translate: 0 1px; scale: .985; }

	/* ---------- Winkelwagen-teller: korte tik na toevoegen ---------- */
	.oz-header-action--cart.is-bumped .oz-cart-count,
	.oz-header-action--cart.is-bumped > svg { animation: oz-bump .6s var(--oz-ease); }
}

/* Hover-lift alleen op apparaten met een echte muis. */
@media (prefers-reduced-motion: no-preference) and (hover: hover) and (pointer: fine) {
	:is(.oz-button, .elementor-button, .single_add_to_cart_button):hover:not(:disabled) { translate: 0 -1px; }
	.oz-card--interactive { transition: border-color var(--oz-duration-fast) ease, box-shadow var(--oz-duration) var(--oz-ease), translate var(--oz-duration) var(--oz-ease); }
	.oz-card--interactive:hover { translate: 0 -.2rem; }
	.woocommerce ul.products li.product { transition: box-shadow var(--oz-duration) var(--oz-ease), translate var(--oz-duration) var(--oz-ease); }
	.woocommerce ul.products li.product:hover { translate: 0 -.25rem; box-shadow: var(--oz-shadow-card); }
	:is(.ozpf-variant, .ozpf-download, .ozpf-cross) { transition: border-color var(--oz-duration-fast) ease, background-color var(--oz-duration-fast) ease, box-shadow var(--oz-duration) var(--oz-ease), translate var(--oz-duration) var(--oz-ease); }
	:is(a.ozpf-variant, a.ozpf-download, .ozpf-cross):hover { translate: 0 -.15rem; box-shadow: var(--oz-shadow-subtle); }
	.oz-header-action { transition: color var(--oz-duration-fast) ease, background-color var(--oz-duration-fast) ease; }
}
