/* Symmetric product containers, with no reserved gutter or clipped page overflow. */
.featured > .wrap, .new-arrivals > .wrap, .catalog.wrap { width:100%; max-width:1200px; margin:0 auto; box-sizing:border-box; padding-left:24px; padding-right:24px; }
.grid, .slide { min-width:0; }
.slide { padding-left:0; padding-right:0; }
html:not(.checkout-page) #checkout { display:none; }
.checkout-page body > section:not(#checkout), .checkout-page .shop-toolbar, .checkout-page .strip { display:none; }
.checkout-page .checkout { min-height:65vh; }
.checkout-page #checkout > .wrap { width:100%; margin:0 auto; box-sizing:border-box; }
.checkout-item { display:grid; grid-template-columns:64px minmax(0,1fr); gap:12px; padding:16px 0; border-bottom:1px solid var(--line); font-size:14px; }
.checkout-item > img, .checkout-item-placeholder { width:64px; height:64px; object-fit:contain; background:var(--ivory-card); }
.checkout-item > strong { grid-column:2; }
.checkout-item p { margin:6px 0; }
.checkout-item .qty-row { display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.checkout-item button { min-width:36px; min-height:40px; padding:4px 8px; background:var(--ivory); color:var(--green-deep); border:1px solid var(--line); border-radius:4px; font:inherit; }
.drawer-delivery { font-size:13px; padding:8px 0 14px; }
.drawer-delivery p { margin:4px 0; }
.checkout-sticky { display:none; }
.cart-is-empty .checkout-form, .cart-is-empty .checkout-sticky, .cart-is-empty #couponForm, .cart-is-empty .checkout-subtotal { display:none; }
.empty-note a, .drawer-empty a { display:inline-block; margin:16px 0; padding:12px 20px; background:var(--green-deep); color:var(--ivory); border-radius:4px; }
.product-gallery { min-width:0; width:100%; margin:16px 0; }
.gallery-track { display:flex; width:100%; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; border:1px solid var(--line); background:var(--ivory-card); }
.gallery-track::-webkit-scrollbar { display:none; }
.gallery-slide { flex:0 0 100%; width:100%; min-width:0; aspect-ratio:1; scroll-snap-align:start; padding:0; border:0; background:transparent; cursor:zoom-in; }
.gallery-slide img { display:block; width:100%; height:100%; object-fit:contain; }
.gallery-dots { display:flex; justify-content:center; }
.gallery-dots button { width:32px; height:32px; padding:0; border:0; background:transparent; display:grid; place-items:center; }
.gallery-dots button::after { content:''; width:7px; height:7px; border-radius:50%; background:var(--line); }
.gallery-dots button[aria-pressed=true]::after { background:var(--gold); }
.gallery-thumbnails { display:flex; justify-content:center; gap:8px; flex-wrap:wrap; }
.gallery-thumbnails button { border:2px solid transparent; background:var(--ivory-card); padding:2px; border-radius:4px; }
.gallery-thumbnails button[aria-pressed=true] { border-color:var(--gold); }
.gallery-thumbnails img { display:block; width:44px; height:44px; object-fit:contain; }
.gallery-hint { text-align:center; font-size:12px; color:var(--green-mid); }
.image-zoom { position:fixed; inset:0; width:100vw; max-width:100vw; height:100dvh; max-height:100dvh; margin:0; padding:0; border:0; background:var(--ivory,#f8f5ed); color:var(--green-deep,#173b27); overflow:hidden; }
.image-zoom::backdrop { background:rgba(15,35,22,.9); }
.zoom-tools { position:absolute; top:max(12px,env(safe-area-inset-top)); right:12px; display:flex; gap:8px; z-index:2; }
.zoom-tools button { min-width:44px; min-height:44px; padding:8px 14px; font:inherit; border:1px solid var(--gold); border-radius:4px; color:inherit; background:var(--ivory); }
.zoom-surface { width:100%; height:100%; display:grid; place-items:center; touch-action:none; overflow:hidden; }
.zoom-surface img { width:100%; height:85%; object-fit:contain; user-select:none; }
.image-zoom > p { position:absolute; bottom:12px; width:100%; text-align:center; pointer-events:none; font-size:13px; }
.cart-toast { position:fixed; z-index:150; top:12px; left:50%; transform:translateX(-50%); width:min(400px,calc(100vw - 24px)); padding:14px; border:1px solid var(--gold); border-radius:8px; box-shadow:0 8px 24px #14392130; background:var(--ivory); color:var(--green-deep); font-size:14px; text-align:center; box-sizing:border-box; }
.cart-toast > div { display:flex; justify-content:center; gap:8px; margin-top:8px; }
.cart-toast button { min-height:40px; padding:8px 12px; border:1px solid var(--green-deep); color:var(--green-deep); background:var(--ivory); border-radius:4px; font:inherit; }
.cart-toast button:first-child { background:var(--green-deep); color:var(--ivory); }
.add-btn.added { background:var(--green-deep); color:var(--ivory); opacity:1; }
.cart-bounce { animation:cart-bounce .35s ease; }
@keyframes cart-bounce { 50% { transform:scale(1.35); } }
@media(max-width:520px) {
  .featured > .wrap, .new-arrivals > .wrap, .catalog.wrap { padding-left:12px; padding-right:12px; }
  .grid, .slide, .compact-showcase .grid, .compact-showcase .slide { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
  .grid.product-detail-grid { display:block; }
  /* Vertical room prevents the unchanged WhatsApp control from covering the last row. */
  .catalog, .featured { padding-bottom:84px; }
  .checkout-page body { padding-bottom:110px; }
  .checkout-sticky { display:flex; position:fixed; z-index:45; bottom:0; left:0; right:0; gap:10px; align-items:center; background:var(--ivory); border-top:1px solid var(--gold); padding:12px 78px max(12px,env(safe-area-inset-bottom)) 12px; }
  .checkout-sticky > div { flex:1; font-size:13px; }
  .checkout-sticky strong, .checkout-sticky small { display:block; white-space:nowrap; }
  .checkout-sticky .submit-btn { width:auto; min-width:116px; padding:12px; font-size:14px; }
  .checkout-page .checkout .submit-row > .submit-btn { display:none; }
}
@media(prefers-reduced-motion:reduce) { .cart-bounce { animation:none; } }

.cart-toast { overflow-wrap:anywhere; }
.checkout [aria-invalid=true] { border:2px solid var(--clay); }

/* Product sheet: price, quantity and Add to cart stay visible at the bottom while the details scroll. */
.product-sheet { max-width:none; }
.sheet-order { position:sticky; bottom:0; z-index:2; margin:12px -22px 0; padding:8px 22px max(10px,env(safe-area-inset-bottom)); background:var(--ivory); border-top:1px solid var(--line); }
.sheet-order .card-foot { gap:8px; }
.sheet-quantity { justify-content:space-between; }
.sheet-status:empty { display:none; }
.sheet-status { margin:4px 0 0; font-size:13px; color:var(--green-mid); }
@media(max-width:480px) {
  /* The browser's built-in dialog max-width left a gap on the right; use the full phone width. */
  .product-sheet { max-width:none; width:100%; box-sizing:border-box; padding-bottom:0; }
  .sheet-order { margin-left:-16px; margin-right:-16px; padding-left:16px; padding-right:16px; }
  .product-sheet .product-gallery { margin:10px 0; }
  .product-sheet .gallery-slide { aspect-ratio:4/3; }
  .product-sheet .gallery-hint { display:none; }
  .product-sheet .gallery-thumbnails img { width:36px; height:36px; }
}

/* Phones: a lone last product is centred instead of hanging on the left, and slides never stretch a card to fill space. */
.slide { align-content:start; }
@media(max-width:480px) {
  .slide > .card:last-child:nth-child(odd), .grid > .card:last-child:nth-child(odd) { grid-column:1 / -1; width:calc(50% - 4px); justify-self:center; }
}

/* Out-of-stock products stay visible but cannot be bought */
.card.sold-out .card-media img { opacity:.5; filter:grayscale(.5); }
.stock-badge { position:absolute; left:8px; top:8px; background:#7a2b1d; color:#fff; font-size:12px; font-weight:600; padding:3px 8px; border-radius:3px; }
.add-btn:disabled { background:#b9b4a4; color:#fff; cursor:not-allowed; opacity:1; }
.stock-note { margin:10px 0 0; padding:10px 12px; border-left:3px solid #7a2b1d; background:rgba(122,43,29,.07); font-size:.92rem; }

/* advance payment summary + free-delivery nudge */
.advance-box{margin:10px 0 0;padding:10px 12px;border:1px solid #cfd8c4;background:#f1f5ec;border-radius:4px;font-size:.95rem}
.advance-box div{display:flex;justify-content:space-between;gap:12px;padding:3px 0}
.advance-box strong{color:#1E3324;white-space:nowrap}
.free-nudge{color:#7a4b00;font-weight:600}
.free-nudge.ok,#freeNudge.ok{color:#1E5B2E;font-weight:600}
#freeNudge:not(:empty){display:block;margin-top:4px}
