.lwp-wholesale-price {
	display: inline-block;
}

.lwp-wholesale-price .lwp-as-low-as {
	display: block;
	font-size: 0.75em;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	opacity: 0.75;
}

.lwp-wholesale-price del {
	opacity: 0.6;
	margin-right: 0.4em;
}

.lwp-wholesale-price ins {
	text-decoration: none;
	font-weight: 700;
}

.lwp-wholesale-price--loop .lwp-unit-label {
	font-size: 0.8em;
	opacity: 0.7;
	margin-right: 0.4em;
}

.lwp-wholesale-price .lwp-savings {
	display: inline-block;
	margin-left: 0.5em;
	padding: 0.1em 0.5em;
	font-size: 0.75em;
	font-weight: 600;
	background: #ecf7ed;
	color: #2a7a2a;
	border-radius: 3px;
}

.lwp-single-product-pricing {
	margin: 0.5em 0 1em;
	padding-bottom: 1em;
	border-bottom: 1px solid #ddd;
}

.lwp-single-product-pricing p {
	margin: 0.25em 0;
}

.lwp-single-product-pricing .lwp-divider {
	margin: 0.5em 0;
	border: none;
	border-top: 1px solid #999;
}

.lwp-single-product-pricing .lwp-pack-line {
	font-weight: 600;
}

.lwp-single-product-pricing del {
	opacity: 0.6;
	margin-right: 0.4em;
}

.lwp-single-product-pricing ins {
	text-decoration: none;
	font-weight: 700;
}

.lwp-single-product-pricing .lwp-as-low-as {
	font-size: 0.85em;
	opacity: 0.75;
	margin-right: 0.3em;
}

/* The number input owns its own border/background/shadow. To show "3 packs"
   in that same cell, .lwp-quantity-cell takes over that border/background,
   and the input + our label sit inside it borderless/transparent, so visually
   it reads as one cell: [number][ packs] instead of the input having its own
   separate box. */
.lwp-quantity-cell {
	display: inline-flex;
	align-items: center;
	align-self: stretch;
	border: 1px solid #ddd;
	background: #fff;
	box-shadow: 0 1px 2px 0 rgba( 0, 0, 0, 0.1 ) inset;
	padding-right: 14px;
}

.lwp-quantity-cell input.qty {
	border: none;
	box-shadow: none;
	background: transparent;
}

.lwp-quantity-cell .lwp-packs-label {
	font-size: 16px;
	color: #333;
	white-space: nowrap;
}

.lwp-tier-table-frontend {
	margin-top: 0.5em;
	border-collapse: collapse;
	font-size: 0.9em;
}

.lwp-tier-table-frontend td {
	padding: 0.25em 0.75em 0.25em 0;
}

/* WooCommerce Cart/Checkout blocks (Store API-driven, same markup on both
   pages): hide the unlabelled per-unit price under the item name (e.g. a
   bare "$45.00" with no "each"/"per pack" context — ambiguous next to the
   line total), and the product's short description, which doesn't belong
   in a cart/checkout summary. Scoped to wholesale customers only via the
   body class — the retail experience is untouched. */
body.lwp-wholesale .wc-block-cart-item__prices,
body.lwp-wholesale .wc-block-components-product-metadata__description {
	display: none !important;
}

.lwp-terms-link {
	color: inherit;
	text-decoration: underline;
	cursor: pointer;
}

.lwp-terms-modal-overlay {
	position: fixed;
	inset: 0;
	background: rgba( 0, 0, 0, 0.5 );
	z-index: 100000;
	padding: 1em;
}

.lwp-terms-modal-overlay:not( [hidden] ) {
	display: flex;
	align-items: center;
	justify-content: center;
}

.lwp-terms-modal {
	position: relative;
	max-width: 600px;
	width: 100%;
	max-height: 80vh;
	overflow-y: auto;
	padding: 2em;
	border-radius: 6px;
	background: #fff;
	box-shadow: 0 10px 40px rgba( 0, 0, 0, 0.2 );
}

.lwp-terms-modal h3 {
	margin-top: 0;
}

.lwp-terms-modal-body p:last-child {
	margin-bottom: 0;
}

.lwp-terms-modal-close {
	position: absolute;
	top: 0.5em;
	right: 0.5em;
	padding: 0.25em 0.5em;
	border: none;
	background: none;
	font-size: 1.5em;
	line-height: 1;
	color: #666;
	cursor: pointer;
}

.lwp-terms-modal-close:hover {
	color: #000;
}

body.lwp-terms-modal-open {
	overflow: hidden;
}

.lwp-cart-savings-banner {
	max-width: 700px;
	margin: 0 0 1.5em;
	padding: 0.75em 1.25em;
	border-radius: 4px;
	background: #ecf7ed;
	color: #2a7a2a;
	font-weight: 600;
}

.lwp-lead-time-note {
	max-width: 700px;
	margin: 0 0 1.5em;
	padding: 0.75em 1.25em;
	border-radius: 4px;
	background: #f9f9f9;
	border: 1px solid #ddd;
}

/* "Total individual items" row (assets/js/order-summary-unit-count.js): the
   Blocks API only offers ExperimentalOrderMeta, which always renders at the
   very end of the Order Summary panel — turning the panel into a
   single-column grid lets `order` move this row above Subtotal instead,
   without touching DOM order (which the slot API doesn't expose).
   Structure (verified by reading each child's actual text, not just its
   class — a first attempt at this assumed "totals-block" contained the
   grand Total and broke the layout, since it actually holds Subtotal +
   Shipping; the real Total row is a *different* sibling with no distinguishing
   class of its own beyond the generic wrapper class, hence the exact-match
   attribute selector below rather than a plain class selector, which would
   also match the cart-items/coupon-form/slot rows that share that same
   base class): cart-items, coupon-form → totals-block (Subtotal + Shipping)
   → Total → our slot. Only totals-block and Total need explicit `order`
   here; our slot's order just needs to land between the untouched default
   (0) and Total's. */
.wc-block-components-checkout-order-summary__content,
.wp-block-woocommerce-cart-order-summary-block {
	display: grid;
}

.wc-block-components-checkout-order-summary__content > .slot-wrapper,
.wp-block-woocommerce-cart-order-summary-block > .slot-wrapper {
	order: 1;
}

.wp-block-woocommerce-checkout-order-summary-totals-block,
.wp-block-woocommerce-cart-order-summary-totals-block {
	order: 2;
}

.wc-block-components-checkout-order-summary__content > [class="wc-block-components-totals-wrapper"],
.wp-block-woocommerce-cart-order-summary-block > [class="wc-block-components-totals-wrapper"] {
	order: 3;
}

.lwp-total-units-line {
	font-weight: 600;
	margin: 0 0 0;
}

/* Checkout's Subtotal row has a native ~16px indent from the panel edge;
   Cart's Subtotal row has none (sits flush) — same padding value can't
   match both, confirmed by measuring each row's actual rendered position
   rather than assuming the two pages share a layout. */
.wc-block-components-checkout-order-summary__content .lwp-total-units-line {
	padding-left: 15px !important;
}

/* Shipping option rows (Wholesale Shipping / Pickup): the label and price sit
   side by side in a flex row. WooCommerce's own base style pins the price
   (".secondary-label") to a fixed `flex: 0 0 50%` — always exactly half the
   row's width no matter how short the price text is ("$30.00" was sitting
   in a 285px-wide box). That leaves the label only the other half (~285px)
   to work with, too narrow for a longer custom Pickup label (editable
   under Settings), so its text used to wrap mid-sentence. Fix has two
   parts:
   1. Un-pin the price from that forced 50% (flex: 0 0 auto) so its box
      shrinks to fit its actual text — freeing up the rest of the row for
      the label instead of reserving half of it for six characters.
   2. min-width: max-content on the label stops it being squeezed onto
      multiple lines in the first place (its shrink floor becomes its own
      full single-line width), and flex-wrap: nowrap keeps the price on
      the same line rather than dropping to one below — a longer label
      just grows to fill the row instead. (An earlier attempt let the row
      wrap the price onto its own line below; that avoided the
      mid-sentence wrap but looked broken instead of fixed. A second
      attempt kept the 50%-wide price box and tried to claw back its
      overflow past the row's padding with a margin — the fixed-percent
      box was the actual bug, so nothing short of un-pinning it worked.) */
.wc-block-components-shipping-rates-control .wc-block-components-radio-control__label-group {
	flex-wrap: nowrap;
}

.wc-block-components-shipping-rates-control .wc-block-components-radio-control__label {
	flex: 1 1 auto;
	min-width: max-content;
}

.wc-block-components-shipping-rates-control .wc-block-components-radio-control__secondary-label {
	flex: 0 0 auto;
}

.wp-block-woocommerce-cart-order-summary-block .lwp-total-units-line {
	padding-left: 0 !important;
}