/* ==========================================================================
   Aurelia Commerce — motion layer
   Loaded after main.css and woocommerce.css.
   Every effect is disabled automatically for visitors who ask for
   reduced motion (prefers-reduced-motion: reduce).
   ========================================================================== */

:root {
	--au-dur-fast: 0.22s;
	--au-dur: 0.45s;
	--au-dur-slow: 0.85s;
	--au-ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
	--au-ease-spring: cubic-bezier(0.18, 0.89, 0.32, 1.18);
}

/* ---------- Keyframes ---------- */
@keyframes au-fade-in {
	from {
		opacity: 0;
	}
	to {
		opacity: 1;
	}
}

@keyframes au-fade-up {
	from {
		opacity: 0;
		transform: translate3d(0, 22px, 0);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes au-rise-in {
	from {
		opacity: 0;
		transform: translate3d(0, 12px, 0);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes au-drop-in {
	from {
		opacity: 0;
		transform: translate3d(0, -100%, 0);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes au-slide-in-right {
	from {
		opacity: 0;
		transform: translate3d(18px, 0, 0);
	}
	to {
		opacity: 1;
		transform: none;
	}
}

@keyframes au-pop {
	0% {
		opacity: 0;
		transform: scale(0.75);
	}
	60% {
		opacity: 1;
		transform: scale(1.06);
	}
	100% {
		opacity: 1;
		transform: scale(1);
	}
}

@keyframes au-bob {
	0%,
	100% {
		transform: translate3d(0, 0, 0);
	}
	50% {
		transform: translate3d(0, -9px, 0);
	}
}

@keyframes au-sheen {
	from {
		transform: translateX(-130%) skewX(-18deg);
	}
	to {
		transform: translateX(130%) skewX(-18deg);
	}
}

@keyframes au-ping {
	0% {
		box-shadow: 0 0 0 0 rgba(var(--au-accent-rgb), 0.5);
	}
	70% {
		box-shadow: 0 0 0 12px rgba(var(--au-accent-rgb), 0);
	}
	100% {
		box-shadow: 0 0 0 0 rgba(var(--au-accent-rgb), 0);
	}
}

@keyframes au-flash {
	0% {
		box-shadow: 0 0 0 0 rgba(var(--au-accent-rgb), 0);
	}
	35% {
		box-shadow: 0 0 0 4px rgba(var(--au-accent-rgb), 0.22);
	}
	100% {
		box-shadow: 0 0 0 0 rgba(var(--au-accent-rgb), 0);
	}
}

@keyframes au-bump {
	0%,
	100% {
		transform: scale(1);
	}
	40% {
		transform: scale(1.55);
	}
}

@keyframes au-spin {
	to {
		transform: rotate(360deg);
	}
}

@keyframes au-check-pop {
	0% {
		opacity: 0;
		transform: scale(0.2) rotate(-18deg);
	}
	65% {
		opacity: 1;
		transform: scale(1.12) rotate(2deg);
	}
	100% {
		opacity: 1;
		transform: scale(1) rotate(0deg);
	}
}

@keyframes au-underline-grow {
	from {
		transform: scaleX(0);
	}
	to {
		transform: scaleX(1);
	}
}

/* ---------- Page enter ---------- */
@media (prefers-reduced-motion: no-preference) {
	.au-topbar {
		animation: au-drop-in 0.55s var(--au-ease-out) both;
	}

	.au-header__brand,
	.au-nav,
	.au-header__actions {
		animation: au-rise-in 0.75s var(--au-ease-out) both;
	}

	.au-nav {
		animation-delay: 0.07s;
	}

	.au-header__actions {
		animation-delay: 0.14s;
	}

	/* Hero children cascade instead of appearing together. */
	html.js .au-hero__copy > .au-reveal:nth-child(1) {
		transition-delay: 0.04s;
	}

	html.js .au-hero__copy > .au-reveal:nth-child(2) {
		transition-delay: 0.1s;
	}

	html.js .au-hero__copy > .au-reveal:nth-child(3) {
		transition-delay: 0.17s;
	}

	html.js .au-hero__copy > .au-reveal:nth-child(4) {
		transition-delay: 0.24s;
	}

	html.js .au-hero__copy > .au-reveal:nth-child(5) {
		transition-delay: 0.31s;
	}

	html.js .au-hero__visual.au-reveal {
		transition-delay: 0.16s;
	}

	/* Floating cards drift slowly so the hero never feels static. */
	.au-hero__float--a {
		animation: au-bob 9s ease-in-out infinite;
	}

	.au-hero__float--b {
		animation: au-bob 11s ease-in-out infinite reverse;
	}

	.au-eyebrow__line {
		animation: au-underline-grow 0.9s 0.5s var(--au-ease-out) both;
		transform-origin: left center;
	}

	/* Soft entrance for the inner page heading. */
	.au-page-head .au-page-title {
		animation: au-fade-up 0.8s 0.1s var(--au-ease-out) both;
	}

	.au-page-head .au-eyebrow {
		animation: au-fade-in 0.7s both;
	}
}

/* ---------- Buttons ---------- */
.au-btn {
	position: relative;
	overflow: hidden;
	isolation: isolate;
}

@media (prefers-reduced-motion: no-preference) {
	.au-btn::after {
		content: "";
		position: absolute;
		top: -20%;
		bottom: -20%;
		left: 0;
		width: 45%;
		background: linear-gradient(
			90deg,
			transparent,
			rgba(255, 255, 255, 0.28),
			transparent
		);
		transform: translateX(-130%) skewX(-18deg);
		pointer-events: none;
		z-index: -1;
	}

	.au-btn:hover::after {
		animation: au-sheen 0.85s var(--au-ease-out);
	}

	.au-btn:active {
		transform: translateY(1px) scale(0.995);
	}

	.au-btn .au-icon {
		transition: transform 0.35s var(--au-ease-out);
	}

	.au-btn:hover .au-icon {
		transform: translateX(4px);
	}
}

/* ---------- Product cards ---------- */
@media (prefers-reduced-motion: no-preference) {
	ul.products li.product {
		animation: au-fade-up 0.7s var(--au-ease-out) both;
		animation-delay: calc(var(--au-i, 0) * 65ms);
	}

	ul.products li.product .au-product-media {
		transition: box-shadow 0.5s var(--au-ease-out), transform 0.5s var(--au-ease-out);
	}

	ul.products li.product:hover .au-product-media {
		box-shadow: var(--au-shadow);
	}

	ul.products li.product .woocommerce-loop-product__title {
		transition: color 0.3s var(--au-ease-out);
	}

	ul.products li.product:hover .woocommerce-loop-product__title {
		color: var(--au-accent);
	}

	ul.products li.product .button {
		transition: background 0.3s var(--au-ease-out), border-color 0.3s var(--au-ease-out),
			color 0.3s var(--au-ease-out), transform 0.3s var(--au-ease-out);
	}

	ul.products li.product:hover .button {
		border-color: var(--au-accent);
		color: var(--au-accent);
	}

	ul.products li.product .button:hover {
		background: var(--au-accent);
		border-color: var(--au-accent);
		color: #fff;
	}

	ul.products li.product .onsale,
	ul.products li.product .au-badge--new {
		animation: au-pop 0.5s 0.35s var(--au-ease-spring) both;
	}

	ul.products li.product .onsale {
		animation: au-pop 0.5s 0.35s var(--au-ease-spring) both,
			au-ping 2.4s 1.4s ease-out 2;
	}

	ul.products li.product .added_to_cart {
		animation: au-fade-up 0.35s var(--au-ease-out) both;
	}
}

/* ---------- Category tiles ---------- */
@media (prefers-reduced-motion: no-preference) {
	.au-cat__body .au-icon,
	.au-cat__arrow {
		transition: transform 0.4s var(--au-ease-out);
	}

	.au-cat:hover .au-cat__body .au-icon,
	.au-cat:hover .au-cat__arrow {
		transform: translate(4px, -4px);
	}

	.au-cat__img {
		transition: transform 1.1s var(--au-ease-out);
	}
}

/* ---------- Navigation drawer & overlays ---------- */
@media (prefers-reduced-motion: no-preference) {
	.au-menu ul {
		transform-origin: top center;
	}

	.au-menu li:hover > ul,
	.au-menu li:focus-within > ul {
		animation: au-fade-in 0.28s var(--au-ease-out) both;
	}

	.au-nav-drawer.is-open .au-menu--mobile > li {
		animation: au-fade-up 0.5s var(--au-ease-out) both;
	}

	.au-nav-drawer.is-open .au-menu--mobile > li:nth-child(1) {
		animation-delay: 0.08s;
	}

	.au-nav-drawer.is-open .au-menu--mobile > li:nth-child(2) {
		animation-delay: 0.13s;
	}

	.au-nav-drawer.is-open .au-menu--mobile > li:nth-child(3) {
		animation-delay: 0.18s;
	}

	.au-nav-drawer.is-open .au-menu--mobile > li:nth-child(4) {
		animation-delay: 0.23s;
	}

	.au-nav-drawer.is-open .au-menu--mobile > li:nth-child(5) {
		animation-delay: 0.28s;
	}

	.au-nav-drawer.is-open .au-menu--mobile > li:nth-child(n + 6) {
		animation-delay: 0.33s;
	}

	.au-nav-drawer.is-open .au-nav-drawer__meta,
	.au-nav-drawer.is-open .au-nav-drawer__widgets {
		animation: au-fade-in 0.6s 0.3s var(--au-ease-out) both;
	}

	.au-search.is-open .au-search__head,
	.au-search.is-open .au-search__form {
		animation: au-fade-up 0.5s var(--au-ease-out) both;
	}

	.au-search.is-open .au-search__form {
		animation-delay: 0.06s;
	}

	.au-search.is-open .au-pill {
		animation: au-pop 0.4s var(--au-ease-spring) both;
	}

	.au-search.is-open .au-pill:nth-child(2) {
		animation-delay: 0.05s;
	}

	.au-search.is-open .au-pill:nth-child(3) {
		animation-delay: 0.1s;
	}

	.au-search.is-open .au-pill:nth-child(4) {
		animation-delay: 0.15s;
	}

	.au-search.is-open .au-pill:nth-child(n + 5) {
		animation-delay: 0.2s;
	}
}

/* ---------- Cart drawer ---------- */
@media (prefers-reduced-motion: no-preference) {
	.au-drawer.is-open .woocommerce-mini-cart-item {
		animation: au-fade-up 0.45s var(--au-ease-out) both;
	}

	.au-drawer.is-open .woocommerce-mini-cart-item:nth-child(1) {
		animation-delay: 0.12s;
	}

	.au-drawer.is-open .woocommerce-mini-cart-item:nth-child(2) {
		animation-delay: 0.17s;
	}

	.au-drawer.is-open .woocommerce-mini-cart-item:nth-child(3) {
		animation-delay: 0.22s;
	}

	.au-drawer.is-open .woocommerce-mini-cart-item:nth-child(n + 4) {
		animation-delay: 0.27s;
	}

	.au-drawer.is-open .au-drawer__head {
		animation: au-fade-in 0.4s both;
	}

	.au-drawer.is-open .au-mini-cart-inner > .woocommerce-mini-cart__total,
	.au-drawer.is-open .au-mini-cart-inner > .woocommerce-mini-cart__buttons {
		animation: au-fade-up 0.5s 0.24s var(--au-ease-out) both;
	}

	.au-cart-count {
		transform-origin: center;
	}

	.au-cart-count.is-bumped {
		animation: au-bump 0.6s var(--au-ease-spring);
	}

	.au-shipbar__fill {
		transition: width 0.9s var(--au-ease-out), background 0.4s var(--au-ease-out);
	}

	.au-shipbar__fill::after {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(
			90deg,
			transparent,
			rgba(255, 255, 255, 0.55),
			transparent
		);
		transform: translateX(-100%);
		animation: au-sheen 2.4s 0.6s ease-in-out infinite;
	}
}

/* ---------- Forms & quantity ---------- */
@media (prefers-reduced-motion: no-preference) {
	input[type="text"],
	input[type="email"],
	input[type="search"],
	input[type="tel"],
	input[type="url"],
	input[type="password"],
	input[type="number"],
	textarea,
	select {
		transition: border-color 0.3s var(--au-ease-out), box-shadow 0.3s var(--au-ease-out),
			background 0.3s var(--au-ease-out);
	}

	.quantity input.qty.is-pulsed {
		animation: au-bump 0.35s var(--au-ease-spring);
	}

	.au-qty-btn {
		transition: background 0.25s var(--au-ease-out), color 0.25s var(--au-ease-out),
			transform 0.25s var(--au-ease-out);
	}

	.au-qty-btn:active {
		transform: scale(0.88);
	}
}

/* ---------- WooCommerce notices ---------- */
@media (prefers-reduced-motion: no-preference) {
	.woocommerce-message,
	.woocommerce-info,
	.woocommerce-error,
	.au-notice {
		animation: au-fade-up 0.5s var(--au-ease-out) both;
	}

	.woocommerce-error {
		animation: au-fade-up 0.4s var(--au-ease-out) both;
	}
}

/* ---------- Single product ---------- */
@media (prefers-reduced-motion: no-preference) {
	.woocommerce div.product .woocommerce-product-gallery {
		animation: au-fade-in 0.9s var(--au-ease-out) both;
	}

	.woocommerce div.product .summary {
		animation: au-fade-up 0.8s 0.12s var(--au-ease-out) both;
	}

	.woocommerce div.product .woocommerce-tabs .panel {
		animation: au-fade-up 0.5s var(--au-ease-out) both;
	}

	.woocommerce div.product .related.products ul.products li.product,
	.woocommerce div.product .upsells.products ul.products li.product {
		animation: au-fade-up 0.7s var(--au-ease-out) both;
		animation-delay: calc(var(--au-i, 0) * 65ms);
	}

	.single_add_to_cart_button.loading {
		position: relative;
		color: transparent !important;
	}

	.single_add_to_cart_button.loading::after {
		content: "";
		position: absolute;
		top: 50%;
		left: 50%;
		width: 16px;
		height: 16px;
		margin: -8px 0 0 -8px;
		border: 2px solid rgba(255, 255, 255, 0.4);
		border-top-color: #fff;
		border-radius: 50%;
		animation: au-spin 0.7s linear infinite;
	}

	.single_add_to_cart_button.added::before {
		content: "";
		display: inline-block;
		width: 12px;
		height: 12px;
		margin-right: 0.4rem;
		background: currentColor;
		mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4.5 12.5 5 5 10-11'/%3E%3C/svg%3E")
			center / contain no-repeat;
		animation: au-pop 0.4s var(--au-ease-spring) both;
	}
}

/* ---------- Cart page ---------- */
@media (prefers-reduced-motion: no-preference) {
	.woocommerce-cart table.cart tr.cart_item {
		animation: au-fade-up 0.5s var(--au-ease-out) both;
	}

	.woocommerce-cart table.cart tr.cart_item:nth-child(1) {
		animation-delay: 0.02s;
	}

	.woocommerce-cart table.cart tr.cart_item:nth-child(2) {
		animation-delay: 0.07s;
	}

	.woocommerce-cart table.cart tr.cart_item:nth-child(3) {
		animation-delay: 0.12s;
	}

	.woocommerce-cart table.cart tr.cart_item:nth-child(n + 4) {
		animation-delay: 0.17s;
	}

	.woocommerce-cart .cart-collaterals {
		animation: au-fade-up 0.7s 0.15s var(--au-ease-out) both;
	}

	.woocommerce .cart_totals .order-total .amount {
		transition: color 0.3s var(--au-ease-out);
	}
}

/* ---------- Checkout ---------- */
@media (prefers-reduced-motion: no-preference) {
	.woocommerce form.checkout #customer_details {
		animation: au-fade-up 0.7s var(--au-ease-out) both;
	}

	.woocommerce form.checkout #order_review_heading,
	.woocommerce form.checkout #order_review {
		animation: au-fade-up 0.7s 0.1s var(--au-ease-out) both;
	}

	.woocommerce form.checkout #order_review.is-updated {
		animation: au-flash 0.7s var(--au-ease-out);
	}

	.woocommerce form.checkout .woocommerce-form-coupon {
		animation: au-fade-up 0.4s var(--au-ease-out) both;
	}

	.woocommerce #payment ul.payment_methods li {
		transition: border-color 0.3s var(--au-ease-out), background 0.3s var(--au-ease-out),
			box-shadow 0.3s var(--au-ease-out);
	}

	.woocommerce #payment ul.payment_methods li:has(input:checked) {
		border-color: var(--au-accent);
		box-shadow: inset 3px 0 0 var(--au-accent);
	}

	.woocommerce #payment div.payment_box {
		animation: au-fade-up 0.35s var(--au-ease-out) both;
	}

	.woocommerce #place_order {
		position: relative;
		overflow: hidden;
	}

	.woocommerce #place_order.is-loading {
		color: transparent !important;
		pointer-events: none;
	}

	.woocommerce #place_order.is-loading::after {
		content: "";
		position: absolute;
		top: 50%;
		left: 50%;
		width: 18px;
		height: 18px;
		margin: -9px 0 0 -9px;
		border: 2px solid rgba(255, 255, 255, 0.35);
		border-top-color: #fff;
		border-radius: 50%;
		animation: au-spin 0.7s linear infinite;
	}

	.woocommerce #place_order.is-loading::before {
		content: "";
		position: absolute;
		inset: 0;
		background: linear-gradient(
			90deg,
			transparent,
			rgba(255, 255, 255, 0.18),
			transparent
		);
		animation: au-sheen 1.1s linear infinite;
	}
}

/* ---------- Order received ---------- */
.woocommerce-thankyou-order-received {
	display: flex;
	align-items: center;
	gap: 0.9rem;
	margin-bottom: 1.75rem !important;
	padding: 1.1rem 1.3rem;
	border: 1px solid var(--au-line);
	border-left: 2px solid var(--au-accent);
	border-radius: var(--au-radius);
	background: var(--au-surface-2);
}

.woocommerce-thankyou-order-received::before {
	content: "";
	flex: none;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background: var(--au-accent)
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m4.5 12.5 5 5 10-11'/%3E%3C/svg%3E")
		center / 17px no-repeat;
}

@media (prefers-reduced-motion: no-preference) {
	.woocommerce-thankyou-order-received::before {
		animation: au-check-pop 0.7s var(--au-ease-spring) both;
	}

	.woocommerce-order-overview li {
		animation: au-fade-up 0.5s var(--au-ease-out) both;
	}

	.woocommerce-order-overview li:nth-child(1) {
		animation-delay: 0.1s;
	}

	.woocommerce-order-overview li:nth-child(2) {
		animation-delay: 0.16s;
	}

	.woocommerce-order-overview li:nth-child(3) {
		animation-delay: 0.22s;
	}

	.woocommerce-order-overview li:nth-child(n + 4) {
		animation-delay: 0.28s;
	}

	.woocommerce-order > p {
		animation: au-fade-in 0.6s 0.2s var(--au-ease-out) both;
	}
}

/* ---------- Minicart empty state ---------- */
@media (prefers-reduced-motion: no-preference) {
	.au-mini-cart-inner .woocommerce-mini-cart__empty-message {
		animation: au-fade-up 0.5s 0.1s var(--au-ease-out) both;
	}

	.au-mini-cart-inner .empty-cart-item,
	.au-empty-cart__inner {
		animation: au-fade-in 0.6s 0.1s var(--au-ease-out) both;
	}
}

/* ---------- Page loading bar ---------- */
.au-progress {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 2200;
	height: 2px;
	background: var(--au-accent);
	transform: scaleX(0);
	transform-origin: 0 50%;
	opacity: 0;
	pointer-events: none;
}

.au-progress.is-active {
	opacity: 1;
	transform: scaleX(0.72);
	transition: transform 1.6s cubic-bezier(0.1, 0.65, 0.2, 1), opacity 0.15s linear;
}

/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.001ms !important;
	}

	.au-progress {
		display: none;
	}
}