/* ==========================================================
   PRODUCT PAGE TRUST BANNER TEST MOBILE SPACING
   Load this after the existing product page CSS and trust-banner.css.

   Scope:
   - Mobile only.
   - Applies only when the standalone trust banner is active for the
     product-page-trust-banner PostHog test group.
   ========================================================== */

@media (max-width: 767.98px) {
	/*
		The product page has broad section spacing rules. In the trust-banner
		test group, tighten section spacing so the page reads as a denser mobile
		experience after the banner is introduced.
	*/
	body:has(
		.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
	) {
		--section-top-bottom-padding: 24px;
		--prod-body-p-margin-bottom: 18px;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section:first-of-type {
		margin-bottom: 24px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section:not(:first-of-type):not(.ah-trust-banner) {
		padding-top: 24px !important;
		padding-bottom: 24px !important;
	}

	/* Keep the banner itself exempt from product-page section spacing. */
	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.ah-trust-banner {
		margin: 0 !important;
		padding: 0 !important;
	}

	/* Tighten the above-the-fold product summary area for the test group. */
	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main {
		padding-top: 0 !important;
		margin-bottom: 12px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		> .container {
		padding-top: 0px !important;
		padding-bottom: 0px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.category-breadcrumb {
		margin-bottom: 0px !important;
		line-height: 1.1 !important;
		height: auto;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.info {
		padding-left: 20px !important;
		padding-right: 20px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.info
		> .info-top
		.prod-gct-text {
		margin-bottom: 4px !important;
		line-height: 1.1 !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.info
		> .info-top
		.prod-title {
		margin-bottom: 3px !important;
		line-height: 1 !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.info
		> .info-top
		.prod-subtitle {
		margin-bottom: 2px !important;
		line-height: 1.15 !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.info
		> .info-top
		.stars-container {
		margin-top: 2px !important;
		margin-bottom: 2px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.info
		> .info-top
		.prod-description {
		padding-top: 0px !important;
		padding-bottom: 0 !important;
	}
}

/*
   Mobile test refinement:
   Avoid adding extra outside gutter around the main product container.
   The earlier spacing pass tightened content but left Bootstrap/product-page
   container gutters visible on small screens. Keep the page edge-to-edge while
   preserving modest readable padding inside the product info column.
*/
@media (max-width: 767.98px) {
	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		> .container {
		width: 100% !important;
		max-width: 100% !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		> .container
		> .row {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.image,
	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.cart {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.info {
		padding-left: 16px !important;
		padding-right: 16px !important;
	}
}

/*
   V3 mobile compaction:
   Tighten the rest of the product-main content that appears before the trust
   banner, including the mobile gallery, buy box, auto reorder, and mobile
   related products. This keeps the added banner from pushing too much content
   below the fold while leaving desktop/control untouched.
*/
@media (max-width: 767.98px) {
	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		> .container
		> .row:first-child {
		padding-top: 4px !important;
		padding-bottom: 2px !important;
		margin-top: 0 !important;
		margin-bottom: 0 !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.prod-extra-info {
		margin-top: 2px !important;
		margin-bottom: 2px !important;
		line-height: 1.15 !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.info
		> .info-bottom {
		gap: 6px !important;
		padding-top: 2px !important;
		padding-bottom: 8px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.info
		> .info-bottom
		.best-before-date {
		margin-top: 2px !important;
		margin-bottom: 2px !important;
		line-height: 1.15 !important;
	}

	/* Mobile product image/gallery spacing above the buy box. */
	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.prod-mobile-image {
		margin-top: 2px !important;
		margin-bottom: 8px !important;
		padding-left: 0 !important;
		padding-right: 0 !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.prod-mobile-image
		> .row {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		#mobileBlazeSlider {
		padding-left: 0 !important;
		padding-right: 0 !important;
		margin-bottom: 0 !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		#mobileBlazeSlider
		.blaze-track {
		height: clamp(360px, 104vw, 440px) !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.blaze-track
		.blaze-mobile-slide {
		padding-inline: 0 !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.blaze-pagination {
		margin-top: 3px !important;
		margin-bottom: 0 !important;
		height: 12px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.prod-mobile-image
		.share-container {
		margin-top: 2px !important;
		margin-bottom: 4px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.prod-mobile-image
		.icons,
	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.prod-mobile-image
		.icons.mt-4 {
		margin-top: 8px !important;
		margin-bottom: 4px !important;
	}

	/* Mobile buy box. */
	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.cart {
		max-width: 100% !important;
		margin-top: 0px !important;
		margin-bottom: 0px !important;
		padding-left: 16px !important;
		padding-right: 16px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.row.add-to-cart {
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding: 5px 6px 6px !important;
		padding-bottom: 5px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.add-to-cart-container {
		padding: 0 !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.add-to-cart-container
		.price {
		font-size: 42px !important;
		line-height: 1 !important;
		margin-top: 0 !important;
		margin-bottom: 0px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.add-to-cart-container
		span.hr {
		margin-top: 0px !important;
		margin-bottom: 0px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.add-to-cart-container
		.pian-wan-switcher,
	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.add-to-cart-container
		.attributes-switcher,
	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.add-to-cart-container
		.short-slices-switcher {
		margin-top: 6px !important;
		margin-bottom: 6px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.add-to-cart-container
		.pian-wan-switcher
		> div,
	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		.short-slices-switcher
		> div,
	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		.attributes-switcher
		> div {
		padding-top: 0px !important;
		padding-bottom: 0px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.add-to-cart-container
		.pian-wan-switcher
		> .wan {
		margin-top: 5px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.add-to-cart-container
		.quantity-save {
		margin-top: 4px !important;
		margin-bottom: 4px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.add-to-cart-container
		.add-to-favorites-button,
	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.add-to-cart-container
		.notify-when-available-button,
	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.add-to-cart-container
		.out-of-stock-button {
		height: 32px !important;
		font-size: 14px !important;
		margin-top: 0px !important;
		padding-top: 4px !important;
		padding-bottom: 4px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.automatic-reorder {
		margin-left: 0 !important;
		margin-right: 0 !important;
		padding-top: 8px !important;
		padding-bottom: 12px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.automatic-reorder-container
		> .form-select,
	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.automatic-reorder-container
		> .set-up-now-button {
		margin-top: 6px !important;
	}

	/* Mobile related links below the buy box and before the trust banner. */
	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.related.mobile-only {
		gap: 20px !important;
		padding-top: 8px !important;
		padding-bottom: 4px !important;
		margin-top: 4px !important;
		margin-bottom: 0px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.related.mobile-only
		.related-title {
		font-size: 14px !important;
		line-height: 1.1 !important;
		margin-bottom: 2px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.related.mobile-only
		.related-box {
		padding-top: 2px !important;
		padding-bottom: 2px !important;
	}

	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		section.prod-main
		.related.mobile-only
		.related-box
		> a {
		line-height: 1.15 !important;
		margin-top: 0px !important;
		margin-bottom: 0px !important;
	}

	/* Sticky mobile add-to-cart bar: reduce only vertical padding. */
	body:has(
			.ah-trust-banner--active[data-trust-banner-feature-flag="product-page-trust-banner"][data-trust-banner-feature-flag-value="test"]
		)
		.prod-mobile-quantity-add-to-cart {
		padding-top: 6px !important;
		padding-bottom: 6px !important;
	}
}
