:root{--green:#087a36;--red:#d10b14;--yellow:#ffd96b;--bg:#f6f7f8;--card:#fff}
*{box-sizing:border-box} body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:#161616;padding-bottom:85px}
.topbar{height:72px;background:white;display:flex;align-items:center;gap:12px;padding:12px 16px;position:sticky;top:0;z-index:10;box-shadow:0 2px 10px #0001}
.icon-btn,.cart-icon{border:0;background:white;font-size:26px}.cart-icon{margin-left:auto;position:relative}.cart-icon span{background:var(--red);color:white;border-radius:50%;font-size:12px;padding:3px 6px;position:absolute;top:0;right:-10px}
.brand-main{font-size:24px;font-weight:900;color:var(--red);font-style:italic;line-height:22px}.brand-main span{color:var(--green)}.brand-sub{font-size:11px;color:var(--green);font-weight:700;letter-spacing:1px}
.delivery-strip{background:#eaf7ef;color:#085c2d;padding:8px 16px;font-size:13px}
main{max-width:1100px;margin:auto}
.search-wrap{display:flex;gap:10px;padding:16px}.search-wrap input{flex:1;padding:14px;border:1px solid #ddd;border-radius:14px;font-size:16px}.search-wrap button,.hero button,.request-box button{background:var(--green);color:white;border:0;border-radius:12px;padding:12px 20px;font-weight:700}
.hero{margin:0 16px 18px;padding:24px;border-radius:20px;background:linear-gradient(135deg,#fff0b8,#fff7d9);display:flex;justify-content:space-between;align-items:center;box-shadow:0 6px 20px #0001}.hero .tag{display:inline-block;background:var(--red);color:white;padding:8px 12px;font-weight:900}.hero h1{margin:8px 0;font-size:26px}.hero h2{color:var(--red);font-size:22px}.hero-visual{font-size:80px}
.quick-cats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:0 16px 18px}.cat-btn{border:0;background:white;border-radius:18px;padding:16px 8px;box-shadow:0 4px 14px #0001;font-weight:700}
.section-title{display:flex;align-items:center;justify-content:space-between;padding:0 16px}.section-title select{padding:9px;border-radius:10px;border:1px solid #ddd}
.product-row{display:flex;overflow:auto;gap:12px;padding:0 16px 18px}.product-card{background:white;border-radius:18px;padding:14px;min-width:170px;box-shadow:0 4px 16px #0001;position:relative}.product-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px;padding:0 16px 18px}.emoji{font-size:54px;text-align:center;background:#f6f6f6;border-radius:14px;padding:14px}.name{font-weight:800;min-height:42px}.sub{font-size:12px;color:#666}.price{color:var(--red);font-weight:900;font-size:18px}.old{text-decoration:line-through;color:#777;font-size:13px;margin-left:4px}.add{float:right;background:var(--green);color:white;border:0;border-radius:9px;padding:8px 10px;font-weight:900}.badge{position:absolute;top:10px;left:10px;background:#e8f7ee;color:var(--green);padding:4px 8px;border-radius:10px;font-size:11px;font-weight:800}.out{opacity:.45}.out .add{background:#777}
.promo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:0 16px 22px}.promo{border-radius:18px;padding:18px;background:white;box-shadow:0 4px 16px #0001}.food{background:#fff0d9}.grocery{background:#eaf7ef}.offer{background:#ffe7e8}
.rewards,.request-box{margin:16px;padding:18px;border-radius:18px;background:white;box-shadow:0 4px 16px #0001}.rewards{background:linear-gradient(135deg,#047432,#0a4d25);color:white}.reward-list{display:flex;gap:10px;overflow:auto}.reward-list span{background:#ffffff22;border-radius:12px;padding:10px;white-space:nowrap}.request-box input{width:100%;padding:12px;border:1px solid #ddd;border-radius:10px;margin-bottom:8px}
.cart-drawer{position:fixed;right:-430px;top:0;width:410px;max-width:100%;height:100vh;background:white;z-index:50;box-shadow:-6px 0 24px #0002;transition:.3s;overflow:auto;padding-bottom:30px}.cart-drawer.open{right:0}.cart-header{display:flex;justify-content:space-between;align-items:center;padding:15px;border-bottom:1px solid #eee}.cart-header button{border:0;background:white;font-size:24px}.cart-item{display:grid;grid-template-columns:52px 1fr auto;gap:8px;align-items:center;padding:12px;border-bottom:1px solid #eee}.qty button{padding:4px 8px}.summary,.checkout{padding:15px}.checkout input,.checkout textarea,.checkout select{width:100%;padding:12px;border:1px solid #ddd;border-radius:10px;margin:6px 0}.delivery-msg{background:#eaf7ef;border-radius:10px;padding:10px;margin:8px 0;color:#085c2d}.total{font-size:22px;color:var(--red)}.whatsapp-btn{width:100%;background:#0b8f3d;color:white;border:0;border-radius:14px;padding:15px;font-size:17px;font-weight:900}
.bottom-nav{position:fixed;bottom:0;left:0;right:0;background:white;display:flex;justify-content:space-around;padding:8px 0;box-shadow:0 -2px 10px #0001;z-index:20}.bottom-nav button{border:0;background:white;font-size:13px;color:#111}
@media(max-width:700px){.quick-cats{grid-template-columns:repeat(3,1fr)}.promo-grid{grid-template-columns:1fr}.hero-visual{font-size:56px}.hero h2{font-size:18px}.brand-main{font-size:20px}.cart-drawer{width:100%}}


/* V2 updates: visible quantity on product card */
.product-card.selected{
  border:2px solid var(--green);
  box-shadow:0 6px 20px rgba(8,122,54,.22);
}
.added-pill{
  position:absolute;
  top:10px;
  right:10px;
  background:var(--green);
  color:white;
  border-radius:999px;
  padding:4px 9px;
  font-size:11px;
  font-weight:900;
}
.inline-qty{
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:#eaf7ef;
  border:1px solid #c6ecd3;
  border-radius:12px;
  padding:6px;
  margin-top:10px;
}
.inline-qty button{
  width:34px;
  height:32px;
  border:0;
  border-radius:9px;
  background:var(--green);
  color:white;
  font-size:20px;
  font-weight:900;
}
.inline-qty b{
  font-size:18px;
  color:var(--green);
}
.price-line{
  margin-top:8px;
}
.toast{
  position:fixed;
  left:50%;
  bottom:90px;
  transform:translateX(-50%) translateY(20px);
  background:#111;
  color:white;
  padding:12px 18px;
  border-radius:999px;
  opacity:0;
  pointer-events:none;
  transition:.25s;
  z-index:100;
  font-weight:700;
  max-width:90%;
  text-align:center;
}
.toast.show{
  opacity:1;
  transform:translateX(-50%) translateY(0);
}


/* V4 product images and descriptions */
.product-img{
  width:100%;
  height:130px;
  object-fit:cover;
  border-radius:14px;
  background:#f6f6f6;
  display:block;
  margin-bottom:10px;
}
.product-card .sub{
  min-height:42px;
  line-height:1.25;
}
.pack{
  font-size:11px;
  color:#777;
  margin-top:4px;
}
.product-row .product-card{min-width:190px}


/* V5 clearer product catalog images */
.product-img{
  height:165px;
  object-fit:contain;
  background:#fff;
  border:1px solid #eee;
}
.product-card{
  overflow:hidden;
}


/* V6 requested items in cart */
.mini-img{
  width:52px;
  height:52px;
  object-fit:cover;
  border-radius:10px;
  border:1px solid #eee;
}
.requested-item{
  background:#fff8e1;
}
.request-icon{
  width:52px;
  height:52px;
  border-radius:10px;
  background:#ffd96b;
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  font-size:28px;
  color:#7a4a00;
}
.remove-request{
  border:0;
  background:#d10b14;
  color:white;
  border-radius:8px;
  padding:7px 9px;
  font-weight:800;
}


/* V7 working links / offers */
.promo{
  cursor:pointer;
  transition:.18s;
}
.promo:active{
  transform:scale(.98);
}
.offers-section{
  margin:16px;
  padding:18px;
  border-radius:18px;
  background:#fff;
  box-shadow:0 4px 16px #0001;
}
.offer-card{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  background:#fff8e1;
  border:1px solid #ffe2a0;
  border-radius:16px;
  padding:14px;
  margin:10px 0;
}
.offer-card p{
  margin:5px 0 0;
  color:#555;
  font-size:14px;
}
.offer-card button{
  border:0;
  background:var(--green);
  color:#fff;
  border-radius:10px;
  padding:10px 12px;
  font-weight:900;
  white-space:nowrap;
}
.quick-menu{
  position:fixed;
  top:74px;
  left:12px;
  right:12px;
  background:white;
  z-index:80;
  border-radius:18px;
  padding:12px;
  box-shadow:0 8px 30px #0003;
  display:grid;
  gap:8px;
}
.quick-menu button{
  border:0;
  background:#f6f7f8;
  border-radius:12px;
  padding:14px;
  text-align:left;
  font-weight:900;
}
.menu-category-title{
  padding:4px 6px 0;
  font-size:13px;
  font-weight:900;
  color:#087a36;
}
.menu-category-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(120px,1fr));
  gap:8px;
}
.quick-menu .menu-category{
  padding:11px 12px;
  background:#eef8f1;
  color:#075b2d;
  font-size:14px;
}
.quick-menu .contact-menu-btn,
.request-box .contact-btn{
  background:#075b2d;
  color:white;
}
.request-box .contact-btn{
  margin-left:8px;
}
@media(max-width:700px){
  .request-box button{
    width:100%;
    margin:0 0 8px;
  }
  .request-box .contact-btn{
    margin-left:0;
  }
}
@media(max-width:700px){
  .offer-card{
    align-items:flex-start;
    flex-direction:column;
  }
  .offer-card button{
    width:100%;
  }
}


/* V8 requested item add confirmation */
.request-added-msg{
  display:none;
  background:#eaf7ef;
  color:#085c2d;
  border:1px solid #bfe8ce;
  border-radius:12px;
  padding:12px;
  margin-top:10px;
  line-height:1.35;
}
.request-added-msg.show{
  display:block;
}


/* V9 smart search */
.search-group{
  grid-column:1/-1;
  background:#fff;
  border-radius:16px;
  padding:14px;
  box-shadow:0 3px 12px #0001;
}
.search-group h3{
  margin:0 0 4px;
  color:#087a36;
}
.search-group p{
  margin:0;
  color:#666;
}
.no-results{
  grid-column:1/-1;
  background:#fff8e1;
  border-radius:16px;
  padding:18px;
}
.no-results button{
  border:0;
  background:var(--green);
  color:white;
  border-radius:12px;
  padding:12px 14px;
  font-weight:900;
}


/* V10 search directly under search bar + real product offers */
.search-results-top{
  display:none;
  margin:0 16px 16px;
  background:white;
  border-radius:18px;
  box-shadow:0 6px 24px #0002;
  overflow:hidden;
}
.search-results-top.show{display:block}
.search-results-top h3{
  margin:0;
  padding:12px 14px 6px;
  color:#087a36;
  font-size:16px;
}
.search-result-row{
  display:grid;
  grid-template-columns:58px 1fr auto;
  gap:10px;
  align-items:center;
  padding:10px 14px;
  border-top:1px solid #eee;
}
.search-result-row img{
  width:58px;
  height:58px;
  border-radius:12px;
  object-fit:cover;
  border:1px solid #eee;
}
.search-result-row button,
.top-no-result button{
  border:0;
  background:var(--green);
  color:white;
  border-radius:10px;
  padding:9px 12px;
  font-weight:900;
}
.search-result-row span{color:#d10b14;font-weight:900}
.mini-qty{display:flex;align-items:center;gap:7px;background:#eaf7ef;border-radius:10px;padding:5px}
.mini-qty button{width:28px;height:28px;padding:0}
.top-no-result{padding:14px}
.top-no-result p{color:#666;margin:6px 0 10px}
.offer-note{color:#666;margin-top:-8px}
.special-offers-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:14px;
}
.offer-product-card{
  display:grid;
  grid-template-columns:95px 1fr;
  gap:12px;
  background:#fff8e1;
  border:1px solid #ffe0a3;
  border-radius:16px;
  padding:12px;
}
.offer-product-card img{
  width:95px;
  height:95px;
  object-fit:cover;
  border-radius:14px;
  background:#fff;
}
.offer-product-card p{margin:5px 0;color:#555;font-size:13px}
.was{text-decoration:line-through;color:#777;font-weight:800}
.now{color:#d10b14;font-size:20px;font-weight:900;margin-left:6px}
.offer-product-card button{
  margin-top:8px;
  border:0;
  background:var(--green);
  color:white;
  border-radius:10px;
  padding:9px 12px;
  font-weight:900;
}


/* V11 direct search request add */
.top-no-result.success{
  background:#eaf7ef;
  color:#085c2d;
  border:1px solid #bfe8ce;
}


/* V12 500x500 PNG product images */
.product-img{
  height:170px;
  object-fit:contain;
  background:#fff;
  border:1px solid #eee;
}
.search-result-row img,
.offer-product-card img,
.mini-img{
  object-fit:contain;
  background:#fff;
}


/* V13 product detail page */
.clickable{
  cursor:pointer;
}
.product-card .name.clickable:hover{
  color:var(--green);
}
.product-modal{
  display:none;
  position:fixed;
  inset:0;
  background:rgba(0,0,0,.45);
  z-index:150;
  overflow:auto;
}
.product-modal.show{
  display:block;
}
.product-detail{
  background:#fff;
  max-width:760px;
  min-height:100vh;
  margin:0 auto;
  padding:16px;
}
.detail-header{
  display:flex;
  justify-content:space-between;
  position:sticky;
  top:0;
  background:#fff;
  padding:8px 0;
  z-index:2;
  border-bottom:1px solid #eee;
}
.detail-header button{
  border:0;
  background:#f3f3f3;
  border-radius:10px;
  padding:10px 14px;
  font-weight:900;
}
.detail-img{
  width:100%;
  max-height:420px;
  object-fit:contain;
  background:#fff;
  border-radius:20px;
  border:1px solid #eee;
  margin-top:12px;
}
.detail-badge{
  display:inline-block;
  margin-top:12px;
  background:#d10b14;
  color:#fff;
  border-radius:999px;
  padding:7px 12px;
  font-weight:900;
}
.product-detail h1{
  margin:12px 0 6px;
  font-size:26px;
}
.detail-category{
  color:#666;
  margin:0 0 8px;
}
.detail-price{
  display:flex;
  align-items:center;
  gap:12px;
  margin:10px 0;
}
.detail-price span{
  color:#d10b14;
  font-size:32px;
  font-weight:900;
}
.detail-old{
  text-decoration:line-through;
  color:#777 !important;
  font-size:22px !important;
}
.detail-stock{
  font-weight:900;
}
.detail-desc{
  background:#f6f7f8;
  padding:14px;
  border-radius:14px;
  line-height:1.4;
}
.detail-actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin:14px 0;
}
.detail-add,.detail-cart,.disabled-detail{
  border:0;
  border-radius:14px;
  padding:14px;
  font-weight:900;
  font-size:16px;
}
.detail-add{
  background:var(--green);
  color:#fff;
}
.detail-cart{
  background:#111;
  color:#fff;
}
.disabled-detail{
  background:#777;
  color:#fff;
}
.detail-qty{
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:#eaf7ef;
  border-radius:14px;
  padding:8px;
}
.detail-qty button{
  width:42px;
  height:42px;
  border:0;
  border-radius:12px;
  background:var(--green);
  color:#fff;
  font-size:24px;
  font-weight:900;
}
.detail-qty b{
  font-size:22px;
  color:var(--green);
}
.detail-related{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(135px,1fr));
  gap:12px;
}
.related-card{
  background:#f8f8f8;
  border-radius:14px;
  padding:10px;
  display:flex;
  flex-direction:column;
  gap:6px;
}
.related-card img{
  width:100%;
  height:100px;
  object-fit:contain;
  background:#fff;
  border-radius:10px;
}
.related-card b{
  font-size:13px;
  cursor:pointer;
}
.related-card span{
  color:#d10b14;
  font-weight:900;
}
.related-card button{
  border:0;
  background:var(--green);
  color:#fff;
  border-radius:9px;
  padding:8px;
  font-weight:900;
}
@media(max-width:700px){
  .product-detail{
    min-height:100vh;
  }
  .detail-actions{
    grid-template-columns:1fr;
  }
  .detail-related{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }
  .related-card img{
    height:92px;
  }
  .related-card b{
    min-height:34px;
  }
}


/* V14 related item interaction fixes */
.related-card{
  position:relative;
}
.selected-related{
  border:2px solid var(--green);
  background:#eaf7ef;
}
.related-added{
  position:absolute;
  top:6px;
  right:6px;
  background:var(--green);
  color:#fff;
  border-radius:999px;
  padding:3px 8px;
  font-size:11px;
  font-weight:900;
}
.related-qty{
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:#dff3e6;
  border-radius:10px;
  padding:5px;
}
.related-qty button{
  width:28px;
  height:28px;
  border:0;
  border-radius:8px;
  background:var(--green);
  color:#fff;
  font-weight:900;
  font-size:18px;
}
.related-qty b{
  color:var(--green);
  font-size:16px;
}


/* V17 claim rewards in cart */
.cart-rewards-box{
  margin-top:12px;
  background:#f7fff9;
  border:1px solid #c9ebd2;
  border-radius:14px;
  padding:12px;
}
.reward-balance{
  background:#eaf7ef;
  border-radius:12px;
  padding:10px;
  line-height:1.5;
  color:#085c2d;
}
.cart-rewards-box h4{
  margin:12px 0 8px;
}
.reward-option,
.claimed-reward{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  background:#fff;
  border:1px solid #e5e5e5;
  border-radius:12px;
  padding:10px;
  margin:8px 0;
}
.reward-option button,
.claimed-reward button{
  border:0;
  background:var(--green);
  color:#fff;
  border-radius:10px;
  padding:8px 10px;
  font-weight:900;
}
.reward-option.locked{
  opacity:.55;
}
.reward-option.locked button{
  background:#777;
}
.reward-cart-item{
  background:#eaf7ef;
}
.reward-icon{
  width:52px;
  height:52px;
  border-radius:10px;
  background:#087a36;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:26px;
}


/* V18 product detail + reward improvements */
.detail-actions{
  grid-template-columns:1fr;
}
.detail-added-note{
  background:#eaf7ef;
  color:#085c2d;
  border-radius:14px;
  padding:12px;
  text-align:center;
  font-weight:900;
}
.reward-info{
  background:#fff8e1;
  border:1px solid #ffe0a3;
  border-radius:12px;
  padding:10px;
  color:#7a4a00;
  margin:8px 0;
}
.claimed-reward small,
.reward-option small{
  color:#666;
}


/* V22 fixed rewards visible under subtotal */
.reward-summary-card{
  margin-top:12px;
  background:#fff;
  border:1px solid #d8eadf;
  border-radius:16px;
  padding:12px;
}
.reward-summary-title{
  font-size:18px;
  font-weight:900;
  color:#087a36;
  margin-bottom:8px;
}
.reward-line{
  display:flex;
  justify-content:space-between;
  background:#eaf7ef;
  border-radius:10px;
  padding:8px;
  margin-bottom:8px;
}
.current-reward-box,
.next-reward-box{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  border-radius:12px;
  padding:10px;
  margin:8px 0;
}
.current-reward-box{
  background:#eaf7ef;
  border:1px solid #bfe8ce;
}
.current-reward-box.locked,
.next-reward-box{
  background:#fff8e1;
  border:1px solid #ffe0a3;
}
.current-reward-box button{
  border:0;
  background:var(--green);
  color:white;
  border-radius:10px;
  padding:9px 12px;
  font-weight:900;
  white-space:nowrap;
}
.current-reward-box .claimed-btn{
  background:#111;
}
.reward-progress{
  height:12px;
  background:#eee;
  border-radius:999px;
  overflow:hidden;
  margin-top:10px;
}
.reward-progress div{
  height:100%;
  background:var(--green);
}
.reward-progress-label{
  font-size:12px;
  color:#555;
  margin-top:4px;
  text-align:right;
}
.reward-ladder{
  margin-top:12px;
  background:#f8f8f8;
  border-radius:12px;
  padding:10px;
}
.reward-ladder div{
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:6px 0;
  border-bottom:1px solid #e8e8e8;
}
.reward-ladder div:last-child{
  border-bottom:0;
}
.reward-ladder .unlocked{
  color:#087a36;
  font-weight:800;
}
.reward-ladder .locked{
  color:#777;
}
.reward-cart-item{
  background:#eaf7ef;
}
.reward-icon{
  width:52px;
  height:52px;
  border-radius:10px;
  background:#087a36;
  color:white;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:26px;
}


/* V23 multiple reward claims with photos */
.reward-line.strong{
  background:#dff3e6;
  font-size:16px;
}
.reward-help{
  margin:0 0 10px;
  color:#555;
  font-size:13px;
}
.gift-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(135px,1fr));
  gap:10px;
  margin:10px 0;
}
.gift-card{
  background:#fff;
  border:1px solid #d8eadf;
  border-radius:14px;
  padding:10px;
  display:flex;
  flex-direction:column;
  gap:6px;
  text-align:center;
}
.gift-card img{
  width:100%;
  height:98px;
  object-fit:contain;
  background:#fff;
  border-radius:10px;
  border:1px solid #eee;
}
.gift-card b{
  font-size:13px;
  min-height:34px;
}
.gift-card span{
  color:#087a36;
  font-weight:900;
}
.gift-card .gift-value{
  color:#d10b14;
  font-weight:900;
  min-height:0;
}
.gift-card button{
  border:0;
  background:var(--green);
  color:#fff;
  border-radius:10px;
  padding:9px;
  font-weight:900;
}
.gift-card.locked{
  opacity:.55;
}
.gift-card.locked button{
  background:#777;
}
.claimed-gift-grid{
  display:grid;
  gap:8px;
}
.claimed-gift-card{
  display:grid;
  grid-template-columns:58px 1fr auto;
  gap:10px;
  align-items:center;
  background:#eaf7ef;
  border:1px solid #c6ecd3;
  border-radius:14px;
  padding:8px;
}
.claimed-gift-card img{
  width:58px;
  height:58px;
  object-fit:contain;
  background:#fff;
  border-radius:10px;
  border:1px solid #eee;
}
.claimed-gift-card button{
  border:0;
  background:#d10b14;
  color:#fff;
  border-radius:10px;
  padding:8px 10px;
  font-weight:900;
}
.next-reward-box img{
  width:58px;
  height:58px;
  object-fit:contain;
  background:#fff;
  border-radius:10px;
  border:1px solid #eee;
}


/* V26 payment options */
.payment-box{
  background:#f6f7f8;
  border-radius:14px;
  padding:12px;
  margin:10px 0;
}
.payment-box h4{
  margin:0 0 8px;
}
.payment-box label{
  display:block;
  background:#fff;
  border:1px solid #e5e5e5;
  border-radius:10px;
  padding:10px;
  margin:6px 0;
  font-weight:800;
}
.bank-card{
  background:#fff8e1;
  border:1px solid #ffe0a3;
  border-radius:12px;
  padding:10px;
  margin-top:8px;
  line-height:1.5;
}


/* V28 opening hours and collection point */
.collection-info-box{
  background:#eaf7ef;
  border:1px solid #bfe8ce;
  color:#085c2d;
  border-radius:14px;
  padding:12px;
  margin:10px 0;
  line-height:1.45;
}
.collection-info-box h4{
  margin:0 0 8px;
}
.collection-info-box p{
  margin:7px 0;
}


/* V29 postcode check button */
.postcode-check-wrap{
  display:grid;
  grid-template-columns:1fr auto;
  gap:8px;
  margin:6px 0;
}
.postcode-check-wrap button{
  border:0;
  background:var(--green);
  color:white;
  border-radius:10px;
  padding:0 12px;
  font-weight:900;
}
.postcode-result{
  display:none;
  border-radius:12px;
  padding:10px;
  margin:8px 0;
  line-height:1.4;
}
.postcode-result.show{
  display:block;
}
.postcode-result.ok{
  background:#eaf7ef;
  border:1px solid #bfe8ce;
  color:#085c2d;
}
.postcode-result.no{
  background:#fff8e1;
  border:1px solid #ffe0a3;
  color:#7a4a00;
}


/* V30 simple delivery no postcode */
.delivery-notice-box{
  display:none;
  background:#fff8e1;
  border:1px solid #ffe0a3;
  color:#7a4a00;
  border-radius:14px;
  padding:12px;
  margin:10px 0;
  line-height:1.45;
}


/* V31 top strip + special offer slideshow */
.category-strip{
  display:flex;
  gap:8px;
  align-items:center;
  justify-content:center;
  padding:8px 12px;
  background:#fff8e1;
  overflow:hidden;
}
.category-strip button{
  border:0;
  background:#fff;
  color:#111;
  border-radius:999px;
  padding:8px 16px;
  font-weight:900;
  box-shadow:0 2px 8px #0001;
}
.offer-hero{
  padding:0;
  min-height:160px;
  overflow:hidden;
}
.offer-slider{
  width:100%;
  position:relative;
  min-height:170px;
}
.offer-slide{
  display:none;
  align-items:center;
  gap:14px;
  padding:18px;
  min-height:170px;
}
.offer-slide.active{
  display:flex;
  animation:fadeOffer .35s ease-in;
}
.offer-slide img{
  width:115px;
  height:115px;
  object-fit:contain;
  background:#fff;
  border-radius:16px;
  border:1px solid #eee;
}
.offer-slide .tag{
  display:inline-block;
  background:#d10b14;
  color:white;
  padding:5px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  margin:0 0 5px;
}
.offer-slide h2{
  margin:4px 0;
  font-size:22px;
}
.offer-price{
  margin:6px 0 10px;
}
.offer-price .was{
  text-decoration:line-through;
  color:#777;
  font-weight:800;
}
.offer-price .now{
  color:#d10b14;
  font-size:24px;
  font-weight:900;
}
.offer-slide button{
  border:0;
  background:#087a36;
  color:#fff;
  border-radius:12px;
  padding:10px 14px;
  font-weight:900;
}
.offer-slide.banner-slide{
  padding:0;
  min-height:0;
}
.banner-slide.active{
  display:block;
}
.special-banner-link{
  display:block;
  width:100%;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
}
.special-banner-img{
  display:block;
  width:100%;
  height:clamp(155px, 24vw, 330px);
  object-fit:cover;
}
@keyframes fadeOffer{
  from{opacity:.25; transform:translateX(8px)}
  to{opacity:1; transform:translateX(0)}
}
@media(max-width:700px){
  .offer-hero{
    margin:2px 8px 14px;
    border-radius:18px;
  }
  .offer-slider{
    min-height:0;
  }
  .special-banner-img{
    height:auto;
    aspect-ratio:1080/560;
  }
  .offer-slide img{width:95px;height:95px}
  .offer-slide h2{font-size:18px}
}


/* V32 remove lower category buttons; top Restaurant/Grocery only */
.quick-cats,
.promo-grid{
  display:none !important;
}
.category-strip{
  position:sticky;
  top:72px;
  z-index:9;
}
.category-strip button{
  min-width:135px;
}


/* V33 delivery address required */
.delivery-only-field{
  display:none;
}

.language-select{
  margin-left:auto;
  max-width:112px;
  height:38px;
  border:1px solid #f0dfc6;
  border-radius:12px;
  background:#fffdf8;
  color:#064f28;
  font-size:12px;
  font-weight:900;
  padding:0 6px;
  box-shadow:0 4px 14px rgba(0,0,0,.06);
}
.language-select + .cart-icon{
  margin-left:0;
}


/* Netlify image fallback */
.img-fallback{
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:#0b7a3b;
  font-weight:900;
  line-height:1.15;
  padding:10px;
  background:
    linear-gradient(135deg,rgba(255,209,92,.28),rgba(11,122,59,.08)),
    #fffdf8 !important;
  border:1px solid #f0dfc6 !important;
  overflow:hidden;
}
.img-fallback span{
  display:block;
  max-width:100%;
  font-size:12px;
}
.detail-img.img-fallback{
  min-height:260px;
  font-size:18px;
}
.offer-slide .img-fallback,
.offer-product-card .img-fallback,
.search-result-row .img-fallback,
.related-card .img-fallback,
.mini-img.img-fallback,
.gift-card .img-fallback,
.claimed-gift-card .img-fallback,
.next-reward-box .img-fallback{
  flex-shrink:0;
}


/* V40 mobile outlook polish */
:root{
  --green:#0b7a3b;
  --green-dark:#064f28;
  --red:#d4141d;
  --gold:#ffd15c;
  --ink:#141414;
  --muted:#6b6b6b;
  --line:#ece7df;
  --bg:#f8f4ec;
  --card:#fffdf8;
}
body{
  background:
    linear-gradient(180deg,#fff9ef 0,#f8f4ec 260px,#f6f7f8 100%);
  color:var(--ink);
}
.topbar{
  height:76px;
  background:linear-gradient(135deg,#fffdf8,#fff3dc);
  border-bottom:1px solid #f0dfc6;
  box-shadow:0 8px 24px rgba(60,35,10,.08);
}
.icon-btn,
.cart-icon{
  min-width:38px;
  height:36px;
  padding:0 8px;
  border-radius:10px;
  background:#fff;
  box-shadow:0 4px 14px rgba(0,0,0,.08);
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:13px;
  font-weight:800;
  line-height:1;
}
.cart-icon{
  color:var(--green);
}
.cart-icon span{
  top:-6px;
  right:-6px;
  min-width:18px;
  height:18px;
  padding:0 5px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
}
.brand-main{
  font-size:23px;
  letter-spacing:.2px;
  text-shadow:0 1px 0 #fff;
}
.brand-sub{
  color:var(--green-dark);
  letter-spacing:1.6px;
}
.category-strip{
  top:76px;
  background:rgba(255,253,248,.92);
  backdrop-filter:blur(12px);
  border-bottom:1px solid #f0dfc6;
}
.category-strip button{
  background:#fff;
  border:1px solid #f0dfc6;
  color:var(--green-dark);
  box-shadow:0 5px 16px rgba(0,0,0,.08);
}
.category-strip button:first-child{
  background:var(--red);
  color:white;
  border-color:var(--red);
}
.search-wrap{
  position:sticky;
  top:72px;
  z-index:9;
  padding:16px 14px 12px;
  background:#fffaf0;
  border-bottom:1px solid #f0dfc6;
}
.search-wrap input{
  min-height:52px;
  border:1px solid #eadfce;
  background:#fffdf8;
  border-radius:16px;
  box-shadow:0 8px 24px rgba(70,45,15,.08);
}
.search-wrap button{
  border-radius:16px;
  background:linear-gradient(135deg,var(--green),#0c9a49);
  box-shadow:0 8px 18px rgba(8,122,54,.22);
}
.veg-weight-select{
  width:100%;
  margin:8px 0;
  padding:9px 10px;
  border:1px solid #dfeee5;
  border-radius:10px;
  background:#f3fbf6;
  color:var(--green);
  font-weight:800;
}
.checkout-message{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  background:rgba(0,0,0,.32);
  z-index:90;
  padding:22px;
}
.checkout-message.show{
  display:flex;
}
.checkout-message-box{
  width:min(360px,100%);
  background:white;
  border-radius:16px;
  padding:22px;
  box-shadow:0 16px 45px rgba(0,0,0,.24);
  text-align:center;
}
.checkout-message-box p{
  margin:0 0 18px;
  font-size:17px;
  font-weight:800;
}
.checkout-message-box button{
  min-width:110px;
  border:0;
  border-radius:12px;
  background:var(--green);
  color:white;
  padding:12px 18px;
  font-weight:900;
}
.offer-hero{
  margin:2px 14px 18px;
  border-radius:24px;
  background:
    radial-gradient(circle at top right,rgba(255,209,92,.85),transparent 45%),
    linear-gradient(135deg,#fffaf0,#ffe8b8);
  border:1px solid #f0dfc6;
  box-shadow:0 14px 35px rgba(100,60,10,.14);
}
.offer-slider,
.offer-slide{
  min-height:184px;
}
.offer-slide{
  padding:18px;
}
.offer-slide img{
  width:112px;
  height:112px;
  border-radius:22px;
  box-shadow:0 8px 22px rgba(0,0,0,.1);
}
.offer-slide h2{
  color:#2b1a08;
  line-height:1.05;
}
.offer-slide .tag{
  background:var(--red);
  letter-spacing:.4px;
}
.offer-slide button,
.offer-product-card button,
.add,
.whatsapp-btn,
.request-box button{
  background:linear-gradient(135deg,var(--green),#09964a);
  box-shadow:0 7px 16px rgba(8,122,54,.2);
}
.section-title{
  padding:4px 16px 8px;
}
.section-title h2,
.offers-section h2,
.rewards h2,
.request-box h2{
  margin-bottom:8px;
  letter-spacing:0;
}
.product-row{
  gap:14px;
  padding:0 14px 20px;
  scroll-snap-type:x proximity;
}
.product-row .product-card{
  min-width:178px;
  scroll-snap-align:start;
}
.product-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
  padding:0 14px 20px;
}
.product-card{
  border-radius:20px;
  background:var(--card);
  border:1px solid #f0e6d8;
  box-shadow:0 10px 26px rgba(70,45,15,.08);
  padding:12px;
}
.product-card.selected{
  border-color:#84d6a1;
}
.product-img{
  height:138px;
  border-radius:18px;
  border-color:#f1e7dc;
}
.product-card .name{
  font-size:14px;
  line-height:1.2;
  min-height:38px;
}
.product-card .sub{
  color:var(--muted);
  font-size:11px;
  min-height:34px;
}
.price{
  font-size:17px;
}
.add{
  border-radius:12px;
  min-width:58px;
}
.inline-qty{
  border-radius:14px;
}
.offers-section,
.rewards,
.request-box{
  margin:16px 14px;
  border-radius:22px;
  border:1px solid #f0e6d8;
  box-shadow:0 10px 28px rgba(70,45,15,.08);
}
.offers-section{
  background:#fffdf8;
}
.special-offers-grid{
  grid-template-columns:1fr;
}
.offer-product-card{
  border-radius:18px;
  background:#fff8e6;
}
.rewards{
  background:
    radial-gradient(circle at top right,rgba(255,209,92,.22),transparent 42%),
    linear-gradient(135deg,#075f30,#093d22);
}
.reward-list span{
  border:1px solid rgba(255,255,255,.22);
}
.cart-drawer{
  background:#fffdf8;
}
.cart-header{
  position:sticky;
  top:0;
  background:#fffdf8;
  z-index:2;
}
.cart-item{
  grid-template-columns:58px 1fr auto;
  margin:8px 12px;
  border:1px solid #f0e6d8;
  border-radius:18px;
  background:white;
}
.summary,
.checkout{
  padding:14px;
}
.checkout input,
.checkout textarea,
.checkout select{
  border-color:#eadfce;
  background:white;
  border-radius:14px;
}
.payment-box,
.collection-info-box,
.delivery-notice-box,
.cart-rewards-box{
  border-radius:18px;
}
.whatsapp-btn{
  border-radius:18px;
  min-height:54px;
}
.bottom-nav{
  width:min(430px,100%);
  left:50%;
  right:auto;
  transform:translateX(-50%);
  margin:0 auto;
  border-radius:24px 24px 0 0;
  border:1px solid #eee0cf;
  box-shadow:0 -8px 28px rgba(70,45,15,.12);
}
.bottom-nav button{
  color:#35302a;
  font-weight:800;
}
@media(max-width:430px){
  body{
    padding-bottom:92px;
  }
  main{
    max-width:430px;
  }
  .brand-main{
    font-size:20px;
  }
  .brand-sub{
    font-size:10px;
  }
  .search-wrap{
    gap:8px;
  }
  .search-wrap button{
    padding:12px 14px;
  }
  .offer-slide{
    gap:12px;
    padding:16px;
  }
  .offer-slide img{
    width:96px;
    height:96px;
  }
  .offer-price .now{
    font-size:21px;
  }
  .product-img{
    height:126px;
  }
  .cart-drawer{
    width:100%;
    right:-100%;
  }
}

/* Special banner slot: desktop and mobile banner images */
.offer-slide.banner-slide{
  padding:0 !important;
  gap:0 !important;
  min-height:0 !important;
}
.banner-slide.active{
  display:block !important;
}
.offer-slide .special-banner-link{
  display:block;
  width:100%;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  cursor:pointer;
}
.offer-slide .special-banner-img{
  display:block;
  width:100% !important;
  height:clamp(155px, 24vw, 330px) !important;
  object-fit:cover;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}
@media(max-width:700px){
  .offer-slide .special-banner-img{
    height:auto !important;
    aspect-ratio:1080/560;
  }
}
