/* LG Legacy UI Clone — minimal overrides (keep the live snapshot CSS untouched). */

/* Injected mobile menu: hidden until the hamburger toggles it; desktop hidden. */
.lg-mobile-menu {
	display: none !important;
}
.lg-mobile-menu.lg-open {
	display: block !important;
}
@media (min-width: 768px) {
	.lg-mobile-menu {
		display: none !important;
	}
}
/* Logged-in admin bar shifts the fixed header 32px; keep the mobile menu aligned. */
body.admin-bar .lg-mobile-menu {
	top: 112px !important;
}

/* 3D viewer placeholder fallback (when a product has no model URL). */
.lg-model-fallback {
	padding: 48px 24px;
	text-align: center;
	color: var(--theme-text-muted, #666);
	background: var(--theme-page-bg-alt, #f5f5f5);
	border-radius: 16px;
}

/* Keep drawings zoom cursor / lightbox images crisp. */
.lg-legacy-page img {
	max-width: 100%;
}

/* Snapshot pages render their own header/footer; hide any stray admin bar offset. */
.lg-legacy-page {
	min-height: 100vh;
}

/* 1:1 hover interaction for product cards.
   Source: components/native/ProductsPageContent.tsx — hover state uses
   transform: translateY(-8px) + box-shadow 0 0 30px rgba(var(--theme-accent-rgb), 0.1)
   with transition: transform 0.4s ease, box-shadow 0.4s ease.
   The frozen snapshot HTML carries the non-hover inline style, so these rules
   must use !important to win over the inline transform/box-shadow. */
.native-product-card {
	transition: transform 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease !important;
	will-change: transform;
}
.native-product-card:hover {
	transform: translateY(-8px) !important;
	box-shadow: 0 0 30px rgba(var(--theme-accent-rgb, 34, 197, 94), 0.1) !important;
	border-color: rgba(var(--theme-accent-rgb, 34, 197, 94), 0.35) !important;
}
.native-product-card:hover .native-product-image img {
	transform: scale(1.04);
	transition: transform 0.4s ease;
}
.native-product-image img {
	transition: transform 0.4s ease;
}

/* 1:1 fix: the old regional-contact cards rely on a React IntersectionObserver to add
   `.rc-visible` (opacity 0 -> 1). The frozen snapshot has no React runtime, so the cards
   stayed invisible (only the WhatsApp phone links were perceptible). Reveal them and keep
   the original hover scale. */
.rc-card {
	opacity: 1 !important;
	transform: none;
	animation: none !important;
}
.rc-card:hover {
	transform: scale(1.04);
	box-shadow: 0 8px 28px rgba(0, 0, 0, 0.12);
	background: #f0fdf4;
	border-color: rgba(34, 197, 94, 0.15);
}



/* Logged-in admin bar on legacy snapshots: WordPress prints #wpadminbar but the legacy
   header is fixed at top:0, so shift it below the bar (32px desktop / 46px mobile). */
body.admin-bar header.fixed,
body.admin-bar header[class*="fixed"] {
	top: 32px !important;
}
@media (max-width: 782px) {
	body.admin-bar header.fixed,
	body.admin-bar header[class*="fixed"] {
		top: 46px !important;
	}
}