/* ============================================================
   Chewtoy's Dugout — WooCommerce pages · "Night Pitch" (2026-09)

   Cart, checkout, order-received, My Account (login, dashboard, orders,
   saved builds, addresses, edit account) and the /builders/ hub. Loads via
   ctd_is_woo_page() / ctd_is_builders_hub() (inc/woo-pages.php).

   The templates under woocommerce/ kept their structural class names — WC's
   own checkout.js / cart.js and js/checkout.js query some of them, and the
   line-item panels are rendered by inc/team-builder-cart.php and
   inc/cart-dropdown.php whose markup this phase does not touch — so this file
   is the v3 skin for those names plus for WooCommerce's core form, payment
   and notice markup. Font Awesome elements left inside the inc renderers are
   hidden here (their labels carry the text); Phase 4 swaps them for sprites.

   Breakpoints: 1000px (single column) and 640px (phone).
   ============================================================ */

/* ---------- the pitch, turned down ----------
   HALF the storefront's, the same as every other effect on this page. The
   user is AIMING at these rows rather than browsing them, so the floor's
   job here is depth and nothing else.

   This is the per-page EFFECT BUDGET from DESIGN-SYSTEM.md applied to the one
   token that can express it. The floor is fixed behind the whole document, so
   it cannot be enqueued per page like a stylesheet can — but --ground-amp is
   read off the layer, and the layer is a child of body, so a page that loads
   this file turns the pitch down for itself and nothing else. */
body { --ground-amp: 0.3; }


/* ---------- page gutter (page.php Woo branch) ---------- */
.ctd-woo { padding-block: var(--s-8) var(--s-12); }
.ctd-woo__wrap { display: flex; flex-direction: column; gap: var(--s-6); }
.ctd-woo .fas, .ctd-woo .fa { display: none; }
.ctd-woo .woocommerce-notices-wrapper:empty { display: none; }
.ctd-woo .woocommerce-notices-wrapper { display: flex; flex-direction: column; gap: var(--s-3); }
.ctd-woo .woocommerce-error li, .ctd-woo .woocommerce-message li, .ctd-woo .woocommerce-info li { list-style: none; }
.ctd-woo .woocommerce-NoticeGroup { display: flex; flex-direction: column; gap: var(--s-3); }
/* jQuery.blockUI paints a white overlay inline while WC refreshes totals */
.ctd-woo .blockUI.blockOverlay { background: var(--scrim) !important; opacity: 1 !important; } /* lint-allow: important — blockUI sets inline styles */

/* ---------- ledger headers (cart + checkout) ---------- */
.cart-ledger-header, .checkout-ledger-header { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--s-6); flex-wrap: wrap; }
.cart-ledger-header__title-block, .checkout-ledger-header__title-block { display: flex; align-items: center; gap: var(--s-4); flex-wrap: wrap; }
/* Page titles take the varsity voice (see components.css). Set here, not
   there: woo.css loads after components.css and would win the family back. */
.cart-ledger-header__title, .checkout-ledger-header__title { font-family: var(--font-varsity); text-transform: uppercase; letter-spacing: 0.005em; font-size: var(--fs-40); font-weight: 700; line-height: var(--lh-tight); }
.cart-ledger-header__meta { display: flex; gap: var(--s-2); flex-wrap: wrap; }
.cart-meta-pill { display: inline-flex; align-items: center; gap: 6px; min-height: 28px; padding: 0 var(--s-3); border: var(--bw) solid var(--line-2); border-radius: var(--r-pill); font-size: var(--fs-13); color: var(--text-2); font-variant-numeric: tabular-nums; }
.cart-meta-pill strong { color: var(--text); }
.cart-meta-pill--savings { border-color: var(--ok); color: var(--ok); }
/* min-height: both are standalone "back" links at the head of their page, and
   at 14px the line box came out 23-24px — under or on the AA floor. */
.cart-ledger-header__continue, .checkout-ledger-header__back { display: inline-flex; align-items: center; gap: 6px; min-height: 24px; color: var(--text-3); text-decoration: none; font-size: var(--fs-14); }
.cart-ledger-header__continue:hover, .checkout-ledger-header__back:hover { color: var(--text); }

/* ---------- status badges ---------- */
.status-badge { display: inline-flex; align-items: center; height: 24px; padding: 0 8px; border: var(--bw) solid var(--line-2); border-radius: var(--r-1); font-family: var(--font-display); font-size: var(--fs-13); font-weight: 500; letter-spacing: 0.06em; text-transform: uppercase; color: var(--text-2); }
.status-badge--processing, .status-badge--on-hold { border-color: var(--warn); color: var(--warn); }
.status-badge--completed { border-color: var(--ok); color: var(--ok); }
.status-badge--cancelled, .status-badge--failed, .status-badge--refunded { border-color: var(--err); color: var(--err); }

/* ---------- empty states ---------- */
.cart-empty, .empty-state { display: flex; flex-direction: column; align-items: center; gap: var(--s-3); padding: var(--s-16) var(--s-6); text-align: center; border: var(--bw) dashed var(--line-2); border-radius: var(--r-2); background: var(--bg-alt); }
.card--empty-state { border: 0; }
.card--empty-state .card__body { padding: 0; }
.cart-empty__ring, .empty-state__icon { width: 64px; height: 64px; border-radius: 50%; border: var(--bw) solid var(--line-2); display: flex; align-items: center; justify-content: center; color: var(--text-3); }
.cart-empty__ring .ctd-i, .empty-state__icon .ctd-i { width: 28px; height: 28px; }
.cart-empty__title, .empty-state__title { font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.03em; font-size: var(--fs-24); font-weight: 500; }
.cart-empty__text, .empty-state__text { color: var(--text-2); max-width: 44ch; }
.cart-empty__actions, .empty-state__actions { display: flex; gap: var(--s-3); flex-wrap: wrap; justify-content: center; margin-top: var(--s-2); }

/* ============================================================
   CART
   ============================================================ */
.cart-ledger-body { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: var(--s-8); align-items: start; }
.woocommerce-cart-form { display: flex; flex-direction: column; gap: var(--s-4); }
.cart-items { display: flex; flex-direction: column; gap: var(--s-3); }
.cart-item { background: var(--surface); border: var(--bw) solid var(--line-1); border-radius: var(--r-2); overflow: hidden; }
.cart-item__head { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto auto 44px; gap: var(--s-4); align-items: center; padding: var(--s-4); }
.cart-item__image img { width: 72px; height: 72px; object-fit: cover; border-radius: var(--r-1); border: var(--bw) solid var(--line-1); background: var(--ink-900); }
.cart-item__info { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cart-item__name { font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.03em; font-size: var(--fs-18); font-weight: 500; line-height: var(--lh-snug); }
.cart-item__name a { color: var(--text); text-decoration: none; }
.cart-item__name a:hover { color: var(--gold-300); }
.cart-item__name small { display: block; font-family: var(--font-body); text-transform: none; letter-spacing: 0; font-size: var(--fs-13); font-weight: 400; color: var(--text-3); }
.cart-item__summary { font-size: var(--fs-13); color: var(--text-3); }
.cart-item__unit-price { font-size: var(--fs-13); color: var(--text-3); font-variant-numeric: tabular-nums; }
.cart-item__unit-label { text-transform: uppercase; letter-spacing: var(--track-caps); font-size: var(--fs-12); margin-right: 4px; }
.cart-item .variation { margin: 0; display: flex; gap: var(--s-2); flex-wrap: wrap; font-size: var(--fs-13); color: var(--text-3); }
.cart-item .variation dt, .cart-item .variation dd { margin: 0; display: inline; }
.cart-item .variation dd p { display: inline; margin: 0; }
.backorder-note { margin: 0; display: inline-flex; align-items: center; gap: 4px; font-size: var(--fs-13); color: var(--warn); }
.cart-qty { display: inline-grid; grid-template-columns: 40px 52px 40px; border: var(--bw) solid var(--line-2); border-radius: var(--r-1); overflow: hidden; }
.cart-qty-btn { display: flex; align-items: center; justify-content: center; min-height: var(--control-h); color: var(--text-2); }
.cart-qty-btn:hover { background: var(--surface-2); color: var(--text); }
.cart-qty .quantity { display: flex; }
.cart-qty__input, .cart-qty .qty { width: 100%; min-height: var(--control-h); text-align: center; appearance: textfield; background: var(--ink-900); color: var(--text); border: 0; border-inline: var(--bw) solid var(--line-2); font-weight: 700; font-variant-numeric: tabular-nums; }
.cart-qty .qty::-webkit-outer-spin-button, .cart-qty .qty::-webkit-inner-spin-button { appearance: none; margin: 0; }
.cart-qty-fixed { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: var(--control-h); font-weight: 700; color: var(--text-2); }
.cart-item__subtotal { font-family: var(--font-display); font-size: var(--fs-20); font-weight: 700; color: var(--gold-300); font-variant-numeric: tabular-nums; white-space: nowrap; }
.cart-item__subtotal .woocommerce-Price-currencySymbol { font-size: 0.8em; }
.cart-remove { color: var(--text-3); }
.cart-remove:hover { color: var(--err); border-color: var(--err); }
.cart-item__details { border-top: var(--bw) solid var(--line-1); }
.cart-item__details-toggle { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); padding: var(--s-3) var(--s-4); font-size: var(--fs-13); font-weight: 600; color: var(--text-2); cursor: pointer; }
.cart-item__details-toggle::-webkit-details-marker { display: none; }
.cart-item__details-toggle > span { display: inline-flex; align-items: center; gap: 6px; }
.cart-item__details-toggle:hover { color: var(--text); background: var(--surface-2); }
.cart-item__details-chev { transition: transform var(--t-fast) var(--ease); }
.cart-item__details[open] .cart-item__details-chev { transform: rotate(180deg); }
.cart-item__body { padding: 0 var(--s-4) var(--s-4); }
.cart-actions { display: flex; align-items: center; gap: var(--s-3); flex-wrap: wrap; }

/* the rich line-item panel inc/team-builder-cart.php renders (markup untouched) */
.cart-builder-panel { display: flex; flex-direction: column; gap: var(--s-4); }
.cart-builder-banner { display: flex; align-items: center; gap: var(--s-3); }
.cart-builder-icon { display: none; }
.cart-builder-info { display: flex; flex-direction: column; }
.cart-builder-team-name { font-weight: 700; color: var(--text); }
.cart-builder-number { color: var(--text-3); font-weight: 400; }
.cart-builder-meta { font-size: var(--fs-13); color: var(--text-3); }
.cart-builder-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3); }
.cart-builder-section { padding: var(--s-3); background: var(--ink-900); border: var(--bw) solid var(--line-1); border-radius: var(--r-1); display: flex; flex-direction: column; gap: var(--s-2); }
.cart-builder-section--full { grid-column: 1 / -1; }
.cart-builder-section-header { display: flex; justify-content: space-between; align-items: baseline; gap: var(--s-2); }
.cart-builder-section-title { font-size: var(--fs-12); letter-spacing: var(--track-caps); text-transform: uppercase; font-weight: 600; color: var(--text-3); }
.cart-builder-section-count { font-family: var(--font-display); font-size: var(--fs-14); color: var(--text-2); font-variant-numeric: tabular-nums; }
.cart-builder-items { display: flex; flex-wrap: wrap; gap: 6px; }
.cart-builder-item { display: inline-flex; align-items: center; gap: 6px; height: 26px; padding: 0 8px; border: var(--bw) solid var(--line-2); border-radius: var(--r-1); font-family: var(--font-display); font-size: var(--fs-13); font-weight: 500; letter-spacing: 0.04em; text-transform: uppercase; color: var(--text); font-variant-numeric: tabular-nums; }
.cart-builder-item-qty { color: var(--text-3); }
.cart-builder-item-skills { font-family: var(--font-body); text-transform: none; letter-spacing: 0; color: var(--text-3); }
.cart-builder-badge-40mm { display: inline-flex; align-items: center; height: 18px; padding: 0 5px; border: var(--bw) solid var(--accent); border-radius: var(--r-1); font-size: var(--fs-12); color: var(--gold-300); }
.cart-builder-empty { font-size: var(--fs-13); color: var(--text-3); }
.cart-builder-pricing { display: flex; flex-direction: column; gap: 4px; padding-top: var(--s-3); border-top: var(--bw) solid var(--line-1); font-size: var(--fs-14); color: var(--text-2); font-variant-numeric: tabular-nums; }
.cart-builder-price-row { display: flex; justify-content: space-between; gap: var(--s-3); }
.cart-builder-price-total { color: var(--text); font-weight: 700; }
.cart-builder-price-total span:last-child { font-family: var(--font-display); color: var(--gold-300); font-size: var(--fs-18); }
.cart-builder-actions { display: flex; }
.cart-builder-edit { display: inline-flex; align-items: center; justify-content: center; min-height: var(--control-h-sm); padding: 0 var(--s-4); border: var(--bw) solid var(--bone-300); border-radius: var(--r-1); color: var(--text); text-decoration: none; font-family: var(--font-display); font-weight: 500; text-transform: uppercase; letter-spacing: 0.06em; font-size: var(--fs-14); }
.cart-builder-edit:hover { background: var(--surface-2); border-color: var(--bone-100); }

/* the summary pane */
.cart-sidebar { position: sticky; top: calc(var(--nav-h) + var(--s-4)); display: flex; flex-direction: column; gap: var(--s-4); }
.cart-summary { background: var(--surface); border: var(--bw) solid var(--line-1); border-radius: var(--r-2); padding: var(--s-5); display: flex; flex-direction: column; gap: var(--s-4); }
.cart-summary__title { display: flex; align-items: center; gap: var(--s-2); font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.03em; font-size: var(--fs-20); font-weight: 500; }
.cart-summary__title .ctd-i { color: var(--accent); }
.cart-summary__rows { display: flex; flex-direction: column; gap: var(--s-2); font-size: var(--fs-14); color: var(--text-2); font-variant-numeric: tabular-nums; }
.cart-summary__row { display: flex; justify-content: space-between; gap: var(--s-3); }
.cart-summary__row--discount { color: var(--ok); }
.cart-summary__row--shipping { flex-direction: column; gap: 4px; }
.cart-summary__shipping-line { display: flex; justify-content: space-between; gap: var(--s-3); }
.cart-summary__shipping-line--notice .cart-summary__shipping-value { color: var(--warn); text-align: right; }
.cart-summary__total { display: flex; justify-content: space-between; align-items: baseline; gap: var(--s-3); padding-top: var(--s-3); border-top: var(--bw) solid var(--line-2); font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.04em; font-weight: 500; }
.cart-summary__total > span:last-child { font-size: var(--fs-28); font-weight: 700; color: var(--gold-300); font-variant-numeric: tabular-nums; }
.cart-summary__total .woocommerce-Price-currencySymbol { font-size: 0.8em; }
.cart-summary__coupon { border: var(--bw) solid var(--line-1); border-radius: var(--r-1); }
.cart-summary__coupon > summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: var(--s-3); padding: var(--s-3); font-size: var(--fs-14); color: var(--text-2); cursor: pointer; }
.cart-summary__coupon > summary::-webkit-details-marker { display: none; }
.cart-summary__coupon > summary > span { display: inline-flex; align-items: center; gap: 6px; }
.cart-summary__coupon-action { font-size: var(--fs-13); color: var(--text-3); }
.cart-summary__coupon-close-label, .cart-summary__coupon-close-icon { display: none; }
.cart-summary__coupon[open] .cart-summary__coupon-open-label, .cart-summary__coupon[open] .cart-summary__coupon-chev { display: none; }
.cart-summary__coupon[open] .cart-summary__coupon-close-label, .cart-summary__coupon[open] .cart-summary__coupon-close-icon { display: inline-flex; }
.cart-summary__coupon-form { display: flex; gap: var(--s-2); padding: 0 var(--s-3) var(--s-3); }
.cart-summary__coupon-input { flex: 1; min-width: 0; min-height: var(--control-h-sm); padding: 0 var(--s-3); background: var(--ink-900); border: var(--bw) solid var(--line-2); border-radius: var(--r-1); color: var(--text); }
.cart-summary__checkout { width: 100%; }
.cart-summary__trust { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; font-size: var(--fs-13); color: var(--text-3); }
.cart-summary__trust li { display: flex; align-items: center; gap: 6px; }
.cart-summary__trust .ctd-i { color: var(--accent); }

/* import-charges / returns policy (inc/postage-packaging.php, cart + checkout) */
.ctd-policy-stack { display: flex; flex-direction: column; gap: var(--s-3); }
.ctd-policy-card { padding: var(--s-4); border: var(--bw) solid var(--line-2); border-left-width: 4px; border-radius: var(--r-2); background: var(--ink-900); display: flex; flex-direction: column; gap: var(--s-2); font-size: var(--fs-13); color: var(--text-2); }
.ctd-policy-card--shipping { border-left-color: var(--accent-2); }
.ctd-policy-card--returns { border-left-color: var(--warn); }
.ctd-policy-card__eyebrow { font-size: var(--fs-12); letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--text-3); font-weight: 600; }
.ctd-policy-card__title { font-size: var(--fs-14); font-weight: 700; color: var(--text); }
.ctd-policy-card__body, .ctd-policy-card__fine-print { margin: 0; }
.ctd-policy-card__fine-print { color: var(--text-3); }
.ctd-policy-card__list { margin: 0; padding-left: 1.1em; display: flex; flex-direction: column; gap: 4px; }
.ctd-policy-card__list li::marker { color: var(--accent); }
.ctd-checkout-policy { padding: var(--s-3) var(--s-4); border: var(--bw) solid var(--line-2); border-left-width: 4px; border-radius: var(--r-2); background: var(--ink-900); display: flex; flex-direction: column; gap: 4px; font-size: var(--fs-13); color: var(--text-2); }
.ctd-checkout-policy--domestic { border-left-color: var(--ok); }
.ctd-checkout-policy--estimate, .ctd-checkout-policy--prompt { border-left-color: var(--accent-2); }
.ctd-checkout-policy--warning { border-left-color: var(--warn); }
.ctd-checkout-policy__head { display: flex; justify-content: space-between; gap: var(--s-3); flex-wrap: wrap; }
.ctd-checkout-policy__eyebrow { font-size: var(--fs-12); letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--text-3); font-weight: 600; }
.ctd-checkout-policy__country { font-weight: 700; color: var(--text); }
.ctd-checkout-policy__summary, .ctd-checkout-policy__detail { margin: 0; }
.ctd-checkout-policy__detail { color: var(--text-3); }
.ctd-checkout-returns-note { margin: 0; font-size: var(--fs-13); color: var(--text-3); }
.ctd-checkout-returns-note strong { color: var(--text-2); }

/* ============================================================
   CHECKOUT
   ============================================================ */
.checkout-page { display: flex; flex-direction: column; gap: var(--s-6); }
.checkout-layout { display: grid; grid-template-columns: minmax(0, 1fr) 400px; gap: var(--s-8); align-items: start; }
.checkout-fields { display: flex; flex-direction: column; gap: var(--s-4); }
.checkout-step { background: var(--surface); border: var(--bw) solid var(--line-1); border-radius: var(--r-2); overflow: hidden; }
.checkout-step__head { display: flex; align-items: flex-start; gap: var(--s-4); padding: var(--s-4) var(--s-5); border-bottom: var(--bw) solid var(--line-1); background: var(--ink-900); }
.checkout-step__num { width: 32px; height: 32px; flex: none; border-radius: 50%; background: var(--bone-100); color: var(--ink-950); display: flex; align-items: center; justify-content: center; font-family: var(--font-display); font-weight: 700; }
.checkout-step__title { font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.03em; font-size: var(--fs-20); font-weight: 500; }
.checkout-step__hint { margin: 2px 0 0; font-size: var(--fs-13); color: var(--text-3); }
.checkout-step__body { padding: var(--s-5); display: flex; flex-direction: column; gap: var(--s-5); }
.checkout-inline-shipping { padding-top: var(--s-4); border-top: var(--bw) solid var(--line-1); }

/* WooCommerce's own form markup (form-billing.php / form-shipping.php, core) */
.ctd-woo .woocommerce-billing-fields > h3, .ctd-woo .woocommerce-shipping-fields > h3, .ctd-woo .woocommerce-additional-fields > h3 { font-size: var(--fs-16); font-weight: 700; color: var(--text); margin-bottom: var(--s-3); }
.ctd-woo .woocommerce-shipping-fields > h3 label { display: inline-flex; align-items: center; gap: var(--s-2); font-weight: 600; font-size: var(--fs-16); color: var(--text); cursor: pointer; }
.ctd-woo .woocommerce-billing-fields__field-wrapper, .ctd-woo .woocommerce-shipping-fields__field-wrapper, .ctd-woo .woocommerce-additional-fields__field-wrapper { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3) var(--s-4); }
.ctd-woo .form-row { margin: 0; display: flex; flex-direction: column; gap: 6px; grid-column: 1 / -1; }
.ctd-woo .form-row-first, .ctd-woo .form-row-last { grid-column: auto; }
.ctd-woo .form-row label { font-size: var(--fs-13); font-weight: 600; color: var(--text-2); }
.ctd-woo .form-row .required { color: var(--err); text-decoration: none; }
.ctd-woo .form-row .optional { color: var(--text-3); font-weight: 400; }
.ctd-woo .woocommerce-input-wrapper { display: flex; }
.ctd-woo .form-row input.input-text, .ctd-woo .form-row textarea, .ctd-woo .form-row select, .ctd-woo .woocommerce-Input {
  width: 100%; min-height: var(--control-h); padding: 0 var(--s-3); background: var(--ink-900); color: var(--text);
  border: var(--bw) solid var(--line-2); border-radius: var(--r-1); font: inherit; color-scheme: dark;
  /* Milled into the panel like every other field on the site (.ctd-input,
     components.css) — these were the one set drawn flat (2026-10-09). */
  box-shadow: var(--fx-channel);
}
.ctd-woo .form-row textarea { min-height: 96px; padding: var(--s-3); resize: vertical; }
/* FOCUS YOU CAN SEE (2026-10-09). The checkout, sign-in and account fields
   dropped the outline and only recoloured a 1px border, the weakest focus on
   the site and on the form that matters most. They take the violet ring the
   rest of the site's fields wear. */
.ctd-woo .form-row input.input-text:focus, .ctd-woo .form-row textarea:focus, .ctd-woo .form-row select:focus, .ctd-woo .woocommerce-Input:focus { outline: none; border-color: var(--focus); box-shadow: var(--fx-channel), var(--fx-glow-violet); }
.ctd-woo .form-row input.input-text:focus-visible, .ctd-woo .form-row textarea:focus-visible, .ctd-woo .form-row select:focus-visible, .ctd-woo .woocommerce-Input:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }
.ctd-woo .form-row.woocommerce-invalid input.input-text, .ctd-woo .form-row.woocommerce-invalid select, .ctd-woo .form-row.woocommerce-invalid .select2-selection { border-color: var(--err); }
.ctd-woo .form-row.woocommerce-validated input.input-text, .ctd-woo .form-row.woocommerce-validated select { border-color: var(--ok); }
.ctd-woo .form-row input[type="checkbox"], .ctd-woo .form-row input[type="radio"] { width: 18px; height: 18px; accent-color: var(--gold-500); margin: 0; }
/* The LABEL is the target for a checkbox — tapping it toggles the box — so it
   is the label that has to clear 24px, not the 18px box inside it. A one-line
   label at 13-14px came out 22-23px: the terms tick at checkout and "remember
   me" at sign-in were both a hair under the floor. */
.ctd-woo .woocommerce-form__label-for-checkbox,
.ctd-woo .form-row label.checkbox { display: inline-flex; align-items: flex-start; gap: var(--s-2); min-height: 24px; font-weight: 400; color: var(--text-2); cursor: pointer; }
.ctd-woo .woocommerce-form__label-for-checkbox input { margin-top: 3px; }
.ctd-woo .woocommerce-form__label-for-checkbox span { font-size: var(--fs-14); }
/* Select2 / SelectWoo (country and state) */
.ctd-woo .select2-container .select2-selection--single { height: var(--control-h); background: var(--ink-900); border: var(--bw) solid var(--line-2); border-radius: var(--r-1); }
.ctd-woo .select2-container .select2-selection--single .select2-selection__rendered { line-height: var(--control-h); padding-left: var(--s-3); color: var(--text); }
.ctd-woo .select2-container .select2-selection--single .select2-selection__arrow { height: var(--control-h); }
.ctd-woo .select2-container .select2-selection--single .select2-selection__arrow b { border-color: var(--text-3) transparent transparent; }
.ctd-woo .select2-container--focus .select2-selection--single, .ctd-woo .select2-container--open .select2-selection--single { border-color: var(--focus); }
.select2-container .select2-dropdown { background: var(--ink-900); border: var(--bw) solid var(--line-2); border-radius: var(--r-1); color: var(--text); }
.select2-container .select2-search--dropdown .select2-search__field { background: var(--ink-950); color: var(--text); border: var(--bw) solid var(--line-2); border-radius: var(--r-1); min-height: 36px; }
.select2-container .select2-results__option { padding: var(--s-2) var(--s-3); font-size: var(--fs-14); }
.select2-container .select2-results__option--highlighted[aria-selected] { background: var(--surface-2); color: var(--text); }
.select2-container .select2-results__option[aria-selected="true"] { background: var(--bone-100); color: var(--ink-950); }

/* the sidebar: order review + payment */
.checkout-sidebar { position: sticky; top: calc(var(--nav-h) + var(--s-4)); display: flex; flex-direction: column; gap: var(--s-4); background: var(--surface); border: var(--bw) solid var(--line-1); border-radius: var(--r-2); padding: var(--s-5); }
.checkout-sidebar__title { display: flex; align-items: center; gap: var(--s-2); font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.03em; font-size: var(--fs-20); font-weight: 500; }
.checkout-sidebar__title .ctd-i { color: var(--accent); }
.checkout-review { display: flex; flex-direction: column; gap: var(--s-3); }
.review-item { border: var(--bw) solid var(--line-1); border-radius: var(--r-1); background: var(--ink-900); }
.review-item__header { list-style: none; display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; align-items: center; gap: var(--s-3); padding: var(--s-3); }
.review-item__header::-webkit-details-marker { display: none; }
details.review-item > .review-item__header { cursor: pointer; }
.review-item--no-details .review-item__header { grid-template-columns: minmax(0, 1fr) auto auto; }
.review-item__icon { width: 32px; height: 32px; border-radius: 50%; border: var(--bw) solid var(--line-2); display: flex; align-items: center; justify-content: center; color: var(--text-3); }
.review-item__icon--star { color: var(--gold-300); border-color: var(--accent); }
.review-item__title-block { display: flex; flex-direction: column; min-width: 0; }
.review-item__name { font-weight: 700; color: var(--text); font-size: var(--fs-14); }
.review-item__name small { font-weight: 400; color: var(--text-3); }
.review-item__number { color: var(--text-3); font-weight: 400; }
.review-item__meta { font-size: var(--fs-13); color: var(--text-3); }
.review-item__meta .variation { margin: 0; display: inline; }
.review-item__meta .variation dt, .review-item__meta .variation dd, .review-item__meta .variation p { display: inline; margin: 0; }
.review-item__qty { font-size: var(--fs-13); color: var(--text-3); font-variant-numeric: tabular-nums; }
.review-item__price { font-family: var(--font-display); font-weight: 700; color: var(--gold-300); font-variant-numeric: tabular-nums; white-space: nowrap; }
.review-item__chev { color: var(--text-3); transition: transform var(--t-fast) var(--ease); }
.review-item[open] .review-item__chev { transform: rotate(180deg); }
.review-item__details { padding: 0 var(--s-3) var(--s-3); display: flex; flex-direction: column; gap: var(--s-2); border-top: var(--bw) solid var(--line-1); padding-top: var(--s-3); }
.review-detail { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: var(--s-2); font-size: var(--fs-13); }
.review-detail__label { display: inline-flex; align-items: center; gap: 4px; color: var(--text-3); text-transform: uppercase; letter-spacing: var(--track-caps); font-size: var(--fs-12); font-weight: 600; }
.review-detail__value { color: var(--text-2); }
.review-coupon { display: flex; flex-direction: column; gap: var(--s-2); padding-top: var(--s-3); border-top: var(--bw) solid var(--line-1); }
.review-coupon__label { display: inline-flex; align-items: center; gap: 6px; font-size: var(--fs-13); font-weight: 600; color: var(--text-2); }
.review-coupon__row { display: flex; gap: var(--s-2); }
.review-coupon__input { flex: 1; min-width: 0; min-height: var(--control-h-sm); padding: 0 var(--s-3); background: var(--ink-900); border: var(--bw) solid var(--line-2); border-radius: var(--r-1); color: var(--text); font: inherit; }
.review-coupon__apply { min-height: var(--control-h-sm); }
.review-coupon__feedback { font-size: var(--fs-13); min-height: 1em; color: var(--text-3); }
.review-coupon__feedback--error { color: var(--err); }
.review-coupon__feedback--success { color: var(--ok); }
.review-coupon__feedback:empty { display: none; }
.review-totals { display: flex; flex-direction: column; gap: var(--s-2); padding-top: var(--s-3); border-top: var(--bw) solid var(--line-1); font-size: var(--fs-14); color: var(--text-2); font-variant-numeric: tabular-nums; }
.review-totals__row { display: flex; justify-content: space-between; gap: var(--s-3); }
.review-totals__row--discount { color: var(--ok); }
.review-totals__row--shipping-head { font-weight: 600; color: var(--text); }
.review-totals__shipping { display: flex; flex-direction: column; gap: 6px; }
.review-totals__shipping-none { font-size: var(--fs-13); color: var(--warn); }
.review-totals__shipping-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.review-totals__shipping-option { display: flex; align-items: center; gap: var(--s-2); }
.review-totals__shipping-option label { flex: 1; display: flex; justify-content: space-between; gap: var(--s-2); cursor: pointer; }
.review-totals__shipping-option input[type="radio"] { width: 18px; height: 18px; accent-color: var(--gold-500); margin: 0; }
.review-totals__row--total { padding-top: var(--s-3); border-top: var(--bw) solid var(--line-2); font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.04em; font-weight: 500; color: var(--text); align-items: baseline; }
.review-totals__row--total > span:last-child { font-size: var(--fs-28); font-weight: 700; color: var(--gold-300); }
.review-totals .woocommerce-Price-currencySymbol { font-size: 0.85em; }

/* payment (WooCommerce's #payment, relocated by js/checkout.js into #checkout_payment_wrap) */
.checkout-payment-skeleton { display: flex; flex-direction: column; gap: var(--s-2); padding: var(--s-4); border: var(--bw) dashed var(--line-2); border-radius: var(--r-1); }
.checkout-payment-skeleton__title { font-size: var(--fs-13); color: var(--text-3); }
.checkout-payment-skeleton__line { display: block; height: 12px; width: 60%; border-radius: var(--r-1); background: var(--surface-2); }
.checkout-payment-skeleton__line--lg { width: 100%; height: 40px; }
#checkout_payment_wrap.has-payment .checkout-payment-skeleton { display: none; }
#checkout_payment_wrap.has-payment-error .checkout-payment-skeleton { border-color: var(--err); }
#checkout_payment_wrap.has-payment-error .checkout-payment-skeleton__line { display: none; }
#checkout_payment_wrap.has-payment-error .checkout-payment-skeleton__title { color: var(--err); }
.ctd-woo #payment { background: none; border: 0; }
.ctd-woo #payment .wc_payment_methods { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--s-2); }
/* Woo prints the radio BEFORE the label, as a sibling: the grid seats it on
   the label's line (Woo hides it when there is one gateway; column 1 then
   collapses), and the payment box spans both. */
.ctd-woo #payment .wc_payment_method { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; border: var(--bw) solid var(--line-2); border-radius: var(--r-1); background: var(--ink-900); }
.ctd-woo #payment .wc_payment_method > label { grid-column: 2; display: flex; align-items: center; gap: var(--s-2); padding: var(--s-3); font-weight: 600; color: var(--text); cursor: pointer; }
.ctd-woo #payment .wc_payment_method > label img { max-height: 24px; width: auto; margin-left: auto; }
.ctd-woo #payment .wc_payment_method input[type="radio"] { grid-column: 1; width: 18px; height: 18px; accent-color: var(--gold-500); margin: 0 0 0 var(--s-3); }
.ctd-woo #payment .payment_box { grid-column: 1 / -1; margin: 0; padding: 0 var(--s-3) var(--s-3); font-size: var(--fs-14); color: var(--text-2); background: none; }
.ctd-woo #payment .payment_box::before { display: none; }
.ctd-woo #payment .payment_box p { margin: 0 0 var(--s-2); }
.ctd-woo #payment .payment_box fieldset { border: 0; padding: 0; margin: 0; }
.ctd-woo #payment .payment_box iframe, .ctd-woo #payment .payment_box .wc-stripe-elements-field, .ctd-woo #payment .payment_box .wc-stripe-upe-element, .ctd-woo #payment .payment_box .wcpay-payment-element { background: var(--bone-100); border-radius: var(--r-1); padding: var(--s-2); }
.ctd-woo #payment .place-order { margin: var(--s-3) 0 0; display: flex; flex-direction: column; gap: var(--s-3); }
.ctd-woo .woocommerce-terms-and-conditions-wrapper { font-size: var(--fs-13); color: var(--text-3); }
.ctd-woo .woocommerce-terms-and-conditions-wrapper a { color: var(--link); }
.ctd-woo .woocommerce-privacy-policy-text p { margin: 0 0 var(--s-2); }
.ctd-woo .ctd-import-acknowledgement label { font-size: var(--fs-13); }
.ctd-woo #place_order { width: 100%; min-height: var(--btn-h-lg); padding: 0 var(--s-8); font-family: var(--font-display); font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; font-size: var(--fs-18); cursor: pointer; }
.ctd-woo #place_order[disabled] { opacity: 0.45; cursor: not-allowed; }
.checkout-inline-error { display: flex; gap: var(--s-3); padding: var(--s-4); border: var(--bw) solid var(--err); border-radius: var(--r-2); background: var(--err-bg); }
.checkout-inline-error__icon { color: var(--err); display: flex; flex: none; }
.checkout-inline-error__body { display: flex; flex-direction: column; gap: 4px; font-size: var(--fs-14); color: var(--text-2); }
.checkout-inline-error__title { font-size: var(--fs-16); font-weight: 700; color: var(--text); }
.checkout-inline-error__copy { margin: 0; }
.checkout-inline-error__link { color: var(--link); }
.checkout-sidebar__trust { list-style: none; margin: 0; padding: 0; display: flex; gap: var(--s-4); flex-wrap: wrap; font-size: var(--fs-13); color: var(--text-3); }
.checkout-sidebar__trust li { display: inline-flex; align-items: center; gap: 6px; }
.checkout-sidebar__trust .ctd-i { color: var(--accent); }

/* phone: collapsible summary above the form, sticky place-order bar below */
.checkout-mobile-summary { display: none; border: var(--bw) solid var(--line-1); border-radius: var(--r-2); background: var(--surface); }
.checkout-mobile-summary > summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: var(--s-3); padding: var(--s-3) var(--s-4); font-size: var(--fs-14); cursor: pointer; }
.checkout-mobile-summary > summary::-webkit-details-marker { display: none; }
.checkout-mobile-summary__label { display: inline-flex; align-items: center; gap: 6px; min-width: 0; font-weight: 600; color: var(--text); }
.checkout-mobile-summary__text { min-width: 0; }
.checkout-mobile-summary__cta { display: inline-flex; flex: none; align-items: center; gap: 4px; font-size: var(--fs-13); color: var(--text-3); white-space: nowrap; }
.checkout-mobile-summary__body { padding: 0 var(--s-4) var(--s-4); }
.checkout-mobile-bar { display: none; }

/* ============================================================
   ORDER RECEIVED
   ============================================================ */
.thankyou-page { display: flex; flex-direction: column; gap: var(--s-6); }
.thankyou-hero { text-align: center; display: flex; flex-direction: column; align-items: center; gap: var(--s-4); }
.thankyou-hero__inner { display: flex; flex-direction: column; align-items: center; gap: var(--s-3); }
.thankyou-hero__icon { width: 64px; height: 64px; border-radius: 50%; border: 2px solid var(--ok); color: var(--ok); display: flex; align-items: center; justify-content: center; }
.thankyou-hero__icon .ctd-i { width: 28px; height: 28px; }
.thankyou-hero__icon--error { border-color: var(--err); color: var(--err); }
.thankyou-hero__title { font-family: var(--font-varsity); text-transform: uppercase; letter-spacing: 0.005em; font-size: var(--fs-40); font-weight: 700; line-height: var(--lh-tight); }
.thankyou-hero__subtitle { color: var(--text-2); font-size: var(--fs-18); max-width: 52ch; text-wrap: pretty; }
.thankyou-hero__subtitle strong { color: var(--text); }
.thankyou-hero__actions, .thankyou-quick-actions, .thankyou-actions, .thankyou-status-card__actions { display: flex; gap: var(--s-3); flex-wrap: wrap; justify-content: center; }
/* The row already wraps; the labels could not. A full-size button with an icon
   and "Explore The Dugout" on it is 238px, and a 320px phone leaves 215px of
   card to put it in, so the button sat 11px out either side of a row that had
   already given it a line of its own. Same two-stage story as .ctd-card__foot. */
.thankyou-hero__actions .ctd-btn, .thankyou-quick-actions .ctd-btn,
.thankyou-actions .ctd-btn, .thankyou-status-card__actions .ctd-btn {
  white-space: normal; text-align: center; padding-block: var(--s-2);
}
.thankyou-meta, .thankyou-overview-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-3); }
.thankyou-meta__tile, .thankyou-overview-stat { display: flex; flex-direction: column; gap: 4px; padding: var(--s-4); background: var(--surface); border: var(--bw) solid var(--line-1); border-radius: var(--r-2); }
.thankyou-meta__label, .thankyou-overview-stat__label { font-size: var(--fs-12); letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--text-3); font-weight: 600; }
.thankyou-meta__value, .thankyou-overview-stat__value { font-family: var(--font-display); font-size: var(--fs-20); font-weight: 500; font-variant-numeric: tabular-nums; }
.thankyou-meta__value--gold, .thankyou-overview-stat__value--gold { color: var(--gold-300); font-weight: 700; }
.thankyou-progress { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s-2); }
.thankyou-progress__step { position: relative; display: flex; flex-direction: column; align-items: center; gap: var(--s-2); text-align: center; }
.thankyou-progress__marker { width: 40px; height: 40px; border-radius: 50%; border: var(--bw) solid var(--line-2); background: var(--ink-900); display: flex; align-items: center; justify-content: center; color: var(--text-3); position: relative; z-index: 1; }
.thankyou-progress__step--complete .thankyou-progress__marker { background: var(--bone-100); color: var(--ink-950); border-color: var(--bone-100); }
.thankyou-progress__step--active .thankyou-progress__marker { border-color: var(--accent); color: var(--gold-300); }
.thankyou-progress__label { font-size: var(--fs-13); font-weight: 600; color: var(--text-3); }
.thankyou-progress__step--active .thankyou-progress__label, .thankyou-progress__step--complete .thankyou-progress__label { color: var(--text); }
.thankyou-progress__bar { position: absolute; top: 20px; left: 50%; width: 100%; height: 1px; background: var(--line-2); }
.thankyou-progress__step--complete .thankyou-progress__bar { background: var(--bone-300); }
.thankyou-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: var(--s-8); align-items: start; }
.thankyou-main, .thankyou-sidebar { display: flex; flex-direction: column; gap: var(--s-4); }
.thankyou-panel { background: var(--surface); border: var(--bw) solid var(--line-1); border-radius: var(--r-2); padding: var(--s-5); display: flex; flex-direction: column; gap: var(--s-4); }
.thankyou-panel--muted { background: var(--bg-alt); }
.thankyou-panel__banner { display: flex; align-items: center; gap: var(--s-3); }
.thankyou-panel__icon { width: 40px; height: 40px; flex: none; border-radius: 50%; border: var(--bw) solid var(--line-2); display: flex; align-items: center; justify-content: center; color: var(--accent); }
.thankyou-panel__banner-title { font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.03em; font-size: var(--fs-20); font-weight: 500; }
.thankyou-panel__subtitle { font-size: var(--fs-13); color: var(--text-3); }
.thankyou-panel__title-bar { display: flex; align-items: center; gap: var(--s-2); font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.03em; font-size: var(--fs-18); font-weight: 500; }
.thankyou-panel__title-bar .ctd-i { color: var(--accent); }
.thankyou-config-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3); }
.thankyou-config-section { padding: var(--s-3); background: var(--ink-900); border: var(--bw) solid var(--line-1); border-radius: var(--r-1); display: flex; flex-direction: column; gap: var(--s-2); }
.thankyou-config-section--full { grid-column: 1 / -1; }
.thankyou-config-header { display: flex; justify-content: space-between; align-items: baseline; gap: var(--s-2); }
.thankyou-config-label { display: inline-flex; align-items: center; gap: 4px; font-size: var(--fs-12); letter-spacing: var(--track-caps); text-transform: uppercase; font-weight: 600; color: var(--text-3); }
.thankyou-config-count { font-family: var(--font-display); font-size: var(--fs-14); color: var(--text-2); font-variant-numeric: tabular-nums; }
.thankyou-config-items { display: flex; flex-wrap: wrap; gap: 6px; }
.thankyou-tag { display: inline-flex; align-items: center; gap: 4px; height: 26px; padding: 0 8px; border: var(--bw) solid var(--line-2); border-radius: var(--r-1); font-family: var(--font-display); font-size: var(--fs-13); font-weight: 500; letter-spacing: 0.04em; text-transform: uppercase; color: var(--text); font-variant-numeric: tabular-nums; }
.thankyou-tag strong { color: var(--text-3); font-weight: 500; }
.thankyou-tag--skill { border-color: var(--line-1); color: var(--text-2); }
.thankyou-big-guy { display: flex; align-items: center; gap: var(--s-2); flex-wrap: wrap; font-size: var(--fs-14); }
.thankyou-big-guy__name { font-weight: 700; color: var(--text); }
.thankyou-big-guy__num { color: var(--text-3); font-weight: 400; }
.thankyou-big-guy__badge { display: inline-flex; align-items: center; height: 18px; padding: 0 5px; border: var(--bw) solid var(--accent); border-radius: var(--r-1); font-size: var(--fs-12); color: var(--gold-300); }
.thankyou-big-guy__skills { color: var(--text-3); font-size: var(--fs-13); }
.thankyou-config-note { display: flex; align-items: center; gap: 6px; font-size: var(--fs-13); color: var(--text-2); }
.thankyou-download { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: var(--s-3); padding: var(--s-3) var(--s-4); border: var(--bw) solid var(--accent); border-radius: var(--r-1); text-decoration: none; color: var(--text); }
.thankyou-download:hover { background: var(--surface-2); }
.thankyou-download__icon { color: var(--accent); display: flex; }
.thankyou-download__copy { display: flex; flex-direction: column; font-size: var(--fs-13); color: var(--text-3); }
.thankyou-download__copy strong { color: var(--text); font-size: var(--fs-14); }
.thankyou-download__cta { display: inline-flex; align-items: center; gap: 6px; font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.06em; font-size: var(--fs-14); color: var(--gold-300); }
.thankyou-star-list, .thankyou-items { display: flex; flex-direction: column; gap: var(--s-2); }
.thankyou-star-card { padding: var(--s-3); background: var(--ink-900); border: var(--bw) solid var(--line-1); border-radius: var(--r-1); display: flex; flex-direction: column; gap: var(--s-2); }
.thankyou-star-card__header { display: flex; align-items: baseline; gap: var(--s-2); flex-wrap: wrap; }
.thankyou-star-card__name { font-weight: 700; color: var(--text); }
.thankyou-star-card__num, .thankyou-star-card__size { font-size: var(--fs-13); color: var(--text-3); }
.thankyou-star-card__price { margin-left: auto; font-family: var(--font-display); font-weight: 700; color: var(--gold-300); }
.thankyou-star-card__skills { display: flex; flex-wrap: wrap; gap: 6px; }
.thankyou-item { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: var(--s-3); align-items: center; padding: var(--s-2) 0; border-bottom: var(--bw) solid var(--line-1); font-size: var(--fs-14); }
.thankyou-item:last-child { border-bottom: 0; }
.thankyou-item__info { display: flex; flex-direction: column; }
.thankyou-item__name { font-weight: 600; color: var(--text); }
.thankyou-item__detail { font-size: var(--fs-13); color: var(--text-3); }
.thankyou-item__qty { color: var(--text-3); font-variant-numeric: tabular-nums; }
.thankyou-item__price { font-family: var(--font-display); font-weight: 700; color: var(--gold-300); font-variant-numeric: tabular-nums; }
.thankyou-totals { display: flex; flex-direction: column; gap: var(--s-2); font-size: var(--fs-14); color: var(--text-2); font-variant-numeric: tabular-nums; }
.thankyou-totals__row { display: flex; justify-content: space-between; gap: var(--s-3); }
.thankyou-totals__row span:first-child { display: inline-flex; align-items: center; gap: 4px; }
.thankyou-totals__row--discount { color: var(--ok); }
.thankyou-totals__row--total { padding-top: var(--s-3); border-top: var(--bw) solid var(--line-2); font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.04em; font-weight: 500; color: var(--text); align-items: baseline; }
.thankyou-totals__row--total span:last-child { font-size: var(--fs-28); font-weight: 700; color: var(--gold-300); }
.thankyou-payment, .thankyou-email-notice { display: flex; align-items: center; gap: var(--s-2); font-size: var(--fs-14); color: var(--text-2); }
.thankyou-email-notice { padding: var(--s-3) var(--s-4); border: var(--bw) solid var(--line-1); border-radius: var(--r-1); background: var(--bg-alt); }
.thankyou-email-notice .ctd-i, .thankyou-payment .ctd-i { color: var(--accent); }
.thankyou-address { font-style: normal; color: var(--text-2); line-height: 1.5; }
.thankyou-status-card__header { display: flex; align-items: flex-start; gap: var(--s-3); }
.thankyou-status-card__icon { width: 40px; height: 40px; flex: none; border-radius: 50%; border: var(--bw) solid var(--accent); display: flex; align-items: center; justify-content: center; color: var(--gold-300); }
.thankyou-status-card__meta { font-size: var(--fs-13); color: var(--text-3); }
.thankyou-status-card__tracking { padding: var(--s-3); background: var(--ink-900); border: var(--bw) solid var(--line-1); border-radius: var(--r-1); font-size: var(--fs-14); color: var(--text-2); }
.thankyou-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--s-3); }
.thankyou-steps li { display: flex; gap: var(--s-3); }
.thankyou-step__marker { width: 32px; height: 32px; flex: none; border-radius: 50%; border: var(--bw) solid var(--line-2); display: flex; align-items: center; justify-content: center; color: var(--text-3); }
.thankyou-step__body { display: flex; flex-direction: column; gap: 2px; font-size: var(--fs-13); color: var(--text-3); }
.thankyou-step__body strong { color: var(--text); font-size: var(--fs-14); }
.thankyou-order-summary { display: flex; flex-direction: column; gap: var(--s-2); }
.thankyou-order-summary__item { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: var(--s-2); font-size: var(--fs-14); align-items: baseline; }
.thankyou-order-summary__copy { display: flex; flex-direction: column; }
.thankyou-order-summary__meta { font-size: var(--fs-13); color: var(--text-3); }
.thankyou-order-summary__qty { color: var(--text-3); }
.thankyou-order-summary__price { font-family: var(--font-display); font-weight: 700; color: var(--gold-300); }
.thankyou-help { font-size: var(--fs-13); color: var(--text-3); }
/* "Contact Us" is the one way out of the order-received page if something is
   wrong with the order; at 13px it was a 76x16 target. */
.thankyou-help a { display: inline-flex; align-items: center; min-height: 24px; color: var(--link); }

/* ============================================================
   MY ACCOUNT
   ============================================================ */
.account-wrapper, .login-wrapper { display: flex; flex-direction: column; gap: var(--s-6); }
.account-hero, .login-hero { display: flex; flex-direction: column; gap: var(--s-2); }
.account-title, .login-title { display: flex; align-items: center; gap: var(--s-3); font-family: var(--font-varsity); text-transform: uppercase; letter-spacing: 0.005em; font-size: var(--fs-40); font-weight: 700; line-height: var(--lh-tight); }
.account-title .ctd-i, .login-title .ctd-i { width: 32px; height: 32px; color: var(--accent); }
.account-subtitle, .login-subtitle { color: var(--text-2); font-size: var(--fs-18); }
.account-layout { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: var(--s-8); align-items: start; }
.woocommerce-MyAccount-navigation { position: sticky; top: calc(var(--nav-h) + var(--s-4)); }
.woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 2px; }
.account-nav-link { display: flex; align-items: center; gap: var(--s-3); min-height: var(--control-h); padding: 0 var(--s-3); border-radius: var(--r-1); border-left: 2px solid transparent; color: var(--text-2); text-decoration: none; font-weight: 600; font-size: var(--fs-14); }
.account-nav-link .ctd-i { color: var(--text-3); }
.account-nav-link:hover { background: var(--surface); color: var(--text); }
.woocommerce-MyAccount-navigation li.is-active .account-nav-link { color: var(--text); border-left-color: var(--accent); border-radius: 0 var(--r-1) var(--r-1) 0; }
.woocommerce-MyAccount-navigation li.is-active .ctd-i { color: var(--accent); }
.woocommerce-MyAccount-content { display: flex; flex-direction: column; gap: var(--s-5); min-width: 0; }
.woocommerce-MyAccount-content > p { color: var(--text-2); max-width: var(--measure); }
.woocommerce-MyAccount-content > p a { color: var(--link); }
.woocommerce-MyAccount-content h2, .woocommerce-MyAccount-content h3, .orders-header h2, .saved-builds-header h2 { display: flex; align-items: center; gap: var(--s-2); font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.03em; font-size: var(--fs-24); font-weight: 500; }
.woocommerce-MyAccount-content .ctd-i { flex: none; }
.orders-header h2 .ctd-i, .saved-builds-header h2 .ctd-i { color: var(--accent); }
.orders-subtitle, .saved-builds-subtitle { margin: var(--s-1) 0 0; color: var(--text-2); }
.woocommerce-Addresses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-4); }
.woocommerce-Address { padding: var(--s-4); background: var(--surface); border: var(--bw) solid var(--line-1); border-radius: var(--r-2); display: flex; flex-direction: column; gap: var(--s-3); }
.woocommerce-Address-title { display: flex; justify-content: space-between; align-items: center; gap: var(--s-3); }
.woocommerce-Address-title h2, .woocommerce-Address-title h3 { font-size: var(--fs-18); }
.woocommerce-Address-title .edit { color: var(--link); font-size: var(--fs-14); }
.woocommerce-Address address { font-style: normal; color: var(--text-2); line-height: 1.5; }
.woocommerce-EditAccountForm fieldset { border: var(--bw) solid var(--line-1); border-radius: var(--r-2); padding: var(--s-4); margin: 0; display: grid; gap: var(--s-3); }
.woocommerce-EditAccountForm legend { font-weight: 700; padding: 0 var(--s-2); }
.woocommerce-EditAccountForm .form-row, .woocommerce-address-fields .form-row { display: flex; flex-direction: column; gap: 6px; }
.woocommerce-EditAccountForm > .form-row, .woocommerce-address-fields__field-wrapper { margin-bottom: var(--s-3); }
.woocommerce-address-fields__field-wrapper { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3) var(--s-4); }
.woocommerce-MyAccount-content .button, .woocommerce-MyAccount-content .woocommerce-Button, .woocommerce-form .woocommerce-button { display: inline-flex; align-items: center; justify-content: center; gap: var(--s-2); min-height: var(--btn-h); padding: 0 var(--s-6); font-family: var(--font-display); font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; font-size: var(--fs-16); text-decoration: none; cursor: pointer; }
.woocommerce-password-strength { font-size: var(--fs-13); padding: var(--s-1) 0; }
.woocommerce-password-strength.short, .woocommerce-password-strength.bad { color: var(--err); }
.woocommerce-password-strength.good { color: var(--warn); }
.woocommerce-password-strength.strong { color: var(--ok); }
.woocommerce-password-hint { font-size: var(--fs-13); color: var(--text-3); }
.woocommerce-orders-table { width: 100%; border-collapse: collapse; font-size: var(--fs-14); }
.woocommerce-orders-table th { text-align: left; font-size: var(--fs-12); letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--text-3); padding: var(--s-2) var(--s-3); border-bottom: var(--bw) solid var(--line-2); }
.woocommerce-orders-table td { padding: var(--s-3); border-bottom: var(--bw) solid var(--line-1); color: var(--text-2); }

/* orders */
.myaccount-orders, .myaccount-saved-builds { display: flex; flex-direction: column; gap: var(--s-4); }
.orders-list { display: flex; flex-direction: column; gap: var(--s-3); }
.order-card { background: var(--surface); border: var(--bw) solid var(--line-1); border-radius: var(--r-2); overflow: hidden; }
.order-card__header { display: flex; justify-content: space-between; align-items: flex-start; gap: var(--s-3); padding: var(--s-4); border-bottom: var(--bw) solid var(--line-1); background: var(--ink-900); flex-wrap: wrap; }
.order-number { display: flex; align-items: center; gap: 4px; font-family: var(--font-display); font-size: var(--fs-20); font-weight: 700; font-variant-numeric: tabular-nums; }
.order-number .ctd-i { color: var(--text-3); }
.order-meta { display: flex; gap: var(--s-4); flex-wrap: wrap; margin-top: 4px; font-size: var(--fs-13); color: var(--text-3); }
.order-meta > span { display: inline-flex; align-items: center; gap: 4px; }
.order-total { color: var(--gold-300); font-weight: 700; }
.order-card__body { padding: var(--s-4); display: flex; flex-direction: column; gap: var(--s-4); }
.order-card__body h4 { display: flex; align-items: center; gap: 6px; font-size: var(--fs-12); letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--text-3); font-weight: 600; margin-bottom: var(--s-2); }
.items-list { display: flex; flex-direction: column; gap: 4px; }
.item-preview { display: flex; justify-content: space-between; gap: var(--s-3); font-size: var(--fs-14); color: var(--text-2); }
.item-quantity { color: var(--text-3); font-variant-numeric: tabular-nums; }
.team-configurations { display: flex; flex-direction: column; }
.team-preview { padding: var(--s-3); background: var(--ink-900); border: var(--bw) solid var(--line-1); border-radius: var(--r-1); display: flex; flex-direction: column; gap: var(--s-2); }
.team-preview + .team-preview { margin-top: var(--s-2); }
.team-name { display: inline-flex; align-items: center; gap: 6px; color: var(--text); }
.team-name .ctd-i { color: var(--accent); }
.team-preview__stats { display: flex; gap: var(--s-3); flex-wrap: wrap; font-size: var(--fs-13); color: var(--text-3); }
.team-preview__stats .stat { display: inline-flex; align-items: center; gap: 4px; }
.order-card__footer { padding: var(--s-3) var(--s-4); border-top: var(--bw) solid var(--line-1); }
.order-actions { display: flex; justify-content: space-between; gap: var(--s-3); flex-wrap: wrap; }
.primary-actions, .secondary-actions { display: flex; gap: var(--s-2); flex-wrap: wrap; }
.orders-pagination { display: flex; align-items: center; justify-content: center; gap: var(--s-4); }
.orders-pagination__info { font-size: var(--fs-13); color: var(--text-3); }

/* saved builds */
.saved-builds-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-3); }
.saved-build-card { background: var(--surface); border: var(--bw) solid var(--line-1); border-radius: var(--r-2); display: flex; flex-direction: column; overflow: hidden; }
.saved-build-card__header { display: flex; align-items: center; gap: var(--s-3); padding: var(--s-4); border-bottom: var(--bw) solid var(--line-1); }
.saved-build-card__icon-wrap { width: 48px; height: 48px; flex: none; border-radius: 50%; border: var(--bw) solid var(--line-2); background: var(--ink-900); display: flex; align-items: center; justify-content: center; color: var(--text-3); overflow: hidden; }
.saved-build-card__logo { width: 100%; height: 100%; object-fit: cover; }
/* min-width: 0 so a long team name wraps instead of pushing the header past
   the card. The card is `overflow: hidden`, so on a 320px phone — where the
   grid is one column — "DA SKULL KRUSHAS · BRUTE ORC BLITZ BUILDER" was
   simply cut off at the card's edge rather than running to a second line. */
.saved-build-card__title { min-width: 0; overflow-wrap: anywhere; font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.03em; font-size: var(--fs-18); font-weight: 500; }
.saved-build-card__mode, .saved-build-card__preset { font-size: var(--fs-13); color: var(--text-3); }
.saved-build-card__stats { display: flex; gap: var(--s-4); padding: var(--s-3) var(--s-4); }
.saved-build-card__stat { display: flex; flex-direction: column; }
.saved-build-card__stat-label { font-size: var(--fs-12); letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--text-3); font-weight: 600; }
.saved-build-card__stat-value { font-family: var(--font-display); font-size: var(--fs-18); font-weight: 500; font-variant-numeric: tabular-nums; }
.saved-build-card__date { display: inline-flex; align-items: center; gap: 4px; font-size: var(--fs-13); color: var(--text-3); padding: 0 var(--s-4); }
.saved-build-card__footer { margin-top: auto; padding: var(--s-3) var(--s-4); border-top: var(--bw) solid var(--line-1); }
.saved-build-card__actions { display: flex; justify-content: space-between; gap: var(--s-2); flex-wrap: wrap; }
.saved-build-card__delete { color: var(--text-3); }
.saved-build-card__delete:hover { color: var(--err); border-color: var(--err); }

/* login / register */
#customer_login { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-6); }
.u-column1, .u-column2, .col-1, .col-2 { min-width: 0; }
.login-wrapper .form-title { display: flex; align-items: center; gap: var(--s-2); font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.03em; font-size: var(--fs-24); font-weight: 500; margin-bottom: var(--s-4); }
.login-wrapper .form-title .ctd-i { color: var(--accent); }
.login-wrapper .woocommerce-form { display: flex; flex-direction: column; gap: var(--s-4); padding: var(--s-5); background: var(--surface); border: var(--bw) solid var(--line-1); border-radius: var(--r-2); }
.login-wrapper .woocommerce-form p { margin: 0; }
.login-wrapper .woocommerce-form .form-row { display: flex; flex-direction: column; gap: 6px; }
.login-wrapper .woocommerce-form .woocommerce-form-login__rememberme { margin-bottom: var(--s-3); }
.login-wrapper .woocommerce-LostPassword a { display: inline-flex; align-items: center; gap: 6px; color: var(--link); font-size: var(--fs-14); }
.social-login-section { display: flex; flex-direction: column; gap: var(--s-4); }
.social-divider { display: flex; align-items: center; gap: var(--s-3); color: var(--text-3); font-size: var(--fs-13); }
.social-divider::before, .social-divider::after { content: ""; flex: 1; height: 1px; background: var(--line-2); }
.login-security-notice { display: flex; }
.security-info { display: flex; gap: var(--s-3); padding: var(--s-4); border: var(--bw) solid var(--line-1); border-radius: var(--r-2); background: var(--bg-alt); font-size: var(--fs-14); color: var(--text-2); }
.security-info .ctd-i { color: var(--accent); flex: none; margin-top: 2px; }
.security-text strong { display: block; color: var(--text); }
.security-text p { margin: 2px 0 0; }

/* WooCommerce core account sub-templates the theme does not override:
   lost/reset password (a guest route), view-order + order-pay (order details
   table, customer details, addresses). Previously css/woocommerce-pages.css. */
.ctd-woo .woocommerce-ResetPassword { display: flex; flex-direction: column; gap: var(--s-4); max-width: 480px; padding: var(--s-5); background: var(--surface); border: var(--bw) solid var(--line-1); border-radius: var(--r-2); }
.ctd-woo .woocommerce-ResetPassword p { margin: 0; color: var(--text-2); }
.ctd-woo .woocommerce-ResetPassword .form-row { display: flex; flex-direction: column; gap: 6px; }
.ctd-woo .woocommerce-ResetPassword .button, .ctd-woo .woocommerce-ResetPassword .woocommerce-Button, .ctd-woo .woocommerce-form-track-order .button, .ctd-woo .woocommerce-order-pay .button { display: inline-flex; align-items: center; justify-content: center; gap: var(--s-2); min-height: var(--btn-h); padding: 0 var(--s-6); font-family: var(--font-display); font-weight: 700; text-transform: uppercase; letter-spacing: 0.06em; font-size: var(--fs-16); cursor: pointer; }
.ctd-woo table.shop_table { width: 100%; border-collapse: collapse; font-size: var(--fs-14); font-variant-numeric: tabular-nums; }
.ctd-woo table.shop_table th { text-align: left; font-size: var(--fs-12); letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--text-3); font-weight: 600; padding: var(--s-2) var(--s-3); border-bottom: var(--bw) solid var(--line-2); }
.ctd-woo table.shop_table td { padding: var(--s-3); border-bottom: var(--bw) solid var(--line-1); vertical-align: top; color: var(--text-2); }
.ctd-woo table.shop_table tfoot th, .ctd-woo table.shop_table tfoot td { border-bottom: 0; color: var(--text); }
.ctd-woo table.shop_table tfoot tr:last-child td { font-family: var(--font-display); font-size: var(--fs-20); font-weight: 700; color: var(--gold-300); }
.ctd-woo table.shop_table .product-name a { color: var(--text); font-weight: 600; text-decoration: none; }
.ctd-woo table.shop_table .wc-item-meta { list-style: none; margin: var(--s-1) 0 0; padding: 0; font-size: var(--fs-13); color: var(--text-3); }
.ctd-woo table.shop_table .wc-item-meta p { display: inline; margin: 0; }
.ctd-woo .woocommerce-customer-details { display: flex; flex-direction: column; gap: var(--s-3); }
.ctd-woo .woocommerce-columns--addresses { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-4); }
.ctd-woo .woocommerce-column { padding: var(--s-4); background: var(--surface); border: var(--bw) solid var(--line-1); border-radius: var(--r-2); }
.ctd-woo .woocommerce-column__title, .ctd-woo .woocommerce-order-details__title, .ctd-woo .woocommerce-customer-details h2 { font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.03em; font-size: var(--fs-20); font-weight: 500; margin-bottom: var(--s-3); }
.ctd-woo .woocommerce-column address { font-style: normal; color: var(--text-2); line-height: 1.5; }
.ctd-woo .woocommerce-customer-details--phone, .ctd-woo .woocommerce-customer-details--email { display: block; margin-top: var(--s-2); }
.ctd-woo .team-builder-order-meta { display: flex; flex-wrap: wrap; gap: var(--s-2); margin-top: var(--s-2); font-size: var(--fs-13); color: var(--text-3); }
.ctd-woo .team-builder-order-meta .meta-item { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; border: var(--bw) solid var(--line-1); border-radius: var(--r-1); }

/* ============================================================
   BUILDERS HUB
   ============================================================ */
.ctd-hub { padding-block: var(--s-10) var(--s-12); }
.ctd-hub__title { font-size: var(--fs-40); }

/* ---------- the group headings are nameplates ----------
   ctd_plate() straddles the steel cross member on a SECTION's top edge, and
   translates up by half itself to do it. These two sit in the middle of one
   section, where there is no member — so they lose the straddle and stand in
   the flow, exactly as the builder's step headings do (builder.css §20). */
.ctd-hub .ctd-plate { transform: none; margin-bottom: 0; }

/* ============================================================
   EFFECTS
   Every value resolves a --fx-* token; see tokens.css and
   DESIGN-SYSTEM.md §2 Effects. Checkout is a tool, not a shop
   window, so these pages spend the same half-budget as the
   builder: panels get the rim, the grand total blooms, the one
   chosen thing glows. Nothing lifts, zooms or rakes — the
   visitor is aiming at these rows, not browsing them. The hub
   cards are the exception and need nothing here: they are
   .ctd-card--interactive and carry the full storefront set.
   ============================================================ */

/* Raised panels, lit along their top edge like every other card. */
.cart-item, .cart-summary, .checkout-step, .checkout-sidebar,
.checkout-mobile-summary, .thankyou-panel, .thankyou-meta__tile,
.thankyou-overview-stat, .thankyou-status-card, .woocommerce-Address,
.woocommerce-EditAccountForm fieldset { box-shadow: var(--fx-rim); }

/* The bar pinned to the bottom of a phone is lit on the edge that faces
   the page, which is still its top edge. */
.checkout-mobile-bar { box-shadow: var(--fx-rim); }

/* Grand totals only. Line-item subtotals stay plain gold so the hierarchy
   survives — the same call the shop makes with .ctd-price__amount. */
.cart-summary__total > span:last-child,
.review-totals__row--total > span:last-child,
.thankyou-totals__row--total span:last-child,
.checkout-mobile-bar__amount { text-shadow: var(--fx-glow-price); }

/* Woo builds these gold buttons itself, so they cannot carry
   .ctd-btn--primary. They get the casting here instead — the same rim, face,
   engraving and states as components.css, applied to Woo's own selectors —
   and #place_order is the most important button in the funnel. */
.ctd-woo #place_order, .woocommerce-MyAccount-content .button, .woocommerce-MyAccount-content .woocommerce-Button, .woocommerce-form .woocommerce-button, .ctd-woo .woocommerce-ResetPassword .button, .ctd-woo .woocommerce-ResetPassword .woocommerce-Button, .ctd-woo .woocommerce-form-track-order .button, .ctd-woo .woocommerce-order-pay .button {
  --btn-c: var(--btn-cut); --btn-b: var(--btn-bevel);
  --btn-ci: calc(var(--btn-c) - var(--btn-b) * 0.41);
  --btn-clip: var(--fx-ticket-rip);   /* with the rip line; the right padding clears its 32px stub */
  --btn-clip-in: var(--btn-clip);
  --btn-rim: var(--fx-btn-rim-gun); --btn-rim-press: var(--fx-btn-rim-gun-press);
  --btn-face: var(--fx-btn-face-gun);
  padding-right: calc(32px + 12px);
  position: relative; isolation: isolate;
  border: 0; border-radius: 0; background: none;
  color: var(--gold-300); text-shadow: var(--fx-btn-engrave-light);
  filter: var(--fx-btn-cast);
  transition: filter var(--t-base) var(--ease), transform var(--t-fast) var(--ease), color var(--t-fast) var(--ease);
}
.ctd-woo #place_order::before, .woocommerce-MyAccount-content .button::before, .woocommerce-MyAccount-content .woocommerce-Button::before, .woocommerce-form .woocommerce-button::before, .ctd-woo .woocommerce-ResetPassword .button::before, .ctd-woo .woocommerce-ResetPassword .woocommerce-Button::before, .ctd-woo .woocommerce-form-track-order .button::before, .ctd-woo .woocommerce-order-pay .button::before, .ctd-woo #place_order::after, .woocommerce-MyAccount-content .button::after, .woocommerce-MyAccount-content .woocommerce-Button::after, .woocommerce-form .woocommerce-button::after, .ctd-woo .woocommerce-ResetPassword .button::after, .ctd-woo .woocommerce-ResetPassword .woocommerce-Button::after, .ctd-woo .woocommerce-form-track-order .button::after, .ctd-woo .woocommerce-order-pay .button::after { content: ""; position: absolute; pointer-events: none; }
.ctd-woo #place_order::before, .woocommerce-MyAccount-content .button::before, .woocommerce-MyAccount-content .woocommerce-Button::before, .woocommerce-form .woocommerce-button::before, .ctd-woo .woocommerce-ResetPassword .button::before, .ctd-woo .woocommerce-ResetPassword .woocommerce-Button::before, .ctd-woo .woocommerce-form-track-order .button::before, .ctd-woo .woocommerce-order-pay .button::before { inset: 0; z-index: -2; clip-path: var(--btn-clip); background: var(--btn-rim); }
.ctd-woo #place_order::after, .woocommerce-MyAccount-content .button::after, .woocommerce-MyAccount-content .woocommerce-Button::after, .woocommerce-form .woocommerce-button::after, .ctd-woo .woocommerce-ResetPassword .button::after, .ctd-woo .woocommerce-ResetPassword .woocommerce-Button::after, .ctd-woo .woocommerce-form-track-order .button::after, .ctd-woo .woocommerce-order-pay .button::after {
  inset: var(--btn-b); z-index: -1; clip-path: var(--btn-clip-in);
  background-image: var(--btn-face); background-repeat: no-repeat; background-size: 100% 100%;
  transition: filter var(--t-fast) var(--ease);
}
.ctd-woo #place_order, .woocommerce-MyAccount-content .button, .woocommerce-MyAccount-content .woocommerce-Button, .woocommerce-form .woocommerce-button, .ctd-woo .woocommerce-ResetPassword .button, .ctd-woo .woocommerce-ResetPassword .woocommerce-Button, .ctd-woo .woocommerce-form-track-order .button, .ctd-woo .woocommerce-order-pay .button {
  --btn-rim: var(--fx-btn-rim-gold); --btn-rim-press: var(--fx-btn-rim-gold-press);
  --btn-face: var(--fx-btn-face-gold);
  color: var(--on-gold); text-shadow: var(--fx-btn-engrave-dark);
}
.ctd-woo #place_order:hover, .woocommerce-MyAccount-content .button:hover, .woocommerce-MyAccount-content .woocommerce-Button:hover, .woocommerce-form .woocommerce-button:hover, .ctd-woo .woocommerce-ResetPassword .button:hover, .ctd-woo .woocommerce-ResetPassword .woocommerce-Button:hover, .ctd-woo .woocommerce-form-track-order .button:hover, .ctd-woo .woocommerce-order-pay .button:hover { background: none; border-color: transparent; color: var(--on-gold); filter: var(--fx-btn-cast-hot); }
.ctd-woo #place_order:hover::after, .woocommerce-MyAccount-content .button:hover::after, .woocommerce-MyAccount-content .woocommerce-Button:hover::after, .woocommerce-form .woocommerce-button:hover::after, .ctd-woo .woocommerce-ResetPassword .button:hover::after, .ctd-woo .woocommerce-ResetPassword .woocommerce-Button:hover::after, .ctd-woo .woocommerce-form-track-order .button:hover::after, .ctd-woo .woocommerce-order-pay .button:hover::after { filter: brightness(1.08); }
.ctd-woo #place_order:active, .woocommerce-MyAccount-content .button:active, .woocommerce-MyAccount-content .woocommerce-Button:active, .woocommerce-form .woocommerce-button:active, .ctd-woo .woocommerce-ResetPassword .button:active, .ctd-woo .woocommerce-ResetPassword .woocommerce-Button:active, .ctd-woo .woocommerce-form-track-order .button:active, .ctd-woo .woocommerce-order-pay .button:active { transform: translateY(2px); filter: var(--fx-btn-cast-press); }
.ctd-woo #place_order:active::before, .woocommerce-MyAccount-content .button:active::before, .woocommerce-MyAccount-content .woocommerce-Button:active::before, .woocommerce-form .woocommerce-button:active::before, .ctd-woo .woocommerce-ResetPassword .button:active::before, .ctd-woo .woocommerce-ResetPassword .woocommerce-Button:active::before, .ctd-woo .woocommerce-form-track-order .button:active::before, .ctd-woo .woocommerce-order-pay .button:active::before { background: var(--btn-rim-press); }
.ctd-woo #place_order:active::after, .woocommerce-MyAccount-content .button:active::after, .woocommerce-MyAccount-content .woocommerce-Button:active::after, .woocommerce-form .woocommerce-button:active::after, .ctd-woo .woocommerce-ResetPassword .button:active::after, .ctd-woo .woocommerce-ResetPassword .woocommerce-Button:active::after, .ctd-woo .woocommerce-form-track-order .button:active::after, .ctd-woo .woocommerce-order-pay .button:active::after { filter: brightness(0.9); }
.ctd-woo #place_order:focus-visible, .woocommerce-MyAccount-content .button:focus-visible, .woocommerce-MyAccount-content .woocommerce-Button:focus-visible, .woocommerce-form .woocommerce-button:focus-visible, .ctd-woo .woocommerce-ResetPassword .button:focus-visible, .ctd-woo .woocommerce-ResetPassword .woocommerce-Button:focus-visible, .ctd-woo .woocommerce-form-track-order .button:focus-visible, .ctd-woo .woocommerce-order-pay .button:focus-visible { outline: 2px solid var(--gold-300); outline-offset: 3px; }

/* Sign in and Register sit side by side, and both were gold: Register is
   the gunmetal casting, so sign-in is the one gold action on the page. */
.woocommerce-form .woocommerce-form-register__submit {
  --btn-rim: var(--fx-btn-rim-gun); --btn-rim-press: var(--fx-btn-rim-gun-press);
  --btn-face: var(--fx-btn-face-gun);
  color: var(--gold-300); text-shadow: var(--fx-btn-engrave-light);
}
.woocommerce-form .woocommerce-form-register__submit:hover { color: var(--btn-hot-ink); filter: var(--fx-btn-cast-hot); }
.woocommerce-form .woocommerce-form-register__submit:hover::before { background: var(--fx-btn-rim-gold); }
.woocommerce-form .woocommerce-form-register__submit:hover::after { filter: var(--fx-btn-lift); }

/* The chosen thing, once per view: where this order has got to, and which
   account page you are on. */
.thankyou-progress__step--active .thankyou-progress__marker,
.thankyou-step--active .thankyou-step__marker,
.woocommerce-MyAccount-navigation li.is-active .account-nav-link { box-shadow: var(--fx-glow-gold); }

/* Empty grounds are empty space, which is exactly where a texture belongs.
   Never behind a paragraph. */
.cart-empty, .empty-state { background: var(--fx-turf), var(--bg-alt); }

@media (prefers-reduced-motion: reduce) {
  /* the casting seats by relighting, not by moving */
  .ctd-woo #place_order:active, .woocommerce-MyAccount-content .button:active, .woocommerce-MyAccount-content .woocommerce-Button:active, .woocommerce-form .woocommerce-button:active, .ctd-woo .woocommerce-ResetPassword .button:active, .ctd-woo .woocommerce-ResetPassword .woocommerce-Button:active, .ctd-woo .woocommerce-form-track-order .button:active, .ctd-woo .woocommerce-order-pay .button:active { transform: none; }
}

/* ============================================================
   single column
   ============================================================ */
@media (max-width: 1000px) {
  .cart-ledger-body, .checkout-layout, .thankyou-layout, .account-layout { grid-template-columns: minmax(0, 1fr); gap: var(--s-6); }
  .cart-sidebar, .checkout-sidebar, .woocommerce-MyAccount-navigation { position: static; }
  .woocommerce-MyAccount-navigation ul { flex-direction: row; flex-wrap: wrap; gap: var(--s-2); }
  .account-nav-link { border: var(--bw) solid var(--line-2); border-radius: var(--r-pill); min-height: 36px; padding: 0 var(--s-3); font-size: var(--fs-13); }
  .woocommerce-MyAccount-navigation li.is-active .account-nav-link { border-color: var(--accent); border-radius: var(--r-pill); }
  .thankyou-meta, .thankyou-overview-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .checkout-mobile-summary { display: block; }
}

/* ============================================================
   phone
   ============================================================ */
@media (max-width: 640px) {
  .ctd-woo { padding-block: var(--s-6) calc(var(--s-10) + 72px); }
  .cart-ledger-header__title, .checkout-ledger-header__title, .thankyou-hero__title, .account-title, .login-title, .ctd-hub__title { font-size: var(--fs-32); }
  .cart-item__head { grid-template-columns: 56px minmax(0, 1fr) 44px; grid-template-areas: "image info remove" "qty qty subtotal"; gap: var(--s-3); }
  .cart-item__image { grid-area: image; }
  .cart-item__image img { width: 56px; height: 56px; }
  .cart-item__info { grid-area: info; }
  .cart-item__qty { grid-area: qty; }
  .cart-item__subtotal { grid-area: subtotal; text-align: right; }
  .cart-item__remove { grid-area: remove; justify-self: end; }
  .cart-builder-grid, .thankyou-config-grid, .saved-builds-grid, .woocommerce-Addresses, #customer_login { grid-template-columns: 1fr; }
  .ctd-woo .woocommerce-billing-fields__field-wrapper, .ctd-woo .woocommerce-shipping-fields__field-wrapper, .ctd-woo .woocommerce-additional-fields__field-wrapper, .woocommerce-address-fields__field-wrapper { grid-template-columns: 1fr; }
  .ctd-woo .form-row-first, .ctd-woo .form-row-last { grid-column: 1 / -1; }
  .checkout-step__body { padding: var(--s-4); }
  .checkout-sidebar { padding: var(--s-4); }
  .checkout-mobile-bar { position: fixed; left: 0; right: 0; bottom: 0; z-index: var(--z-sticky); display: flex; align-items: center; justify-content: space-between; gap: var(--s-3); padding: var(--s-3) var(--s-4); padding-bottom: calc(var(--s-3) + env(safe-area-inset-bottom)); background: var(--ink-900); border-top: var(--bw) solid var(--line-1); }
  .checkout-mobile-bar__total { display: flex; flex-direction: column; }
  .checkout-mobile-bar__label { font-size: var(--fs-12); letter-spacing: var(--track-caps); text-transform: uppercase; color: var(--text-3); }
  .checkout-mobile-bar__amount { font-family: var(--font-display); font-size: var(--fs-24); font-weight: 700; color: var(--gold-300); font-variant-numeric: tabular-nums; }
  body.woocommerce-checkout:not(.woocommerce-order-received):not(.woocommerce-order-pay) .ctd-tabbar { display: none; } /* the place-order bar takes the tab bar's slot */
  body.woocommerce-order-received .ctd-woo, body.woocommerce-order-pay .ctd-woo, body.woocommerce-cart .ctd-woo, body.woocommerce-account .ctd-woo { padding-bottom: var(--s-10); }
  .thankyou-progress { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s-4); }
  .thankyou-progress__bar { display: none; }
  .thankyou-download { grid-template-columns: auto minmax(0, 1fr); }
  .thankyou-download__cta { grid-column: 1 / -1; }
  .review-detail { grid-template-columns: 1fr; }
  .order-actions, .primary-actions, .secondary-actions { flex-direction: column; align-items: stretch; }
}

/* ============================================================
   THE EVENT LOOK · the builders hub (2026-09-28)
   inc/builders-partial.php: the sheet head, the four ways at full size
   (components.css), and a Full Squad against the Blitz Builder. The hub's
   2026-09-11 lead panel and posters left with their markup.
   ============================================================ */
.ctd-hub__title.ctd-title--page { font-size: clamp(2.4rem, 5.6vw, 3.9rem); }
.ctd-hub .ctd-plate:not(.ctd-builderbar__id) { margin-bottom: clamp(20px, 3vw, 36px); }
.ctd-hub__compare-block { margin-top: var(--s-8); }
.ctd-hub__compare { overflow-x: auto; }
.ctd-hub__compare:focus-visible { outline: 2px solid var(--focus); outline-offset: 3px; }
.ctd-hub__table { font-size: var(--fs-16); }
.ctd-hub__table th, .ctd-hub__table td { padding: var(--s-4) var(--s-5); border-bottom: var(--bw) solid var(--line-1); vertical-align: top; }
.ctd-hub__table thead th { font: 700 var(--fs-20)/1 var(--font-varsity); letter-spacing: 0.01em; text-transform: uppercase; color: var(--text); border-bottom-color: var(--line-2); }
.ctd-hub__table thead th small { display: block; margin-top: 6px; font: 600 var(--fs-12)/1 var(--font-display); letter-spacing: 0.14em; color: var(--violet-400); }
.ctd-hub__table tbody th { width: 26%; font: 600 var(--fs-13)/1.3 var(--font-display); letter-spacing: 0.1em; text-transform: uppercase; color: var(--text-3); }
.ctd-hub__table td, .ctd-hub__table td:first-child { color: var(--text-2); font-weight: 400; }
.ctd-hub__table tr:last-child td { font: 700 var(--fs-20)/1 var(--font-display); color: var(--gold-300); }
.ctd-hub__table tr:last-child th, .ctd-hub__table tr:last-child td { border-bottom: 0; }
@media (max-width: 640px) { .ctd-hub__table th, .ctd-hub__table td { padding: var(--s-3); } }