/**
 * Responsive guardrails for the existing WooCommerce upsell component.
 * Scoped to single-product upsells so shop/category grids are unaffected.
 */
.single-product section.up-sells ul.products,
.single-product section.upsells ul.products {
	display: grid !important;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: clamp(16px, 2vw, 28px);
}

.single-product section.up-sells ul.products::before,
.single-product section.up-sells ul.products::after,
.single-product section.upsells ul.products::before,
.single-product section.upsells ul.products::after {
	display: none !important;
}

.single-product section.up-sells ul.products li.product,
.single-product section.upsells ul.products li.product {
	box-sizing: border-box;
	float: none !important;
	margin: 0 !important;
	min-width: 0;
	width: auto !important;
}

.single-product section.up-sells ul.products li.product img,
.single-product section.upsells ul.products li.product img {
	height: auto;
	max-width: 100%;
}

.single-product section.up-sells ul.products li.product .woocommerce-loop-product__title,
.single-product section.upsells ul.products li.product .woocommerce-loop-product__title {
	overflow-wrap: anywhere;
}

.single-product section.up-sells ul.products li.product .button,
.single-product section.upsells ul.products li.product .button {
	box-sizing: border-box;
	max-width: 100%;
	white-space: normal;
}

@media (max-width: 900px) {
	.single-product section.up-sells ul.products,
	.single-product section.upsells ul.products {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 479px) {
	.single-product section.up-sells ul.products,
	.single-product section.upsells ul.products {
		grid-template-columns: minmax(0, 1fr);
	}
}