/**
 * Floating cart button.
 *
 * Matches the site's button system: rich green (#009058) pill with a pale
 * chartreuse (#dfde85) border and accents, a 44px radius, and a circular
 * count badge echoing the header button's icon badge. Fixed bottom-right,
 * mobile + desktop.
 */

.cgc-floating-cart {
	position: fixed;
	right: 22px;
	bottom: calc( 22px + env( safe-area-inset-bottom, 0px ) );
	z-index: 990; /* above content (<=20), below .clapat-header (1000) & configurator overlay (999999) */
	display: inline-flex;
	align-items: center;
	gap: 10px;
	min-height: 48px; /* WCAG 2.5.8 touch target */
	box-sizing: border-box;
	padding: 12px 24px;
	border: 2px solid #dfde85;
	border-radius: 44px; /* site pill radius */
	background-color: #009058;
	color: #ffffff;
	font-family: Tinos, "Times New Roman", Times, serif;
	font-size: 16px;
	font-weight: 400;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;
	box-shadow: 0 8px 24px rgba( 0, 0, 0, 0.18 );
	transition: background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, opacity 0.25s ease, visibility 0.25s ease, transform 0.25s ease;
}

.cgc-floating-cart:hover,
.cgc-floating-cart:focus {
	background-color: #dfde85;
	color: #009058;
	border-color: #009058;
	text-decoration: none;
}

.cgc-floating-cart:focus-visible {
	outline: 2px solid #009058;
	outline-offset: 3px;
}

.cgc-fc-icon {
	flex: 0 0 auto;
	display: block;
	color: #dfde85; /* chartreuse glyph on the green pill */
}

.cgc-floating-cart:hover .cgc-fc-icon,
.cgc-floating-cart:focus .cgc-fc-icon {
	color: #009058;
}

.cgc-fc-total {
	font-variant-numeric: tabular-nums;
}

/* Hidden when empty — element stays in the DOM as the fragment swap target. */
.cgc-floating-cart.is-empty {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY( 10px );
}

/* Hidden while the configurator overlay is open, so it never sits over it. */
body.cgc-configurator-open .cgc-floating-cart {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

/* Pulse when the cart contents change. */
@keyframes cgc-cart-pulse {
	0%   { transform: scale( 1 ); }
	40%  { transform: scale( 1.08 ); }
	100% { transform: scale( 1 ); }
}

.cgc-floating-cart.cgc-pulse {
	animation: cgc-cart-pulse 0.45s ease;
}

@media ( max-width: 767px ) {
	.cgc-floating-cart {
		right: 14px;
		bottom: calc( 14px + env( safe-area-inset-bottom, 0px ) );
		padding: 12px 20px;
		font-size: 15px;
	}
}

@media ( prefers-reduced-motion: reduce ) {
	.cgc-floating-cart {
		transition: none;
	}
	.cgc-floating-cart.cgc-pulse {
		animation: none;
	}
}

@media print {
	.cgc-floating-cart-wrap {
		display: none !important;
	}
}