/* amo-constanta — WooCommerce overrides: shop grid, single product, cart, checkout, account */

.amo-shop{ padding: var(--space-9) 0 var(--space-12); }

/* archive-product.php grid (menu-as-list, matching the design's dotted-row menu) */
ul.products{
  display: grid !important;
  grid-template-columns: 1fr 1fr;
  column-gap: var(--space-14);
  list-style: none;
  margin: 0; padding: 0;
}
@media (max-width: 1023px){ ul.products{ grid-template-columns: 1fr; column-gap: 0; } }

/* Layout (display/align-items/gap/padding/border) is owned by .amo-menu-row
   in components.css, so it applies identically whether a row is inside this
   ul.products wrapper (shop/category archives) or not (homepage's plain
   WP_Query list) — this used to also redeclare align-items:center here,
   which (higher specificity than .amo-menu-row alone) silently overrode the
   flex-start alignment fix on archive pages only. Only margin reset and the
   underline removal are genuinely archive-specific, kept below. */
ul.products li.product{ margin: 0; }
ul.products li.product a{ text-decoration: none; }
ul.products li.product .woocommerce-loop-product__title{
  font-size: var(--text-xl); color: var(--color-ink); margin: 0; display: inline;
}
ul.products li.product .price{ font-size: var(--text-xl); color: var(--color-accent); white-space: nowrap; font-family: var(--font-body); }
ul.products li.product .price del{ color: var(--color-ink-faint); opacity: .7; margin-right: var(--space-2); }
ul.products li.product .price ins{ text-decoration: none; }
/* Solid "colored box" look (matches .amo-btn) — kept as an explicit
   archive-scoped rule since ul.products li.product .add_to_cart_button
   otherwise outranks .amo-btn on specificity alone; redeclared here rather
   than left to inherit so archive pages can't drift from the homepage look
   the way the old transparent/outline version did. */
ul.products li.product .add_to_cart_button{
  display: inline-flex; align-items: center; justify-content: center;
  padding: var(--space-2) var(--space-4); font: 400 var(--text-sm)/1 var(--font-heading);
  background: var(--color-accent); color: var(--color-white-warm);
  border: 0; cursor: pointer; text-decoration: none; white-space: nowrap;
}
ul.products li.product .add_to_cart_button:hover{ background: var(--color-accent-hover); }
ul.products li.product .added_to_cart{ font-size: var(--text-xs); margin-left: var(--space-2); }

.amo-shop-toolbar{ display: flex; align-items: center; justify-content: flex-end; margin-bottom: var(--space-4); }
.woocommerce-result-count, .woocommerce-ordering{ font-size: var(--text-sm); color: var(--color-ink-softer); }
.woocommerce-pagination{ margin-top: var(--space-9); }
.woocommerce-pagination ul{ display: flex; gap: var(--space-2); list-style: none; padding: 0; }
.woocommerce-pagination a, .woocommerce-pagination span{
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 36px; height: 36px; padding: 0 var(--space-2);
  border: 2px solid var(--color-border-soft); color: var(--color-ink);
}
.woocommerce-pagination .current{ background: var(--color-accent); color: var(--color-white-warm); border-color: var(--color-accent); }

/* single product — WooCommerce's native content-single-product.php wrapper
   (div.product with .woocommerce-product-gallery and .summary as siblings)
   is used as-is; this just lays it out as a two-column grid and restyles
   the native elements inside it. */
.amo-single-product{ padding: var(--space-9) 0 var(--space-12); }
.single-product div.product{
  display: grid;
  grid-template-columns: .9fr 1.1fr;
  gap: var(--space-9);
  align-items: start;
}
@media (max-width: 1023px){ .single-product div.product{ grid-template-columns: 1fr; } }
.single-product .woocommerce-product-gallery{ grid-column: 1; }
.single-product .summary.entry-summary{ grid-column: 2; }
@media (max-width: 1023px){
  .single-product .woocommerce-product-gallery,
  .single-product .summary.entry-summary{ grid-column: 1; }
}
.woocommerce-product-gallery__image img{ width: 100%; height: 100%; object-fit: cover; display: block; }
.amo-single-gallery-placeholder{ aspect-ratio: 4/3; }

.single-product .product_title{ font-size: var(--text-3xl); margin: 0 0 var(--space-2); }
.single-product .woocommerce-product-details__short-description{ color: var(--color-ink-soft); font-size: var(--text-base); margin: var(--space-4) 0 var(--space-6); }

.single-product .price{ font-family: var(--font-body); font-size: var(--text-3xl); color: var(--color-accent); display: block; margin-bottom: var(--space-6); }
.single-product .price del{ font-size: var(--text-lg); color: var(--color-ink-faint); opacity: .7; }
.single-product .price ins{ text-decoration: none; }

.variations{ width: 100%; border-collapse: collapse; margin-bottom: var(--space-6); }
.variations td{ padding: 0; border: 0; display: block; }
.variations tr{ display: block; margin-bottom: var(--space-4); }
.variations label{ display: block; font-size: var(--text-sm); color: var(--color-ink-soft); margin-bottom: var(--space-2); }
.variations select{
  font: 400 var(--text-base)/1 var(--font-body);
  padding: var(--space-3) var(--space-4);
  border: 2px solid var(--color-border-input);
  background: var(--color-white-warm);
  color: var(--color-ink);
  min-width: 220px;
}
.woocommerce-variation-price .price{ font-size: var(--text-2xl); margin-bottom: var(--space-2); }
.woocommerce-variation-availability{ margin-bottom: var(--space-4); }
.reset_variations{ font-size: var(--text-xs); color: var(--color-ink-faint); }

form.cart{ display: flex; align-items: center; gap: var(--space-4); flex-wrap: wrap; }
.quantity{ display: inline-flex; }
.quantity .qty{
  width: 72px; padding: var(--space-3) var(--space-3);
  border: 2px solid var(--color-border-input); background: var(--color-white-warm); color: var(--color-ink);
  font: 400 var(--text-base)/1 var(--font-body);
}
.single_add_to_cart_button{
  display: inline-flex; align-items: center; gap: var(--space-2);
  padding: var(--space-3) var(--space-7);
  font: 400 var(--text-base)/1 var(--font-heading);
  border: 0; cursor: pointer;
  background: var(--color-accent); color: var(--color-white-warm);
}
.single_add_to_cart_button:hover{ background: var(--color-accent-hover); }
.single_add_to_cart_button.disabled{ background: var(--color-border-stronger); color: var(--color-ink-softer); cursor: not-allowed; }

.amo-product-meta{ margin-top: var(--space-6); font-size: var(--text-sm); color: var(--color-ink-faint); }

/* related products reuse ul.products grid but as cards, so scope override */
.related.products{ margin-top: var(--space-13); }
.related.products > h2{ font-size: var(--text-3xl); border-bottom: 2px solid var(--color-border-strong); padding-bottom: var(--space-4); margin-bottom: var(--space-6); }

/* cart page */
/*
 * Same padding-shorthand bug as .amo-checkout-page below, same fix: this
 * class lands on the same element as .amo-container (woocommerce/cart/cart.php),
 * so the 3-value `padding` shorthand's left/right: 0 was overriding
 * .amo-container's horizontal padding. Not reported by name, but it's the
 * identical bug on the full /cos/ page — fixed alongside checkout.
 */
.amo-cart-page{ padding-top: var(--space-9); padding-bottom: var(--space-12); }
table.shop_table{ width: 100%; border-collapse: collapse; }
table.shop_table th{
  text-align: left; font-size: var(--text-xs); text-transform: uppercase; letter-spacing: .06em;
  color: var(--color-ink-faint); padding: var(--space-3) var(--space-2);
  border-bottom: 2px solid var(--color-border-strong);
}
table.shop_table td{ padding: var(--space-4) var(--space-2); border-bottom: 1px solid var(--color-border); vertical-align: middle; }
table.shop_table td.product-thumbnail img{ width: 62px; height: 62px; object-fit: cover; }
table.shop_table td.product-remove a{
  color: var(--color-ink-faint); font-size: 20px; text-decoration: none;
}
.cart-collaterals{ margin-top: var(--space-9); display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-9); }
@media (max-width: 1023px){ .cart-collaterals{ grid-template-columns: 1fr; } }
.cart_totals{ background: var(--color-white-warm); border: 2px solid var(--color-border-soft); padding: var(--space-6); }
.cart_totals h2{ font-size: var(--text-2xl); }
.cart_totals table{ width: 100%; }
.cart_totals table td, .cart_totals table th{ padding: var(--space-2) 0; border: 0; border-bottom: 1px solid var(--color-border); }
.cart_totals .order-total .amount{ color: var(--color-accent); font-size: var(--text-xl); }
.wc-proceed-to-checkout .checkout-button{
  display: flex; width: 100%; justify-content: space-between; align-items: center;
  margin-top: var(--space-4);
}

/* ===========================================================================
 * checkout page — full rebuild (2026-09-16, v4) to match
 * feedback-v3/checkout-out/index.html. Previously WooCommerce's stock
 * col2-set billing/shipping + order-review-table layout, only ever given a
 * container class and a padding fix (see CHANGELOG.md v3 #3) — never
 * actually restructured. See woocommerce/checkout/form-checkout.php,
 * review-order.php and payment-method.php for the matching markup rebuild.
 * =========================================================================== */
.amo-checkout-page{ padding-top: 0; padding-bottom: 0; }

.amo-checkout-steps{
  display: flex; align-items: center; gap: var(--space-3);
  padding-top: var(--space-4); padding-bottom: var(--space-4);
  background: var(--color-white-warm);
  border-bottom: 1px solid var(--color-border-strong);
}
.amo-checkout-step{ display: flex; align-items: center; gap: var(--space-2); }
.amo-checkout-step-n{
  width: 28px; height: 28px; border-radius: var(--radius-pill);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: var(--text-sm);
  background: transparent; color: var(--color-ink-faint);
  box-shadow: inset 0 0 0 2px var(--color-border-stronger);
}
.amo-checkout-step span:last-child{ font-size: var(--text-lg); color: var(--color-ink-faint); }
.amo-checkout-step.is-done .amo-checkout-step-n,
.amo-checkout-step.is-active .amo-checkout-step-n{ background: var(--color-accent); color: var(--color-white-warm); box-shadow: none; }
.amo-checkout-step.is-done span:last-child,
.amo-checkout-step.is-active span:last-child{ color: var(--color-ink); }
.amo-checkout-step-sep{ color: var(--color-border-stronger); padding: 0 var(--space-1); }

.amo-checkout-closed-notice{
  background: var(--color-danger-bg); border: 1px solid var(--color-danger); color: var(--color-danger);
  padding: var(--space-5); margin: var(--space-6) 0; font-size: var(--text-base);
}
.amo-checkout-closed-notice strong{ display: block; margin-bottom: var(--space-1); }
body.amo-shop-closed #place_order{ background: var(--color-border-stronger); color: var(--color-ink-softer); pointer-events: none; }

/* Two-column grid: bleeds to the full 1360px container width (cancels
   .amo-container's own padding), then each column re-pads itself — the
   main column at the page's 40px container-pad, the sidebar at a smaller
   fixed 24px (space-6), matching the same convention already established
   for the cart flyout's .amo-cart-head/-body/-foot (reused directly
   below — this sidebar and the cart flyout share the same component
   shape in the design source, so they share the same CSS). */
.amo-checkout-grid{
  display: grid; grid-template-columns: 1fr 420px; align-items: start;
  margin: 0 calc(var(--container-pad) * -1);
}
.amo-checkout-main{ padding: var(--space-9) var(--container-pad) var(--space-13); max-width: 900px; }
.amo-checkout-main h1{ font-size: var(--text-5xl); color: var(--color-ink); line-height: 1; }
.amo-checkout-lede{ margin: var(--space-2) 0 var(--space-7); font-size: var(--text-lg); color: var(--color-ink-softer); }
.amo-checkout-main h2{ font-size: var(--text-2xl); color: var(--color-ink); margin: var(--space-8) 0 var(--space-4); }
.amo-checkout-main h2:first-of-type{ margin-top: 0; }
.amo-checkout-mode{ margin-bottom: var(--space-2); }

.amo-checkout-fieldset{ display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4) var(--space-5); max-width: 640px; margin-bottom: var(--space-4); }
.amo-checkout-fieldset:last-of-type{ margin-bottom: 0; }
.amo-checkout-fieldset .form-row{ margin: 0; }
.amo-checkout-fieldset .form-row-wide{ grid-column: 1 / -1; }
/* Visible street plus block, apartment and intercom on the same row. */
.amo-checkout-fieldset--addr{ grid-template-columns: 2fr 1fr 1fr 1fr; max-width: 900px; }
@media (min-width: 768px){ .amo-checkout-fieldset--addr #billing_address_1_field{ grid-column: auto; } }


.amo-checkout-pickup-name{ font-size: var(--text-xl); color: var(--color-accent); margin: 0 0 var(--space-1); }
.amo-checkout-pickup-addr{ margin: 0; font-size: var(--text-base); color: var(--color-ink); }
.amo-checkout-pickup-hours{ margin: var(--space-1) 0 0; font-size: var(--text-sm); color: var(--color-ink-softer); }
.amo-checkout-address{ max-width: 900px; }
.amo-checkout-pickup{ max-width: 640px; }
.amo-hidden{ display: none; }

.amo-checkout-payments{ list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2); max-width: 640px; }
.amo-checkout-payment-card{ background: transparent; box-shadow: inset 0 0 0 2px var(--color-border-strong); }
.amo-checkout-payment-card.is-active{ background: var(--color-accent-tint-2); box-shadow: inset 0 0 0 2px var(--color-accent); }
.amo-checkout-payment-label{
  display: flex; align-items: center; gap: var(--space-4);
  padding: var(--space-5); cursor: pointer;
  font: 400 var(--text-lg)/1.2 var(--font-heading); color: var(--color-ink);
}
.amo-checkout-payment-radio{ position: absolute; opacity: 0; width: 1px; height: 1px; }
.amo-checkout-payment-dot{
  width: 20px; height: 20px; border-radius: var(--radius-pill); flex: none;
  box-shadow: inset 0 0 0 2px var(--color-border-stronger); background: transparent;
}
.amo-checkout-payment-card.is-active .amo-checkout-payment-dot{ box-shadow: none; background: var(--color-accent); }
.amo-checkout-payment-title{ flex: 1; }
.amo-checkout-payment-box{ padding: 0 var(--space-4) var(--space-4) var(--space-4); }

.amo-checkout-terms{ margin: var(--space-4) 0; font-size: var(--text-sm); color: var(--color-ink-softer); }
.amo-checkout-terms label{ display: flex; align-items: flex-start; gap: var(--space-3); }
.amo-checkout-terms input[type="checkbox"]{ width: 24px; height: 24px; flex: 0 0 24px; margin: 0; accent-color: var(--color-accent); }
.amo-checkout-optin{
  display: flex; align-items: flex-start; gap: var(--space-2); margin: var(--space-6) 0 0; max-width: 640px;
  font-size: var(--text-sm); color: var(--color-ink-softer); cursor: pointer;
}
.amo-checkout-optin input{ width: 18px; height: 18px; margin-top: 2px; accent-color: var(--color-accent); }

.amo-field-hidden{ display: none !important; }

/* Sidebar order summary — reuses the cart flyout's own component classes
   (.amo-cart-head/-body/-foot, .amo-mini-cart-item-*, .amo-cart-row/-total,
   .amo-cart-coupon*, .amo-cart-eta) since this design deliberately shares
   that same component shape. #order_review is the part
   WC_AJAX::update_order_review() replaces on delivery-mode toggle — same
   "needs to be a flex container itself" requirement already learned from
   the cart flyout's .amo-cart-flyout-content fix (v2/v3 CHANGELOG), so it
   gets the identical treatment here. */
.amo-checkout-summary{
  position: sticky; top: 0;
  background: var(--color-white-warm);
  border-left: 2px solid var(--color-border-strong);
  min-height: 100vh;
  display: flex; flex-direction: column;
}
.amo-checkout-summary .amo-cart-head{ border-bottom: 1px solid var(--color-border-strong); }
.amo-checkout-summary-edit{ margin-left: auto; font-size: var(--text-sm); }
#order_review{ flex: 1; min-height: 0; display: flex; flex-direction: column; }
#order_review .amo-cart-body{ flex: 1; min-height: 0; overflow-y: auto; padding: var(--space-1) var(--space-6); }
/* .amo-thankyou-items: same item-row look, reused on the order-confirmation
   page (woocommerce/checkout/thankyou.php) outside of #order_review. */
#order_review .amo-mini-cart-item,
.amo-thankyou-items .amo-mini-cart-item{ display: flex; gap: var(--space-3); align-items: flex-start; padding: var(--space-4) 0; border-bottom: 1px solid var(--color-border-soft); }
#order_review .amo-mini-cart-item-qty{ margin-left: var(--space-1); }
#order_review .amo-cart-coupon{ padding: var(--space-4) 0 var(--space-1); }
#order_review .amo-cart-foot{ padding: var(--space-5) var(--space-6) var(--space-6); border-top: 2px solid var(--color-border-strong); background: var(--color-cream); }
#order_review #place_order{ display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); margin-top: var(--space-2); }
#order_review .amo-place-order-total{ margin-left: auto; white-space: nowrap; }

@media (max-width: 1023px){
  /*
   * The grid no longer bleeds past .amo-container's own padding at this
   * width (margin:0, below), so .amo-checkout-main's independent
   * container-pad would otherwise stack on top of .amo-container's —
   * zeroed here rather than doubled.
   */
  .amo-checkout-grid{ grid-template-columns: 1fr; margin: 0; }
  .amo-checkout-main{ max-width: none; padding-left: 0; padding-right: 0; }
  .amo-checkout-summary{ position: static; min-height: 0; border-left: 0; border-top: 2px solid var(--color-border-strong); }
  #order_review .amo-cart-body{ overflow-y: visible; }
}
@media (max-width: 599px){
  .amo-checkout-fieldset, .amo-checkout-fieldset--addr{ grid-template-columns: 1fr; }
  .amo-checkout-steps{ flex-wrap: wrap; row-gap: var(--space-2); }
}

/* my account */
.amo-account-page{ padding: var(--space-9) 0 var(--space-12); }
.woocommerce-MyAccount-navigation ul{ list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: var(--space-1); }
.woocommerce-MyAccount-navigation a{
  display: block; padding: var(--space-3) var(--space-4);
  color: var(--color-ink); border-left: 3px solid transparent;
}
.woocommerce-MyAccount-navigation li.is-active a{ color: var(--color-accent); border-left-color: var(--color-accent); background: var(--color-accent-tint-2); }
.woocommerce-MyAccount-content{ background: var(--color-white-warm); border: 2px solid var(--color-border-soft); padding: var(--space-7); }
.woocommerce-account .amo-account-grid{ display: grid; grid-template-columns: 220px 1fr; gap: var(--space-9); }
@media (max-width: 1023px){ .woocommerce-account .amo-account-grid{ grid-template-columns: 1fr; } }

/* mini-cart (flyout drawer contents, see footer.php + woocommerce/cart/mini-cart.php)
   Full custom rebuild 2026-09-07 — Livrare/Ridicare toggle, quantity
   stepper, coupon field. .amo-cart-foot/.amo-cart-row/.amo-cart-total (the
   totals block) and .amo-qty (the stepper) are shared components already
   defined earlier in this file / components.css, reused here rather than
   redeclared. */
.woocommerce-mini-cart{ list-style: none; margin: 0; padding: 0; }

.amo-cart-mode{ padding: var(--space-4) 0; border-bottom: 1px solid var(--color-border-strong); }
/* Segmented control fills the full width here (unlike category pills /
   the size toggle, which share the same .amo-seg/.amo-seg-btn base classes
   but stay auto-width) — scoped to .amo-cart-mode so those other uses of
   the shared component are untouched. Matches the design canvas exactly:
   two equal-width pill buttons filling the toggle row. */
.amo-cart-mode .amo-seg{ width: 100%; }
.amo-cart-mode .amo-seg-btn{ flex: 1; text-align: center; }
.amo-cart-mode-panel{ margin-top: var(--space-3); }
.amo-cart-mode-panel[hidden]{ display: none; }
.amo-cart-pickup-address{ margin: 0; font-size: var(--text-base); color: var(--color-ink); }
.amo-cart-mode-note{ margin: var(--space-2) 0 0; font-size: var(--text-sm); color: var(--color-ink-softer); }

/* Cart line items — no product photo (owner decision 2026-09-07: removed
   entirely, not just hidden, after it rendered at inconsistent sizes and
   broke row height). Row structure matches the design canvas 1:1: name,
   then unit price + size, then a qty-stepper + "Scoate" row, with the
   line total (qty × unit price) right-aligned against the whole row. */
.woocommerce-mini-cart-item{
  display: flex; align-items: flex-start; gap: var(--space-3);
  padding: var(--space-4) 0; border-bottom: 1px solid var(--color-border-soft);
}
.amo-mini-cart-item-body{ flex: 1; min-width: 0; }
.amo-mini-cart-item-name{ display: block; color: var(--color-ink); font-size: var(--text-lg); text-decoration: none; }
a.amo-mini-cart-item-name:hover{ color: var(--color-accent); }
.amo-mini-cart-item-meta{ font-size: var(--text-sm); color: var(--color-ink-softer); margin-top: 0; }
.amo-mini-cart-item-size{ margin-left: var(--space-1); }
.amo-mini-cart-item-actions{ display: flex; align-items: center; gap: var(--space-3); margin-top: var(--space-2); }
.amo-mini-cart-item-actions .amo-qty{ flex: none; }
.amo-mini-cart-item-actions .remove{
  flex: none; background: transparent; border: 0; cursor: pointer; padding: 0;
  color: var(--color-ink-faint); font-size: var(--text-sm); text-decoration: underline;
}
.amo-mini-cart-item-actions .remove:hover{ color: var(--color-danger); }
.amo-mini-cart-item-linetotal{ flex: none; font-size: var(--text-lg); color: var(--color-accent); white-space: nowrap; }

.amo-cart-coupon{ padding: var(--space-4) 0; border-bottom: 1px solid var(--color-border-strong); }
.amo-cart-coupon-form{ display: flex; gap: var(--space-2); }
.amo-cart-coupon-form .amo-in{ min-width: 0; }
.amo-cart-coupon-applied{ display: flex; flex-wrap: wrap; gap: var(--space-2); }
.amo-cart-coupon-applied .amo-pill{ gap: var(--space-2); }
.amo-cart-coupon-applied button{
  background: transparent; border: 0; cursor: pointer; color: inherit;
  font-size: var(--text-sm); line-height: 1; padding: 0;
}
.amo-cart-coupon-message{ margin: var(--space-2) 0 0; font-size: var(--text-sm); color: var(--color-danger); }
.amo-cart-coupon-message[hidden]{ display: none; }
.amo-cart-coupon-message.is-success{ color: var(--color-success); }

.amo-cart-eta{ margin: var(--space-2) 0 0; font-size: 13.5px; color: var(--color-ink-faint); }

/* notices */
.woocommerce-error, .woocommerce-message, .woocommerce-info{
  list-style: none; padding: var(--space-4) var(--space-5); margin: 0 0 var(--space-6);
  border-left: 4px solid var(--color-accent); background: var(--color-white-warm);
}
.woocommerce-error{ border-left-color: var(--color-danger); }


/* D2 desktop visual match: amo club card beside notes, two payment tiles,
   and a compact order card. Deliberately desktop-only; mobile keeps its existing layout. */
@media (min-width: 1024px){
  .amo-checkout-main:has(> label.amo-checkout-optin){
    display:grid;
    grid-template-columns:minmax(0,1.35fr) minmax(250px,.9fr);
    column-gap:20px;
  }
  .amo-checkout-main:has(> label.amo-checkout-optin) > *{grid-column:1 / -1;}
  .amo-checkout-main > h2:has(+ .amo-checkout-fieldset textarea#order_comments){grid-column:1;}
  .amo-checkout-main > .amo-checkout-fieldset:has(textarea#order_comments){grid-column:1;max-width:none;margin-bottom:0;}
  .amo-checkout-main > label.amo-checkout-optin{
    grid-column:2;align-self:stretch;max-width:none;margin:0;padding:18px 18px 18px 42px;
    position:relative;box-sizing:border-box;border-radius:12px;background:#493026;color:#fffaf0;
    font-size:14px;line-height:1.45;
  }
  .amo-checkout-main > label.amo-checkout-optin input{
    position:absolute;left:16px;top:19px;width:19px;height:19px;margin:0;accent-color:#ef5a3c;
  }
  .amo-checkout-main > label.amo-checkout-optin .amo-p37-optin-desk{display:none!important;}
  .amo-checkout-main > label.amo-checkout-optin .amo-p37-optin-m{display:block!important;color:#fffaf0;}
  .amo-checkout-main > label.amo-checkout-optin .amo-p37-optin-m b{display:block;margin:0 0 9px;font:600 16px/1.25 var(--font-heading);}
  .amo-checkout-main > label.amo-checkout-optin .amo-p37-optin-m em{color:#ffb38f;font-style:normal;}
  .amo-checkout-main > label.amo-checkout-optin .amo-p37-optin-m > span,
  .amo-checkout-main > label.amo-checkout-optin .amo-p37-optin-m small{display:block;color:#f4e8dd;font-size:12px;line-height:1.4;}
  .amo-checkout-main > label.amo-checkout-optin .amo-p37-optin-m small{margin-top:7px;}

  .amo-checkout-payments{grid-template-columns:repeat(2,minmax(0,1fr));max-width:640px;gap:12px;}
  .amo-checkout-payment-card{border-radius:12px;overflow:hidden;}
  .amo-checkout-payment-label{min-height:70px;padding:14px 16px;font-size:15px;}

  .amo-checkout-summary{
    position:sticky;top:20px;align-self:start;min-height:0;height:auto;
    margin:24px 24px 24px 0;border:1px solid var(--color-border-strong);
    border-radius:14px;overflow:hidden;box-shadow:0 8px 24px rgba(55,38,28,.08);
  }
  #order_review{display:block;flex:initial;min-height:0;}
  #order_review .amo-cart-body{overflow:visible;}
}


/* D2 desktop product thumbnails inside the order summary. */
@media (min-width:1024px){
  #order_review .amo-mini-cart-item{align-items:center;}
  #order_review .amo-mini-cart-item-thumb{width:40px;height:40px;flex:0 0 40px;overflow:hidden;border-radius:8px;background:var(--color-white-warm);}
  #order_review .amo-mini-cart-item-thumb img{display:block;width:100%;height:100%;object-fit:cover;}
}

@media (max-width:1023px){#order_review .amo-mini-cart-item-thumb{display:none!important;}}

/* D2 desktop: keep the coupon field only in the order card, where the mockup places it. */
@media (min-width: 1024px){ .woocommerce-form-coupon-toggle{ display:none !important; } }
