@import url("https://fonts.googleapis.com/css2?family=DM+Serif+Display&family=Plus+Jakarta+Sans:wght@400;500;600;700;800&display=swap");

/* BEGIN shoopy-gen:base */
.sx{--sx-gold:#f2a51a;--sx-gold-ink:#3d2400;--sx-gold-soft:#fff3d6;--sx-cream:#fff8ee;--sx-ink:#1f1a17;--sx-muted:#6b625c;--sx-line:#efe6da;--sx-radius:16px;--sx-wa:#1fa855}
.sx .sx-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 20px;border-radius:12px;font-weight:800;font-size:14.5px;text-decoration:none;white-space:nowrap}
.sx .sx-btn--brand{background:var(--secondary-main);color:#fff}
.sx .sx-btn--wa{background:var(--sx-wa);color:#fff}
.sx .sx-ico{width:22px;height:22px;flex:none}
/* END shoopy-gen:base */

/* BEGIN shoopy-gen:usp-1 */
.sx-usp{margin-top:14px}
.sx-usp .sx-usp__list{display:grid;grid-template-columns:1fr 1fr;gap:8px;list-style:none;margin:0;padding:0}
.sx-usp .sx-usp__item{display:flex;align-items:center;gap:10px;background:var(--sx-cream);border:1px solid var(--sx-line);border-radius:var(--sx-radius);padding:10px 12px}
.sx-usp .sx-usp__icon{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#fff;color:var(--secondary-main);flex:none;border:1px solid var(--sx-line)}
.sx-usp .sx-usp__txt{display:flex;flex-direction:column;line-height:1.25}
.sx-usp .sx-usp__txt b{font-size:13px;font-weight:800;color:var(--sx-ink)}
.sx-usp .sx-usp__txt small{font-size:11.5px;color:var(--sx-muted);margin-top:2px}
@media (min-width:1024px){
.sx-usp .sx-usp__list{grid-template-columns:repeat(4,1fr);gap:12px}
.sx-usp .sx-usp__item{padding:14px 16px}
.sx-usp .sx-usp__txt b{font-size:14px}
.sx-usp .sx-usp__txt small{font-size:12.5px}
}
/* END shoopy-gen:usp-1 */

/* BEGIN shoopy-gen:how-to-order-1 */
.sx-order{margin-top:34px;border-radius:22px;background:var(--secondary-main);color:#fff;padding:24px 18px;position:relative;overflow:hidden}
.sx-order::after{content:"";position:absolute;right:-90px;top:-90px;width:260px;height:260px;border-radius:50%;border:2px solid rgba(242,165,26,.35);box-shadow:0 0 0 30px rgba(242,165,26,.08),0 0 0 62px rgba(242,165,26,.05);pointer-events:none}
.sx-order .sx-order__title{font-family:"DM Serif Display",Georgia,serif;font-weight:400;font-size:26px;line-height:1.1;margin:0}
.sx-order .sx-order__sub{opacity:.88;font-size:13.5px;margin:6px 0 16px;max-width:520px}
.sx-order .sx-order__steps{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.sx-order .sx-order__step{display:flex;gap:12px;align-items:flex-start;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);border-radius:14px;padding:12px 14px}
.sx-order .sx-order__num{width:30px;height:30px;border-radius:50%;background:var(--sx-gold);color:var(--sx-gold-ink);font-weight:800;display:grid;place-items:center;flex:none}
.sx-order .sx-order__step b{display:block;font-size:14.5px}
.sx-order .sx-order__step small{display:block;font-size:12.5px;opacity:.85;margin-top:2px}
.sx-order .sx-order__cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px;position:relative;z-index:1}
.sx-order .sx-order__cta .sx-btn--light{background:#fff;color:var(--secondary-main)}
@media (min-width:768px){
.sx-order{padding:34px 36px}
.sx-order .sx-order__title{font-size:32px}
.sx-order .sx-order__steps{grid-template-columns:repeat(3,1fr);gap:14px}
}
/* END shoopy-gen:how-to-order-1 */

/* ===== zippy theme chrome + native sections (theme-fixed in the store; mirrored here) ===== */
:root{
--secondary-main:#a50e18; --crimson-deep:#6e0810; --crimson-ink:#8a0b14; --rose:#fdeae6;
--gold:#f2a51a; --gold-ink:#3d2400; --gold-soft:#fff3d6; --cream:#fff8ee;
--leaf:#1fa855; --ink:#1f1a17; --ink-2:#3b332e; --muted:#6b625c; --line:#efe6da; --line-2:#e3d8ca; --bg:#fff; --bg-2:#faf6f0;
--font-ui:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
--font-display:"DM Serif Display",Georgia,serif;
--radius:14px; --radius-lg:20px; --wrap:1280px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--font-ui);color:var(--ink);background:var(--bg);font-size:14px;line-height:1.45;padding-bottom:64px}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;cursor:pointer;border:0;background:none;color:inherit}
ul,ol{list-style:none}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 16px}
.ico{width:22px;height:22px;flex:none}

/* notice */
.notice{background:var(--crimson-deep);color:#fff;font-size:12.5px;font-weight:600;text-align:center;padding:7px 12px;letter-spacing:.1px}
.notice b{color:var(--gold)}
.notice .sep{opacity:.45;margin:0 8px}
.notice .hide-sm{display:none}

/* header */
.hdr{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line)}
.hdr__row{display:flex;align-items:center;gap:10px;height:60px}
.logo img{height:40px;width:auto}
.loc{display:none}
.search{display:none}
.hdr__acts{margin-left:auto;display:flex;align-items:center;gap:6px}
.icon-btn{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;color:var(--ink-2)}
.cart-btn{display:flex;align-items:center;gap:8px;background:var(--secondary-main);color:#fff;font-weight:700;border-radius:12px;height:40px;padding:0 12px}
.cart-btn .lbl{display:none}
.cart-btn .count{background:#fff;color:var(--secondary-main);border-radius:999px;min-width:20px;height:20px;font-size:12px;display:grid;place-items:center;padding:0 5px}
.search-m{display:block;padding:0 0 12px}
.search-box{display:flex;align-items:center;gap:10px;background:var(--bg-2);border:1px solid var(--line-2);border-radius:12px;height:44px;padding:0 14px;color:var(--muted)}
.search-box input{border:0;background:transparent;font:inherit;color:var(--ink);flex:1;min-width:0;outline:none}
.search-box input::placeholder{color:var(--muted)}
.loc-m{display:flex;align-items:center;gap:6px;font-size:12.5px;color:var(--ink-2);padding:2px 0 12px}
.loc-m b{font-weight:700}
.loc-m .pin{color:var(--secondary-main)}
.loc-m .chg{margin-left:auto;color:var(--secondary-main);font-weight:700}
.catbar{display:none;border-top:1px solid var(--line)}
.catbar ul{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;height:44px;align-items:center}
.catbar a{display:block;padding:7px 12px;border-radius:999px;font-weight:600;font-size:13.5px;color:var(--ink-2);white-space:nowrap}
.catbar a:hover{background:var(--rose);color:var(--crimson-ink)}
.catbar .hot{background:var(--gold-soft);color:var(--gold-ink)}
.catbar .hot::before{content:"\2726 ";color:var(--gold)}

/* hero (StoreBanner, native) */
.hero{padding:12px 0 0}
.hero__frame{position:relative;border-radius:var(--radius-lg);overflow:hidden}
.hero__track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;scroll-behavior:smooth}
.hero__track::-webkit-scrollbar{display:none}
.slide{flex:0 0 100%;scroll-snap-align:start;position:relative;display:flex;flex-direction:column}
.slide picture,.slide picture img{width:100%;height:auto;aspect-ratio:900/600;object-fit:cover}
.slide__copy>*{align-self:flex-start}
.slide__copy{display:flex;flex-direction:column}
.slide p{display:none}
.slide__copy{padding:18px 18px 22px}
.slide--diwali .slide__copy{background:var(--crimson-deep);color:#fff}
.slide--monthly .slide__copy{background:var(--cream);color:var(--ink)}
.kicker{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:800;letter-spacing:.6px;text-transform:uppercase;padding:5px 10px;border-radius:999px}
.slide--diwali .kicker{background:rgba(242,165,26,.18);color:var(--gold);border:1px solid rgba(242,165,26,.45)}
.slide--monthly .kicker{background:#fff;color:var(--crimson-ink);border:1px solid var(--line-2)}
.slide h1,.slide h2{font-family:var(--font-display);font-weight:400;font-size:28px;line-height:1.08;margin:10px 0 8px;letter-spacing:-.2px}
.slide h1 em,.slide h2 em{font-style:normal;color:var(--gold)}
.slide--monthly h2 em{color:var(--secondary-main)}
.slide p{font-size:14px;opacity:.92;max-width:440px}
.slide .kicker{order:-1}
.slide__ctas{display:flex;gap:10px;margin-top:14px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 20px;border-radius:12px;font-weight:800;font-size:14.5px;white-space:nowrap}
.btn--primary{background:var(--secondary-main);color:#fff}
.btn--light{background:#fff;color:var(--crimson-ink)}
.btn--ghost-light{border:1.5px solid rgba(255,255,255,.6);color:#fff}
.btn--ghost{border:1.5px solid var(--line-2);color:var(--ink)}
.offer-chip{display:inline-flex;align-items:baseline;gap:6px;margin-top:12px;background:var(--gold);color:var(--gold-ink);border-radius:10px;padding:6px 10px;font-weight:800;font-size:13px}
.offer-chip big{font-size:20px;line-height:1}
.dots{display:flex;gap:6px;justify-content:center;padding:10px 0 0}
.dots button{width:8px;height:8px;border-radius:99px;background:var(--line-2);transition:width .2s}
.dots button.on{width:22px;background:var(--secondary-main)}
.hero__arrow{display:none}

/* section heads */
.sec{padding:26px 0 0}
.sec__head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;margin-bottom:12px}
.sec__title{font-family:var(--font-display);font-weight:400;font-size:23px;line-height:1.1;letter-spacing:-.1px}
.sec__sub{color:var(--muted);font-size:13px;margin-top:3px}
.view-all{color:var(--secondary-main);font-weight:800;font-size:13.5px;white-space:nowrap}

/* categories (ProductCategoriesV2, native; layout from category_settings) */
.cats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px 10px}
.cat a{display:flex;flex-direction:column;align-items:center;text-align:center;gap:7px}
.cat__img{width:100%;aspect-ratio:1;border-radius:16px;overflow:hidden;background:var(--gold-soft);border:1px solid var(--line)}
.cat__img img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.cat a:hover .cat__img img{transform:scale(1.05)}
.cat b{font-size:12.5px;font-weight:700;line-height:1.2}

/* product rows (ProductGridCollection, native; zippy card) */
.festive{background:linear-gradient(180deg,var(--cream),#fff 85%);margin-top:26px;padding:22px 0 4px;border-top:1px solid var(--line)}
.festive .sec{padding-top:0}
.festive .sec__title::before{content:"";display:inline-block;width:26px;height:26px;margin-right:8px;vertical-align:-4px;background:url("assets/icons/diya.svg") center/contain no-repeat}
.rail{position:relative}
.prow{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 20px)/2.3);gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px 2px 8px}
.prow::-webkit-scrollbar{display:none}
.pcard{scroll-snap-align:start;background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:10px;display:flex;flex-direction:column;transition:box-shadow .2s,border-color .2s}
.pcard:hover{box-shadow:0 8px 22px rgba(60,30,10,.08);border-color:var(--line-2)}
.pcard__img{position:relative;aspect-ratio:1;border-radius:10px;overflow:hidden;background:#fff}
.pcard__img img{width:100%;height:100%;object-fit:contain}
.badge{position:absolute;top:0;left:0;background:var(--gold);color:var(--gold-ink);font-size:11px;font-weight:800;padding:4px 8px;border-radius:10px 0 10px 0}
.pcard__unit{margin-top:8px;font-size:12px;color:var(--muted);font-weight:600}
.pcard__name{font-size:13.5px;font-weight:600;line-height:1.3;min-height:35px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-top:2px}
.pcard__row{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-top:auto;padding-top:10px}
.price{font-weight:800;font-size:15px}
.mrp{display:block;font-size:12px;color:var(--muted);text-decoration:line-through}
.add{height:34px;min-width:68px;border-radius:9px;border:1.5px solid var(--secondary-main);color:var(--secondary-main);background:#fff;font-weight:800;font-size:13px;padding:0 10px}
.add:hover{background:var(--rose)}
.add.in{background:var(--secondary-main);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 4px}
.add.in span{padding:0 7px;font-size:16px;line-height:1}
.rail__btn{display:none}

/* feature cards (LargeCollectionCard x3, native) */
.features{display:grid;grid-template-columns:1fr;gap:12px}
.fcard{position:relative;display:block;border-radius:var(--radius-lg);overflow:hidden;aspect-ratio:800/460}
.fcard img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.fcard:hover img{transform:scale(1.03)}
.fcard__copy{position:absolute;left:20px;top:50%;transform:translateY(-50%);max-width:46%}
.fcard__copy h3{font-family:var(--font-display);font-weight:400;font-size:24px;line-height:1.05}
.fcard__copy p{font-size:12.5px;color:var(--ink-2);margin:6px 0 10px}
.fcard__copy span{display:inline-flex;align-items:center;gap:4px;font-weight:800;font-size:13px;color:var(--secondary-main)}

/* footer (Tier C) */
.ftr{margin-top:34px;background:var(--bg-2);border-top:1px solid var(--line)}
.ftr__grid{display:grid;grid-template-columns:1fr 1fr;gap:24px 16px;padding:28px 16px 18px}
.ftr__brand{grid-column:1/-1}
.ftr__brand img{height:92px;width:auto;margin-bottom:10px}
.ftr__brand p{color:var(--muted);font-size:13px;max-width:360px}
.ftr h4{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.6px;margin-bottom:10px;color:var(--crimson-ink)}
.ftr li{margin:7px 0;font-size:13.5px;color:var(--ink-2)}
.ftr li a:hover{color:var(--secondary-main)}
.pay{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.pay span{border:1px solid var(--line-2);background:#fff;border-radius:8px;padding:4px 8px;font-size:12px;font-weight:700;color:var(--ink-2)}
.ftr__bar{border-top:1px solid var(--line);padding:14px 16px;font-size:12px;color:var(--muted);display:flex;flex-wrap:wrap;gap:6px 16px;justify-content:space-between}

/* mobile bottom nav (zippy signature) */
.bnav{position:fixed;left:0;right:0;bottom:0;z-index:60;background:#fff;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr);height:62px}
.bnav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:11px;font-weight:700;color:var(--muted)}
.bnav a.on{color:var(--secondary-main)}
.bnav .ico{width:22px;height:22px}
.bnav .hot{color:var(--gold-ink)}
.bnav .hot .ico{color:var(--gold)}

/* ---------- >=640 ---------- */
@media (min-width:640px){
.notice .hide-sm{display:inline}
.slide p{display:block}
.prow{grid-auto-columns:calc((100% - 30px)/3.3)}
.features{grid-template-columns:repeat(3,1fr)}
.fcard{aspect-ratio:800/560}
.fcard__copy h3{font-size:21px}
.ftr__grid{grid-template-columns:1.4fr 1fr 1fr 1.2fr}
.ftr__brand{grid-column:auto}
}
/* ---------- >=768 tablet ---------- */
@media (min-width:768px){
.wrap{padding:0 24px}
.hdr__row{height:68px;gap:16px}
.logo img{height:46px}
.search{display:block;flex:1;max-width:520px}
.search-m,.loc-m{display:none}
.cart-btn .lbl{display:inline}
.catbar{display:block}
.slide{display:block}
.slide picture,.slide picture img{aspect-ratio:auto;height:100%;position:absolute;inset:0}
.slide{min-height:340px}
.slide--diwali::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(110,8,16,.92) 0,rgba(110,8,16,.75) 34%,rgba(110,8,16,0) 58%);pointer-events:none}
.slide--monthly::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(255,248,238,.9) 0,rgba(255,248,238,.6) 38%,rgba(255,248,238,0) 56%);pointer-events:none}
.slide__copy{z-index:2}
.slide__copy{position:relative;z-index:1;width:56%;padding:34px 0 34px 36px;background:none!important;min-height:340px;display:flex;flex-direction:column;justify-content:center}
.slide h1,.slide h2{font-size:34px}
.cats{grid-template-columns:repeat(8,1fr)}
.prow{grid-auto-columns:calc((100% - 40px)/4.3)}
.sec{padding-top:34px}
.sec__title{font-size:27px}
.fcard__copy h3{font-size:19px}
.fcard__copy p{display:none}
body{padding-bottom:0}
.bnav{display:none}
}
/* ---------- >=1024 laptop ---------- */
@media (min-width:1024px){
.loc{display:flex;align-items:center;gap:8px;padding:6px 12px;border:1px solid var(--line-2);border-radius:12px;font-size:12px;color:var(--muted);line-height:1.2;white-space:nowrap}
.loc b{display:block;color:var(--ink);font-size:13px}
.loc .pin{color:var(--secondary-main)}
.slide,.slide__copy{min-height:0}
.slide{aspect-ratio:1600/700}
.slide__copy{width:46%;height:100%;padding:0 0 0 56px}
.slide h1,.slide h2{font-size:46px;margin:14px 0 10px}
.slide p{font-size:16px}
.slide__ctas{margin-top:20px}
.btn{height:50px;padding:0 24px;font-size:15px}
.hero__arrow{display:grid;place-items:center;position:absolute;top:50%;transform:translateY(-50%);width:42px;height:42px;border-radius:50%;background:rgba(255,255,255,.92);box-shadow:0 4px 14px rgba(0,0,0,.15);z-index:2;color:var(--ink)}
.hero__arrow--prev{left:14px}.hero__arrow--next{right:14px}
.hero__arrow--prev{display:none}
.prow{grid-auto-columns:calc((100% - 50px)/6);overflow-x:auto}
.rail__btn{display:grid;place-items:center;position:absolute;top:38%;width:38px;height:38px;border-radius:50%;background:#fff;border:1px solid var(--line-2);box-shadow:0 4px 12px rgba(0,0,0,.08);z-index:2}
.rail__btn--prev{left:-18px}.rail__btn--next{right:-18px}
.fcard__copy{left:28px}
.fcard__copy h3{font-size:25px}
.fcard__copy p{display:block}
}
@media (min-width:1280px){
.slide h1,.slide h2{font-size:52px}
}

/* ============================================================
   MKS FIXES (appended) — align native + custom sections, diya
   ============================================================ */

/* 1) Width consistency: native Zippy sections render inside
   .page-container (max-width 1440 / 40px desktop padding) while the
   custom HTML blocks use .wrap (max-width 1280 / 24px). Normalise the
   native container to the shared 1280/16-24 container so every section
   (categories, collections, all-products) lines up to the same edges
   as the hero, Quick picks and ordering blocks. */
.page-container{max-width:1280px;margin-left:auto;margin-right:auto}
@media (min-width:768px){
  .page-container{padding-left:24px;padding-right:24px}
}
/* (The "Diwali kitchen specials" diya is added as an emoji in the
   collection name itself via Home Page > Products, so it survives
   section reordering — no text-matching selector needed here.) */

/* ===== refine-315558 — 2026-11-02 : match the preview's cards, headings, discount & fonts =====
   Appended after mks-current.css. Overrides zippy theme defaults only.
   Card treatment is GLOBAL (every .product-card: home rows, /products, category, related) —
   verified it renders correctly on all of them. */

/* ---- Section headings → DM Serif Display 27px (reference) ---- */
.ProductGridCollection-component .heading-title,
.ProductInfiniteScroll-component .section-heading,
.LargeCategoriesCardV1-component .category-header{
  font-family:"DM Serif Display",Georgia,serif !important;
  font-weight:400 !important; font-size:27px !important; color:#1f1a17 !important;
}
.ProductGridCollection-component .shop-all-link{ color:#a50e18 !important; font-weight:800 !important; font-size:13.5px !important; }
.LargeCategoriesCardV1-component .category-header::after{
  content:"Everything for your kitchen, from one trusted kirana";
  display:block; font-family:"Plus Jakarta Sans",system-ui,-apple-system,sans-serif;
  font-size:14px; font-weight:400; color:#6b625c; margin-top:6px;
}

/* ---- Product card (ALL cards) : match the reference ---- */
.product-card{ border-radius:14px !important; border:1px solid #efe6da !important; display:flex !important; flex-direction:column !important; height:100% !important; }
/* fill the equal-height slide/grid cell so price rows (and ADD) align across a row */
.product-swiper-slide>.scroll-animate-item{ height:100% !important; }

/* info stack: weight → name → price; price row pinned to the bottom */
.product-card-info{ display:flex !important; flex-direction:column !important; gap:3px; flex:1 1 auto !important; }
.product-card-info .product-card-quantity{ order:1 !important; font-weight:600 !important; color:#6b625c !important; font-size:12px !important; margin:0; }
.product-card-info .product-card-name-link{ order:2 !important; }
.product-card-info .product-card-name{ color:#1f1a17 !important; font-weight:600 !important; font-size:13.5px !important; }
.product-card-info .product-card-pricing{ order:3 !important; margin-top:auto !important; padding-right:62px !important; }

/* price = dark ink, NO border box (reference); MRP muted strike; keep one line */
.product-card-price{ border:none !important; background:transparent !important; color:#1f1a17 !important; padding:0 !important; border-radius:0 !important; box-shadow:none !important; font-weight:800 !important; font-size:15px !important; white-space:nowrap !important; }
.product-card-mrp-price{ border:none !important; background:transparent !important; color:#6b625c !important; font-weight:400 !important; font-size:12px !important; }
.product-card-price-container{ white-space:nowrap !important; }

/* discount = festive gold pill at the image top-left (reference) — NOT the full-width coupon bar */
.product-card .product-card-discount-amount{
  position:absolute !important; top:0 !important; left:0 !important; right:auto !important; bottom:auto !important; width:auto !important; z-index:3;
  margin:0 !important; border:none !important; border-radius:14px 0 10px 0 !important; padding:4px 8px !important;
  background:#f2a51a !important; color:#3d2400 !important; font-size:11px !important; font-weight:800 !important; line-height:1.25 !important;
}
/* remove the theme's dashed "coupon perforation" tail on the discount tag */
.product-card .product-card-discount-amount::after{ display:none !important; }

/* move ADD into the price row (reparent by neutralising the image container's positioning) */
.product-card-image-container{ position:static !important; }
.product-card-image-container .product-card-link{ position:relative !important; display:block !important; width:100% !important; aspect-ratio:1/1 !important; }
.product-card-image-container .product-card-image{ position:absolute !important; inset:0 !important; width:100% !important; height:100% !important; }
.product-card .product-card-add-button{
  position:absolute !important; left:auto !important; right:12px !important; top:auto !important; bottom:12px !important;
  border:1.5px solid #a50e18 !important; background:#fff !important; color:#a50e18 !important;
  border-radius:9px !important; font-size:13px !important; font-weight:800 !important; padding:5px 12px !important;
  height:auto !important; width:auto !important;
}

/* ---- Header (desktop) : match the preview ---- */
/* location = bordered rounded pill (reference) */
.desktop-delivery-location{ border:1px solid #e3d8ca !important; border-radius:12px !important; padding:5px 12px !important; }
.desktop-delivery-location .title-punchline{ font-size:11px !important; font-weight:700 !important; color:#6b625c !important; }
.desktop-delivery-location .desktop-location-selector-text,
.desktop-delivery-location .desktop-location-selector-text span{ font-size:12.5px !important; font-weight:600 !important; color:#1f1a17 !important; }
/* nav links = reference weight/size/colour; "Diwali offers" = soft gold pill with a sparkle */
.desktop-nav a.nav-link{ font-weight:600 !important; font-size:13.5px !important; color:#3b332e !important; border-radius:999px !important; padding:7px 12px !important; }
.desktop-nav a.nav-link[href*="diwali"]{ background:#fff3d6 !important; color:#3d2400 !important; }
.desktop-nav a.nav-link[href*="diwali"]::before{ content:"\2726\00a0"; }

/* keep the price on one line and give the narrow 2-col mobile card room for ADD */
@media (max-width:768px){
  .product-card-info .product-card-pricing{ padding-right:46px !important; }
  .product-card .product-card-add-button{ right:8px !important; bottom:10px !important; padding:4px 9px !important; font-size:12px !important; }
  .product-card-price{ font-size:14px !important; }
}


/* =====================================================================
   refine-315558 — ROUND 2 — 2026-11-03
   Shree Mahalakshmi kirani Stores (315558, org 309735, slug mks, zippy)
   Three merchant-requested fixes, appended after the live base CSS.
   Base backup: live_backup/mks-current-1793630555914.css
   ===================================================================== */

/* -------------------------------------------------------------------
   FIX 1 — WHITE product-image background.
   Card images are object-fit:contain inside a 1:1 box; the letterbox
   showed the cream page background (--bg), so bottles/packs looked like
   they sat on a grey/off-white tint. Paint the image box solid white so
   every product image sits on uniform white. (Images with grey baked
   INTO the photo cannot be normalised by CSS and are flagged separately.)
   ------------------------------------------------------------------- */
.product-card .product-card-image-container,
.product-card .product-card-image-container .product-card-link,
.product-card .product-card-image{
  background:#ffffff !important;
}

/* -------------------------------------------------------------------
   FIX 2 — product-card inner spacing.
   .product-card-info had 0 padding, so the name/price/weight butted
   against the card border. Give the text block breathing room. The ADD
   button is absolutely positioned to the card (right/bottom 12px), so
   the pricing row keeps a right reserve to clear it.
   ------------------------------------------------------------------- */
.product-card .product-card-info{
  padding:10px 12px 12px !important;
}
.product-card .product-card-info .product-card-pricing{
  padding-right:52px !important;   /* clear the ADD button */
}
@media (max-width:768px){
  .product-card .product-card-info{ padding:8px 10px 10px !important; }
  .product-card .product-card-info .product-card-pricing{ padding-right:44px !important; }
}

/* -------------------------------------------------------------------
   FIX 3 — footer inner spacing.
   .ftr__grid / .ftr__bar sat at 16px side padding and the columns/brand
   touched the footer edges. Widen the inner padding so the footer
   content does not butt against the container edges.
   ------------------------------------------------------------------- */
.ftr .ftr__grid{ padding:32px 24px 22px !important; }
.ftr .ftr__bar{ padding:16px 24px !important; }
@media (min-width:768px){
  .ftr .ftr__grid{ padding:40px 40px 26px !important; }
  .ftr .ftr__bar{ padding:18px 40px !important; }
}

/* =====================================================================
   refine-315558 — ROUND 3 — 2026-11-03
   Two more merchant-requested fixes.
   ===================================================================== */

/* FIX 4 — WhatsApp chat bubble: periwinkle blue -> WhatsApp green.
   The cb12 plugin paints the floating bubble from --cb-bg-color (#4874C28F)
   and the chat-window header from --cw-header-bg-color (#013B82). Override
   both variables AND the bubble background directly (the plugin's own rule
   is high-specificity); the send button is already green. White glyph stays. */
#cb12_bubble_wrapper .cb12_cb_container_bg,
.cb12_cb_container_bg{ background:#25D366 !important; }
.cb12_wrapper{ --cb-bg-color:#25D366 !important; --cw-header-bg-color:#075E54 !important; }
.cb12_cw_header{ background:#075E54 !important; }

/* FIX 5 — Hero carousel stray vertical line.
   The hero is a flex scroll-snap / overflow-x track (2 slides). At browser
   zoom / HiDPI the snap lands a sub-pixel short, exposing the neighbouring
   (maroon Diwali) slide as a ~1px vertical line at the left edge of the cream
   MONTHLY RATION slide. A 2px inter-slide gutter over a cream frame background
   means any sub-pixel edge shows cream, never the red slide. */
.hero__frame{ background:var(--cream, #fff8ee) !important; }
.hero__track{ gap:2px !important; }