/* ---------- Cart (fallback full page) ---------- */
.cart-page-body{background:var(--surface); border:var(--border-w) solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--shadow); padding:20px; max-width:560px;}
.cart-page-continue{margin-top:20px; font-family:var(--font-mono); font-size:12px;}
.cart-page-continue a:hover{color:var(--red);}

/* ---------- Notices (WooCommerce core classes, restyled) ---------- */
.woocommerce-error, .woocommerce-message, .woocommerce-info{
  list-style:none; border:var(--border-w) solid var(--line); border-radius:var(--radius); padding:14px 16px; margin-bottom:20px;
  font-size:13.5px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px;
}
.woocommerce-error{border-color:var(--red); background:#FBEAEC;}
.woocommerce-message{border-color:var(--green); background:#EAF4EE;}
.woocommerce-info{background:var(--bg);}
.woocommerce-error li{list-style:none;}
.woocommerce-message .button, .woocommerce-error .button{
  border:var(--border-w) solid var(--ink); border-radius:var(--radius-sm); background:var(--ink); color:#fff; padding:8px 14px;
  font-family:var(--font-mono); font-size:11px; font-weight:700;
}

/* ---------- Payment methods loading state (replaces the "no payment
   methods available" flash on first paint — see checkout/payment.php and
   the trailing block in assets/js/checkout.js). Uses the same @keyframes
   shimmer already defined in main.css, but its own class rather than
   .shimmer-block, since that class is auto-marked "loaded" (animation
   stopped) a frame after it appears — fine for images/cards, wrong here,
   where the wait can genuinely last a few seconds. ---------- */
.payment-methods-loading{
  list-style:none; padding:16px 14px; display:flex; flex-direction:column; gap:10px;
}
.payment-loading-shimmer{display:flex; flex-direction:column; gap:6px;}
.payment-loading-bar{
  height:14px; border-radius:var(--radius-sm);
  background-image:linear-gradient(90deg, var(--bg) 0%, #e8ecf0 20%, var(--bg) 40%, var(--bg) 100%);
  background-size:200% 100%; background-repeat:no-repeat;
  animation:shimmer 1.8s ease-in-out infinite;
}
.payment-loading-bar.medium{width:80%;}
.payment-loading-bar.short{width:55%;}
.payment-loading-copy{
  font-family:var(--font-mono); font-size:11.5px; color:var(--ink-soft); letter-spacing:0.03em;
}
.payment-loading-real-message{
  font-size:13px; color:var(--ink-soft); line-height:1.5;
  border:var(--border-w) solid var(--line); border-radius:var(--radius-sm); background:var(--bg); padding:10px 12px;
}

/* ---------- Neutralizing Stripe's own "no payment methods available"
   notice while it's likely just still loading (see the trailing block in
   assets/js/checkout.js). That notice is WooCommerce's own red "error"
   component — this only overrides its color while our JS has swapped its
   text for the calm placeholder above; the JS removes this class again
   if the message genuinely never resolves, so a real, lasting failure
   still looks like the warning it actually is. !important is needed
   here since the red styling comes from the component's own build,
   which this theme doesn't control the specificity of. ---------- */
.dwc-notice-neutralized{
  background:var(--bg) !important; border-color:var(--line) !important; color:var(--ink-soft) !important;
}
.dwc-notice-neutralized *{
  color:var(--ink-soft) !important;
}
.dwc-notice-neutralized svg,
.dwc-notice-neutralized svg *{
  fill:var(--ink-soft) !important; stroke:var(--ink-soft) !important;
}

/* ---------- Checkout login prompt (replaces WooCommerce's default
   "Returning customer? Click here to login" full-page-reload form —
   see dwc_checkout_login_prompt() in inc/woocommerce-support.php) ---------- */
.checkout-login-prompt{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  border:var(--border-w) dashed var(--line); border-radius:var(--radius); background:var(--bg); padding:12px 16px;
  margin-bottom:24px; font-size:13px;
}
.checkout-login-prompt span{color:var(--ink-soft);}
.checkout-login-prompt a{font-weight:700; text-decoration:underline;}
.checkout-login-prompt a:hover{color:var(--red);}

/* ---------- Checkout "must be logged in" dead end (registration-required
   stores only) — same empty-state look as elsewhere, plus a way forward. ---------- */
.checkout-login-required{display:flex; flex-direction:column; align-items:center; gap:14px;}
.checkout-login-required .add-btn{width:auto; padding-left:28px; padding-right:28px; border-radius:var(--radius-pill);}

/* ---------- Checkout layout ---------- */
.checkout-page{max-width:1100px;}
.checkout-columns{display:flex; flex-wrap:wrap; gap:44px; align-items:flex-start; margin-top:10px;}
.checkout-col-details{flex:1 1 460px; width:calc(56% - 22px);}
.checkout-col-summary{flex:1 1 340px; width:calc(44% - 22px);}
.checkout-field-group{margin-bottom:28px;}
.checkout-field-group-title{font-family:var(--font-body); font-weight:600; font-size:16px; margin-bottom:16px; letter-spacing:-0.01em;}
.checkout-summary-sticky{
  position:sticky; top:100px; background:var(--surface); border:var(--border-w) solid var(--line); border-radius:var(--radius-lg); box-shadow:var(--shadow);
  padding:20px;
}
#order_review_heading{font-family:var(--font-body); font-weight:600; font-size:16px; margin-bottom:14px;}
@media (max-width:900px){
  .checkout-col-details, .checkout-col-summary{width:100%;}
  .checkout-summary-sticky{position:static;}
}

/* ---------- Order-review savings + Club nudge — put the value prop back
   in front of the shopper right at the moment of payment. Content-only
   addition inside the existing sticky rail, no structural change. ---------- */
.checkout-savings-block{
  margin-bottom:16px; padding-bottom:14px; border-bottom:1px dashed var(--line);
  display:flex; flex-direction:column; gap:10px;
}
.checkout-savings-line{
  display:flex; justify-content:space-between; align-items:baseline;
  font-family:var(--font-mono); font-size:12.5px; color:var(--ink-soft);
}
.checkout-savings-amount{font-size:15px; font-weight:700; color:var(--green);}
.checkout-club-nudge{
  background:var(--bg); border:var(--border-w) dashed var(--accent); border-radius:var(--radius); padding:10px 12px;
  font-size:12.5px; line-height:1.5; display:flex; align-items:center; justify-content:space-between; gap:10px; flex-wrap:wrap;
}
.checkout-club-nudge strong{color:var(--ink);}
.checkout-club-nudge-link{
  font-family:var(--font-mono); font-size:11px; font-weight:700; color:var(--accent);
  white-space:nowrap;
}
.checkout-club-nudge-link:hover{color:var(--red);}

/* ---------- Form fields (WooCommerce's default field markup, restyled — 
   our theme intentionally dequeues WC's general/layout CSS, so these rules
   replace that base layer for form-row/field-wrapper structure) ---------- */
.woocommerce-billing-fields__field-wrapper,
.woocommerce-shipping-fields__field-wrapper,
.woocommerce-additional-fields__field-wrapper{
  display:flex; flex-wrap:wrap; gap:14px 12px;
}
.form-row{width:100%; margin-bottom:2px;}
.form-row-first, .form-row-last{width:calc(50% - 6px);}
.form-row label{display:block; font-family:var(--font-mono); font-size:11px; letter-spacing:0.03em; color:var(--ink-soft); margin-bottom:6px;}
.form-row label .required{color:var(--red); text-decoration:none;}
.form-row.woocommerce-invalid .input-text{border-color:var(--red);}
#ship-to-different-address{font-family:var(--font-mono); font-size:12px; margin:10px 0; display:block;}
#ship-to-different-address label{display:flex; align-items:center; gap:8px; cursor:pointer;}
.woocommerce-shipping-fields{margin-top:16px;}
.woocommerce-additional-fields{margin-top:8px;}
.woocommerce-additional-fields h3{font-family:var(--font-body); font-weight:600; font-size:16px; margin-bottom:14px;}

/* Coupon */
.checkout_coupon{border:var(--border-w) dashed var(--line); border-radius:var(--radius); padding:16px; margin-bottom:24px; display:flex; gap:10px; flex-wrap:wrap;}
.checkout_coupon .form-row{width:auto; flex:1; min-width:160px; margin-bottom:0;}
.checkout_coupon .button{border:var(--border-w) solid var(--ink); border-radius:var(--radius-sm); background:var(--ink); color:#fff; font-family:var(--font-mono); font-size:12px; font-weight:700; padding:0 18px;}

/* ---------- Order review table (WooCommerce core classes) ---------- */
.woocommerce-checkout-review-order-table{width:100%; border-collapse:collapse; font-family:var(--font-mono); font-size:13px;}
.woocommerce-checkout-review-order-table thead{display:none;}
.woocommerce-checkout-review-order-table .cart_item td{padding:10px 0; border-bottom:1px dashed var(--line); vertical-align:top;}
.woocommerce-checkout-review-order-table .product-name{font-family:var(--font-body); font-size:13.5px;}
.woocommerce-checkout-review-order-table .product-total{text-align:right; white-space:nowrap;}
.woocommerce-checkout-review-order-table .cart-subtotal td,
.woocommerce-checkout-review-order-table .shipping td,
.woocommerce-checkout-review-order-table .tax-total td,
.woocommerce-checkout-review-order-table .fee td{padding:10px 0; border-bottom:1px dashed var(--line);}
.woocommerce-checkout-review-order-table .order-total td{
  padding-top:14px; font-size:18px; font-weight:700; border-top:1px solid var(--line); border-bottom:none;
}
.woocommerce-checkout-review-order-table td:last-child{text-align:right;}

/* Shipping method radios */
.woocommerce-shipping-methods{list-style:none;}
.woocommerce-shipping-methods li{padding:6px 0; font-size:13px;}

/* Payment methods */
.woocommerce-checkout-payment{margin-top:20px; border-top:1px solid var(--line); padding-top:16px;}
ul.payment_methods{list-style:none;}
ul.payment_methods li{border:var(--border-w) solid var(--line); border-radius:var(--radius); margin-bottom:8px; padding:12px 14px;}
ul.payment_methods li input[type="radio"]{margin-right:8px;}
ul.payment_methods li label{font-size:13.5px; font-weight:600; cursor:pointer;}
.payment_box{
  background:var(--bg); border:1px dashed var(--line); border-radius:var(--radius-sm); margin-top:10px; padding:12px 14px;
  font-size:12.5px; color:var(--ink-soft); line-height:1.6;
}
.woocommerce-terms-and-conditions-wrapper{margin:16px 0; font-size:12.5px;}
.woocommerce-form__label-for-checkbox{display:flex; align-items:flex-start; gap:8px; cursor:pointer;}
#place_order{
  width:100%; border:var(--border-w) solid var(--red); border-radius:var(--radius-sm); background:var(--red); color:#fff;
  font-family:var(--font-mono); font-weight:700; font-size:14px; letter-spacing:0.05em;
  padding:16px; margin-top:14px;
}
#place_order:hover{background:var(--ink); border-color:var(--ink);}

.express-checkout-slot:empty{display:none;}

.order-summary-toggle{
  width:100%; border:var(--border-w) solid var(--line); border-radius:var(--radius-sm); background:var(--bg); color:var(--ink);
  font-family:var(--font-mono); font-size:11px; font-weight:700; letter-spacing:0.04em;
  padding:10px; margin-bottom:12px;
}
.order-summary-toggle:hover{background:var(--accent); color:#fff; border-color:var(--accent);}