/**
 * ThornBloom Studio — Cart + Checkout v3 (Midnight Blue redesign)
 * Author: website-manager, 2026-04-22
 * Source of truth: outputs/designs/midnight-blue-pages-2026-04-20/cart/mockup.html
 *
 * v3 Dark-Body Overhaul — 2026-04-22
 * ----------------------------------
 * Architectural correction: the ENTIRE cart + checkout surface now matches the
 * original Midnight Blue mockup's dark-body aesthetic. Prior v1/v2-fix painted
 * containers dark but left the Astra wrapper chain cream by default, which
 * bled through wherever a v2 selector missed. v3 closes this by:
 *
 *   1. Gating the legacy /* ── Cart & Checkout ── * / block in style.css (lines
 *      1350–2003) off wholesale — it painted .entry-content cream with !important
 *      and had higher specificity than body.tb-cart-v2 .entry-content.
 *   2. Resetting EVERY Astra wrapper under body.tb-cart-v2 / body.tb-checkout-v2
 *      to transparent: #page, .site, #content, .site-content, .ast-container,
 *      #primary, .content-area, .site-main, article, .entry-content,
 *      .ast-woocommerce-container, .site-primary-header-wrap.
 *   3. Giving body a single dark body-bg rule.
 *   4. Broad cream text cascade at body level, then specialize gold for
 *      eyebrows/totals/CTAs.
 *
 * Scope: body-class-gated only. Never touches non-cart/-checkout pages.
 *
 * BLOCK-AWARE. Targets WC Blocks DOM (.wp-block-woocommerce-*, .wc-block-*).
 *
 * Hard constraints (unchanged from v2):
 *  - NEVER touch .wc-stripe-*, .wc-block-components-payment-method internals,
 *    .wc-stripe-payment-request-button*. Apple/Google Pay lifecycle lives there.
 *  - NEVER touch .widget_shopping_cart_content — WC fragment wipes custom markup.
 *  - All injected hero/trust/sticky/realm markup is added via cart-checkout-v2.js
 *    on DOMContentLoaded. This file styles what JS inserts + what WC renders.
 *  - Tokens pulled from tokens.css. No new :root block here.
 *
 * Tokens used (from tokens.css):
 *   --realm-bg          #070A14   page background
 *   --realm-primary     #0E1426   summary card / dark panels
 *   --realm-secondary   #161E35   thumbnails
 *   --realm-cream       #ECE4D5   body text + titles
 *   --realm-taupe       #B8B3A8   italic/meta text
 *   --realm-metallic    #D1B28C   gold eyebrows/totals/CTAs
 *   --realm-metallic-bright  #E1C29A  CTA hover
 *   --realm-muted       #5A6580   hero atmosphere only
 *   --tb-border-gold    rgba(209, 178, 140, 0.18)   hairline dividers
 *   --tb-border-taupe   rgba(196, 188, 177, 0.14)   muted chrome
 *   --tb-border-strong  rgba(209, 178, 140, 0.35)   emphasised edges
 */

/* =============================================================
   0. PAGE SHELL — dark body + full wrapper reset
      Scoped ONLY to body.tb-cart-v2 and body.tb-checkout-v2.
      Every Astra wrapper class is explicitly reset transparent so
      the body's dark bg reads through to the content area.
   ============================================================= */

body.tb-cart-v2,
body.tb-checkout-v2 {
	background: var(--realm-bg) !important;
	background-color: var(--realm-bg) !important;
	color: var(--realm-cream) !important;
	font-family: var(--tb-font-body);
}

/* Astra wrapper chain:
   body > #page.hfeed.site > #content.site-content > .ast-container
        > #primary.content-area.primary > .site-main > article > .entry-content
        > .ast-woocommerce-container
   All must be transparent so body's dark bg is what the user sees.     */
body.tb-cart-v2 #page,
body.tb-cart-v2 .site,
body.tb-cart-v2 #content,
body.tb-cart-v2 .site-content,
body.tb-cart-v2 .ast-container,
body.tb-cart-v2 #primary,
body.tb-cart-v2 .content-area,
body.tb-cart-v2 .site-main,
body.tb-cart-v2 article,
body.tb-cart-v2 .entry-content,
body.tb-cart-v2 .ast-woocommerce-container,
body.tb-cart-v2 .site-primary-header-wrap,
body.tb-checkout-v2 #page,
body.tb-checkout-v2 .site,
body.tb-checkout-v2 #content,
body.tb-checkout-v2 .site-content,
body.tb-checkout-v2 .ast-container,
body.tb-checkout-v2 #primary,
body.tb-checkout-v2 .content-area,
body.tb-checkout-v2 .site-main,
body.tb-checkout-v2 article,
body.tb-checkout-v2 .entry-content,
body.tb-checkout-v2 .ast-woocommerce-container,
body.tb-checkout-v2 .site-primary-header-wrap {
	background: transparent !important;
	background-color: transparent !important;
	padding: 0 !important;
	margin: 0 !important;
	border: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	color: inherit !important;
}

/* Kill Astra default page title / entry header — we render our own editorial hero */
body.tb-cart-v2 .entry-header,
body.tb-cart-v2 .ast-above-header-section,
body.tb-cart-v2 .page-title,
body.tb-cart-v2 .entry-title,
body.tb-cart-v2 header.entry-header,
body.tb-checkout-v2 .entry-header,
body.tb-checkout-v2 .ast-above-header-section,
body.tb-checkout-v2 .page-title,
body.tb-checkout-v2 .entry-title,
body.tb-checkout-v2 header.entry-header {
	display: none !important;
}

/* Full-bleed content container — we control interior spacing */
body.tb-cart-v2 .site-content > .ast-container,
body.tb-checkout-v2 .site-content > .ast-container {
	max-width: none !important;
	width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* Broad cream-text cascade on all Astra wrapper chain nodes.
   Specialized gold/taupe rules below override where needed. */
body.tb-cart-v2 #page,
body.tb-cart-v2 #content,
body.tb-cart-v2 .site-content,
body.tb-cart-v2 .ast-container,
body.tb-cart-v2 .content-area,
body.tb-cart-v2 .site-main,
body.tb-cart-v2 article,
body.tb-cart-v2 .entry-content,
body.tb-checkout-v2 #page,
body.tb-checkout-v2 #content,
body.tb-checkout-v2 .site-content,
body.tb-checkout-v2 .ast-container,
body.tb-checkout-v2 .content-area,
body.tb-checkout-v2 .site-main,
body.tb-checkout-v2 article,
body.tb-checkout-v2 .entry-content {
	color: var(--realm-cream) !important;
}

/* Default paragraph + heading text inside cart/checkout body */
body.tb-cart-v2 p,
body.tb-cart-v2 span,
body.tb-cart-v2 li,
body.tb-cart-v2 h1,
body.tb-cart-v2 h2,
body.tb-cart-v2 h3,
body.tb-cart-v2 h4,
body.tb-checkout-v2 p,
body.tb-checkout-v2 span,
body.tb-checkout-v2 li,
body.tb-checkout-v2 h1,
body.tb-checkout-v2 h2,
body.tb-checkout-v2 h3,
body.tb-checkout-v2 h4 {
	color: var(--realm-cream);
}

/* =============================================================
   1. EDITORIAL HERO — injected by JS above the WC block wrapper
   ============================================================= */

.tb-cart-hero {
	position: relative;
	padding: 88px 56px 56px;
	overflow: hidden;
	background: transparent;
}

.tb-cart-hero::before {
	content: '';
	position: absolute;
	inset: 0;
	background:
		radial-gradient(ellipse at 20% 30%, color-mix(in srgb, var(--realm-secondary) 70%, transparent) 0%, transparent 50%),
		radial-gradient(ellipse at 80% 70%, color-mix(in srgb, var(--realm-muted) 18%, transparent) 0%, transparent 55%);
	pointer-events: none;
	z-index: 0;
}

.tb-cart-hero__inner {
	max-width: 1280px;
	margin: 0 auto;
	position: relative;
	z-index: 1;
}

.tb-cart-hero__breadcrumb {
	font-family: var(--tb-font-heading);
	font-size: 10px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--realm-taupe);
	margin-bottom: 28px;
}

.tb-cart-hero__breadcrumb a {
	color: var(--realm-taupe);
	text-decoration: none;
}

.tb-cart-hero__breadcrumb a:hover {
	color: var(--realm-metallic);
}

.tb-cart-hero__breadcrumb .sep {
	margin: 0 12px;
	opacity: 0.6;
}

.tb-cart-hero__breadcrumb .current {
	color: var(--realm-metallic);
}

.tb-cart-hero__eyebrow {
	font-family: var(--tb-font-heading);
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	font-size: 12px;
	color: var(--realm-metallic);
}

.tb-cart-hero h1 {
	font-family: var(--tb-font-display);
	font-weight: 600;
	letter-spacing: -0.005em;
	line-height: 1.05;
	font-size: clamp(40px, 4.8vw, 68px);
	color: var(--realm-cream);
	margin: 14px 0 16px;
	max-width: 820px;
}

.tb-cart-hero h1 em {
	font-style: italic;
	font-weight: 500;
}

.tb-cart-hero__lead {
	color: var(--realm-taupe);
	font-size: 18px;
	font-style: italic;
	line-height: 1.7;
	max-width: 640px;
	margin: 0;
}

@media (max-width: 900px) {
	.tb-cart-hero {
		padding: 64px 24px 40px;
	}
}

/* =============================================================
   2. CART/CHECKOUT BLOCK WRAPPER — 2-col layout on desktop
   ============================================================= */

body.tb-cart-v2 .wp-block-woocommerce-cart,
body.tb-checkout-v2 .wp-block-woocommerce-checkout {
	max-width: 1280px !important;
	margin: 0 auto !important;
	padding: 40px 56px 120px !important;
	background: transparent !important;
}

/* WC Blocks filled-cart container wraps both the items col and totals col */
body.tb-cart-v2 .wp-block-woocommerce-filled-cart-block {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 380px !important;
	gap: 56px !important;
	align-items: start !important;
	background: transparent !important;
}

/* Checkout 2-col */
body.tb-checkout-v2 .wp-block-woocommerce-checkout {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 380px !important;
	gap: 56px !important;
	align-items: start !important;
}

@media (max-width: 1099px) {
	body.tb-cart-v2 .wp-block-woocommerce-cart,
	body.tb-checkout-v2 .wp-block-woocommerce-checkout {
		padding: 32px 24px 120px !important;
	}
	body.tb-cart-v2 .wp-block-woocommerce-filled-cart-block,
	body.tb-checkout-v2 .wp-block-woocommerce-checkout {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 40px !important;
	}
}

/* =============================================================
   3. CART LINE ITEMS — 3-column grid: image / product / total
      Matches real WC Blocks DOM (qty + remove live INSIDE __product)
   ============================================================= */

body.tb-cart-v2 .wp-block-woocommerce-cart-items-block,
body.tb-cart-v2 .wp-block-woocommerce-cart-line-items-block {
	min-width: 0;
	background: transparent !important;
}

.tb-cart-items-eyebrow {
	font-family: var(--tb-font-heading);
	font-size: 10px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--realm-metallic);
	padding: 12px 0;
	margin: 0 0 6px;
	border-bottom: 1px solid var(--tb-border-gold);
}

body.tb-cart-v2 .wc-block-cart-items,
body.tb-cart-v2 table.wc-block-cart-items {
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	width: 100% !important;
	border-collapse: collapse !important;
	color: var(--realm-cream) !important;
}

body.tb-cart-v2 .wc-block-cart-items thead,
body.tb-cart-v2 .wc-block-cart-items__header {
	display: none !important;
}

/* Each row: 3 cols = image | product | total */
body.tb-cart-v2 .wc-block-cart-items__row,
body.tb-cart-v2 tr.wc-block-cart-items__row {
	display: grid !important;
	grid-template-columns: 120px minmax(0, 1fr) 160px !important;
	gap: 24px !important;
	padding: 28px 0 !important;
	border-bottom: 1px solid var(--tb-border-gold) !important;
	align-items: start !important;
	background: transparent !important;
	width: 100% !important;
}

body.tb-cart-v2 .wc-block-cart-items__row > td,
body.tb-cart-v2 .wc-block-cart-items__row > th {
	padding: 0 !important;
	border: none !important;
	background: transparent !important;
	vertical-align: top !important;
	display: block !important;
	width: auto !important;
	min-width: 0 !important;
}

/* IMAGE column */
body.tb-cart-v2 .wc-block-cart-item__image,
body.tb-cart-v2 td.wc-block-cart-item__image {
	width: 120px !important;
	max-width: 120px !important;
	height: 150px !important;
	background: var(--realm-secondary) !important;
	border: 1px solid var(--tb-border-gold) !important;
	overflow: hidden !important;
	float: none !important;
	margin: 0 !important;
	padding: 0 !important;
	display: block !important;
}

body.tb-cart-v2 .wc-block-cart-item__image a,
body.tb-cart-v2 .wc-block-cart-item__image img {
	display: block !important;
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	max-width: none !important;
	border-radius: 0 !important;
}

/* PRODUCT column */
body.tb-cart-v2 .wc-block-cart-item__product,
body.tb-cart-v2 td.wc-block-cart-item__product {
	color: var(--realm-cream) !important;
	padding: 0 !important;
	min-width: 0 !important;
	overflow: visible !important;
	display: block !important;
	background: transparent !important;
}

body.tb-cart-v2 .wc-block-cart-item__wrap {
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
	min-width: 0 !important;
}

/* Title link + text */
body.tb-cart-v2 .wc-block-cart-item__product .wc-block-components-product-name,
body.tb-cart-v2 .wc-block-components-product-name,
body.tb-cart-v2 a.wc-block-components-product-name {
	font-family: var(--tb-font-display) !important;
	font-weight: 600 !important;
	font-size: 22px !important;
	color: var(--realm-cream) !important;
	line-height: 1.2 !important;
	margin: 0 !important;
	padding: 0 !important;
	text-decoration: none !important;
	display: block !important;
	word-break: normal !important;
	overflow-wrap: anywhere !important;
	background: transparent !important;
}

body.tb-cart-v2 .wc-block-cart-item__product .wc-block-components-product-name:hover,
body.tb-cart-v2 a.wc-block-components-product-name:hover {
	color: var(--realm-metallic) !important;
}

/* Unit price row under title */
body.tb-cart-v2 .wc-block-cart-item__prices {
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
}

body.tb-cart-v2 .wc-block-cart-item__prices .wc-block-components-product-price {
	font-family: var(--tb-font-body) !important;
	font-size: 14px !important;
	font-style: italic !important;
	color: var(--realm-taupe) !important;
	font-weight: 400 !important;
}

/* Realm chip — JS-injected before title */
.tb-cart-item__realm {
	display: block;
	font-family: var(--tb-font-heading);
	font-size: 12px;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--realm-metallic);
	margin: 0 0 2px;
	order: -1;
}

/* Pieces / meta line — JS-injected after title */
.tb-cart-item__meta {
	color: var(--realm-taupe);
	font-size: 14px;
	font-style: italic;
	line-height: 1.55;
	margin: 0;
}

/* Hide WC's product-metadata block */
body.tb-cart-v2 .wc-block-components-product-metadata,
body.tb-cart-v2 .wc-block-cart-item__product .wc-block-components-product-details {
	display: none !important;
}

/* Low-stock / sale badges off-brand for digital */
body.tb-cart-v2 .wc-block-components-product-badge,
body.tb-cart-v2 .wc-block-components-sale-badge {
	display: none !important;
}

/* =============================================================
   4. QUANTITY STEPPER + REMOVE LINK
      Both live INSIDE .wc-block-cart-item__product under .__quantity.
   ============================================================= */

body.tb-cart-v2 .wc-block-cart-item__quantity {
	display: flex !important;
	align-items: center !important;
	gap: 16px !important;
	justify-content: flex-start !important;
	margin: 4px 0 0 !important;
	padding: 0 !important;
	background: transparent !important;
}

body.tb-cart-v2 .wc-block-components-quantity-selector {
	display: inline-flex !important;
	align-items: stretch !important;
	border: 1px solid var(--tb-border-taupe) !important;
	border-radius: 2px !important;
	overflow: hidden !important;
	background: transparent !important;
	width: 120px !important;
	max-width: 120px !important;
	height: 40px !important;
	flex: 0 0 auto !important;
}

body.tb-cart-v2 .wc-block-components-quantity-selector__button,
body.tb-cart-v2 button.wc-block-components-quantity-selector__button {
	width: 40px !important;
	min-width: 40px !important;
	height: 40px !important;
	background: transparent !important;
	border: none !important;
	color: var(--realm-cream) !important;
	font-family: var(--tb-font-display) !important;
	font-size: 18px !important;
	line-height: 1 !important;
	cursor: pointer !important;
	transition: color .2s ease, background .2s ease !important;
	padding: 0 !important;
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	visibility: visible !important;
	opacity: 1 !important;
}

body.tb-cart-v2 .wc-block-components-quantity-selector__button:hover {
	color: var(--realm-metallic) !important;
	background: color-mix(in srgb, var(--realm-metallic) 8%, transparent) !important;
}

body.tb-cart-v2 .wc-block-components-quantity-selector__button:disabled {
	opacity: 0.4 !important;
	cursor: not-allowed !important;
}

body.tb-cart-v2 .wc-block-components-quantity-selector__input,
body.tb-cart-v2 input.wc-block-components-quantity-selector__input {
	flex: 1 1 auto !important;
	width: 40px !important;
	min-width: 40px !important;
	height: 40px !important;
	background: transparent !important;
	border: none !important;
	border-left: 1px solid var(--tb-border-taupe) !important;
	border-right: 1px solid var(--tb-border-taupe) !important;
	color: var(--realm-cream) !important;
	text-align: center !important;
	font-family: var(--tb-font-display) !important;
	font-size: 16px !important;
	padding: 0 !important;
	line-height: 40px !important;
	box-shadow: none !important;
	-moz-appearance: textfield;
}

body.tb-cart-v2 .wc-block-components-quantity-selector__input::-webkit-inner-spin-button,
body.tb-cart-v2 .wc-block-components-quantity-selector__input::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

body.tb-cart-v2 .wc-block-components-quantity-selector__input:focus {
	outline: none !important;
	background: color-mix(in srgb, var(--realm-metallic) 6%, transparent) !important;
}

/* Remove link */
body.tb-cart-v2 .wc-block-cart-item__remove-link,
body.tb-cart-v2 button.wc-block-cart-item__remove-link {
	font-family: var(--tb-font-heading) !important;
	font-size: 10px !important;
	letter-spacing: 0.2em !important;
	text-transform: uppercase !important;
	color: var(--realm-taupe) !important;
	text-decoration: none !important;
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
	transition: color .2s ease !important;
	cursor: pointer !important;
}

body.tb-cart-v2 .wc-block-cart-item__remove-link:hover {
	color: var(--realm-metallic) !important;
}

body.tb-cart-v2 .wc-block-cart-item__remove-link svg {
	width: 16px !important;
	height: 16px !important;
	fill: currentColor !important;
}

/* =============================================================
   5. TOTAL column (td 3)
   ============================================================= */

body.tb-cart-v2 .wc-block-cart-item__total,
body.tb-cart-v2 td.wc-block-cart-item__total {
	text-align: right !important;
	color: var(--realm-metallic) !important;
	align-self: start !important;
	padding-top: 4px !important;
	background: transparent !important;
}

body.tb-cart-v2 .wc-block-cart-item__total .wc-block-components-product-price,
body.tb-cart-v2 .wc-block-cart-item__total .wc-block-components-product-price__value,
body.tb-cart-v2 .wc-block-cart-item__total-price-and-sale-badge-wrapper .wc-block-components-product-price__value {
	font-family: var(--tb-font-display) !important;
	font-size: 22px !important;
	color: var(--realm-metallic) !important;
	font-weight: 600 !important;
}

body.tb-cart-v2 .wc-block-components-product-price ins {
	text-decoration: none !important;
}

body.tb-cart-v2 .wc-block-components-product-price del {
	display: none !important; /* house rule: no strikethrough */
}

@media (max-width: 720px) {
	body.tb-cart-v2 .wc-block-cart-items__row,
	body.tb-cart-v2 tr.wc-block-cart-items__row {
		grid-template-columns: 88px minmax(0, 1fr) !important;
		gap: 16px !important;
	}
	body.tb-cart-v2 .wc-block-cart-item__image {
		width: 88px !important;
		height: 110px !important;
	}
	body.tb-cart-v2 .wc-block-cart-item__total {
		grid-column: 1 / -1 !important;
		text-align: left !important;
		padding: 8px 0 0 !important;
	}
	body.tb-cart-v2 .wc-block-cart-item__product .wc-block-components-product-name {
		font-size: 19px !important;
	}
}

/* =============================================================
   6. ACTIONS ROW — coupon + continue shopping (JS-moved)
   ============================================================= */

.tb-cart-actions {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 20px;
	padding: 28px 0;
	border-bottom: 1px solid var(--tb-border-gold);
	flex-wrap: wrap;
	background: transparent;
}

.tb-cart-actions .tb-continue-link {
	font-family: var(--tb-font-heading);
	font-size: 11px;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--realm-taupe);
	text-decoration: none;
	order: 2;
}

.tb-cart-actions .tb-continue-link:hover {
	color: var(--realm-metallic);
}

.tb-cart-actions .tb-continue-link::before {
	content: '\2190 ';
	margin-right: 2px;
}

/* Coupon form relocated into actions row */
.tb-cart-actions .wp-block-woocommerce-cart-order-summary-coupon-form-block,
.tb-cart-actions [class*="coupon-form"] {
	flex: 1;
	max-width: 420px;
	order: 1;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: none !important;
}

.tb-cart-actions .wc-block-components-totals-coupon,
body.tb-cart-v2 .tb-cart-actions .wc-block-components-totals-coupon {
	background: transparent !important;
	padding: 0 !important;
	border: none !important;
}

.tb-cart-actions .wc-block-components-totals-coupon__button,
.tb-cart-actions .wc-block-components-panel__button {
	font-family: var(--tb-font-heading) !important;
	font-size: 11px !important;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
	color: var(--realm-metallic) !important;
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
	text-decoration: none !important;
}

.tb-cart-actions .wc-block-components-totals-coupon__content {
	margin-top: 12px !important;
}

.tb-cart-actions .wc-block-components-totals-coupon__form {
	display: flex !important;
	gap: 10px !important;
	align-items: stretch !important;
}

.tb-cart-actions .wc-block-components-text-input input,
.tb-cart-actions .wc-block-components-totals-coupon input[type="text"] {
	background: transparent !important;
	border: 1px solid var(--tb-border-strong, rgba(209, 178, 140, 0.35)) !important;
	color: var(--realm-cream) !important;
	font-family: var(--tb-font-body) !important;
	padding: 12px 16px !important;
	border-radius: 2px !important;
	width: 100% !important;
}

.tb-cart-actions .wc-block-components-text-input input:focus,
.tb-cart-actions .wc-block-components-totals-coupon input[type="text"]:focus {
	outline: none !important;
	border-color: var(--realm-metallic) !important;
	box-shadow: none !important;
}

.tb-cart-actions .wc-block-components-totals-coupon__button.components-button.is-secondary {
	padding: 12px 22px !important;
	font-family: var(--tb-font-heading) !important;
	font-size: 10px !important;
	letter-spacing: 0.2em !important;
	text-transform: uppercase !important;
	background: transparent !important;
	color: var(--realm-metallic) !important;
	border: 1px solid var(--realm-metallic) !important;
	border-radius: 2px !important;
}

.tb-cart-actions .wc-block-components-totals-coupon__button.components-button.is-secondary:hover {
	background: color-mix(in srgb, var(--realm-metallic) 12%, transparent) !important;
}

@media (max-width: 720px) {
	.tb-cart-actions {
		flex-direction: column;
		align-items: stretch;
	}
	.tb-cart-actions .tb-continue-link {
		order: 2;
	}
}

/* =============================================================
   7. TRUST STRIP
   ============================================================= */

.tb-cart-trust {
	display: flex;
	justify-content: center;
	gap: 48px;
	padding: 32px 0;
	border-bottom: 1px solid var(--tb-border-gold);
	color: var(--realm-taupe);
	font-family: var(--tb-font-heading);
	font-size: 11px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	flex-wrap: wrap;
	background: transparent;
}

.tb-cart-trust span {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.tb-cart-trust span::before {
	content: '\2766';
	color: var(--realm-metallic);
	font-size: 12px;
}

@media (max-width: 720px) {
	.tb-cart-trust {
		gap: 20px;
		padding: 24px 0;
		font-size: 10px;
	}
}

/* =============================================================
   8. ORDER SUMMARY SIDEBAR (Cart)
   ============================================================= */

body.tb-cart-v2 .wp-block-woocommerce-cart-totals-block,
body.tb-cart-v2 .wp-block-woocommerce-cart-order-summary-block {
	background: var(--realm-primary) !important;
	color: var(--realm-cream) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

body.tb-cart-v2 .wp-block-woocommerce-cart-totals-block {
	position: sticky !important;
	top: 24px !important;
	border: 1px solid var(--tb-border-gold) !important;
	padding: 36px 32px !important;
	align-self: start !important;
}

@media (max-width: 1099px) {
	body.tb-cart-v2 .wp-block-woocommerce-cart-totals-block {
		position: static !important;
	}
}

/* Broad cream cascade inside sidebar */
body.tb-cart-v2 .wp-block-woocommerce-cart-totals-block,
body.tb-cart-v2 .wp-block-woocommerce-cart-totals-block *,
body.tb-cart-v2 .wp-block-woocommerce-cart-order-summary-block,
body.tb-cart-v2 .wp-block-woocommerce-cart-order-summary-block *:not(svg):not(path) {
	color: var(--realm-cream);
}

body.tb-cart-v2 .wp-block-woocommerce-cart-order-summary-heading-block,
body.tb-cart-v2 .wp-block-woocommerce-cart-order-summary-heading-block * {
	margin: 0 0 24px !important;
	padding: 0 !important;
	border: none !important;
}

body.tb-cart-v2 .wp-block-woocommerce-cart-order-summary-heading-block h2,
body.tb-cart-v2 .wp-block-woocommerce-cart-order-summary-heading-block,
body.tb-cart-v2 .wc-block-components-totals-wrapper h2 {
	font-family: var(--tb-font-display) !important;
	font-size: 26px !important;
	font-weight: 600 !important;
	color: var(--realm-cream) !important;
	margin: 0 !important;
	letter-spacing: -0.005em !important;
	text-transform: none !important;
}

body.tb-cart-v2 .wc-block-components-totals-item {
	display: flex !important;
	justify-content: space-between !important;
	align-items: baseline !important;
	padding: 14px 0 !important;
	font-size: 16px !important;
	border-bottom: 1px solid var(--tb-border-taupe) !important;
	background: transparent !important;
	margin: 0 !important;
}

body.tb-cart-v2 .wc-block-components-totals-item__label {
	font-family: var(--tb-font-heading) !important;
	font-size: 10px !important;
	letter-spacing: 0.2em !important;
	text-transform: uppercase !important;
	color: var(--realm-cream) !important;
	opacity: 0.85;
}

body.tb-cart-v2 .wc-block-components-totals-item__value {
	font-family: var(--tb-font-display) !important;
	font-size: 17px !important;
	color: var(--realm-cream) !important;
	font-weight: 500 !important;
	opacity: 1 !important;
}

body.tb-cart-v2 .wc-block-components-totals-discount .wc-block-components-totals-item__value {
	color: var(--realm-metallic) !important;
}

body.tb-cart-v2 .wc-block-components-totals-item__description {
	display: none !important;
}

/* Final total row */
body.tb-cart-v2 .wc-block-components-totals-footer-item,
body.tb-cart-v2 .wp-block-woocommerce-cart-order-summary-totals-block .wc-block-components-totals-item {
	display: flex !important;
	justify-content: space-between !important;
	align-items: baseline !important;
	padding: 22px 0 24px !important;
	border: none !important;
	border-top: 1px solid var(--tb-border-gold) !important;
	background: transparent !important;
	margin: 8px 0 0 !important;
}

body.tb-cart-v2 .wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
body.tb-cart-v2 .wp-block-woocommerce-cart-order-summary-totals-block .wc-block-components-totals-item__label {
	font-family: var(--tb-font-heading) !important;
	font-size: 11px !important;
	letter-spacing: 0.22em !important;
	text-transform: uppercase !important;
	color: var(--realm-metallic) !important;
	opacity: 1 !important;
}

body.tb-cart-v2 .wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
body.tb-cart-v2 .wp-block-woocommerce-cart-order-summary-totals-block .wc-block-components-totals-item__value {
	font-family: var(--tb-font-display) !important;
	font-size: 32px !important;
	color: var(--realm-metallic) !important;
	font-weight: 600 !important;
}

/* Coupon in sidebar */
body.tb-cart-v2 .wp-block-woocommerce-cart-order-summary-coupon-form-block .wc-block-components-totals-coupon-link,
body.tb-cart-v2 .wp-block-woocommerce-cart-order-summary-coupon-form-block .wc-block-components-totals-coupon__button,
body.tb-cart-v2 .wp-block-woocommerce-cart-order-summary-coupon-form-block .wc-block-components-panel__button {
	color: var(--realm-metallic) !important;
	background: transparent !important;
	border: none !important;
	font-family: var(--tb-font-heading) !important;
	font-size: 11px !important;
	letter-spacing: 0.2em !important;
	text-transform: uppercase !important;
	padding: 10px 0 !important;
}

/* Proceed-to-checkout CTA */
body.tb-cart-v2 .wp-block-woocommerce-proceed-to-checkout-block {
	margin-top: 24px !important;
	background: transparent !important;
}

/* Fix (2026-09-06, website-manager): WooCommerce's own Cart block JS marks
   .wc-block-cart__submit-container as "--sticky" whenever an internal
   IntersectionObserver finds the button below the initial viewport fold --
   true here at >=783px because .tb-cart-hero (~410px) plus the Stripe/
   Apple Pay/Google Pay .wc-block-cart__payment-options panel (~228px) push
   "Proceed to Checkout" below the 900px fold on load. WooCommerce's own
   cart.css then unconditionally hides the --sticky variant at >=783px
   (@media(min-width:783px){display:none}), assuming desktop's two-column
   layout never needs the sticky treatment. Net effect on this page: the
   button renders 0x0 until the shopper scrolls it into view by hand, with
   no visible cue that it exists. This does NOT touch the theme's own
   .tb-sticky-checkout floating CTA (shown <=1099px, labelled "Checkout",
   unaffected either way) or restyle the button itself -- it only restores
   the container's normal in-flow display, identical to what WooCommerce
   already renders once the shopper scrolls the sentinel into view. Mobile
   (<783px) is untouched -- WooCommerce's own fixed-bottom-bar sticky
   behavior there is left exactly as shipped. */
@media (min-width: 783px) {
	body.tb-cart-v2 .wc-block-cart__submit-container--sticky {
		display: block !important;
	}
}

body.tb-cart-v2 .wc-block-cart__submit-button,
body.tb-cart-v2 a.wc-block-cart__submit-button,
body.tb-cart-v2 button.wc-block-cart__submit-button,
body.tb-cart-v2 .wc-block-components-checkout-place-order-button,
body.tb-checkout-v2 .wc-block-components-checkout-place-order-button,
body.tb-checkout-v2 button.wc-block-components-checkout-place-order-button {
	display: inline-flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px !important;
	width: 100% !important;
	padding: 16px 32px !important;
	font-family: var(--tb-font-heading) !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	letter-spacing: 0.18em !important;
	text-transform: uppercase !important;
	background-color: var(--realm-metallic) !important;
	background: var(--realm-metallic) !important;
	color: var(--realm-bg) !important;
	border: 1px solid var(--realm-metallic) !important;
	border-radius: 2px !important;
	cursor: pointer !important;
	text-decoration: none !important;
	transition: background-color .35s ease, border-color .35s ease, transform .35s ease !important;
	height: auto !important;
	box-shadow: none !important;
	opacity: 1 !important;
}

body.tb-cart-v2 .wc-block-cart__submit-button:hover,
body.tb-cart-v2 .wc-block-components-checkout-place-order-button:hover,
body.tb-checkout-v2 .wc-block-components-checkout-place-order-button:hover {
	background-color: var(--realm-metallic-bright) !important;
	background: var(--realm-metallic-bright) !important;
	color: var(--realm-bg) !important;
	border-color: var(--realm-metallic-bright) !important;
	transform: translateY(-1px) !important;
}

body.tb-cart-v2 .wc-block-cart__submit-button *,
body.tb-cart-v2 .wp-block-woocommerce-proceed-to-checkout-block a *,
body.tb-cart-v2 .wp-block-woocommerce-proceed-to-checkout-block button *,
body.tb-checkout-v2 .wc-block-components-checkout-place-order-button * {
	color: var(--realm-bg) !important;
}

/* Summary reassurance (JS-injected below CTA) */
.tb-summary-reassure {
	margin-top: 22px;
	font-size: 13px;
	font-style: italic;
	color: var(--realm-taupe);
	text-align: center;
	line-height: 1.6;
}

.tb-summary-reassure strong {
	color: var(--realm-metallic);
	font-style: normal;
	font-weight: 500;
}

/* Accepted payment methods strip */
body.tb-cart-v2 .wp-block-woocommerce-cart-accepted-payment-methods-block {
	margin-top: 16px !important;
	padding-top: 16px !important;
	border-top: 1px solid var(--tb-border-taupe) !important;
	text-align: center !important;
	opacity: 0.65 !important;
	background: transparent !important;
}

body.tb-cart-v2 .wp-block-woocommerce-cart-accepted-payment-methods-block img,
body.tb-cart-v2 .wp-block-woocommerce-cart-accepted-payment-methods-block svg {
	filter: grayscale(0.3) brightness(1.1) !important;
	max-height: 22px !important;
}

/* =============================================================
   9. EXPRESS PAYMENT (Stripe Apple/Google Pay wrappers only)
      NEVER style .wc-stripe-* internals — only the block wrapper.
   ============================================================= */

body.tb-cart-v2 .wp-block-woocommerce-cart-express-payment-block,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-express-payment-block {
	margin: 16px 0 !important;
	padding: 12px 0 !important;
	background: transparent !important;
	border: none !important;
	border-top: 1px solid var(--tb-border-taupe) !important;
	border-bottom: 1px solid var(--tb-border-taupe) !important;
}

body.tb-cart-v2 .wp-block-woocommerce-cart-express-payment-block .wc-block-components-express-payment__title-container,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-express-payment-block .wc-block-components-express-payment__title-container,
body.tb-cart-v2 .wp-block-woocommerce-cart-express-payment-block .wc-block-components-express-payment__title,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-express-payment-block .wc-block-components-express-payment__title {
	color: var(--realm-taupe) !important;
	font-family: var(--tb-font-heading) !important;
	font-size: 10px !important;
	letter-spacing: 0.2em !important;
	text-transform: uppercase !important;
	background: transparent !important;
}

/* =============================================================
   10. EMPTY CART STATE — editorial
   ============================================================= */

body.tb-cart-v2 .wp-block-woocommerce-empty-cart-block {
	padding: 96px 24px !important;
	text-align: center !important;
	max-width: 680px !important;
	margin: 0 auto !important;
	background: transparent !important;
}

body.tb-cart-v2 .wp-block-woocommerce-empty-cart-block .tb-empty-ornament {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	color: var(--realm-metallic);
	font-family: var(--tb-font-heading);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
}

body.tb-cart-v2 .wp-block-woocommerce-empty-cart-block .tb-empty-ornament::before,
body.tb-cart-v2 .wp-block-woocommerce-empty-cart-block .tb-empty-ornament::after {
	content: '';
	width: 42px;
	height: 1px;
	background: var(--realm-metallic);
	opacity: 0.45;
	display: inline-block;
	vertical-align: middle;
}

body.tb-cart-v2 .wp-block-woocommerce-empty-cart-block h2 {
	font-family: var(--tb-font-display) !important;
	font-weight: 600 !important;
	letter-spacing: -0.005em !important;
	line-height: 1.05 !important;
	font-size: clamp(36px, 4vw, 58px) !important;
	color: var(--realm-cream) !important;
	margin: 24px 0 18px !important;
}

body.tb-cart-v2 .wp-block-woocommerce-empty-cart-block h2 em {
	font-style: italic !important;
	font-weight: 500 !important;
}

body.tb-cart-v2 .wp-block-woocommerce-empty-cart-block p {
	color: var(--realm-taupe) !important;
	font-size: 18px !important;
	font-style: italic !important;
	line-height: 1.7 !important;
	max-width: 520px !important;
	margin: 0 auto 36px !important;
}

body.tb-cart-v2 .wp-block-woocommerce-empty-cart-block .tb-empty-cta {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 15px 32px;
	font-family: var(--tb-font-heading);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	background: var(--realm-metallic);
	color: var(--realm-bg);
	border: 1px solid var(--realm-metallic);
	border-radius: 2px;
	text-decoration: none;
	transition: background-color .35s ease, transform .35s ease;
}

body.tb-cart-v2 .wp-block-woocommerce-empty-cart-block .tb-empty-cta:hover {
	background: var(--realm-metallic-bright);
	border-color: var(--realm-metallic-bright);
	transform: translateY(-1px);
}

/* Hide default empty-state carousel */
body.tb-cart-v2 .wp-block-woocommerce-empty-cart-block .wp-block-separator,
body.tb-cart-v2 .wp-block-woocommerce-empty-cart-block .wp-block-woocommerce-product-new,
body.tb-cart-v2 .wp-block-woocommerce-empty-cart-block .wc-block-product-new {
	display: none !important;
}

/* =============================================================
   11. STICKY MOBILE CHECKOUT CTA
   ============================================================= */

.tb-sticky-checkout {
	display: none;
}

body.tb-cart-v2.has-cart {
	padding-bottom: 80px;
}

@media (max-width: 1099px) {
	body.tb-cart-v2 .tb-sticky-checkout {
		display: flex;
		position: fixed;
		bottom: 16px;
		left: 16px;
		right: 16px;
		z-index: 50;
		background: var(--realm-metallic);
		color: var(--realm-bg);
		padding: 15px 24px;
		font-family: var(--tb-font-heading);
		font-size: 12px;
		font-weight: 600;
		letter-spacing: 0.14em;
		text-transform: uppercase;
		border-radius: 2px;
		justify-content: space-between;
		text-decoration: none;
		box-shadow: 0 8px 24px rgba(0,0,0,0.5);
		align-items: center;
	}
	body.tb-cart-v2 .tb-sticky-checkout * {
		color: var(--realm-bg) !important;
	}
}

/* =============================================================
   12. CHECKOUT SIDEBAR — dark panel, cream text, gold total
   ============================================================= */

body.tb-checkout-v2 .wp-block-woocommerce-checkout-totals-block,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-order-summary-block {
	background: var(--realm-primary) !important;
	color: var(--realm-cream) !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

body.tb-checkout-v2 .wp-block-woocommerce-checkout-totals-block {
	position: sticky !important;
	top: 24px !important;
	border: 1px solid var(--tb-border-gold) !important;
	padding: 36px 32px !important;
	align-self: start !important;
}

@media (max-width: 1099px) {
	body.tb-checkout-v2 .wp-block-woocommerce-checkout-totals-block {
		position: static !important;
	}
}

body.tb-checkout-v2 .wp-block-woocommerce-checkout-totals-block,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-totals-block *:not(svg):not(path),
body.tb-checkout-v2 .wp-block-woocommerce-checkout-order-summary-block,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-order-summary-block *:not(svg):not(path) {
	color: var(--realm-cream);
}

body.tb-checkout-v2 .wp-block-woocommerce-checkout-order-summary-block h2,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-order-summary-block h3 {
	font-family: var(--tb-font-display) !important;
	font-size: 22px !important;
	font-weight: 600 !important;
	color: var(--realm-cream) !important;
	margin: 0 0 16px !important;
	letter-spacing: -0.005em !important;
}

body.tb-checkout-v2 .wc-block-components-order-summary-item {
	background: transparent !important;
	border-bottom: 1px solid var(--tb-border-taupe) !important;
	padding: 14px 0 !important;
	color: var(--realm-cream) !important;
}

body.tb-checkout-v2 .wc-block-components-order-summary-item__title,
body.tb-checkout-v2 .wc-block-components-order-summary-item__description,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-order-summary-block .wc-block-components-product-name {
	color: var(--realm-cream) !important;
	font-family: var(--tb-font-body) !important;
}

body.tb-checkout-v2 .wc-block-components-order-summary-item__total-price,
body.tb-checkout-v2 .wc-block-components-order-summary-item__total-price *,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-order-summary-block .wc-block-components-product-price,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-order-summary-block .wc-block-components-product-price__value {
	color: var(--realm-metallic) !important;
	font-family: var(--tb-font-display) !important;
	font-weight: 600 !important;
}

body.tb-checkout-v2 .wc-block-components-order-summary-item__quantity {
	color: var(--realm-taupe) !important;
	font-family: var(--tb-font-heading) !important;
	font-size: 10px !important;
	letter-spacing: 0.2em !important;
	text-transform: uppercase !important;
	background: transparent !important;
	border: 1px solid var(--tb-border-taupe) !important;
}

body.tb-checkout-v2 .wc-block-components-order-summary-item__image img {
	border: 1px solid var(--tb-border-gold) !important;
	border-radius: 0 !important;
}

body.tb-checkout-v2 .wc-block-components-totals-item {
	display: flex !important;
	justify-content: space-between !important;
	align-items: baseline !important;
	padding: 14px 0 !important;
	font-size: 16px !important;
	border-bottom: 1px solid var(--tb-border-taupe) !important;
	background: transparent !important;
	margin: 0 !important;
}

body.tb-checkout-v2 .wc-block-components-totals-item__label {
	font-family: var(--tb-font-heading) !important;
	font-size: 10px !important;
	letter-spacing: 0.2em !important;
	text-transform: uppercase !important;
	color: var(--realm-cream) !important;
	opacity: 0.85;
}

body.tb-checkout-v2 .wc-block-components-totals-item__value {
	font-family: var(--tb-font-display) !important;
	font-size: 17px !important;
	color: var(--realm-cream) !important;
	font-weight: 500 !important;
	opacity: 1 !important;
}

body.tb-checkout-v2 .wc-block-components-totals-discount .wc-block-components-totals-item__value {
	color: var(--realm-metallic) !important;
}

body.tb-checkout-v2 .wc-block-components-totals-item__description {
	display: none !important;
}

body.tb-checkout-v2 .wc-block-components-totals-footer-item,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-order-summary-totals-block .wc-block-components-totals-item {
	display: flex !important;
	justify-content: space-between !important;
	align-items: baseline !important;
	padding: 22px 0 24px !important;
	border: none !important;
	border-top: 1px solid var(--tb-border-gold) !important;
	background: transparent !important;
	margin: 8px 0 0 !important;
}

body.tb-checkout-v2 .wc-block-components-totals-footer-item .wc-block-components-totals-item__label,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-order-summary-totals-block .wc-block-components-totals-item__label {
	font-family: var(--tb-font-heading) !important;
	font-size: 11px !important;
	letter-spacing: 0.22em !important;
	text-transform: uppercase !important;
	color: var(--realm-metallic) !important;
	opacity: 1 !important;
}

body.tb-checkout-v2 .wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-order-summary-totals-block .wc-block-components-totals-item__value {
	font-family: var(--tb-font-display) !important;
	font-size: 32px !important;
	color: var(--realm-metallic) !important;
	font-weight: 600 !important;
}

body.tb-checkout-v2 .wp-block-woocommerce-checkout-order-summary-coupon-form-block .wc-block-components-totals-coupon-link,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-order-summary-coupon-form-block .wc-block-components-totals-coupon__button,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-order-summary-coupon-form-block .wc-block-components-panel__button {
	color: var(--realm-metallic) !important;
	background: transparent !important;
	border: none !important;
	font-family: var(--tb-font-heading) !important;
	font-size: 11px !important;
	letter-spacing: 0.2em !important;
	text-transform: uppercase !important;
	padding: 10px 0 !important;
}

body.tb-checkout-v2 .wp-block-woocommerce-checkout-order-summary-coupon-form-block input[type="text"] {
	background: transparent !important;
	border: 1px solid var(--tb-border-strong, rgba(209, 178, 140, 0.35)) !important;
	color: var(--realm-cream) !important;
}

/* =============================================================
   13. CHECKOUT FORM COLUMN — light-cream-card inputs on dark body
        Scoped to .wp-block-woocommerce-checkout-fields-block.
   ============================================================= */

body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block {
	min-width: 0;
	color: var(--realm-cream) !important;
	background: transparent !important;
}

body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-checkout-step {
	background: transparent !important;
	border: none !important;
	padding: 28px 0 !important;
	margin: 0 !important;
	border-bottom: 1px solid var(--tb-border-gold) !important;
}

body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-checkout-step__heading {
	font-family: var(--tb-font-display) !important;
	font-size: 22px !important;
	font-weight: 600 !important;
	color: var(--realm-cream) !important;
	margin: 0 0 8px !important;
	letter-spacing: -0.005em !important;
}

body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-checkout-step__heading-content,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-checkout-step__description {
	color: var(--realm-taupe) !important;
	font-size: 14px !important;
	font-style: italic !important;
}

body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-checkout-step__container {
	padding-left: 0 !important;
	border-left: none !important;
}

body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-checkout-step::before,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-checkout-step__heading::before {
	display: none !important;
}

/* Label above/inside input (taupe caps) */
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-text-input label,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-select label,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-combobox label,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block label {
	color: var(--realm-taupe) !important;
	font-family: var(--tb-font-heading) !important;
	font-size: 10px !important;
	letter-spacing: 0.2em !important;
	text-transform: uppercase !important;
}

/* Form INPUTS — dark bg, cream text (2026-06-09 readability fix) */
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-text-input input,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-select select,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-combobox input,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-textarea textarea,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block input[type="text"],
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block input[type="email"],
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block input[type="tel"],
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block input[type="number"],
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block textarea,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block select {
	background: var(--realm-primary, #0E1426) !important;
	background-color: var(--realm-primary, #0E1426) !important;
	border: 1px solid var(--tb-border-strong, rgba(209, 178, 140, 0.35)) !important;
	color: var(--realm-cream, #ECE4D5) !important;
	font-family: var(--tb-font-body) !important;
	font-size: 16px !important;
	padding: 12px 16px !important;
	border-radius: 2px !important;
	box-shadow: none !important;
	line-height: 1.5 !important;
}

body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-text-input input::placeholder,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block input::placeholder,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block textarea::placeholder {
	color: var(--realm-taupe, #B8B3A8) !important;
	opacity: 0.6 !important;
	font-style: italic;
}

body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-text-input input:focus,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-select select:focus,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block input:focus,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block textarea:focus,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block select:focus {
	outline: none !important;
	border-color: var(--realm-metallic) !important;
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--realm-metallic) 25%, transparent) !important;
	background: var(--realm-secondary, #161E35) !important;
	background-color: var(--realm-secondary, #161E35) !important;
	color: var(--realm-cream, #ECE4D5) !important;
}

/* Floating-label — cream/taupe on dark input bg */
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-text-input label,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-combobox label {
	color: var(--realm-taupe, #B8B3A8) !important;
}

/* Input wrapper div */
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-text-input,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-select,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-combobox {
	background: transparent !important;
	border: none !important;
	padding: 0 !important;
	margin-bottom: 16px !important;
}

body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-select::after,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-country-input::after,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-state-input::after {
	color: var(--realm-cream, #ECE4D5) !important;
}

/* Checkbox + label */
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-checkbox__input {
	accent-color: var(--realm-metallic) !important;
}

body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-checkbox__label,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-checkbox-control__label {
	color: var(--realm-cream) !important;
	font-family: var(--tb-font-body) !important;
	font-size: 15px !important;
	letter-spacing: normal !important;
	text-transform: none !important;
	font-style: normal !important;
}

/* Radio (payment/shipping method) — tonally-shifted dark panels */
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-radio-control__option,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-radio-control-accordion__option {
	background: color-mix(in srgb, var(--realm-primary) 60%, transparent) !important;
	border: 1px solid var(--tb-border-strong, rgba(209, 178, 140, 0.35)) !important;
	color: var(--realm-cream) !important;
	border-radius: 2px !important;
	padding: 14px 16px !important;
	margin: 8px 0 !important;
}

body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-radio-control__option--checked,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-radio-control-accordion__option--checked {
	border-color: var(--realm-metallic) !important;
	background: color-mix(in srgb, var(--realm-metallic) 5%, var(--realm-primary)) !important;
}

body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-components-radio-control__label {
	color: var(--realm-cream) !important;
}

/* Terms block */
body.tb-checkout-v2 .wc-block-checkout__terms,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-terms-block {
	color: var(--realm-taupe) !important;
	font-size: 13px !important;
	font-style: italic !important;
	background: transparent !important;
}

/* Loading skeleton */
body.tb-cart-v2 .wc-block-components-skeleton,
body.tb-checkout-v2 .wc-block-components-skeleton {
	background: linear-gradient(90deg, var(--realm-primary), var(--realm-secondary), var(--realm-primary)) !important;
	opacity: 0.5 !important;
}



/* =============================================================
   13b. NOTICE BANNERS — dark-themed error/info/success messages
        2026-06-09 readability fix. WC Blocks default notices use
        light backgrounds that clash with dark checkout page.
        High-specificity selectors prevent theme/plugin overrides.
   ============================================================= */

/* Error notice (red) */
body.tb-checkout-v2 .wc-block-components-notice-banner.is-error,
body.tb-cart-v2 .wc-block-components-notice-banner.is-error {
	background: rgba(139, 30, 30, 0.25) !important;
	background-color: rgba(139, 30, 30, 0.25) !important;
	border: 1px solid rgba(200, 60, 60, 0.4) !important;
	color: var(--realm-cream, #ECE4D5) !important;
	border-radius: 2px !important;
}

body.tb-checkout-v2 .wc-block-components-notice-banner.is-error .wc-block-components-notice-banner__content,
body.tb-cart-v2 .wc-block-components-notice-banner.is-error .wc-block-components-notice-banner__content,
body.tb-checkout-v2 .wc-block-components-notice-banner.is-error a,
body.tb-cart-v2 .wc-block-components-notice-banner.is-error a {
	color: var(--realm-cream, #ECE4D5) !important;
}

body.tb-checkout-v2 .wc-block-components-notice-banner.is-error a,
body.tb-cart-v2 .wc-block-components-notice-banner.is-error a {
	text-decoration: underline !important;
	color: var(--realm-metallic, #D1B28C) !important;
}

/* Info notice */
body.tb-checkout-v2 .wc-block-components-notice-banner.is-info,
body.tb-cart-v2 .wc-block-components-notice-banner.is-info,
body.tb-checkout-v2 .wc-block-components-notice-banner.is-warning,
body.tb-cart-v2 .wc-block-components-notice-banner.is-warning {
	background: rgba(14, 20, 38, 0.6) !important;
	background-color: rgba(14, 20, 38, 0.6) !important;
	border: 1px solid var(--tb-border-gold, rgba(209, 178, 140, 0.18)) !important;
	color: var(--realm-cream, #ECE4D5) !important;
	border-radius: 2px !important;
}

body.tb-checkout-v2 .wc-block-components-notice-banner.is-info .wc-block-components-notice-banner__content,
body.tb-cart-v2 .wc-block-components-notice-banner.is-info .wc-block-components-notice-banner__content,
body.tb-checkout-v2 .wc-block-components-notice-banner.is-warning .wc-block-components-notice-banner__content,
body.tb-cart-v2 .wc-block-components-notice-banner.is-warning .wc-block-components-notice-banner__content {
	color: var(--realm-cream, #ECE4D5) !important;
}

/* Success notice */
body.tb-checkout-v2 .wc-block-components-notice-banner.is-success,
body.tb-cart-v2 .wc-block-components-notice-banner.is-success {
	background: rgba(26, 47, 37, 0.5) !important;
	background-color: rgba(26, 47, 37, 0.5) !important;
	border: 1px solid rgba(82, 106, 94, 0.4) !important;
	color: var(--realm-cream, #ECE4D5) !important;
	border-radius: 2px !important;
}

body.tb-checkout-v2 .wc-block-components-notice-banner.is-success .wc-block-components-notice-banner__content,
body.tb-cart-v2 .wc-block-components-notice-banner.is-success .wc-block-components-notice-banner__content {
	color: var(--realm-cream, #ECE4D5) !important;
}

/* Notice dismiss button */
body.tb-checkout-v2 .wc-block-components-notice-banner button.components-notice__dismiss,
body.tb-cart-v2 .wc-block-components-notice-banner button.components-notice__dismiss {
	color: var(--realm-taupe, #B8B3A8) !important;
}

/* Notice SVG icon */
body.tb-checkout-v2 .wc-block-components-notice-banner svg,
body.tb-cart-v2 .wc-block-components-notice-banner svg {
	fill: currentColor !important;
}

/* Validation error on individual fields */
body.tb-checkout-v2 .wc-block-components-text-input.has-error input,
body.tb-checkout-v2 .wc-block-components-text-input.has-error select {
	border-color: rgba(200, 60, 60, 0.6) !important;
	box-shadow: 0 0 0 1px rgba(200, 60, 60, 0.3) !important;
}

body.tb-checkout-v2 .wc-block-components-validation-error,
body.tb-checkout-v2 .wc-block-components-text-input .wc-block-components-validation-error {
	color: #f0a0a0 !important;
	font-size: 13px !important;
	margin-top: 4px !important;
}

/* Coupon input inside order summary sidebar */
body.tb-checkout-v2 .wp-block-woocommerce-checkout-order-summary-coupon-form-block input,
body.tb-cart-v2 .wc-block-components-totals-coupon__input input,
body.tb-checkout-v2 .wc-block-components-totals-coupon__input input {
	background: var(--realm-primary, #0E1426) !important;
	background-color: var(--realm-primary, #0E1426) !important;
	border: 1px solid var(--tb-border-strong, rgba(209, 178, 140, 0.35)) !important;
	color: var(--realm-cream, #ECE4D5) !important;
	font-family: var(--tb-font-body) !important;
	font-size: 15px !important;
	padding: 10px 14px !important;
	border-radius: 2px !important;
}

body.tb-checkout-v2 .wc-block-components-totals-coupon__input input:focus,
body.tb-cart-v2 .wc-block-components-totals-coupon__input input:focus {
	border-color: var(--realm-metallic, #D1B28C) !important;
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--realm-metallic, #D1B28C) 25%, transparent) !important;
	background: var(--realm-secondary, #161E35) !important;
}

/* Address card (saved address) — ensure cream text */
body.tb-checkout-v2 .wc-block-components-address-card,
body.tb-checkout-v2 .wc-block-components-address-card span,
body.tb-checkout-v2 .wc-block-components-address-card address {
	color: var(--realm-cream, #ECE4D5) !important;
}

body.tb-checkout-v2 .wc-block-components-address-card__edit {
	color: var(--realm-metallic, #D1B28C) !important;
	cursor: pointer !important;
}

body.tb-checkout-v2 .wc-block-components-address-card__edit:hover {
	color: var(--realm-metallic-bright, #E1C29A) !important;
}

/* =============================================================
   14. CART PAGE UPSELL CARDS — tonally-shifted dark panels
        Styled to match Midnight Blue mockup. PHP emits markup
        with class .tb-cart-page-upsell via functions.php hooks
        thornbloom_cart_page_upsell + _website_upsell.
   ============================================================= */

body.tb-cart-v2 .tb-cart-page-upsell {
	background: var(--realm-primary) !important;
	border: 1px solid var(--tb-border-gold) !important;
	border-radius: 0 !important;
	padding: 20px 24px !important;
	margin-bottom: 24px !important;
	color: var(--realm-cream) !important;
	box-shadow: none !important;
}

body.tb-cart-v2 .tb-cart-page-upsell__eyebrow {
	font-family: var(--tb-font-heading) !important;
	font-size: 12px !important;
	letter-spacing: 0.22em !important;
	text-transform: uppercase !important;
	color: var(--realm-metallic) !important;
	margin: 0 0 8px !important;
	font-style: normal !important;
}

body.tb-cart-v2 .tb-cart-page-upsell__title {
	font-family: var(--tb-font-display) !important;
	font-size: 1.1rem !important;
	color: var(--realm-cream) !important;
	margin: 0 0 6px !important;
	font-weight: 600 !important;
	letter-spacing: -0.005em !important;
}

body.tb-cart-v2 .tb-cart-page-upsell__sub {
	font-size: 0.9rem !important;
	color: var(--realm-taupe) !important;
	font-family: var(--tb-font-body) !important;
	font-style: italic !important;
	margin: 0 0 12px !important;
	line-height: 1.55 !important;
}

body.tb-cart-v2 .tb-cart-page-upsell__cta {
	display: inline-flex !important;
	align-items: center !important;
	gap: 8px !important;
	padding: 10px 18px !important;
	font-family: var(--tb-font-heading) !important;
	font-size: 12px !important;
	font-weight: 600 !important;
	letter-spacing: 0.14em !important;
	text-transform: uppercase !important;
	background: transparent !important;
	color: var(--realm-metallic) !important;
	border: 1px solid var(--realm-metallic) !important;
	border-radius: 2px !important;
	text-decoration: none !important;
	cursor: pointer !important;
	transition: background-color .35s ease, transform .35s ease !important;
}

body.tb-cart-v2 .tb-cart-page-upsell__cta:hover {
	background: color-mix(in srgb, var(--realm-metallic) 12%, transparent) !important;
	color: var(--realm-metallic-bright) !important;
	border-color: var(--realm-metallic-bright) !important;
	transform: translateY(-1px) !important;
}

/* =============================================================
   END
   ============================================================= */

/* =============================================================
   15. v3.1 WIDTH FIXES — 2026-04-23
      Fixes two separate grid-template bugs where title/product
      columns were collapsing to ~30-80px and wrapping character-
      by-character.

      CART BUG: native WC Blocks assigns .wc-block-cart-item__product
      `grid-column: 2 / 4` on mobile container-query rules. When our
      forced `display:grid` + `grid-template-columns: 120px minmax(0,1fr) 160px`
      applies at desktop, __product still spans cols 2-3 and
      __total auto-places wherever it can. Result: title column
      fights __total for col 3, title gets crushed.

      CHECKOUT BUG: .wc-block-components-order-summary-item is
      `display:flex` with children using `display:table-cell`.
      Without explicit min-width:0 / flex-basis on __description,
      table-cell semantics can shrink the text column when title
      is long. Image stays at 48px native but text collapses.

      Fix path: explicit grid-column + flex sizing overrides
      targeting the exact children. No parent-level changes needed.
      ============================================================= */

/* ---- CART: snap row children to our 3-col layout ------------ */
body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__image,
body.tb-cart-v2 .wc-block-cart-items__row > .wc-block-cart-item__image {
	grid-column: 1 / 2 !important;
	grid-row: 1 !important;
	width: 120px !important;
	min-width: 120px !important;
	max-width: 120px !important;
	flex-shrink: 0 !important;
	padding-right: 0 !important;
}

body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__product,
body.tb-cart-v2 .wc-block-cart-items__row > .wc-block-cart-item__product {
	grid-column: 2 / 3 !important;
	grid-row: 1 !important;
	min-width: 0 !important;
	justify-self: stretch !important;
	word-wrap: break-word !important;
	overflow-wrap: break-word !important;
}

body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__total,
body.tb-cart-v2 .wc-block-cart-items__row > .wc-block-cart-item__total {
	grid-column: 3 / 4 !important;
	grid-row: 1 !important;
	width: auto !important;
	justify-self: end !important;
	text-align: right !important;
}

/* Defensive: any nested img inside __product (WC sometimes renders
   a secondary thumbnail) must not blow out column width */
body.tb-cart-v2 .wc-block-cart-item__product img,
body.tb-cart-v2 .wc-block-cart-item__product .wc-block-components-product-image {
	max-width: 100% !important;
	height: auto !important;
}

/* Product title: keep a sane min-width so one-word-per-line can't happen */
body.tb-cart-v2 .wc-block-cart-item__product .wc-block-components-product-name {
	max-width: 100% !important;
	min-width: 0 !important;
	word-break: normal !important;
	overflow-wrap: break-word !important;
}

/* Mobile: collapse to single column as intended */
@media (max-width: 720px) {
	body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__image,
	body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__product,
	body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__total {
		grid-column: 1 / -1 !important;
	}
	body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__image {
		grid-row: 1 !important;
		width: 88px !important;
		min-width: 88px !important;
		max-width: 88px !important;
	}
	body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__product {
		grid-row: 2 !important;
	}
	body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__total {
		grid-row: 3 !important;
		justify-self: start !important;
		text-align: left !important;
	}
}

/* ---- CHECKOUT SIDEBAR: product-row inner flex sizing -------- */
/* Confirm sidebar outer width. Parent grid on .wp-block-woocommerce-checkout
   already sets col 2 to 380px. This is a belt-and-braces against any
   width: auto override on the sidebar wrapper. */
body.tb-checkout-v2 .wp-block-woocommerce-checkout-totals-block {
	width: 380px !important;
	max-width: 380px !important;
	min-width: 0 !important;
	box-sizing: border-box !important;
}

@media (max-width: 1099px) {
	body.tb-checkout-v2 .wp-block-woocommerce-checkout-totals-block {
		width: 100% !important;
		max-width: 100% !important;
	}
}

/* Order-summary-item: enforce flex shape. Native `display:flex` with
   children `display:table-cell` needs explicit sizing or text collapses. */
body.tb-checkout-v2 .wc-block-components-order-summary-item {
	display: flex !important;
	flex-direction: row !important;
	flex-wrap: nowrap !important;
	align-items: flex-start !important;
	gap: 12px !important;
	width: 100% !important;
	min-width: 0 !important;
	box-sizing: border-box !important;
}

/* Image column: fixed 56px, never shrinks, never grows */
body.tb-checkout-v2 .wc-block-components-order-summary-item__image {
	display: block !important;
	width: 56px !important;
	min-width: 56px !important;
	max-width: 56px !important;
	flex: 0 0 56px !important;
	margin: 0 !important;
	padding: 0 !important;
	position: relative !important;
	box-sizing: border-box !important;
}

body.tb-checkout-v2 .wc-block-components-order-summary-item__image > img,
body.tb-checkout-v2 .wc-block-components-order-summary-item__image img {
	width: 56px !important;
	max-width: 56px !important;
	height: auto !important;
	display: block !important;
}

/* Description column: flex grow, min-width 0 so title can break */
body.tb-checkout-v2 .wc-block-components-order-summary-item__description {
	display: block !important;
	flex: 1 1 0 !important;
	min-width: 0 !important;
	max-width: 100% !important;
	padding: 0 0 0 12px !important;
	margin: 0 !important;
	word-break: normal !important;
	overflow-wrap: break-word !important;
	box-sizing: border-box !important;
}

/* Title inside description: don't let WC's max-width:max-content crush it */
body.tb-checkout-v2 .wc-block-components-order-summary-item__description .wc-block-components-product-name,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-order-summary-block .wc-block-components-product-name {
	display: block !important;
	max-width: 100% !important;
	min-width: 0 !important;
	word-break: normal !important;
	overflow-wrap: break-word !important;
	white-space: normal !important;
	line-height: 1.3 !important;
}

/* Total price column: auto width, pushed right */
body.tb-checkout-v2 .wc-block-components-order-summary-item__total-price {
	flex: 0 0 auto !important;
	margin-left: auto !important;
	padding-left: 8px !important;
	white-space: nowrap !important;
	text-align: right !important;
}

/* Quantity badge: keep native absolute positioning intact but scope its
   color/border. The width-fix doesn't touch its positioning. */

/* Guard: product images anywhere in sidebar must never be intrinsic */
body.tb-checkout-v2 .wp-block-woocommerce-checkout-totals-block img {
	max-width: 56px !important;
	height: auto !important;
}

/* ---- CART SIDEBAR: cart's own order-summary-item path (rare) -- */
/* If cart ever renders order-summary-items (it doesn't by default, but
   safe-guard in case a future block adds them) */
body.tb-cart-v2 .wc-block-components-order-summary-item {
	display: flex !important;
	flex-wrap: nowrap !important;
	align-items: flex-start !important;
	min-width: 0 !important;
}
body.tb-cart-v2 .wc-block-components-order-summary-item__image {
	width: 56px !important;
	min-width: 56px !important;
	max-width: 56px !important;
	flex: 0 0 56px !important;
}
body.tb-cart-v2 .wc-block-components-order-summary-item__description {
	flex: 1 1 0 !important;
	min-width: 0 !important;
	padding: 0 0 0 12px !important;
}

/* ================================================================
 * 16. v3.2 HYDRATED SIDEBAR-LAYOUT FIX — 2026-04-23
 * ================================================================
 *
 * Root cause (diagnosed by website-manager, 2026-04-23):
 * -----------------------------------------------------
 * WC Blocks server-renders:
 *     .wp-block-woocommerce-filled-cart-block > [items-block, totals-block]
 *     .wp-block-woocommerce-checkout         > [fields-block, totals-block]
 *
 * After React hydration the DOM changes to:
 *     .wp-block-woocommerce-filled-cart-block
 *       > .wc-block-components-sidebar-layout      <-- NEW wrapper (flex)
 *           > .wc-block-components-main            (items)
 *           > .wc-block-components-sidebar         (totals)
 *     .wp-block-woocommerce-checkout
 *       > .wc-block-components-sidebar-layout      <-- NEW wrapper (flex)
 *           > .wc-block-components-main            (fields or totals)
 *           > .wc-block-components-sidebar         (totals or fields)
 *
 * Native CSS:
 *     .wc-block-components-sidebar-layout { display:flex; flex-wrap:wrap }
 *     .wc-block-components-main    { width: 65% }
 *     .wc-block-components-sidebar { width: 35% }
 *     :has(>:last-child.wp-block-woocommerce-checkout-fields-block)
 *         { flex-direction: row-reverse }   // on checkout only
 *     @container (max-width: 699px) { column stack }
 *
 * What v3/v3.1 did wrong:
 * -----------------------
 * v3 set display:grid on .wp-block-woocommerce-filled-cart-block and
 * .wp-block-woocommerce-checkout, expecting the two block children to
 * become the two grid columns. But after hydration each of those parents
 * has ONLY ONE child: .wc-block-components-sidebar-layout. The grid puts
 * that one child in column 1 (the 1fr side) and leaves column 2 (380px)
 * EMPTY. The main+sidebar flex inside then allocates 65/35 of the single
 * 1fr column — so the cart items column ends up ~560px wide (not ~900px)
 * and the totals land in a ~300px slot inside the main column with 380px
 * of dead space on the right. That's the "pinched center strip" Caelin saw.
 *
 * On checkout specifically there was a second bug: the fields-block and
 * totals-block were natively flowing vertically because the sidebar-layout
 * wrapper's flex rule was getting overridden somewhere, causing a single
 * stacked column. Same fix handles both.
 *
 * The fix:
 * --------
 * Re-grid the HYDRATED sidebar-layout directly, and flatten the native
 * 65%/35% main/sidebar widths so the grid (minmax(0,1fr) 380px) wins.
 * Keep flex fallback intact for the pre-hydration paint so the user
 * doesn't see a reflow flash. Neutralize row-reverse on checkout since
 * we want fields-left / totals-right ordering per the mockup.
 *
 * Scoped strictly under body.tb-cart-v2 / body.tb-checkout-v2. No JS.
 * No Stripe internals touched. No .widget_shopping_cart_content. No
 * announcement strip. Stripe express-payment wrappers intact.
 */

/* ---- CART: grid-ify the hydrated sidebar-layout ---- */
body.tb-cart-v2 .wp-block-woocommerce-filled-cart-block > .wc-block-components-sidebar-layout,
body.tb-cart-v2 .wp-block-woocommerce-filled-cart-block .wc-block-components-sidebar-layout.wc-block-cart {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 380px !important;
	gap: 56px !important;
	flex-wrap: nowrap !important;
	flex-direction: row !important;
	align-items: start !important;
	margin: 0 !important;
	width: 100% !important;
	max-width: none !important;
	padding: 0 !important;
}

body.tb-cart-v2 .wp-block-woocommerce-filled-cart-block .wc-block-components-sidebar-layout > .wc-block-components-main {
	width: auto !important;
	max-width: none !important;
	padding: 0 !important;
	margin: 0 !important;
	min-width: 0 !important;
	grid-column: 1 / 2 !important;
}

body.tb-cart-v2 .wp-block-woocommerce-filled-cart-block .wc-block-components-sidebar-layout > .wc-block-components-sidebar {
	width: auto !important;
	max-width: none !important;
	padding: 0 !important;
	margin: 0 !important;
	min-width: 0 !important;
	grid-column: 2 / 3 !important;
}

/* ---- CHECKOUT: grid-ify the hydrated sidebar-layout ---- */
body.tb-checkout-v2 .wp-block-woocommerce-checkout > .wc-block-components-sidebar-layout,
body.tb-checkout-v2 .wp-block-woocommerce-checkout .wc-block-components-sidebar-layout {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 380px !important;
	gap: 56px !important;
	flex-wrap: nowrap !important;
	flex-direction: row !important;   /* override native row-reverse from :has() */
	align-items: start !important;
	margin: 0 !important;
	width: 100% !important;
	max-width: none !important;
	padding: 0 !important;
}

body.tb-checkout-v2 .wp-block-woocommerce-checkout .wc-block-components-sidebar-layout > .wc-block-components-main {
	width: auto !important;
	max-width: none !important;
	padding: 0 !important;
	margin: 0 !important;
	min-width: 0 !important;
	grid-column: 1 / 2 !important;
}

body.tb-checkout-v2 .wp-block-woocommerce-checkout .wc-block-components-sidebar-layout > .wc-block-components-sidebar {
	width: auto !important;
	max-width: none !important;
	padding: 0 !important;
	margin: 0 !important;
	min-width: 0 !important;
	grid-column: 2 / 3 !important;
}

/* ---- Belt-and-braces: if React nests the blocks one level deeper
       (e.g., under .wc-block-cart or .wc-block-checkout), force the
       sidebar-layout descendant rule to still fire ---- */
body.tb-cart-v2 .wc-block-cart > .wc-block-components-sidebar-layout,
body.tb-cart-v2 .wc-block-cart .wc-block-components-sidebar-layout,
body.tb-checkout-v2 .wc-block-checkout > .wc-block-components-sidebar-layout,
body.tb-checkout-v2 .wc-block-checkout .wc-block-components-sidebar-layout {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 380px !important;
	gap: 56px !important;
	flex-direction: row !important;
	align-items: start !important;
}

/* ---- Fallback order (cart: items left, totals right; checkout: same) ----
       Without this, if both children still resolve as grid auto-placed items
       in source order, .wc-block-components-main lands in col 1 (items) and
       .wc-block-components-sidebar in col 2 (totals). Explicit override below
       enforces that independent of the native :has() row-reverse rule. */
body.tb-cart-v2 .wc-block-components-sidebar-layout > .wc-block-components-main,
body.tb-checkout-v2 .wc-block-components-sidebar-layout > .wc-block-components-main {
	order: 1 !important;
}
body.tb-cart-v2 .wc-block-components-sidebar-layout > .wc-block-components-sidebar,
body.tb-checkout-v2 .wc-block-components-sidebar-layout > .wc-block-components-sidebar {
	order: 2 !important;
}

/* ---- Mobile: collapse to single column at the same breakpoint as v3 ---- */
@media (max-width: 1099px) {
	body.tb-cart-v2 .wp-block-woocommerce-filled-cart-block > .wc-block-components-sidebar-layout,
	body.tb-cart-v2 .wp-block-woocommerce-filled-cart-block .wc-block-components-sidebar-layout.wc-block-cart,
	body.tb-checkout-v2 .wp-block-woocommerce-checkout > .wc-block-components-sidebar-layout,
	body.tb-checkout-v2 .wp-block-woocommerce-checkout .wc-block-components-sidebar-layout,
	body.tb-cart-v2 .wc-block-cart > .wc-block-components-sidebar-layout,
	body.tb-cart-v2 .wc-block-cart .wc-block-components-sidebar-layout,
	body.tb-checkout-v2 .wc-block-checkout > .wc-block-components-sidebar-layout,
	body.tb-checkout-v2 .wc-block-checkout .wc-block-components-sidebar-layout {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 40px !important;
	}
	body.tb-cart-v2 .wc-block-components-sidebar-layout > .wc-block-components-main,
	body.tb-cart-v2 .wc-block-components-sidebar-layout > .wc-block-components-sidebar,
	body.tb-checkout-v2 .wc-block-components-sidebar-layout > .wc-block-components-main,
	body.tb-checkout-v2 .wc-block-components-sidebar-layout > .wc-block-components-sidebar {
		grid-column: 1 / -1 !important;
	}
}

/* ---- Guard: the @container (min-width:700px) native rules inside WC Blocks
     can re-apply 16px side padding to sidebar children. Keep that OFF since
     our grid gap handles spacing. ---- */
body.tb-cart-v2 .wc-block-components-sidebar .wc-block-components-panel,
body.tb-cart-v2 .wc-block-components-sidebar .wc-block-components-totals-coupon,
body.tb-cart-v2 .wc-block-components-sidebar .wc-block-components-totals-item,
body.tb-checkout-v2 .wc-block-components-sidebar .wc-block-components-panel,
body.tb-checkout-v2 .wc-block-components-sidebar .wc-block-components-totals-coupon,
body.tb-checkout-v2 .wc-block-components-sidebar .wc-block-components-totals-item {
	padding-left: 0 !important;
	padding-right: 0 !important;
}

/* ---- End of Section 16 ---- */

/* ========================================================================
   SECTION 17: v3.3 -- ROW-WIDEN + MOBILE BREAK + CONTAINER-WIDEN (2026-04-22)
   ------------------------------------------------------------------------
   Target three remaining bugs after v3.2:
   - Bug A (Cart desktop): row grid children not sized right; title wraps
     per-word, huge gap between title col and price col.
   - Bug B (Checkout desktop): inner container pinched to ~900-1000px;
     outer Astra/entry-content chain needs to let the block breathe to 1280.
   - Bug C (Checkout mobile): sidebar-layout grid not collapsing because our
     mobile break was at 1099px. WC internal break is 700px container /
     ~900px viewport. Force single column at <=900px.

   CRITICAL: Do not touch Stripe internals (.wc-block-components-express-payment
   inner DOM). Only wrapper-level. Mobile cart must stay usable.
   ======================================================================== */


/* ---- Bug B: widen the outer chain so checkout/cart block can hit 1280 ---- */

body.tb-cart-v2 .ast-container,
body.tb-checkout-v2 .ast-container {
	max-width: none !important;
	width: 100% !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

body.tb-cart-v2 #primary,
body.tb-cart-v2 #main,
body.tb-cart-v2 article,
body.tb-checkout-v2 #primary,
body.tb-checkout-v2 #main,
body.tb-checkout-v2 article {
	max-width: none !important;
	width: 100% !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
}

body.tb-cart-v2 .entry-content,
body.tb-cart-v2 .entry-content[data-ast-blocks-layout],
body.tb-checkout-v2 .entry-content,
body.tb-checkout-v2 .entry-content[data-ast-blocks-layout] {
	max-width: none !important;
	width: 100% !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

body.tb-cart-v2 .wp-block-woocommerce-cart,
body.tb-cart-v2 .wp-block-woocommerce-cart.alignwide,
body.tb-checkout-v2 .wp-block-woocommerce-checkout,
body.tb-checkout-v2 .wp-block-woocommerce-checkout.alignwide {
	max-width: 1280px !important;
	width: 100% !important;
	margin: 0 auto !important;
	padding: 40px 56px 120px !important;
	box-sizing: border-box !important;
	background: transparent !important;
}

body.tb-cart-v2 .ast-woocommerce-container,
body.tb-checkout-v2 .ast-woocommerce-container {
	padding: 0 !important;
	max-width: none !important;
	width: 100% !important;
}


/* ---- Bug A: re-affirm cart row grid with hard !important + child widths ---- */

body.tb-cart-v2 .wc-block-cart-items,
body.tb-cart-v2 table.wc-block-cart-items {
	display: block !important;
	width: 100% !important;
	border-collapse: separate !important;
	table-layout: auto !important;
}

body.tb-cart-v2 .wc-block-cart-items > tbody,
body.tb-cart-v2 table.wc-block-cart-items > tbody {
	display: block !important;
	width: 100% !important;
}

body.tb-cart-v2 .wc-block-cart-items__row,
body.tb-cart-v2 tr.wc-block-cart-items__row {
	display: grid !important;
	grid-template-columns: 120px minmax(0, 1fr) 160px !important;
	column-gap: 24px !important;
	row-gap: 0 !important;
	padding: 28px 0 !important;
	align-items: start !important;
	width: 100% !important;
	border-bottom: 1px solid rgba(209, 178, 140, 0.14) !important;
}

body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__image,
body.tb-cart-v2 .wc-block-cart-items__row td.wc-block-cart-item__image {
	display: block !important;
	grid-column: 1 / 2 !important;
	width: 120px !important;
	min-width: 120px !important;
	max-width: 120px !important;
	padding: 0 !important;
	margin: 0 !important;
}

body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__image img {
	display: block !important;
	width: 100% !important;
	height: auto !important;
	max-width: 120px !important;
	border-radius: 6px !important;
}

body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__product,
body.tb-cart-v2 .wc-block-cart-items__row td.wc-block-cart-item__product {
	display: block !important;
	grid-column: 2 / 3 !important;
	width: 100% !important;
	min-width: 0 !important;
	max-width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
	word-break: normal !important;
	overflow-wrap: break-word !important;
	white-space: normal !important;
}

body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__product .wc-block-cart-item__wrap,
body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__product .wc-block-cart-item__wrap > * {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
	min-width: 0 !important;
	white-space: normal !important;
	word-break: normal !important;
	overflow-wrap: break-word !important;
}

body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__product a,
body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__product .wc-block-components-product-name {
	display: inline !important;
	white-space: normal !important;
	word-break: normal !important;
	overflow-wrap: break-word !important;
}

body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__total,
body.tb-cart-v2 .wc-block-cart-items__row td.wc-block-cart-item__total {
	display: block !important;
	grid-column: 3 / 4 !important;
	width: auto !important;
	min-width: 120px !important;
	max-width: 160px !important;
	justify-self: end !important;
	text-align: right !important;
	padding: 0 !important;
	margin: 0 !important;
}

body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__total .wc-block-components-formatted-money-amount,
body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__total .wc-block-cart-item__total-price-and-sale-badge-wrapper {
	display: block !important;
	text-align: right !important;
	width: 100% !important;
}


/* ---- Sidebar-layout grid -- re-affirm for both pages at desktop ---- */

body.tb-cart-v2 .wc-block-components-sidebar-layout,
body.tb-checkout-v2 .wc-block-components-sidebar-layout {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) 380px !important;
	column-gap: 56px !important;
	row-gap: 0 !important;
	flex-direction: initial !important;
	flex-wrap: initial !important;
	margin: 0 !important;
	width: 100% !important;
	max-width: 100% !important;
}

body.tb-cart-v2 .wc-block-components-sidebar-layout > .wc-block-components-main,
body.tb-checkout-v2 .wc-block-components-sidebar-layout > .wc-block-components-main {
	grid-column: 1 / 2 !important;
	width: 100% !important;
	max-width: 100% !important;
	padding-right: 0 !important;
	padding-left: 0 !important;
	min-width: 0 !important;
}

body.tb-cart-v2 .wc-block-components-sidebar-layout > .wc-block-components-sidebar,
body.tb-checkout-v2 .wc-block-components-sidebar-layout > .wc-block-components-sidebar {
	grid-column: 2 / 3 !important;
	width: 100% !important;
	max-width: 380px !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	min-width: 0 !important;
}


/* ---- Bug C: Mobile break at <=900px (matches WC Blocks internal) ---- */

@media (max-width: 900px) {
	body.tb-cart-v2 .wp-block-woocommerce-cart,
	body.tb-checkout-v2 .wp-block-woocommerce-checkout {
		padding: 24px 20px 80px !important;
	}

	body.tb-cart-v2 .wc-block-components-sidebar-layout,
	body.tb-checkout-v2 .wc-block-components-sidebar-layout {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr) !important;
		column-gap: 0 !important;
		row-gap: 32px !important;
	}

	body.tb-cart-v2 .wc-block-components-sidebar-layout > .wc-block-components-main,
	body.tb-cart-v2 .wc-block-components-sidebar-layout > .wc-block-components-sidebar,
	body.tb-checkout-v2 .wc-block-components-sidebar-layout > .wc-block-components-main,
	body.tb-checkout-v2 .wc-block-components-sidebar-layout > .wc-block-components-sidebar {
		grid-column: 1 / -1 !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
	}

	body.tb-cart-v2 .wc-block-cart-items__row,
	body.tb-cart-v2 tr.wc-block-cart-items__row {
		grid-template-columns: 80px minmax(0, 1fr) !important;
		column-gap: 16px !important;
		row-gap: 8px !important;
		padding: 20px 0 !important;
	}

	body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__image,
	body.tb-cart-v2 .wc-block-cart-items__row td.wc-block-cart-item__image {
		grid-column: 1 / 2 !important;
		grid-row: 1 / 3 !important;
		width: 80px !important;
		min-width: 80px !important;
		max-width: 80px !important;
	}

	body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__image img {
		max-width: 80px !important;
	}

	body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__product,
	body.tb-cart-v2 .wc-block-cart-items__row td.wc-block-cart-item__product {
		grid-column: 2 / 3 !important;
		grid-row: 1 / 2 !important;
	}

	body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__total,
	body.tb-cart-v2 .wc-block-cart-items__row td.wc-block-cart-item__total {
		grid-column: 2 / 3 !important;
		grid-row: 2 / 3 !important;
		justify-self: start !important;
		text-align: left !important;
		min-width: 0 !important;
		max-width: none !important;
	}

	body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__total .wc-block-components-formatted-money-amount,
	body.tb-cart-v2 .wc-block-cart-items__row .wc-block-cart-item__total .wc-block-cart-item__total-price-and-sale-badge-wrapper {
		text-align: left !important;
	}
}

/* ---- v3.3 sentinel for curl verification ---- */
/* v3-3-sentinel: row-widen-mobile-break-container-widen */

/* ---- End of Section 17 (v3.3) ---- */


/* ========================================================================
   SECTION 18: v3.4 -- CHECKOUT OUTER GRID FIX (2026-04-23)
   ------------------------------------------------------------------------
   Root cause: Section 2 (line ~284) applied display:grid with
   grid-template-columns: 1fr 380px to .wp-block-woocommerce-checkout
   itself. But after React hydration, that element has ONE direct child:
   a <form class='wc-block-checkout__form'>. The form lands in col 1,
   leaving col 2 as 380px of empty space. Symptom: checkout looks
   two-column but the main block is squished into the left, empty gap on
   the right. Fix: force the outer to display:block, then let the inner
   .wc-block-components-sidebar-layout grid (Section 16, line ~1894) do
   the two-column layout. Cart left untouched.
   ======================================================================== */

body.tb-checkout-v2 .wp-block-woocommerce-checkout {
	display: block !important;
	grid-template-columns: none !important;
	gap: 0 !important;
}

/* Ensure the intermediate <form> element doesn't shrink the layout */
body.tb-checkout-v2 .wp-block-woocommerce-checkout > form,
body.tb-checkout-v2 .wp-block-woocommerce-checkout > .wc-block-checkout__form,
body.tb-checkout-v2 .wc-block-checkout__form {
	display: block !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* If sidebar-layout lives inside the form, keep it full-width so its own
   grid can expand to the 1280px container */
body.tb-checkout-v2 .wc-block-checkout__form > .wc-block-components-sidebar-layout,
body.tb-checkout-v2 form.wc-block-checkout__form > .wc-block-components-sidebar-layout {
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
}

/* v3-4-sentinel: checkout-outer-display-block */

/* ---- End of Section 18 (v3.4) ---- */


/* ========================================================================
   SECTION 19: v3.5 -- MOBILE CHECKOUT FORCE-COLLAPSE (2026-04-23)
   ------------------------------------------------------------------------
   v3.4 fixed desktop checkout but mobile still rendered 2-col with the
   order summary floating right of a squeezed form. WC Blocks uses both
   media queries AND container queries inside .wc-block-components-sidebar-
   layout, and our @900px rule wasn't winning at all viewports. This
   section uses a higher breakpoint (1024px) and stronger selectors to
   force single-column on every mobile + tablet width.
   ======================================================================== */

@media (max-width: 1024px) {

	/* Outer block: full-bleed, no leftover grid behaviour */
	body.tb-checkout-v2 .wp-block-woocommerce-checkout,
	body.tb-checkout-v2 .wp-block-woocommerce-checkout.alignwide,
	body.tb-checkout-v2 .wc-block-checkout {
		display: block !important;
		grid-template-columns: none !important;
		gap: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		padding: 24px 20px 80px !important;
	}

	/* Form wrapper: block, no grid */
	body.tb-checkout-v2 .wc-block-checkout__form,
	body.tb-checkout-v2 form.wc-block-checkout__form,
	body.tb-checkout-v2 .wp-block-woocommerce-checkout > form {
		display: block !important;
		grid-template-columns: none !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	/* Inner sidebar-layout: SINGLE COLUMN. Beats WC's container query. */
	body.tb-checkout-v2 .wc-block-components-sidebar-layout,
	body.tb-checkout-v2 .wp-block-woocommerce-checkout .wc-block-components-sidebar-layout,
	body.tb-checkout-v2 .wc-block-checkout .wc-block-components-sidebar-layout,
	body.tb-checkout-v2 .wc-block-checkout__form .wc-block-components-sidebar-layout {
		display: block !important;
		grid-template-columns: none !important;
		flex-direction: column !important;
		flex-wrap: wrap !important;
		gap: 0 !important;
		column-gap: 0 !important;
		row-gap: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
	}

	/* Both children full-width, stacked: main first, sidebar second */
	body.tb-checkout-v2 .wc-block-components-sidebar-layout > .wc-block-components-main,
	body.tb-checkout-v2 .wc-block-components-sidebar-layout > .wc-block-checkout__main,
	body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block {
		display: block !important;
		width: 100% !important;
		max-width: 100% !important;
		grid-column: 1 / -1 !important;
		float: none !important;
		order: 1 !important;
		margin: 0 0 32px 0 !important;
		padding: 0 !important;
	}

	body.tb-checkout-v2 .wc-block-components-sidebar-layout > .wc-block-components-sidebar,
	body.tb-checkout-v2 .wc-block-components-sidebar-layout > .wc-block-checkout__sidebar,
	body.tb-checkout-v2 .wp-block-woocommerce-checkout-totals-block {
		display: block !important;
		width: 100% !important;
		max-width: 100% !important;
		grid-column: 1 / -1 !important;
		float: none !important;
		order: 2 !important;
		position: static !important;
		margin: 0 !important;
		padding: 0 !important;
		top: auto !important;
	}
}

/* v3-5-sentinel: mobile-checkout-force-collapse */

/* ---- End of Section 19 (v3.5) ---- */

/* =============================================================
/* =============================================================
   20. PAYMENT METHODS CONTRAST FIX (2026-06-07 v3, 2026-06-09 v4 dark-bg fix)
   Problem: the global "body.tb-checkout-v2 p,span,li {color:var(--realm-cream)}"
   rule bled near-white cream text onto the WooCommerce payment-method box,
   which renders on a light/white card by default -> light-on-white,
   unreadable card-option labels + descriptions + saved-payment text.
   Additionally, the Section 13 radio-option rules give EVERY radio option
   (including payment radios) a dark-panel background with cream text, which
   conflicts with the light payment card surface.
   Fix: scope the payment block to an explicit light card with DARK text AND
   override the radio-option dark panels inside the payment block to transparent
   backgrounds with dark text.
   v3 changes (2026-06-07):
     - Doubled selectors to also target .wc-block-checkout__payment-method
       (WC runtime class) in addition to .wp-block-woocommerce-checkout-payment-block
       (block wrapper class). WC 10.8+ may use either or both.
     - Added body.tb-cart-v2 alongside body.tb-checkout-v2 to cover combined
       cart/checkout flows.
     - Bumped specificity on radio label override with
       .checkout-fields-block chain to beat Section 13.
   HARD RULE: do NOT touch .wc-stripe-* internals, the Stripe payment IFRAME
   (.wc-block-components-payment-element / #wc-stripe-*), or the express-pay
   button lifecycle. Stripe controls its own iframe text color via the
   gateway appearance config (payment_element_theme), not site CSS.
   ============================================================= */

/* Light card surface for the payment options box */
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block,
body.tb-checkout-v2 .wc-block-checkout__payment-method,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block,
body.tb-cart-v2 .wc-block-checkout__payment-method {
	background: var(--realm-primary, #0E1426) !important;
	background-color: var(--realm-primary, #0E1426) !important;
	border: 1px solid var(--tb-border-taupe) !important;
	border-radius: 2px !important;
	padding: 20px 18px !important;
	margin-top: 8px !important;
}

/* Override the dark-panel radio options INSIDE the payment block.
   Section 13 gives all radio options dark bg + cream text via
   .checkout-fields-block .radio-control__option -- the payment block sits
   inside that wrapper so it inherits the dark panel. Cancel it here.
   Extra specificity via .checkout-fields-block chain ensures this beats S13. */
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__option,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control-accordion__option,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-checkout__payment-method .wc-block-components-radio-control__option,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-checkout__payment-method .wc-block-components-radio-control-accordion__option,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__option,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control-accordion__option,
body.tb-checkout-v2 .wc-block-checkout__payment-method .wc-block-components-radio-control__option,
body.tb-checkout-v2 .wc-block-checkout__payment-method .wc-block-components-radio-control-accordion__option,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__option,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control-accordion__option,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-checkout__payment-method .wc-block-components-radio-control__option,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-checkout__payment-method .wc-block-components-radio-control-accordion__option,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__option,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control-accordion__option,
body.tb-cart-v2 .wc-block-checkout__payment-method .wc-block-components-radio-control__option,
body.tb-cart-v2 .wc-block-checkout__payment-method .wc-block-components-radio-control-accordion__option {
	background: transparent !important;
	border: 1px solid var(--tb-border-taupe, rgba(196, 188, 177, 0.14)) !important;
	color: var(--realm-cream, #ECE4D5) !important;
}
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__option--checked,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control-accordion__option--checked,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-checkout__payment-method .wc-block-components-radio-control__option--checked,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-checkout__payment-method .wc-block-components-radio-control-accordion__option--checked,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__option--checked,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control-accordion__option--checked,
body.tb-checkout-v2 .wc-block-checkout__payment-method .wc-block-components-radio-control__option--checked,
body.tb-checkout-v2 .wc-block-checkout__payment-method .wc-block-components-radio-control-accordion__option--checked,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__option--checked,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control-accordion__option--checked,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-checkout__payment-method .wc-block-components-radio-control__option--checked,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wc-block-checkout__payment-method .wc-block-components-radio-control-accordion__option--checked,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__option--checked,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control-accordion__option--checked,
body.tb-cart-v2 .wc-block-checkout__payment-method .wc-block-components-radio-control__option--checked,
body.tb-cart-v2 .wc-block-checkout__payment-method .wc-block-components-radio-control-accordion__option--checked {
	border-color: var(--realm-metallic, #D1B28C) !important;
	background: color-mix(in srgb, var(--realm-metallic, #D1B28C) 8%, transparent) !important;
}

/* Force ALL payment-block text to brand near-black for readable contrast on the
   light card. Excludes svg/path so card-brand icons keep their own fills.
   Excludes the Stripe iframe + express-pay button (handled/owned by Stripe).
   High-specificity chain (.checkout-fields-block > .payment-block) to beat
   the Section 13 cream-text cascade. */
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block p,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block span,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block li,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block label,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block legend,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__label,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__description,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block .wc-block-components-payment-method-label,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block .wc-block-components-payment-method-icons,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block .wc-block-components-saved-payment-method-options,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block p,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block span,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block li,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block label,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block legend,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__label,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__description,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__option-checked,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-payment-method-label,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-payment-method-icons,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-saved-payment-method-options,
body.tb-checkout-v2 .wc-block-checkout__payment-method,
body.tb-checkout-v2 .wc-block-checkout__payment-method p,
body.tb-checkout-v2 .wc-block-checkout__payment-method span,
body.tb-checkout-v2 .wc-block-checkout__payment-method li,
body.tb-checkout-v2 .wc-block-checkout__payment-method label,
body.tb-checkout-v2 .wc-block-checkout__payment-method legend,
body.tb-checkout-v2 .wc-block-checkout__payment-method .wc-block-components-radio-control__label,
body.tb-checkout-v2 .wc-block-checkout__payment-method .wc-block-components-radio-control__description,
body.tb-checkout-v2 .wc-block-checkout__payment-method .wc-block-components-payment-method-label,
body.tb-checkout-v2 .wc-block-checkout__payment-method .wc-block-components-payment-method-icons,
body.tb-checkout-v2 .wc-block-checkout__payment-method .wc-block-components-saved-payment-method-options,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block p,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block span,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block li,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block label,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block legend,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__label,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__description,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block .wc-block-components-payment-method-label,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block .wc-block-components-payment-method-icons,
body.tb-cart-v2 .wp-block-woocommerce-checkout-fields-block .wp-block-woocommerce-checkout-payment-block .wc-block-components-saved-payment-method-options,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block p,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block span,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block li,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block label,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block legend,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__label,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__description,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-payment-method-label,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-payment-method-icons,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-saved-payment-method-options,
body.tb-cart-v2 .wc-block-checkout__payment-method,
body.tb-cart-v2 .wc-block-checkout__payment-method p,
body.tb-cart-v2 .wc-block-checkout__payment-method span,
body.tb-cart-v2 .wc-block-checkout__payment-method li,
body.tb-cart-v2 .wc-block-checkout__payment-method label,
body.tb-cart-v2 .wc-block-checkout__payment-method legend,
body.tb-cart-v2 .wc-block-checkout__payment-method .wc-block-components-radio-control__label,
body.tb-cart-v2 .wc-block-checkout__payment-method .wc-block-components-radio-control__description,
body.tb-cart-v2 .wc-block-checkout__payment-method .wc-block-components-payment-method-label,
body.tb-cart-v2 .wc-block-checkout__payment-method .wc-block-components-payment-method-icons,
body.tb-cart-v2 .wc-block-checkout__payment-method .wc-block-components-saved-payment-method-options {
	color: var(--realm-cream, #ECE4D5) !important;
}

/* Saved/expanded payment description helper text -- slightly muted but still AA */
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__description,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block small,
body.tb-checkout-v2 .wc-block-checkout__payment-method .wc-block-components-radio-control__description,
body.tb-checkout-v2 .wc-block-checkout__payment-method small,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__description,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block small,
body.tb-cart-v2 .wc-block-checkout__payment-method .wc-block-components-radio-control__description,
body.tb-cart-v2 .wc-block-checkout__payment-method small {
	color: var(--realm-taupe, #B8B3A8) !important;
}

/* Radio button dot -- gold on dark bg (2026-06-09) */
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__input,
body.tb-checkout-v2 .wc-block-checkout__payment-method .wc-block-components-radio-control__input,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__input,
body.tb-cart-v2 .wc-block-checkout__payment-method .wc-block-components-radio-control__input {
	border-color: var(--realm-taupe, #B8B3A8) !important;
}
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__input:checked,
body.tb-checkout-v2 .wc-block-checkout__payment-method .wc-block-components-radio-control__input:checked,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-radio-control__input:checked,
body.tb-cart-v2 .wc-block-checkout__payment-method .wc-block-components-radio-control__input:checked {
	background-color: var(--realm-metallic, #D1B28C) !important;
	border-color: var(--realm-metallic, #D1B28C) !important;
}

/* Headings ("Payment options") above the box stay cream on the dark page bg.
   The heading sits OUTSIDE the payment card wrapper, so leave it untouched. */

/* SAFETY: never recolor inside the Stripe iframe / payment element / express
   button. Stripe owns those; this just makes sure our cascade does not try. */
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-payment-element,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block iframe,
body.tb-checkout-v2 .wc-block-checkout__payment-method .wc-block-components-payment-element,
body.tb-checkout-v2 .wc-block-checkout__payment-method iframe,
body.tb-checkout-v2 .wp-block-woocommerce-checkout-express-payment-block *,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-payment-element,
body.tb-cart-v2 .wp-block-woocommerce-checkout-payment-block iframe,
body.tb-cart-v2 .wc-block-checkout__payment-method .wc-block-components-payment-element,
body.tb-cart-v2 .wc-block-checkout__payment-method iframe,
body.tb-cart-v2 .wp-block-woocommerce-checkout-express-payment-block * {
	color: revert !important;
}



/* Save payment checkbox inside payment block — cream text on dark bg (2026-06-09) */
body.tb-checkout-v2 .wp-block-woocommerce-checkout-payment-block .wc-block-components-checkbox__label,
body.tb-checkout-v2 .wc-block-checkout__payment-method .wc-block-components-checkbox__label {
	color: var(--realm-cream, #ECE4D5) !important;
}
/* ---- End of Section 20 ---- */


/* =============================================================
   21. CART PAGE UPSELL — MOBILE STACKING FIX (2026-06-06)
   Problem: the .tb-cart-page-upsell inner flex row (image 70px +
   text div + CTA button) crushes the text column on mobile,
   causing character-by-character wrapping of product title and
   description. The inline style sets display:flex horizontally.
   Fix: on <=720px, force the inner div to flex-wrap so the CTA
   drops below; give the text column full width. The image + text
   stay side-by-side (image is only 70px), CTA wraps to its own row.
   ============================================================= */

@media (max-width: 720px) {
	/* Force the inline-styled flex container to wrap */
	body.tb-cart-v2 .tb-cart-page-upsell > div[style] {
		flex-wrap: wrap !important;
		gap: 12px !important;
	}

	/* Text column: take full remaining width beside image */
	body.tb-cart-v2 .tb-cart-page-upsell > div[style] > div[style] {
		flex: 1 1 calc(100% - 84px) !important;
		min-width: calc(100% - 84px) !important;
	}

	/* CTA button: full width on its own row */
	body.tb-cart-v2 .tb-cart-page-upsell__cta {
		flex: 0 0 100% !important;
		width: 100% !important;
		justify-content: center !important;
		text-align: center !important;
		box-sizing: border-box !important;
	}

	/* Image: keep small and don't grow */
	body.tb-cart-v2 .tb-cart-page-upsell > div[style] > img {
		width: 60px !important;
		height: 60px !important;
		min-width: 60px !important;
		flex-shrink: 0 !important;
	}
}

/* ---- End of Section 21 ---- */

/* ── Empty-cart CTA ── dark text on the gold button (2026-09-19)
   functions.php prints ".entry-content a,.entry-content a:visited{color:#D1B28C
   !important}" at (0,1,1). This CTA sits inside .entry-content, so that gold
   beat the "color: var(--realm-bg)" declared above and the button rendered gold
   on gold: 1.00:1, the label invisible on the live empty cart. The selectors
   below are (0,3,2) and (0,4,2) with !important, so they win on specificity. */
body.tb-cart-v2 .wp-block-woocommerce-empty-cart-block a.tb-empty-cta,
body.tb-cart-v2 .wp-block-woocommerce-empty-cart-block a.tb-empty-cta:visited {
	color: var(--realm-bg, #070A14) !important;
}

body.tb-cart-v2 .wp-block-woocommerce-empty-cart-block a.tb-empty-cta:hover,
body.tb-cart-v2 .wp-block-woocommerce-empty-cart-block a.tb-empty-cta:focus {
	color: var(--realm-bg, #070A14) !important;
}

/* =============================================================
   USD ON THE BLOCKS TOTAL -- 2026-09-21 (website-manager)

   The cart and checkout totals are rendered by React through the Store
   API. Injecting a node inside a React-owned money element risks a
   reconciliation error, and React would wipe it on the next update, so
   the label is applied as CSS generated content instead: presentation
   only, invisible to React, and it cannot desynchronise from the figure.

   The Store API CurrencyFormatter derives its prefix/suffix from
   woocommerce_currency_pos alone and ignores woocommerce_price_format,
   so there is no server-side filter that could do this job.
   ============================================================= */
.wc-block-components-totals-footer-item .wc-block-formatted-money-amount::after,
.wc-block-components-totals-item__value .wc-block-formatted-money-amount::after {
  content: " USD";
  font-size: 0.68em;
  letter-spacing: 0.1em;
  opacity: 0.7;
  white-space: nowrap;
}

/* Only the grand total carries the label; line rows stay clean. */
.wc-block-components-totals-item__value .wc-block-formatted-money-amount::after { content: none; }
.wc-block-components-totals-footer-item .wc-block-formatted-money-amount::after { content: " USD"; }

.tb-currency-note--totals {
  display: block;
  font-family: var(--tb-font-body, 'Cormorant Garamond'), serif;
  font-size: 13px;
  font-style: italic;
  line-height: 1.4;
  color: var(--realm-taupe, #B8B3A8);
  opacity: 0.85;
  margin: 10px 0 0;
  text-align: right;
}
@media (max-width: 767px) {
  .tb-currency-note--totals { text-align: left; }
}