/* ==================================================================
   The Longevity Edge — Cart page styles (loaded only on /cart/).
   Depends on tokens.css + components.css.
   ================================================================== */

/* === Trust strip (full-bleed) === */
.cart-trust-strip { width: 100vw; position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; background: var(--navy-900); color: #fff; padding: var(--s-3) var(--s-4); margin-bottom: 0; }
.cart-trust-strip ul { list-style: none; margin: 0 auto; padding: 0; max-width: 1200px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: var(--s-5) var(--s-6); font-family: var(--font-body); font-size: var(--fs-xs); font-weight: 600; letter-spacing: var(--ls-wide); text-transform: uppercase; }
.cart-trust-strip li { display: inline-flex; align-items: center; gap: var(--s-2); color: rgba(255,255,255,0.92); }
.cart-trust-icon { color: var(--gold-300); font-size: 14px; line-height: 1; }
@media (max-width: 700px) { .cart-trust-strip ul { gap: var(--s-3) var(--s-4); font-size: 10px; } }

/* === Page shell === */
.cart-page { background: var(--canvas); padding: var(--s-7) 0 var(--s-9); width: 100vw; position: relative; left: 50%; right: 50%; margin-left: -50vw; margin-right: -50vw; }
.cart-shell { max-width: 1200px; margin: 0 auto; padding: 0 var(--s-5); }

/* Hide the Kadence page title — our header below replaces it. */
body.woocommerce-cart .entry-header,
body.woocommerce-cart .page-title,
body.woocommerce-cart .entry-title { display: none !important; }
body.woocommerce-cart .content-area { margin-top: 0 !important; padding: 0 !important; }
body.woocommerce-cart .entry-content-wrap { padding: 0 !important; }
body.woocommerce-cart main#main { padding: 0 !important; }

.cart-page-header { display: flex; justify-content: space-between; align-items: flex-end; gap: var(--s-5); margin-bottom: var(--s-6); flex-wrap: wrap; }
.cart-page-header-text { min-width: 0; }
.cart-page-header h1 { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-3xl); color: var(--navy-900); margin: 0 0 var(--s-2); letter-spacing: var(--ls-tight); line-height: var(--lh-tight); }
.cart-page-sub { font-size: var(--fs-lg); color: var(--ink-700); margin: 0; }
.cart-continue-shopping { display: inline-flex; align-items: center; gap: 6px; padding: 10px 16px; font-family: var(--font-body); font-size: var(--fs-sm); font-weight: 600; color: var(--navy-900); background: var(--surface); border: 1.5px solid var(--navy-100); border-radius: var(--r-md); text-decoration: none; transition: border-color 180ms var(--ease-out), color 180ms var(--ease-out), box-shadow 180ms var(--ease-out), transform 180ms var(--ease-out); white-space: nowrap; }
.cart-continue-shopping:hover, .cart-continue-shopping:focus-visible { border-color: var(--gold-600); color: var(--gold-600); box-shadow: 0 4px 12px rgba(14, 26, 43, 0.06); transform: translateX(-2px); outline: none; }
.cart-continue-shopping svg { color: currentColor; flex-shrink: 0; }

/* === Two-column layout === */
.cart-layout { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: var(--s-6); align-items: start; }
@media (max-width: 900px) { .cart-layout { grid-template-columns: 1fr; } }

/* === Items column === */
.cart-items-list { display: flex; flex-direction: column; gap: var(--s-3); }
.cart-item { display: grid; grid-template-columns: 90px 1fr auto auto; align-items: center; gap: var(--s-4); padding: var(--s-4); background: var(--surface); border: 1px solid var(--navy-100); border-radius: var(--r-lg); }
.cart-item-thumb { width: 90px; height: 90px; border-radius: var(--r-md); overflow: hidden; background: var(--canvas); display: flex; align-items: center; justify-content: center; }
.cart-item-thumb img { width: 100%; height: 100%; object-fit: cover; }
.cart-item-info { min-width: 0; }
.cart-item-name { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-lg); margin: 0 0 var(--s-2); color: var(--navy-900); letter-spacing: var(--ls-tight); }
.cart-item-name a { color: inherit; text-decoration: none; }
.cart-item-name a:hover { color: var(--gold-600); }
.cart-item-meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-3); font-size: var(--fs-xs); color: var(--ink-700); }
.cart-item-badge { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: var(--r-pill); font-weight: 700; letter-spacing: var(--ls-wide); text-transform: uppercase; font-size: 10px; line-height: 1; }
.cart-item-badge--sub { background: var(--success-50); color: var(--success); }
.cart-item-badge--sub svg { width: 12px; height: 12px; }
.cart-item-badge--ot { background: var(--navy-50); color: var(--navy-700); }
.cart-item-eta { font-size: var(--fs-xs); color: var(--ink-700); }
.cart-item-qty .qty { width: 64px; height: 36px; border: 1.5px solid var(--navy-100); border-radius: var(--r-md); padding: 0 var(--s-2); font-family: var(--font-body); font-weight: 600; text-align: center; color: var(--navy-900); background: var(--canvas); }
.cart-item-price { font-family: var(--font-body); font-weight: 700; font-size: var(--fs-lg); color: var(--navy-900); text-align: right; font-feature-settings: "tnum","lnum"; min-width: 80px; }
.cart-item-remove { display: block; margin-top: var(--s-2); font-size: var(--fs-xs); color: var(--ink-500); text-decoration: none; letter-spacing: var(--ls-wide); text-transform: uppercase; font-weight: 600; }
.cart-item-remove:hover { color: var(--cta-600); }
@media (max-width: 640px) {
	.cart-item { grid-template-columns: 64px 1fr; grid-template-areas: "thumb info" "qty price"; }
	.cart-item-thumb { grid-area: thumb; width: 64px; height: 64px; }
	.cart-item-info { grid-area: info; }
	.cart-item-qty { grid-area: qty; }
	.cart-item-price { grid-area: price; }
}

.cart-updates-row { display: flex; justify-content: flex-end; gap: var(--s-3); margin-top: var(--s-4); }

/* === Bundle suggestion === */
.cart-bundle-cta { display: grid; grid-template-columns: 80px 1fr auto; gap: var(--s-4); align-items: center; padding: var(--s-5); background: linear-gradient(105deg, var(--gold-50) 0%, var(--surface) 100%); border: 1px solid var(--gold-100); border-radius: var(--r-lg); margin-top: var(--s-5); }
.cart-bundle-cta-img { width: 80px; height: 80px; border-radius: var(--r-md); overflow: hidden; background: var(--canvas); }
.cart-bundle-cta-img img { width: 100%; height: 100%; object-fit: cover; }
.cart-bundle-cta-eyebrow { font-family: var(--font-body); font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: var(--ls-widest); color: var(--gold-600); margin: 0 0 4px; }
.cart-bundle-cta h3 { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-lg); color: var(--navy-900); margin: 0 0 4px; letter-spacing: var(--ls-tight); }
.cart-bundle-cta p { font-size: var(--fs-sm); color: var(--ink-700); margin: 0; }
.cart-bundle-cta-btn { white-space: nowrap; }
@media (max-width: 640px) { .cart-bundle-cta { grid-template-columns: 1fr; text-align: center; } .cart-bundle-cta-img { margin: 0 auto; } }

/* === Order summary (right column) === */
.cart-summary-col { position: sticky; top: 96px; }
@media (max-width: 900px) { .cart-summary-col { position: static; } }
.cart-summary { background: var(--surface); border: 1px solid var(--navy-100); border-radius: var(--r-lg); padding: var(--s-6); }
.cart-summary h2 { font-family: var(--font-display); font-weight: 600; font-size: var(--fs-xl); color: var(--navy-900); margin: 0 0 var(--s-5); letter-spacing: var(--ls-tight); }
.cart-summary-row { display: flex; justify-content: space-between; align-items: baseline; padding: var(--s-3) 0; border-bottom: 1px solid var(--navy-100); font-size: var(--fs-base); color: var(--ink-700); }
.cart-summary-row span:last-child { color: var(--navy-900); font-weight: 600; font-feature-settings: "tnum","lnum"; }
.cart-summary-row--total { font-size: var(--fs-lg); padding-top: var(--s-4); border-bottom: 0; }
.cart-summary-row--total span { color: var(--navy-900); font-weight: 700; }

/* Free shipping progress — tightly coupled header + bar */
.cart-shipping-progress { padding: var(--s-3) 0; border-bottom: 1px solid var(--navy-100); }
.cart-shipping-progress-header { display: flex; justify-content: space-between; align-items: baseline; gap: var(--s-3); margin-bottom: 6px; font-size: var(--fs-sm); }
.cart-shipping-progress-label { color: var(--ink-700); display: inline-flex; align-items: center; gap: 6px; }
.cart-shipping-progress-label strong { color: var(--gold-600); font-weight: 700; font-feature-settings: "tnum","lnum"; }
.cart-shipping-progress.is-won .cart-shipping-progress-label { color: var(--success); font-weight: 600; }
.cart-shipping-progress.is-won .cart-shipping-progress-label svg { color: var(--success); }
.cart-shipping-progress-threshold { color: var(--ink-500); font-size: var(--fs-xs); font-weight: 700; font-feature-settings: "tnum","lnum"; letter-spacing: var(--ls-wide); }
.cart-shipping-bar { background: var(--navy-50); border-radius: var(--r-pill); height: 8px; overflow: hidden; }
.cart-shipping-bar-fill { background: var(--gold-600); height: 100%; border-radius: var(--r-pill); transition: width 400ms var(--ease-out); }
.cart-shipping-progress.is-won .cart-shipping-bar-fill { background: var(--success); }

/* Checkout button */
.cart-checkout-btn { display: block; width: 100%; text-align: center; margin-top: var(--s-5); height: 52px; line-height: 52px; padding: 0 var(--s-4); font-size: var(--fs-base); font-weight: 700; letter-spacing: -0.005em; box-shadow: 0 4px 12px rgba(14, 26, 43, 0.14); }
.cart-checkout-btn:hover { box-shadow: 0 8px 20px rgba(14, 26, 43, 0.22); }

/* Trust block */
.cart-summary-trust { margin-top: var(--s-5); padding-top: var(--s-5); border-top: 1px solid var(--navy-100); display: flex; flex-direction: column; gap: var(--s-3); }
.cart-summary-trust-item { display: flex; align-items: flex-start; gap: var(--s-3); font-size: var(--fs-sm); color: var(--ink-700); line-height: var(--lh-normal); }
.cart-summary-trust-item svg { color: var(--gold-600); flex-shrink: 0; margin-top: 2px; }
.cart-summary-trust-item strong { color: var(--navy-900); font-weight: 600; }
.cart-summary-help { margin: var(--s-4) 0 0; font-size: var(--fs-xs); color: var(--ink-500); text-align: center; }
.cart-summary-help a { color: var(--gold-600); font-weight: 600; }


/* === Switch-to-Subscribe button + Cross-sells === */
.cart-item-switch-form { width: 100%; margin: 6px 0 0; }
.cart-item-switch-btn { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; background: var(--gold-50); border: 1px solid var(--gold-100); border-radius: var(--r-pill); font-family: var(--font-body); font-size: var(--fs-xs); font-weight: 700; letter-spacing: -0.005em; color: var(--gold-600); cursor: pointer; transition: background 180ms var(--ease-out), border-color 180ms var(--ease-out), color 180ms var(--ease-out); }
.cart-item-switch-btn:hover { background: var(--gold-100); border-color: var(--gold-600); color: var(--navy-900); }
.cart-item-switch-btn svg { color: currentColor; flex-shrink: 0; }
.cart-item-badge--cadence { background: var(--navy-50); color: var(--navy-700); }

/* WC cross-sells block at the bottom — center inside the cart-page container */
body.woocommerce-cart .cross-sells { max-width: 1200px; margin: var(--s-8) auto 0; padding: 0 var(--s-5); text-align: center; }
body.woocommerce-cart .cross-sells > h2 { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-2xl); color: var(--navy-900); margin: 0 0 var(--s-5); letter-spacing: var(--ls-tight); }
body.woocommerce-cart .cross-sells > .products { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: var(--s-5); margin: 0; padding: 0; list-style: none; max-width: 900px; margin-left: auto; margin-right: auto; }
body.woocommerce-cart .cross-sells > .products > .product { text-align: left; }


/* === WCSO Original Price + Savings rows (rewritten from <tr>/<th>/<td> in PHP) ===
   Base styles first, modifier overrides last so they win the specificity tie. */
.cart-summary-row .cart-summary-row-label { color: var(--ink-700); font-weight: 500; font-family: var(--font-body); }
.cart-summary-row .cart-summary-row-value { color: var(--navy-900); font-weight: 600; font-feature-settings: "tnum","lnum"; }
.cart-summary-row--strike .cart-summary-row-label,
.cart-summary-row--strike .cart-summary-row-value { color: var(--ink-500); text-decoration: line-through; font-weight: 500; }
.cart-summary-row--savings .cart-summary-row-label { color: var(--success); font-weight: 700; }
.cart-summary-row--savings .cart-summary-row-value,
.cart-summary-row--savings .wcso-savings-amount,
.cart-summary-row--savings .wcso-savings-amount .amount { color: var(--success); font-weight: 700; }


/* === Cart notices (WC info / message / error) — TLE themed === */
.cart-notices { margin: 0 0 var(--s-6); }
.cart-notices ul.woocommerce-info,
.cart-notices ul.woocommerce-message,
.cart-notices ul.woocommerce-error,
.cart-notices div.woocommerce-info,
.cart-notices div.woocommerce-message,
.cart-notices div.woocommerce-error,
.cart-notices .woocommerce-NoticeGroup ul { list-style: none; margin: 0 0 var(--s-3); padding: var(--s-4) var(--s-5); border-radius: var(--r-md); font-family: var(--font-body); font-size: var(--fs-base); line-height: var(--lh-normal); border-left: 4px solid; background: var(--surface); color: var(--navy-900); display: flex; align-items: center; gap: var(--s-3); }
.cart-notices ul li,
.cart-notices div li { padding: 0; margin: 0; list-style: none; flex: 1; }
.cart-notices .woocommerce-info,
.cart-notices .woocommerce-message { background: var(--success-50); border-left-color: var(--success); color: var(--navy-900); }
.cart-notices .woocommerce-error { background: rgba(208, 60, 60, 0.08); border-left-color: var(--error); color: var(--error); }
.cart-notices a { color: var(--gold-600); font-weight: 600; text-decoration: none; }
.cart-notices a:hover { color: var(--navy-900); text-decoration: underline; }
.cart-notices .button { background: transparent; color: var(--gold-600); font-weight: 600; padding: 4px 10px; border: 1.5px solid var(--gold-100); border-radius: var(--r-md); font-size: var(--fs-xs); margin-left: auto; }
.cart-notices .button:hover { background: var(--gold-50); border-color: var(--gold-600); color: var(--navy-900); }

/* === Empty cart === */
.cart-empty { text-align: center; padding: var(--s-9) var(--s-5); background: var(--surface); border: 1px solid var(--navy-100); border-radius: var(--r-lg); }
.cart-empty-illus { color: var(--ink-500); margin: 0 auto var(--s-4); }
.cart-empty h2 { font-family: var(--font-display); font-weight: 700; font-size: var(--fs-2xl); color: var(--navy-900); margin: 0 0 var(--s-3); letter-spacing: var(--ls-tight); }
.cart-empty p { font-size: var(--fs-base); color: var(--ink-700); max-width: 480px; margin: 0 auto var(--s-5); line-height: var(--lh-normal); }