/* Bundled item price line — responsive wrapping fix, 2026-09-23 (Chris).
   Delete this file + its enqueue in functions.php to revert.

   PROBLEM
   The line "Add for $12.14 Sale Price! 50% off! $24.28 MSRP" broke badly below
   ~1150px: "Add for" stranded on its own line and "MSRP" orphaned on a third.
   Two causes:
     1. span.price is display:inline-flex — an atomic inline box, so the whole
        price drops below "Add for" the instant it cannot fit beside it.
     2. The del ($24.28) and span.msrp (MSRP) are independent flex items in a
        flex-wrap:wrap container, so they wrap one at a time and MSRP orphans.
   Above ~1200px the line fits on one row unaided, so this is scoped to 1199px.

   WHY !important AND THE LONG SELECTORS
   The Customizer's Additional CSS (wp-custom-css — stored in the DB, NOT in
   this theme) already styles this exact line, at specificity up to (0,11,1)
   with !important:
     PRE = .single-product .product .summary form.cart .bundle_form
           .bundled_product .details .bundled_product_optional_checkbox
     PRE .price                         { display:inline-flex; flex-wrap:wrap }
     PRE .price .zen-...-display        { font-size:16px; font-weight:700; margin-right:8px }
     PRE .price .zen-...-display .zen-...-title          { font-size:16px !important }
     PRE .price .zen-...-section-page-description        { font-size:16px !important; margin-right:8px }
     PRE .price del, PRE .price .msrp                    { font-size:16px !important }
   Block B below mirrors that chain with two classes doubled to outrank it.
   If those Customizer rules are ever removed, Block B can go with them. */

@media all and (max-width: 1199px) {

	/* ---------------------------------------------------------------
	   BLOCK A — baseline. Also covers non-optional bundled items,
	   which have no .bundled_product_optional_checkbox label and are
	   therefore untouched by the Customizer rules.
	   --------------------------------------------------------------- */

	.bundled_product label.bundled_product_optional_checkbox {
		font-size: 13px !important;
	}

	/* Un-atomise the price box so its contents join the label's line flow. */
	.bundled_product .price {
		display: inline !important;
		font-size: 13px !important;
	}

	.bundled_product .price .zen-product-vip-price-display,
	.bundled_product .price .zen-product-vip-price-display-price,
	.bundled_product .price .zen-product-vip-price-display-title,
	.bundled_product .price .zen-product-vip-price-display-section-page-description,
	.bundled_product .price del,
	.bundled_product .price del .woocommerce-Price-amount {
		display: inline !important;
		font-size: 13px !important;
	}

	/* Keep "$12.14 Sale Price!" together as one unit. */
	.bundled_product .price .zen-product-vip-price-display {
		white-space: nowrap;
	}

	/* Weld "$24.28 MSRP" into a single unbreakable token so MSRP can never
	   orphan. The real .msrp span is hidden and re-rendered on the del, which
	   is the only way to group them without touching the markup. inline-block
	   keeps the pseudo-element clear of the del's line-through. */
	.bundled_product .price .msrp {
		display: none;
	}
	.bundled_product .price del {
		white-space: nowrap;
	}
	.bundled_product .price del::after {
		content: " MSRP";
		display: inline-block;
		text-decoration: none;
		color: #9e9e9e;
		font-weight: 500;
		font-size: 13px;
	}

	/* Keep "50% off!" intact — the space inside it is otherwise a break
	   opportunity, and on a 320px phone it splits into "50%" / "off!". */
	.bundled_product .price .zen-product-vip-price-display-section-page-description {
		white-space: nowrap;
	}

	/* There is no whitespace text node between "50% off!" and the del, so
	   without this they could never break apart and would overflow the column
	   on narrow phones instead of wrapping. The pseudo-element re-enables
	   normal white-space so this one space stays a valid break point despite
	   the nowrap above. */
	.bundled_product .price .zen-product-vip-price-display-section-page-description::after {
		content: " ";
		white-space: normal;
	}

	/* ---------------------------------------------------------------
	   BLOCK B — same declarations, re-stated at a specificity that
	   outranks the Customizer's !important rules. Optional items only.
	   --------------------------------------------------------------- */

	.single-product .product .summary form.cart .bundle_form .bundled_product.bundled_product .details .bundled_product_optional_checkbox.bundled_product_optional_checkbox .price {
		display: inline !important;
		font-size: 13px !important;
	}

	.single-product .product .summary form.cart .bundle_form .bundled_product.bundled_product .details .bundled_product_optional_checkbox.bundled_product_optional_checkbox .price .zen-product-vip-price-display,
	.single-product .product .summary form.cart .bundle_form .bundled_product.bundled_product .details .bundled_product_optional_checkbox.bundled_product_optional_checkbox .price .zen-product-vip-price-display .zen-product-vip-price-display-price,
	.single-product .product .summary form.cart .bundle_form .bundled_product.bundled_product .details .bundled_product_optional_checkbox.bundled_product_optional_checkbox .price .zen-product-vip-price-display .zen-product-vip-price-display-title,
	.single-product .product .summary form.cart .bundle_form .bundled_product.bundled_product .details .bundled_product_optional_checkbox.bundled_product_optional_checkbox .price .zen-product-vip-price-display-section-page-description,
	.single-product .product .summary form.cart .bundle_form .bundled_product.bundled_product .details .bundled_product_optional_checkbox.bundled_product_optional_checkbox .price del {
		display: inline !important;
		font-size: 13px !important;
	}
}