/*
 * One2TenX native WooCommerce recommendations — v11.26.0
 * Scoped to built-in single-product Upsells / Related Products.
 */

body.single-product :is(.upsells.products, .related.products, .one2tenx-native-recommendations, .wp-block-woocommerce-related-products) {
	--o2x-rec-card-width: 232px;
	width: 100% !important;
	max-width: 100% !important;
	margin-block: clamp(30px, 5vw, 64px) !important;
	padding: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	border: 0 !important;
	box-sizing: border-box !important;
}

body.single-product :is(.upsells.products, .related.products, .one2tenx-native-recommendations, .wp-block-woocommerce-related-products) > :is(h2, .wp-block-heading) {
	margin: 0 0 18px !important;
	color: var(--rivrun-text, var(--wp--preset--color--contrast, #241d28)) !important;
	font-size: clamp(24px, 2.1vw, 34px) !important;
	font-weight: 800 !important;
	line-height: 1.16 !important;
	letter-spacing: -0.025em !important;
	text-wrap: balance;
}

body.single-product :is(.upsells.products, .related.products) ul.products,
body.single-product .one2tenx-native-recommendations .wc-block-product-template,
body.single-product .wp-block-woocommerce-related-products .wc-block-product-template {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 190px), var(--o2x-rec-card-width))) !important;
	justify-content: start !important;
	align-items: stretch !important;
	gap: 16px !important;
	width: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
}

body.single-product :is(.upsells.products, .related.products) ul.products > li.product,
body.single-product .one2tenx-native-recommendations .wc-block-product,
body.single-product .one2tenx-native-recommendations .wc-block-product-template > li,
body.single-product .wp-block-woocommerce-related-products .wc-block-product {
	position: relative !important;
	display: flex !important;
	flex-direction: column !important;
	min-width: 0 !important;
	width: auto !important;
	max-width: none !important;
	height: 100% !important;
	margin: 0 !important;
	padding: 10px !important;
	border: 1px solid var(--rivrun-border, #f3c8d8) !important;
	border-radius: 17px !important;
	background: var(--rivrun-surface, #fff) !important;
	box-shadow: 0 8px 24px color-mix(in srgb, var(--rivrun-text, #241d28) 7%, transparent) !important;
	overflow: hidden !important;
	box-sizing: border-box !important;
	transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}

@media (hover:hover) and (pointer:fine) {
	body.single-product :is(.upsells.products, .related.products) ul.products > li.product:hover,
	body.single-product .one2tenx-native-recommendations .wc-block-product:hover,
	body.single-product .one2tenx-native-recommendations .wc-block-product-template > li:hover,
	body.single-product .wp-block-woocommerce-related-products .wc-block-product:hover {
		transform: translateY(-2px) !important;
		border-color: color-mix(in srgb, var(--rivrun-accent, #6f3ba3) 38%, var(--rivrun-border, #f3c8d8)) !important;
		box-shadow: 0 12px 30px color-mix(in srgb, var(--rivrun-text, #241d28) 11%, transparent) !important;
	}
}

body.single-product :is(.upsells.products, .related.products) ul.products > li.product img,
body.single-product .one2tenx-native-recommendations :is(.wc-block-components-product-image img, .wp-block-woocommerce-product-image img),
body.single-product .wp-block-woocommerce-related-products :is(.wc-block-components-product-image img, .wp-block-woocommerce-product-image img) {
	display: block !important;
	width: 100% !important;
	height: auto !important;
	aspect-ratio: 1 / 1 !important;
	object-fit: contain !important;
	margin: 0 0 10px !important;
	border-radius: 13px !important;
	background: var(--rivrun-surface-2, #fff0f6) !important;
}

body.single-product :is(.upsells.products, .related.products) ul.products > li.product :is(h2, .woocommerce-loop-product__title),
body.single-product .one2tenx-native-recommendations :is(.wp-block-post-title, .wc-block-components-product-name),
body.single-product .wp-block-woocommerce-related-products :is(.wp-block-post-title, .wc-block-components-product-name) {
	display: -webkit-box !important;
	-webkit-box-orient: vertical !important;
	-webkit-line-clamp: 2 !important;
	overflow: hidden !important;
	min-height: 2.75em !important;
	margin: 0 0 8px !important;
	color: var(--rivrun-text, #241d28) !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	line-height: 1.36 !important;
	text-align: start !important;
	overflow-wrap: break-word !important;
	word-break: normal !important;
	hyphens: none !important;
}

body.single-product :is(.upsells.products, .related.products) ul.products > li.product .price,
body.single-product .one2tenx-native-recommendations :is(.wp-block-woocommerce-product-price, .wc-block-components-product-price),
body.single-product .wp-block-woocommerce-related-products :is(.wp-block-woocommerce-product-price, .wc-block-components-product-price) {
	margin: auto 0 10px !important;
	font-size: 14px !important;
	font-weight: 750 !important;
	line-height: 1.25 !important;
	text-align: start !important;
}

body.single-product :is(.upsells.products, .related.products) ul.products > li.product :is(.button, .added_to_cart),
body.single-product .one2tenx-native-recommendations :is(.wp-block-button, .wc-block-components-product-button),
body.single-product .wp-block-woocommerce-related-products :is(.wp-block-button, .wc-block-components-product-button) {
	width: 100% !important;
	max-width: 100% !important;
	margin-top: auto !important;
}

body.single-product :is(.upsells.products, .related.products) ul.products > li.product .button,
body.single-product .one2tenx-native-recommendations :is(.wp-block-button__link, .wc-block-components-product-button__button),
body.single-product .wp-block-woocommerce-related-products :is(.wp-block-button__link, .wc-block-components-product-button__button) {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	width: 100% !important;
	min-height: 40px !important;
	padding: 9px 12px !important;
	border: 1px solid color-mix(in srgb, var(--rivrun-button-bg, #ef4f91) 78%, var(--rivrun-border, #f3c8d8)) !important;
	border-radius: 11px !important;
	background: var(--rivrun-button-bg, #ef4f91) !important;
	color: var(--rivrun-button-text, #fff) !important;
	font-size: 13px !important;
	font-weight: 750 !important;
	line-height: 1.2 !important;
	text-decoration: none !important;
	white-space: normal !important;
	text-align: center !important;
}

body.single-product :is(.upsells.products, .related.products, .one2tenx-native-recommendations, .wp-block-woocommerce-related-products) :is(.onsale, .wc-block-components-product-sale-badge, .wc-block-components-product-sale-badge span) {
	font-size: 11px !important;
	line-height: 1 !important;
}

@media (max-width: 760px) {
	body.single-product :is(.upsells.products, .related.products, .one2tenx-native-recommendations, .wp-block-woocommerce-related-products) {
		margin-block: 28px !important;
	}

	body.single-product :is(.upsells.products, .related.products, .one2tenx-native-recommendations, .wp-block-woocommerce-related-products) > :is(h2, .wp-block-heading) {
		margin-bottom: 14px !important;
		font-size: clamp(22px, 7vw, 28px) !important;
	}

	body.single-product :is(.upsells.products, .related.products) ul.products,
	body.single-product .one2tenx-native-recommendations .wc-block-product-template,
	body.single-product .wp-block-woocommerce-related-products .wc-block-product-template {
		grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
		gap: 10px !important;
	}

	body.single-product :is(.upsells.products, .related.products) ul.products > li.product,
	body.single-product .one2tenx-native-recommendations .wc-block-product,
	body.single-product .one2tenx-native-recommendations .wc-block-product-template > li,
	body.single-product .wp-block-woocommerce-related-products .wc-block-product {
		padding: 8px !important;
		border-radius: 14px !important;
	}

	body.single-product :is(.upsells.products, .related.products) ul.products > li.product :is(h2, .woocommerce-loop-product__title),
	body.single-product .one2tenx-native-recommendations :is(.wp-block-post-title, .wc-block-components-product-name),
	body.single-product .wp-block-woocommerce-related-products :is(.wp-block-post-title, .wc-block-components-product-name) {
		min-height: 2.65em !important;
		font-size: clamp(12.5px, 3.7vw, 14px) !important;
		line-height: 1.32 !important;
	}

	body.single-product :is(.upsells.products, .related.products) ul.products > li.product .price,
	body.single-product .one2tenx-native-recommendations :is(.wp-block-woocommerce-product-price, .wc-block-components-product-price),
	body.single-product .wp-block-woocommerce-related-products :is(.wp-block-woocommerce-product-price, .wc-block-components-product-price) {
		font-size: 12.5px !important;
	}

	body.single-product :is(.upsells.products, .related.products) ul.products > li.product .button,
	body.single-product .one2tenx-native-recommendations :is(.wp-block-button__link, .wc-block-components-product-button__button),
	body.single-product .wp-block-woocommerce-related-products :is(.wp-block-button__link, .wc-block-components-product-button__button) {
		min-height: 38px !important;
		font-size: 12px !important;
	}
}

@media (max-width: 359px) {
	body.single-product :is(.upsells.products, .related.products) ul.products,
	body.single-product .one2tenx-native-recommendations .wc-block-product-template,
	body.single-product .wp-block-woocommerce-related-products .wc-block-product-template {
		grid-template-columns: 1fr !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	body.single-product :is(.upsells.products, .related.products) ul.products > li.product,
	body.single-product .one2tenx-native-recommendations .wc-block-product,
	body.single-product .one2tenx-native-recommendations .wc-block-product-template > li,
	body.single-product .wp-block-woocommerce-related-products .wc-block-product {
		transition: none !important;
	}
}
