/* ==================================================================
   LUMIADE brand layer — cart surfaces (Phase 5).
   Loaded SITE-WIDE (unlike pdp/shop.css): the FunnelKit slide-cart
   drawer (#fkcart-modal) is injected lazily by JS on every storefront
   page, so its skin must always be available. Everything /cart/-page-
   specific in this file is scoped under the .woocommerce-cart body
   class and cannot leak elsewhere; everything drawer-specific is
   scoped under fkcart ids/classes that exist nowhere else.
   Spec: docs/superpowers/specs/2026-07-12-clinical-rebrand-phase5-cart-account-design.md
   ================================================================== */

/* ==================================================================
   /cart/ page (WooCommerce Blocks cart, page ID 6).
   Scope = .woocommerce-cart body class — cannot fire elsewhere.
   Migrated from lumiade-homepage.css §9 + §13f + §13g (Phase 5 T3).
   ================================================================== */

/* 9a. Cart item typography: secondary ≥14px floor.
   WC sets font-size on .wc-block-components-product-name and
   .wc-block-cart-item__total via table.wc-block-cart-items selector
   (specificity 31). Raise ours to (0,4,1)=41 to win without !important. */
.woocommerce-cart table.wc-block-cart-items .wc-block-cart-items__row .wc-block-components-product-name,
.woocommerce-cart table.wc-block-cart-items .wc-block-cart-items__row .wc-block-cart-item__total {
	font-size: var(--lumiade-fs-sm);
}
/* Product price has no WC cart specificity override; (0,2,0) suffices. */
.woocommerce-cart .wc-block-components-product-price {
	font-size: var(--lumiade-fs-sm);
}

/* Column eyebrow labels ("Details" / "Total"). Rule is unconditional;
   WC-Blocks only renders these column headers at ≥700px, so it takes
   visible effect only there. */
.woocommerce-cart .wc-block-cart-items__header-product,
.woocommerce-cart .wc-block-cart-items__header-total {
	font-size: var(--lumiade-fs-eyebrow);
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

/* 9b. Quantity selector: ≥44px touch target + token border */
.woocommerce-cart .wc-block-components-quantity-selector {
	border-color: var(--lumiade-line);
	min-height: 44px;
}
.woocommerce-cart .wc-block-components-quantity-selector__button,
.woocommerce-cart .wc-block-components-quantity-selector__input {
	min-height: 44px;
}

/* 9c. Order summary panel: token soft background + 8px-rhythm padding */
.woocommerce-cart .wc-block-cart__sidebar {
	background: var(--lumiade-soft);
	border-radius: var(--lumiade-radius-sm);
	padding: var(--lumiade-space-4);
}

/* 9d. Checkout button: 44px touch target (layout only — ink fill/color are
   owned by lumiade-brand/components.css' ink-CTA rule, which reaches
   .wc-block-cart__submit-button at (0,2,0), beating Blocksy's un-!important
   .wp-element-button base rule; verified live, Phase 1 Task 5). */
.woocommerce-cart .wc-block-cart__submit-button {
	min-height: 44px;
}

/* 9e. Coupon panel label: 14px floor */
.woocommerce-cart .wc-block-components-panel__button {
	font-size: var(--lumiade-fs-sm);
}

/* — Phase 5 clinical pass — */

/* Hairline row separators. WC Blocks draws its own row border
   (border-top on td at higher-tint gray); recolor to the token hairline.
   If live verification shows no default border, this adds it. */
.woocommerce-cart table.wc-block-cart-items .wc-block-cart-items__row td {
	border-color: var(--lumiade-line);
	border-bottom: 1px solid var(--lumiade-line);
	border-top: 0;
}

/* Tabular figures on money columns. */
.woocommerce-cart .wc-block-cart-item__total,
.woocommerce-cart .wc-block-components-totals-item__value,
.woocommerce-cart .wc-block-formatted-money-amount {
	font-variant-numeric: tabular-nums;
}

/* — Free-shipping progress (slot injected by storefront JS). Migrated
   from monolith §13f; de-bronzed Phase 5 (bronze budget = stars + sale
   price only): fill was var(--lumiade-gold), now ink; the .is-unlocked
   color swaps (retired sage alias) are dropped — the unlock state is
   carried by the label text, not a color change. — */
.lumiade-ship-progress {
	background: var(--lumiade-paper);
	border: 1px solid var(--lumiade-line);
	border-radius: var(--lumiade-radius-sm);
	margin-bottom: var(--lumiade-space-3);
	padding: 12px 14px;
}
.lumiade-ship-progress:empty {
	display: none;
}
.lumiade-ship-progress-text {
	color: var(--lumiade-ink);
	display: block;
	font-size: var(--lumiade-fs-sm);
	font-weight: 600;
	margin-bottom: 8px;
}
.lumiade-ship-progress-track {
	background: var(--lumiade-line);
	border-radius: var(--lumiade-radius-pill);
	display: block;
	height: 6px;
	overflow: hidden;
}
.lumiade-ship-progress-fill {
	background: var(--lumiade-ink);
	border-radius: var(--lumiade-radius-pill);
	display: block;
	height: 100%;
	transition: width 0.3s ease;
}

/* Bundle & save nudge (slot injected by storefront JS next to the
   free-shipping progress; tiers mirror lumiade-homepage.php). Border was
   var(--lumiade-gold), now hairline; .is-unlocked color swap dropped (as above). */
.lumiade-bundle-progress {
	align-items: center;
	background: var(--lumiade-warm);
	border: 1px solid var(--lumiade-line);
	border-radius: var(--lumiade-radius-sm);
	color: var(--lumiade-ink);
	display: flex;
	font-size: var(--lumiade-fs-sm);
	font-weight: 600;
	gap: 10px;
	margin-bottom: var(--lumiade-space-3);
	padding: 12px 14px;
}
.lumiade-bundle-progress:empty {
	display: none;
}

/* — Reassurance microcopy under the checkout button (migrated §13g). — */
.woocommerce-cart .wc-block-cart__submit::after {
	color: var(--lumiade-muted);
	content: "🔒  Secure checkout  ·  30-day returns  ·  Free shipping $60+";
	display: block;
	font-size: var(--lumiade-fs-sm);
	margin-top: 10px;
	text-align: center;
}