/* ============ InstaKart sale landing — mobile-first ============ */

/* ---------- Self-hosted Inter (variable font, weights 100–900; no Google Fonts dependency) ---------- */
@font-face{
    font-family:"Inter";
    font-style:normal;
    font-weight:100 900;
    font-display:swap;
    src:url("../fonts/inter-latin-ext.woff2") format("woff2");
    unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
    font-family:"Inter";
    font-style:normal;
    font-weight:100 900;
    font-display:swap;
    src:url("../fonts/inter-latin.woff2") format("woff2");
    unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}

:root{
    --blue:#1f4bb8;
    --blue2:#2874f0;
    --yellow:#ffc200;
    --green:#22a06b;
    --red:#e5484d;
    --ink:#1a1a1a;
    --muted:#6b7280;
    --line:#e6e8eb;
    --bg:#eef1f4;
    --card:#ffffff;
}
*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
html{-webkit-text-size-adjust:100%;}
body{
    font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;
    background:var(--bg);
    color:var(--ink);
    line-height:1.35;
    -webkit-font-smoothing:antialiased;
    -moz-osx-font-smoothing:grayscale;
}
a{text-decoration:none;color:inherit;}
img{display:block;max-width:100%;}

.app{max-width:480px;margin:0 auto;background:var(--bg);min-height:100vh;overflow-x:hidden;overflow-x:clip;}
/* clip (not hidden) so .app is not a scroll container and sticky headers stick to the viewport; hidden is the fallback for old browsers */

/* ---------- Top bar ---------- */
.topbar{
    background:linear-gradient(180deg,#56adff 0%,#deefff 58%,var(--bg) 100%);
    padding:12px 14px 16px;
}
/* Flipkart-style two-box brand strip: icon on top, italic bold label below */
.brandtabs{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
.btab{
    background:#fff;border-radius:12px;height:52px;
    display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;
    box-shadow:0 1px 3px rgba(0,0,0,.10);
}
.btab--active{background:#ffe51f;box-shadow:none;}
.btab-mark,.btab-plane{display:block;}
.btab-plane{width:29px;height:22px;object-fit:contain;}
.btab-mark--img{width:29px;height:22px;object-fit:contain;}   /* uploaded website icon: same box as the Travel plane */
/* uploaded text logo (its empty border is trimmed on upload): letters about as tall as the "Travel" label */
.btab-logo{display:block;height:17px;width:auto;max-width:130px;object-fit:contain;}
.btab-logo--travel{height:14px;}   /* small source (71×20): kept smaller so it stays sharp */
.btab-name{font-style:italic;font-weight:800;font-size:15px;line-height:1;color:#1a1a1a;letter-spacing:-.2px;}
.btab .bt-1{color:#1a1a1a;}
.btab .bt-2{color:#1f4bb8;}

.location{display:flex;align-items:center;gap:6px;margin:14px 2px 12px;font-size:14px;font-weight:700;}
.loc-pin{font-size:14px;}
.loc-text{font-weight:800;}
.loc-link{color:var(--blue2);font-weight:800;}
.loc-link span{font-weight:900;}

.searchrow{display:flex;align-items:center;gap:12px;margin-top:16px;}
.brandmall{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:54px;}
.bm-label{font-size:11px;font-weight:800;color:#333;}
.toggle{display:flex;align-items:center;gap:5px;cursor:pointer;}
.toggle input{display:none;}
.track{width:34px;height:18px;background:#c4c9d0;border-radius:20px;position:relative;transition:.2s;}
.thumb{position:absolute;top:2px;left:2px;width:14px;height:14px;background:#fff;border-radius:50%;transition:.2s;box-shadow:0 1px 2px rgba(0,0,0,.3);}
.toggle input:checked + .track{background:var(--green);}
.toggle input:checked + .track .thumb{left:18px;}
.bm-state{font-size:11px;font-weight:800;color:#333;}
.search{
    flex:1;display:flex;align-items:center;gap:11px;background:#fff;
    border:1.5px solid #58abfa;border-radius:12px;padding:0 14px;height:51px;
    box-shadow:none;
}
.search-ic{border:0;background:none;padding:0;display:flex;align-items:center;cursor:pointer;color:#2874f0;}
.search-svg{stroke-width:2.4;}
.search input{flex:1;border:0;outline:0;font-size:16px;background:transparent;color:#1a1a1a;}
.search input::placeholder{color:#7a8699;}
.tab-ic{color:#1a1a1a;}

/* ---------- Hero carousel ---------- */
.hero{padding:0 14px;margin-top:-2px;}
.carousel{position:relative;border-radius:12px;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,.10);}
.slides{display:flex;transition:transform .4s ease;}
.slide{min-width:100%;}
.slide img{width:100%;height:auto;display:block;}
.dots{display:flex;justify-content:center;gap:5px;padding:11px 0 2px;}
.dot{width:12px;height:4px;border-radius:2px;background:rgba(0,0,0,.13);transition:width .25s,background .25s;cursor:pointer;}
.dot.active{width:36px;background:#000;}

/* ---------- Home category tab strip (Flipkart "For You / Fashion / Mobiles …") ---------- */
.hometabs{position:sticky;top:0;z-index:25;background:#fff;padding:2px 0 0 8px;border-bottom:1px solid rgba(0,0,0,.16);}
.ht-row{display:flex;overflow-x:auto;padding-right:16px;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
.ht-row::-webkit-scrollbar{display:none;}
.ht{position:relative;flex:0 0 auto;min-width:69px;height:75px;padding:0 4px 4px;display:flex;flex-direction:column;align-items:center;color:#000;}
.ht-ic{width:44px;height:38px;margin-top:7px;border-radius:8px;display:flex;align-items:center;justify-content:center;}
.ht-ic img{width:32px;height:32px;display:block;transition:width .15s,height .15s;}
.ht-name{padding:4px;font-size:11px;line-height:14px;font-weight:400;white-space:nowrap;}
.ht.is-on .ht-ic{background:linear-gradient(180deg,#d4e8ff 0%,#eef6ff 100%);}
.ht.is-on .ht-ic img{width:36px;height:36px;}
.ht.is-on .ht-name{font-weight:700;}
.ht.is-on::after{content:"";position:absolute;left:8px;right:8px;bottom:0;height:4px;border-radius:2px;background:#1162f2;}
.foryou[hidden],.ht-empty[hidden],.grid[hidden]{display:none;}
.foryou .hero{margin-top:12px;}
.grid.is-loading{opacity:.45;transition:opacity .15s;}
.ht-empty{max-width:520px;margin:32px auto;padding:0 24px;text-align:center;color:#555;font-size:14px;}
.ht-empty p{margin-bottom:16px;}
.ht-empty b{color:#111;}

/* ---------- Sale strip ---------- */
.salestrip{
    max-width:520px;margin:4px auto 0;padding:9px 14px;
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    background:#fff;border-bottom:1px solid #f1f3f6;font-size:13px;color:#212121;
}
.sale-left{display:flex;align-items:center;gap:8px;white-space:nowrap;}
.live-dot{width:7px;height:7px;border-radius:50%;background:#00c853;box-shadow:0 0 0 0 rgba(0,200,83,.6);animation:livePulse 1.4s infinite;}
@keyframes livePulse{
    0%{box-shadow:0 0 0 0 rgba(0,200,83,.6);}
    70%{box-shadow:0 0 0 8px rgba(0,200,83,0);}
    100%{box-shadow:0 0 0 0 rgba(0,200,83,0);}
}
.sale-title{font-weight:700;color:#1f3fb8;}
.sep{color:#9aa3b2;}
.sale-ends{color:#5f6368;}
.sale-ends b{font-weight:800;color:#e65100;}
.shop-now{
    flex-shrink:0;display:inline-flex;align-items:center;gap:2px;
    font-weight:700;font-size:12px;color:#fff;padding:6px 12px;border-radius:10px;
    background:linear-gradient(135deg,#2874f0,#1f4bd8);box-shadow:0 6px 14px rgba(40,116,240,.35);
}
.shop-now:active{transform:scale(.97);}

/* ---------- Product grid ---------- */
.grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:8px;max-width:520px;width:100%;margin:0 auto;}
.card{
    background:#fff;border-radius:6px;padding:10px;display:flex;flex-direction:column;
    color:#212121;box-shadow:0 1px 3px rgba(0,0,0,.1);position:relative;min-width:0;overflow:hidden;
    cursor:pointer;transition:box-shadow .15s;
}
.card:active{box-shadow:0 2px 8px rgba(0,0,0,.15);}
.card-img{width:100%;height:160px;display:flex;align-items:center;justify-content:center;margin-bottom:10px;overflow:hidden;}
.card-img img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;}
.card-body{display:flex;flex-direction:column;flex:1;min-width:0;}
.card-title{font-size:13px;font-weight:500;color:#212121;line-height:1.4;margin-bottom:6px;overflow-wrap:anywhere;
    display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}

/* green star rating widget (see stars_html) */
.stars{display:inline-flex;gap:1px;flex-shrink:0;color:#26a541;font-size:11px;line-height:1;}
.stars svg{display:block;}
.rate{display:flex;align-items:center;flex-wrap:wrap;gap:4px;margin-bottom:6px;min-width:0;}
.rate-count{font-size:11px;color:#878787;}
.card .assured-badge{height:14px;width:auto;margin-left:2px;max-width:55px;object-fit:contain;}

.price{display:flex;align-items:center;flex-wrap:wrap;gap:6px;margin-bottom:4px;min-width:0;}
.off{font-size:14px;font-weight:700;color:#388e3c;}
/* struck-through MRP everywhere (product page, cart, checkout); cards override size/colour below */
.mrp{color:var(--muted);text-decoration:line-through;font-size:13px;}
.card .mrp{font-size:12px;font-weight:500;color:#878787;text-decoration:line-through;}
.now{font-size:16px;font-weight:700;color:#212121;}

/* WOW "with offer" row */
.offer-row{display:flex;align-items:center;flex-wrap:wrap;gap:5px;margin-bottom:6px;min-width:0;}
.card .wow-badge{height:15px;width:auto;flex-shrink:0;}
.offer-price{font-size:14px;font-weight:700;color:#1a4fb8;}
.offer-text{font-size:12px;color:#1a4fb8;}

.tag{font-size:12px;font-weight:600;margin-bottom:4px;}
.delivery{font-size:12px;color:#212121;margin-top:auto;overflow-wrap:anywhere;}
.delivery b{font-weight:600;}

/* Infinite-scroll sentinel + spinner */
.feed-sentinel{display:flex;justify-content:center;align-items:center;min-height:44px;padding:8px 0 18px;}
.feed-spinner{width:22px;height:22px;border:3px solid #e2e6ee;border-top-color:var(--blue2);border-radius:50%;animation:feedspin .7s linear infinite;}
.feed-sentinel.is-done{display:none;}
@keyframes feedspin{to{transform:rotate(360deg);}}
@media (prefers-reduced-motion:reduce){.feed-spinner{animation:none;}}
.loadmore-wrap{display:flex;justify-content:center;padding:4px 14px 24px;}
.loadmore{background:#fff;border:1px solid var(--blue2);color:var(--blue2);font-weight:800;padding:12px 26px;border-radius:10px;font-size:15px;cursor:pointer;}

/* ---------- Footer ---------- */
.footer{background:#172337;color:#c7cfdb;padding:26px 18px 34px;margin-top:12px;}
/* fixed bottom bars overlap the page end: pad the footer instead of a spacer above it */
.app:has(.bottomnav) .footer{padding-bottom:calc(34px + 64px + env(safe-area-inset-bottom,0px));}
.app:has(.buybar) .footer{padding-bottom:calc(34px + 76px + env(safe-area-inset-bottom,0px));}
.app:has(.footer) .bn-spacer,.app:has(.footer) .pd-spacer{display:none;}
.foot-cols{display:flex;gap:16px;justify-content:space-between;flex-wrap:wrap;}
.foot-cols h4{font-size:12px;letter-spacing:.5px;color:#8a97ab;margin-bottom:10px;}
.foot-cols a{display:block;font-size:13px;margin-bottom:8px;color:#c7cfdb;}
.foot-bottom{border-top:1px solid #2a3852;margin-top:20px;padding-top:16px;}
.foot-logo{display:block;height:28px;width:auto;margin-bottom:10px;}
.foot-bottom p{font-size:12px;color:#8a97ab;line-height:1.5;}

/* Toast */
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%) translateY(20px);
    background:#172337;color:#fff;padding:11px 18px;border-radius:24px;font-size:14px;font-weight:600;
    opacity:0;pointer-events:none;transition:.25s;z-index:50;box-shadow:0 6px 20px rgba(0,0,0,.3);}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

@media(min-width:480px){
    .grid{grid-template-columns:1fr 1fr;}
}

/* ==================================================================
   Inner pages (product, cart, address, checkout, success, catalog)
   ================================================================== */

/* Search page (Flipkart /searchsuggestion): white bar — back arrow + borderless input — on a grey page */
.app:has(.topbar-search){background:#f1f3f6;}
.topbar-search{position:sticky;top:0;z-index:30;display:flex;align-items:center;height:53px;background:#fff;border-bottom:1px solid #eaeaea;}
.ts-back{flex:0 0 56px;height:52px;display:flex;align-items:center;justify-content:center;color:rgba(0,0,0,.54);}
.ts-form{flex:1 1 0;min-width:0;height:52px;margin:0;display:flex;align-items:center;}
.ts-input{flex:1 1 0;min-width:0;height:100%;padding:12px 12px 12px 0;border:0;outline:0;background:transparent;font:inherit;font-size:14px;color:#212121;
    -webkit-appearance:none;appearance:none;border-radius:0;}
.ts-input::placeholder{color:#c8c7c2;opacity:1;}
.ts-clear{flex:0 0 44px;height:52px;padding:0 16px 0 8px;border:0;background:none;display:flex;align-items:center;justify-content:center;cursor:pointer;}
.ts-clear[hidden]{display:none;}
.ts-input::-webkit-search-cancel-button,.ts-input::-webkit-search-decoration{-webkit-appearance:none;appearance:none;display:none;}
/* suggestion rows: photo · typed part grey + completion bold (· "in Mobiles" blue on the first two) · ↖ fill */
.sugg{list-style:none;margin:0;padding:0;background:#fff;box-shadow:0 1px 1.5px rgba(0,0,0,.118);}
.sugg[hidden]{display:none;}
.sg{display:flex;align-items:center;min-height:56px;position:relative;}
.sg + .sg::before{content:"";position:absolute;top:0;left:56px;right:0;border-top:1px solid #f0f0f0;}
.sg-link{flex:1 1 0;min-width:0;display:flex;align-items:center;min-height:56px;color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent;}
.sg-link:active{background:#f5f5f5;}
.sg-img{flex:0 0 56px;height:56px;padding:8px;display:flex;align-items:center;justify-content:center;}
.sg-img img{width:32px;height:40px;object-fit:contain;}
.sg-img--hist{padding:8px 0 8px 8px;}   /* recent search: 40px history icon (24px glyph) at x=8 */
.sg-text{flex:1 1 0;min-width:0;display:flex;flex-direction:column;justify-content:center;padding:8px 0;}
.sg-main{font-size:16px;line-height:19px;font-weight:500;color:#212121;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sg-q{font-weight:400;color:#757575;}
.sg--hist .sg-main{font-weight:400;}
.sg-cat{margin-top:2px;font-size:12px;line-height:14px;font-weight:500;color:#2874f0;}
.sg-fill{flex:0 0 40px;height:56px;padding:0;border:0;background:none;display:flex;align-items:center;justify-content:center;cursor:pointer;}
.search-results[hidden]{display:none;}

/* Product page header — light-blue bar: back arrow, outlined search box, cart */
.topbar-pd{position:sticky;top:0;z-index:30;display:flex;align-items:center;height:64px;padding:12px 0 12px 8px;background:#d8effe;}
.tp-back{flex:0 0 40px;height:40px;display:flex;align-items:center;justify-content:center;color:#333;}
.tp-search{flex:1 1 0;min-width:0;height:40px;margin:0 4px 0 8px;padding:0 12px 0 0;display:flex;align-items:center;
    background:#fff;border:1.5px solid #2ea1ff;border-radius:12px;}
.tp-search-ic{flex:0 0 40px;height:40px;margin-left:.5px;padding:0;border:0;background:none;display:flex;align-items:center;justify-content:center;color:#333;cursor:pointer;}
.tp-search input{flex:1 1 0;min-width:0;height:100%;padding:0;border:0;outline:0;background:transparent;font:inherit;font-size:14px;color:#333;}
.tp-search input::placeholder{color:#707070;opacity:1;}
.tp-cart{flex:0 0 40px;height:40px;margin:0 8px;padding-right:4px;display:flex;align-items:center;justify-content:flex-end;color:#333;}
.tp-cart .cart-badge{top:2px;right:-6px;}

/* Inner white header */
.topbar-inner{position:sticky;top:0;z-index:30;background:#fff;display:flex;align-items:center;gap:12px;
    padding:12px 14px;box-shadow:0 1px 4px rgba(0,0,0,.08);}
.ti-back{font-size:22px;font-weight:700;color:#1a1a1a;line-height:1;}
.ti-mark{flex:0 0 23px;display:flex;align-items:center;}   /* small brand mark before a category name */
.ti-mark svg,.ti-mark img{display:block;width:23px;height:23px;object-fit:contain;}
.ti-title{font-size:18px;font-weight:700;flex:1;}
.ti-logo{flex:1;} .ti-logo img{height:24px;}
.ti-actions{display:flex;align-items:center;gap:18px;margin-left:auto;}
/* Blue category header (Flipkart): 52px #2874f0 bar, white 16px title, white icons */
.topbar-inner--blue{height:52px;padding:0 13px 0 12px;gap:0;background:#2874f0;box-shadow:none;color:#fff;}
.topbar-inner--blue .ti-back{color:#fff;flex:0 0 19px;}
.topbar-inner--blue .ti-mark{margin-left:11px;}
.topbar-inner--blue .ti-title{margin-left:12px;font-size:16px;font-weight:400;line-height:20px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;}
.topbar-inner--blue .ti-actions{gap:20px;margin-left:12px;}
.topbar-inner--blue .ti-actions a{color:#fff;}
/* Plain white Flipkart bar (empty "My Cart"): 52px, thin ←, 16px regular title */
.topbar-inner--flat{height:52px;padding:0 12px;gap:0;box-shadow:none;}
.topbar-inner--flat .ti-back{flex:0 0 19px;color:#212121;}
.topbar-inner--flat .ti-title{margin-left:23px;font-size:16px;font-weight:400;line-height:20px;color:#212121;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;}
/* "Step 3 of 3" kicker above the title */
.ti-titlewrap{flex:1;min-width:0;display:flex;flex-direction:column;}
.ti-kicker{font-size:11px;font-weight:600;color:#6b7280;letter-spacing:.3px;line-height:1.3;}
.ti-titlewrap .ti-title{flex:none;font-size:20px;line-height:1.15;}
/* "100% Secure" badge in the checkout header (right side) */
.ti-secure{margin-left:auto;display:inline-flex;align-items:center;gap:5px;padding:5px 10px;border-radius:6px;
    background:#f1f3f5;color:#374151;font-size:13px;font-weight:700;white-space:nowrap;}
.ti-secure svg{flex:0 0 13px;}
.ti-actions a{display:flex;align-items:center;color:#2c3340;}
.ti-back{color:#1a1a1a;display:flex;align-items:center;}
.ti-ic{display:block;}
.ti-cart{position:relative;}
.cart-badge{position:absolute;top:-8px;right:-10px;background:var(--red);color:#fff;font-size:10px;font-weight:800;
    min-width:16px;height:16px;border-radius:9px;display:flex;align-items:center;justify-content:center;padding:0 4px;}

/* Steps progress bar */
.steps{display:flex;align-items:center;justify-content:center;gap:0;background:#fff;padding:16px 18px;margin-bottom:8px;box-shadow:0 1px 2px rgba(0,0,0,.04);}
.step{display:flex;flex-direction:column;align-items:center;gap:5px;position:relative;}
.step-dot{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;
    font-size:13px;font-weight:800;border:2px solid #c9ced6;color:#8a97ab;background:#fff;}
.step-label{font-size:12px;color:#8a97ab;font-weight:700;}
.step--active .step-dot{background:var(--blue2);border-color:var(--blue2);color:#fff;}
.step--active .step-label{color:#1a1a1a;}
.step--done .step-dot{background:var(--blue2);border-color:var(--blue2);color:#fff;}
.step--done .step-label{color:#1a1a1a;}
.step--missing .step-dot{background:#e5484d;border-color:#e5484d;color:#fff;font-size:13px;}
.step--missing .step-label{color:#e5484d;}
.step-line{flex:1;height:2px;background:#c9ced6;margin:0 6px;margin-bottom:22px;min-width:34px;}
.step-line.on{background:var(--blue2);}

/* Results head / empty states */
.results-head{display:flex;gap:10px;align-items:center;padding:12px 14px;font-size:14px;color:#555;font-weight:600;}

/* ---------- Category page ---------- */
.cat-chips{
    position:sticky;top:48px;z-index:25;display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;
    padding:10px 12px;background:#fff;border-bottom:1px solid #f1f3f6;scroll-behavior:smooth;
}
.cat-chips::-webkit-scrollbar{display:none;}
.chip{
    flex-shrink:0;display:flex;align-items:center;gap:6px;padding:4px 10px 4px 4px;
    border:1px solid #e0e3e8;border-radius:20px;background:#fff;color:#212121;font-size:13px;font-weight:500;
    transition:background .15s,border-color .15s;
}
.chip-img{width:26px;height:26px;border-radius:50%;background:#f1f3f6;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.chip-img img{width:22px;height:22px;object-fit:contain;mix-blend-mode:multiply;}
.chip-img--all{color:#2874f0;}
.chip-count{font-size:11px;font-weight:600;color:#878787;background:#f1f3f6;border-radius:10px;padding:1px 6px;}
.chip--on{background:#eaf1fe;border-color:#2874f0;color:#1f4bd8;font-weight:600;}
.chip--on .chip-img{background:#fff;}
.chip--on .chip-count{background:#2874f0;color:#fff;}

.list-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px 2px;max-width:520px;margin:0 auto;}
.lb-count{font-size:13px;color:#5f6368;}
.lb-count b{color:#212121;font-weight:700;}
.lb-sort{display:flex;align-items:center;gap:6px;font-size:12px;color:#5f6368;}
.lb-sort select{
    appearance:none;-webkit-appearance:none;font:inherit;font-size:12px;font-weight:600;color:#212121;
    background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%23555' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 9px center;
    border:1px solid #e0e3e8;border-radius:8px;padding:6px 26px 6px 10px;cursor:pointer;
}

.cat-empty{margin:12px;padding:28px 20px 24px;background:#fff;border-radius:10px;text-align:center;box-shadow:0 1px 3px rgba(0,0,0,.08);}
.cat-empty-img{width:96px;height:96px;margin:0 auto 14px;border-radius:50%;background:#f1f3f6;display:flex;align-items:center;justify-content:center;}
.cat-empty-img img{width:70px;height:70px;object-fit:contain;mix-blend-mode:multiply;}
.cat-empty h2{font-size:17px;font-weight:700;color:#212121;margin-bottom:6px;}
.cat-empty p{font-size:13px;color:#5f6368;line-height:1.5;margin-bottom:16px;}
.cat-empty-links{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:18px;}
.cat-empty-links a{font-size:13px;font-weight:600;color:#2874f0;border:1px solid #cfdcf7;border-radius:18px;padding:6px 12px;}
.cat-empty-links span{color:#878787;font-weight:500;}
.results-cat{color:var(--blue2);font-weight:800;}
.empty{text-align:center;padding:60px 24px;}
.empty-emoji{font-size:52px;margin-bottom:14px;}
.empty p{color:#555;margin-bottom:18px;}

.btn-primary{display:inline-block;background:var(--blue2);color:#fff;font-weight:800;padding:13px 26px;border-radius:10px;font-size:15px;border:0;cursor:pointer;}

/* Flash toast (inline) */
.flash{background:#e7f7ee;color:#137a4b;font-weight:700;text-align:center;padding:10px;font-size:14px;}

/* ---------------- Product detail ---------------- */
/* light grey stage like Flipkart; the white product photos are blended into it below */
.pd-gallery{background:#fff;position:relative;padding:0;display:flow-root;}   /* flow-root keeps the dots margin inside the white strip */
.pd-actions{position:absolute;right:16px;top:16px;z-index:2;display:flex;flex-direction:column;gap:12px;}
.pd-icon{width:32px;height:32px;padding:4px;border:0;border-radius:8px;background:rgba(255,255,255,.88);color:#333;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.pd-icon .pd-ic{stroke-width:1.4;}
.pd-icon:active{transform:scale(.94);}
/* image slider: full-width slides, finger-follow swipe, snaps in .25s (see main.js) */
.pd-slider{overflow:hidden;width:100%;touch-action:pan-y;cursor:grab;}
.pd-slider.dragging{cursor:grabbing;}
.pd-track{display:flex;transition:transform .25s cubic-bezier(0,0,.3,1);will-change:transform;}
.pd-slide{flex:0 0 100%;height:420px;padding:16px;display:flex;align-items:center;justify-content:center;background:#f1f2f4;}
.pd-slide img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;mix-blend-mode:multiply;user-select:none;-webkit-user-drag:none;pointer-events:none;}
/* sliding dot indicator: 6 dots visible, active is blue and largest, neighbours shrink with distance */
/* 25px white strip under the photos, dots window centred in it */
.pd-dots{width:fit-content;max-width:96px;height:16px;margin:4.5px auto;overflow:hidden;display:flex;align-items:center;}
.pd-dots-track{display:flex;align-items:center;transition:transform .25s cubic-bezier(0,0,.3,1);}
.pd-dot{flex:0 0 8px;width:8px;height:8px;margin:0 4px;border-radius:50%;background:#e0e0e0;transform:scale(.4);transition:transform .25s,background-color .25s;}
.pd-dot.on{background:#1152e0;}
.pd-slider{-webkit-tap-highlight-color:transparent;}

/* ---------- Full-image viewer (tap a gallery photo) ---------- */
.fiv{position:fixed;top:0;bottom:0;left:0;right:0;max-width:480px;margin:0 auto;z-index:100;background:#fff;overflow:hidden;}
.fiv[hidden]{display:none;}
.fiv:focus{outline:none;}
.fiv-close:focus{outline:none;} .fiv-close:focus-visible{outline:2px solid #2874f0;outline-offset:-6px;}
.fiv-close{position:absolute;top:0;left:0;z-index:3;width:50px;height:50px;border:0;border-radius:50%;background:transparent;display:flex;align-items:center;justify-content:center;cursor:pointer;}
.fiv-stage{position:absolute;inset:0;overflow:hidden;touch-action:none;}
.fiv-track{display:flex;height:100%;transition:transform .25s cubic-bezier(0,0,.3,1);will-change:transform;}
.fiv-slide{flex:0 0 100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.fiv-slide img{width:100%;height:auto;max-height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none;pointer-events:none;transform-origin:0 0;}
.fiv-slide img.zoomed{transition:none;}
.fiv-slide img.zoom-anim{transition:transform .25s ease-out;}
/* dots: 7px grey, active becomes a 12px pill that fills dark grey */
.fiv-dots{position:absolute;left:0;right:0;bottom:0;z-index:2;height:31px;padding:5px 0;display:flex;align-items:center;justify-content:center;}
.fiv-dot{position:relative;flex:0 0 auto;width:7px;height:7px;margin:0 2px;border-radius:50%;background:#e1e1e1;}
.fiv-dot::before{content:"";position:absolute;top:50%;left:50%;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;border-radius:50%;background:#818181;transform:scale(0);transition:transform .3s ease-out;}
.fiv-dot.on{width:12px;}
.fiv-dot.on::before{width:12px;margin-left:-6px;border-radius:3px;transform:scale(1);}

.pd-info{background:#fff;padding:16px;margin-top:8px;}
.pd-gallery + .pd-info,.pd-gallery + .fiv + .pd-info{margin-top:0;}   /* white runs on from the dots strip into the title, no grey gap */
.pd-title{font-size:19px;font-weight:600;line-height:1.35;margin-bottom:12px;}
.pd-rate{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:14px;}
.rate-badge{background:var(--green);color:#fff;font-size:13px;font-weight:800;padding:3px 8px;border-radius:5px;}
.pd-reviews{color:var(--muted);font-size:14px;font-weight:600;}
.pd-rate a{cursor:pointer;}
#reviews{scroll-margin-top:56px;}   /* lands just below the sticky header */
.pd-assured{height:21px;width:auto;margin-left:auto;}   /* pinned to the right end of the rating row */
/* product price row, Flipkart-style: ↓38%  23,999  ₹14,999 — all 22px/28px */
.pd-price{display:flex;align-items:center;flex-wrap:wrap;}
.pd-price-off{display:inline-flex;align-items:center;color:#008042;font-size:22px;font-weight:800;line-height:28px;}
.pd-price-off svg{flex:0 0 20px;}
.pd-price-mrp{margin-left:6px;color:#707070;font-size:22px;font-weight:400;line-height:28px;text-decoration:line-through;}
.pd-price-now{margin-left:5px;color:#333;font-size:22px;font-weight:800;line-height:28px;}
.pd-off{color:var(--green);font-weight:800;font-size:16px;}
.pd-pack{margin-top:8px;color:#212529;font-size:14px;line-height:21px;margin-bottom:4px;}
.pd-pack .mrp{color:#808080;font-size:14px;text-decoration:line-through;}   /* grey struck ₹99, like the reference */
.pd-freedel{color:#333;font-size:14px;margin-top:2px;}

.pd-express{background:#fff;padding:20px 16px;display:flex;gap:0;align-items:center;}
.pd-exp-title{font-size:15px;} .free{color:var(--green);font-weight:800;}
.pd-exp-sub{font-size:14px;color:#333;margin-top:2px;}
.pd-exp-offer{font-size:13px;color:#555;margin-top:2px;}
.pd-exp-offer b{color:var(--red);}

.pd-wow{background:#fff;padding:20px 16px;display:flex;gap:0;align-items:center;}
/* Express truck and WOW Deal share one 62x35 icon slot + 15px gap, so their texts start on the same line */
.pd-wow-badge,.pd-truck{width:62px;height:35px;flex:0 0 62px;margin-right:15px;}
.pd-wow-badge{object-fit:contain;object-position:left center;}
.pd-wow-title{font-size:16px;} .pd-wow-title b{color:var(--green);font-size:18px;}
.pd-wow-sub{font-size:13px;color:#555;}

.pd-section{background:#fff;padding:20px 16px;}
.pd-section .pd-h2{font-size:17px;font-weight:700;line-height:22px;color:#333;margin-bottom:16px;}
.pd-h2{font-size:16px;font-weight:800;margin-bottom:12px;}
.pd-highlights{list-style:none;display:flex;flex-direction:column;gap:8px;}
.pd-highlights li{position:relative;padding-left:18px;font-size:14px;color:#333;}
.pd-highlights li::before{content:'•';position:absolute;left:2px;color:var(--blue2);font-weight:900;}
.pd-warranty{background:#fff;padding:20px 16px;font-size:14px;color:#333;}
/* product page: one continuous white page; sections split by a 1px #ebebeb line inset 16px (Flipkart-style) instead of 8px grey gaps */
.pd-express,.pd-wow,.pd-section,.pd-warranty{position:relative;}
.pd-express::before,.pd-wow::before,.pd-section::before,.pd-warranty::before{content:"";position:absolute;top:0;left:16px;right:16px;height:1px;background:#ebebeb;}

.pd-similar{display:flex;gap:12px;overflow-x:auto;padding-bottom:6px;-webkit-overflow-scrolling:touch;}
.sim-card{min-width:140px;max-width:140px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:10px;}
/* similar-product card body, Flipkart sizes: rating chip on the photo, 1-line name, OFF %, mrp + price, bank offer, delivery */
.sim-img{position:relative;height:120px;display:flex;align-items:center;justify-content:center;margin-bottom:8px;}
.sim-img img{max-width:100%;max-height:100%;object-fit:contain;}
.sim-chip{position:absolute;left:4px;bottom:4px;display:inline-flex;align-items:center;gap:2px;padding:4px;border-radius:4px;background:rgba(255,255,255,.88);box-shadow:0 0 0 1px rgba(0,0,0,.04);color:#333;font-size:11px;font-weight:700;line-height:14px;}
.sim-chip svg{display:block;}
.sim-name{font-size:12px;font-weight:700;line-height:16px;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:4px;}
.sim-off{font-size:11px;font-weight:700;line-height:14px;color:#008042;margin-bottom:2px;}
.sim-price{display:flex;align-items:center;gap:4px;flex-wrap:wrap;margin-bottom:4px;}
.sim-mrp{font-size:11px;font-weight:400;line-height:14px;color:#707070;text-decoration:line-through;}
.sim-now{font-size:14px;font-weight:700;line-height:18px;color:#333;}
.sim-offer{font-size:11px;font-weight:700;line-height:14px;color:#133fb9;margin-bottom:2px;}
.sim-del{font-size:11px;font-weight:400;line-height:14px;color:#333;}
.sim-del b{font-weight:700;}

/* "All details" (Flipkart-style): heading + collapse button, chip tabs, label/value grid */
.ad-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px;}
.pd-section .ad-head .pd-h2{margin:0;}
.ad-toggle{flex:0 0 32px;width:32px;height:32px;padding:0;border:0;border-radius:8px;background:#f5f5f5;display:flex;align-items:center;justify-content:center;cursor:pointer;}
.ad-toggle svg{transition:transform .2s;}
.ad-toggle[aria-expanded="false"] svg{transform:rotate(180deg);}
.is-collapsed > .ad-head{margin-bottom:0;}
section.pd-reviews > .ad-head,section.pd-hl > .ad-head{margin-bottom:16px;}
section.pd-reviews.is-collapsed > .ad-head,section.pd-hl.is-collapsed > .ad-head{margin-bottom:0;}
.pd-highlights[hidden]{display:none;}
.ad-tabs{display:flex;gap:8px;margin:0 -16px;padding:0 16px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
.ad-tabs::-webkit-scrollbar{display:none;}
.ad-tab{flex:0 0 auto;height:35px;padding:0 12px;border:.5px solid #d6d6d6;border-radius:8px;background:#f5f5f5;color:#333;
    font-family:inherit;font-size:14px;font-weight:400;line-height:18px;white-space:nowrap;cursor:pointer;}
.ad-tab.is-active{background:#1f1f1f;color:#fff;font-weight:700;}
.ad-panel{margin-top:18px;}
.ad-group + .ad-group{margin-top:18px;}
.ad-group-title{font-size:14px;font-weight:700;line-height:18px;color:#333;margin-bottom:12px;}
.ad-grid{display:grid;grid-template-columns:1fr 1fr;column-gap:16px;row-gap:12px;}
.ad-cell{min-width:0;padding-bottom:8px;border-bottom:1px solid #ebebeb;}
.ad-cell--wide{grid-column:1 / -1;}
.ad-label{font-size:12px;line-height:16px;color:#707070;}
.ad-value{font-size:14px;line-height:18px;color:#333;overflow-wrap:anywhere;}
.ad-desc{font-size:14px;line-height:1.6;color:#333;}
.ad-desc p + p{margin-top:10px;}
.ad-showcase{margin:0 -16px;}
.ad-showcase img{display:block;width:100%;height:auto;}
.ad-showcase--all{margin:0;}
.ad-showcase--all img + img{margin-top:5px;}
.ad-more{display:flex;justify-content:center;padding-top:16px;}
.ad-more-btn{display:inline-flex;align-items:center;gap:8px;height:34px;padding:0 12px;border:1px solid #d6d6d6;border-radius:8px;background:#fff;
    color:#333;font-family:inherit;font-size:14px;font-weight:700;line-height:18px;cursor:pointer;}
.ad-sheet-body{padding:16px;}

.pd-spacer{height:76px;}

/* Sticky buy bar */
.buybar{position:fixed;left:50%;transform:translateX(-50%);bottom:0;width:100%;max-width:480px;
    background:#fff;display:flex;gap:0;box-shadow:0 -2px 10px rgba(0,0,0,.12);z-index:40;}
.buybar-cart,.buybar-buy{flex:1;border:0;padding:16px;font-size:16px;font-weight:800;cursor:pointer;text-align:center;}
.buybar-cart{background:#fff;color:var(--blue2);border:1px solid var(--blue2);}
.buybar-buy{background:var(--yellow);color:#1a1a1a;}
/* product page bar: outlined blue "Add to Cart" + wider yellow "Buy Now", rounded, floating on a white strip */
.buybar--pd{padding:10px 8px;gap:8px;align-items:center;box-shadow:0 -2px 10px rgba(0,0,0,.08);}
.buybar--pd .buybar-cart{flex:1 1 0;min-width:0;height:48px;padding:0;background:#fff;color:#2874f0;border:2px solid #2874f0;border-radius:10px;font-size:14px;font-weight:600;gap:6px;transition:.25s;}
.buybar--pd .buybar-cart .bb-ic{width:16px;height:16px;}
/* "Buy at ₹…" — Flipkart's yellow gradient pill */
.buybar--pd .buybar-buy{flex:1 1 0;min-width:0;height:48px;padding:0 6px;line-height:18px;display:flex;align-items:center;justify-content:center;background:linear-gradient(90deg,#ffe51f,#ffcd03);color:#333;border:0;border-radius:12px;font-size:15px;font-weight:700;white-space:nowrap;transition:.25s;}
@media (hover:hover){
    .buybar--pd .buybar-cart:hover{background:#2874f0;color:#fff;}
    .buybar--pd .buybar-buy:hover{filter:brightness(1.03);transform:scale(1.03);}
}
.buybar--pd .buybar-cart:active,.buybar--pd .buybar-buy:active{transform:scale(.97);}
.buybar--summary{align-items:center;padding:10px 14px;gap:14px;}
.bb-total{display:flex;flex-direction:column;line-height:1.15;}
.bb-total .mrp{font-size:13px;} .bb-total b{font-size:20px;font-weight:900;} .bb-total small{color:#777;font-size:12px;}
/* cart page: price on the left, orange Continue filling the rest of the bar (same orange as the cart drawer) */
.buybar--cart{padding:10px 8px 10px 14px;box-shadow:0 -2px 10px rgba(0,0,0,.08);}
.buybar--cart .bb-total{flex:0 0 auto;}
.buybar--summary.buybar--cart .buybar-buy{flex:0 0 170px;min-width:0;width:170px;height:50px;margin-left:auto;padding:0;display:flex;align-items:center;justify-content:center;
    border-radius:10px;background:#fb641b;color:#fff;font-size:16px;font-weight:700;letter-spacing:.025em;}
.buybar--summary.buybar--cart .buybar-buy:active{transform:scale(.98);}
.buybar--summary .buybar-buy{flex:0 0 auto;min-width:170px;border-radius:8px;padding:14px 20px;background:var(--blue2);color:#fff;}

/* ---------------- Address form ---------------- */
.addr-form{padding:14px;}
.field{margin-bottom:14px;position:relative;flex:1;}
.field input,.field select{width:100%;border:1px solid #cfd4da;border-radius:6px;padding:15px 12px;font-size:15px;background:#fff;outline:none;}
.field input:focus,.field select:focus{border-color:var(--blue2);}
.field.has-err input,.field.has-err select{border-color:var(--red);}
.field select:invalid{color:#878787;}   /* "Select State" reads like a placeholder until a state is picked */
.field select option{color:#212121;}
.field .err{color:var(--red);font-size:12px;margin-top:4px;display:block;}
.field-row{display:flex;gap:12px;}
.field-select{position:relative;}
.field-label{position:absolute;top:-8px;left:10px;background:#fff;padding:0 5px;font-size:11px;color:var(--blue2);z-index:1;}
/* ---------- Free-shipping banner (address page): plays once on load ---------- */
.ship-banner{position:relative;overflow:hidden;display:flex;align-items:center;justify-content:space-between;gap:10px;
    min-height:84px;padding:10px 16px 8px 10px;margin:8px 0 20px;border-radius:8px;background:linear-gradient(90deg,#ffe0e6,#ffe9c9);}
.ship-banner::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:35%;pointer-events:none;
    background:linear-gradient(100deg,transparent,rgba(255,255,255,.65),transparent);transform:skewX(-18deg);
    animation:shipShine .9s ease-in 1.55s both;}
.ship-scene{position:relative;flex:0 0 150px;height:64px;}
.ship-van{position:absolute;left:0;bottom:0;animation:shipDrive 1.1s cubic-bezier(.2,.75,.25,1) .15s both;}
.ship-wheel{transform-box:fill-box;transform-origin:center;animation:shipWheel 1.1s cubic-bezier(.2,.75,.25,1) .15s both;}
.ship-box{position:absolute;bottom:10px;width:22px;height:18px;border-radius:2px;background:#d9a066;box-shadow:inset 0 -3px 0 rgba(0,0,0,.08);
    animation:shipDrop .55s cubic-bezier(.3,1.5,.5,1) both;}
.ship-box::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:4px;margin-left:-2px;background:#f3d9b0;}
.ship-box--1{left:116px;animation-delay:1.1s;}
.ship-box--2{left:122px;bottom:28px;width:18px;height:15px;background:#c98d52;animation-delay:1.3s;}
.ship-text{flex:1;min-width:0;text-align:right;color:#1a1a1a;animation:shipText .6s ease-out .85s both;}
.ship-text b{display:block;font-size:21px;font-weight:900;line-height:1.15;letter-spacing:-.2px;}
.ship-text span{display:block;font-size:14px;font-weight:600;margin-top:2px;}
.ship-text sup{font-size:9px;}
@keyframes shipDrive{0%{transform:translateX(-170px);}82%{transform:translateX(5px);}100%{transform:translateX(0);}}
@keyframes shipWheel{from{transform:rotate(-900deg);}to{transform:rotate(0);}}
@keyframes shipDrop{0%{transform:translateY(-60px);opacity:0;}40%{opacity:1;}100%{transform:translateY(0);opacity:1;}}
@keyframes shipText{from{opacity:0;transform:translateX(16px);}to{opacity:1;transform:none;}}
@keyframes shipShine{from{left:-40%;}to{left:120%;}}
@media (prefers-reduced-motion:reduce){
    .ship-banner::after,.ship-van,.ship-wheel,.ship-box,.ship-text{animation:none;}
}
.btn-save{width:100%;background:#f36f21;padding:16px;font-size:16px;}
/* address page: Save Address pinned to the bottom like the product page buy bar */
.save-bar{position:fixed;left:50%;transform:translateX(-50%);bottom:0;width:100%;max-width:480px;z-index:40;
    padding:10px 8px calc(10px + env(safe-area-inset-bottom,0px));background:#fff;box-shadow:0 -2px 10px rgba(0,0,0,.08);}
.save-bar .btn-save{display:flex;align-items:center;justify-content:center;height:48px;padding:0;margin:0;}
.addr-form:has(.save-bar){padding-bottom:84px;}   /* room so the last field / banner isn't hidden behind the bar */

/* ---------------- Cart / Order summary ---------------- */
.deliver-to{background:#fff;padding:14px;margin-bottom:8px;display:flex;justify-content:space-between;gap:12px;align-items:flex-start;}
.dt-name{font-size:14px;} .dt-addr{font-size:13px;color:#555;margin-top:3px;line-height:1.4;}
.dt-mobile{font-size:13px;color:#555;margin-top:3px;}
.dt-change{color:var(--blue2);font-weight:800;border:1px solid var(--blue2);border-radius:6px;padding:8px 16px;font-size:14px;white-space:nowrap;}

.cart-item{background:#fff;padding:14px;margin-bottom:8px;}
.ci-tags{display:flex;gap:8px;margin-bottom:10px;}
.ci-tag{font-size:12px;font-weight:800;} 
.ci-tag--seller{background:#e7f7ee;color:#137a4b;padding:3px 8px;border-radius:4px;}
.ci-body{display:flex;gap:14px;}
.ci-img{width:90px;flex:0 0 90px;height:110px;display:flex;align-items:center;justify-content:center;}
.ci-img img{max-width:100%;max-height:100%;object-fit:contain;}
.ci-info{flex:1;}
.ci-name{font-size:14.5px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.ci-rate{display:flex;align-items:center;gap:8px;margin:6px 0;} .ci-rate .assured-badge{height:18px;}
.ci-price{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;}
.ci-now{font-size:18px;font-weight:900;}
.ci-coupon{color:var(--green);font-size:12.5px;font-weight:600;margin-top:6px;}
.ci-footer{display:flex;align-items:center;gap:16px;margin-top:12px;}
.qty{display:flex;align-items:center;border:1px solid #cfd4da;border-radius:6px;overflow:hidden;}
.qty form{display:flex;} .qty button{width:36px;height:36px;border:0;background:#f5f6f8;font-size:20px;cursor:pointer;color:#333;}
.qty-n{width:40px;text-align:center;font-weight:700;}
/* same red trash button as the cart drawer, pushed to the right end of the qty row */
.ci-remove-form{margin-left:auto;}
.ci-remove{width:34px;height:34px;display:flex;align-items:center;justify-content:center;padding:0;border:0;border-radius:50%;
    background:#fdecec;color:#e5484d;cursor:pointer;transition:background-color .15s;}
.ci-remove:hover,.ci-remove:active{background:#fbd5d5;}
.ci-delivery{margin-top:12px;padding-top:12px;border-top:1px solid var(--line);font-size:13px;color:#333;}

.price-details{background:#fff;padding:16px;margin-bottom:8px;}
/* "Rest assured with Open Box Delivery" (cart page) */
.ob-section{background:#fff;padding:12px 16px;margin-bottom:8px;box-shadow:0 1px 3px rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);}
.ob-title{display:flex;align-items:center;gap:8px;padding-bottom:8px;border-bottom:1px solid #f3f4f6;color:#854d0e;font-size:13px;font-weight:700;}
.ob-title svg{flex:0 0 16px;}
.ob-text{margin-top:8px;font-size:12px;line-height:1.375;color:#4b5563;}
/* cart page: thinner 4px grey gaps between the sections */
.app:has(.buybar--cart) .steps,
.app:has(.buybar--cart) .deliver-to,
.app:has(.buybar--cart) .cart-item,
.app:has(.buybar--cart) .ob-section{margin-bottom:4px;}
.prow{display:flex;justify-content:space-between;font-size:14px;color:#333;margin-bottom:10px;}
.prow--total{font-weight:900;font-size:16px;border-top:1px dashed var(--line);padding-top:12px;}
.prow-save{color:var(--green);font-weight:700;font-size:13px;margin-top:6px;}

/* ---------------- Payment ---------------- */
.pay{background:#fff;padding:16px;margin-bottom:8px;}
.pay-opt{display:flex;align-items:center;gap:12px;padding:14px 10px;border:1px solid var(--line);border-radius:10px;margin-bottom:10px;cursor:pointer;}
.pay-opt input{display:none;}
.pay-radio{width:20px;height:20px;border-radius:50%;border:2px solid #c9ced6;flex:0 0 20px;position:relative;}
.pay-opt--active{border-color:var(--blue2);background:#f4f8ff;}
.pay-opt--active .pay-radio{border-color:var(--blue2);}
.pay-opt--active .pay-radio::after{content:'';position:absolute;inset:3px;border-radius:50%;background:var(--blue2);}
.pay-opt--disabled{opacity:.55;cursor:not-allowed;}
.pay-ic{font-size:22px;}
.pay-text{display:flex;flex-direction:column;} .pay-text small{color:#777;font-size:12px;}
.pay-note{font-size:12.5px;color:#777;line-height:1.5;margin-top:6px;background:#f7f8fa;padding:12px;border-radius:8px;}

/* ---------------- Success ---------------- */
.success{background:#fff;text-align:center;padding:34px 20px 26px;margin-bottom:8px;}
.success-check{width:72px;height:72px;border-radius:50%;background:var(--green);color:#fff;font-size:40px;
    display:flex;align-items:center;justify-content:center;margin:0 auto 16px;box-shadow:0 6px 18px rgba(34,160,107,.35);animation:pop .4s ease;}
@keyframes pop{0%{transform:scale(.4);opacity:0;}100%{transform:scale(1);opacity:1;}}
.success-title{font-size:24px;font-weight:900;margin-bottom:6px;}
.success-sub{color:#555;font-size:14px;margin-bottom:14px;}
.success-id{font-size:15px;} .success-id b{color:var(--blue2);}
.success-date{color:#888;font-size:13px;margin-top:4px;}
.os-line{display:flex;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--line);}
.os-prices{margin-top:14px;}   /* price / discount / delivery / total under the items on the success page */
.os-img{width:54px;height:54px;flex:0 0 54px;display:flex;align-items:center;justify-content:center;}
.os-img img{max-width:100%;max-height:100%;object-fit:contain;}
.os-info{flex:1;} .os-name{font-size:13.5px;line-height:1.3;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.os-meta{font-size:12px;color:#777;margin-top:2px;} .os-price{font-weight:800;font-size:14px;}
.success-actions{padding:18px 14px 30px;text-align:center;}
.success-actions .btn-primary{width:100%;}

/* search page input */
.search--page{margin:12px 14px;box-shadow:0 1px 4px rgba(0,0,0,.1);}
.search--page .search-ic{border:0;background:none;cursor:pointer;}

/* ---------- SVG icon colours / alignment ---------- */
.pay-ic{display:flex;align-items:center;color:var(--blue2);}
.pd-truck{color:#f36f21;display:flex;align-items:center;justify-content:flex-start;overflow:hidden;}
/* truck.webp is a 360x360 square with the truck in a 318x162 band (x 21-338, y 99-260).
   Drawn at 70x70 and nudged 4px left, the truck itself spans the full 62px slot width like the WOW badge;
   only the empty top/bottom padding falls outside the 35px slot. Re-tune if the image is replaced. */
/* the truck is a one-colour shape, so it's used as a mask and filled with the site orange (swap background to recolour) */
.pd-truck-img{width:70px;height:70px;flex:0 0 70px;margin-left:-4px;background:#fb641b;
    -webkit-mask:var(--truck) center/contain no-repeat;mask:var(--truck) center/contain no-repeat;}
.ci-truck{vertical-align:-4px;margin-right:5px;color:#555;}
.pd-warr-ic{vertical-align:-4px;margin-right:6px;color:var(--blue2);}
/* 3 store promises under the warranty line: 32px icon tile + 12px centred label, equal thirds */
.pd-promise{display:flex;justify-content:space-between;margin-top:16px;}
.pd-promise-item{flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;text-align:center;}
.pd-promise-item svg{display:block;margin-bottom:6px;}
.pd-promise-item span{font-size:12px;line-height:16px;color:#333;font-weight:400;white-space:nowrap;}
.buybar-cart{display:flex;align-items:center;justify-content:center;gap:8px;}
.buybar-cart .bb-ic{flex:0 0 auto;}

/* ---------- Bottom navigation (Flipkart-style) ---------- */
.bn-spacer{height:64px;}
.bottomnav{
    position:fixed;left:50%;transform:translateX(-50%);bottom:0;
    width:100%;max-width:480px;background:#fff;display:flex;z-index:45;
    box-shadow:0 -1px 8px rgba(0,0,0,.08);
    padding-bottom:env(safe-area-inset-bottom,0);
}
.bn-item{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;padding:8px 0 9px;color:#1f1f1f;}
.bn-on{color:#1254e7;}
.bn-on .bn-label{font-weight:600;}   /* active tab label semi-bold, like Flipkart */
.bn-ic{position:relative;display:flex;align-items:center;justify-content:center;}
.bn-label{font-size:11px;line-height:1;}
.bn-badge{position:absolute;top:-6px;right:-9px;background:var(--red);color:#fff;font-size:9px;font-weight:800;
    min-width:15px;height:15px;border-radius:8px;display:flex;align-items:center;justify-content:center;padding:0 4px;}

/* ---------- Ratings & reviews (product page + reviews.php), Flipkart-style ---------- */
.rv-empty{font-size:14px;color:#707070;}
.rv-score{display:flex;align-items:center;gap:6px;margin-bottom:6px;}
.rv-avg{font-size:24px;font-weight:700;line-height:30px;color:#333;}
.rv-label{margin-left:6px;padding:2px 6px;border-radius:4px;background:#e7fbf0;color:#007385;font-size:12px;line-height:16px;}
.rv-based{display:flex;align-items:center;gap:3px;flex-wrap:wrap;font-size:12px;line-height:16px;color:#707070;margin-bottom:16px;}
/* customer photos: one big tile + 2x2 small, "+N" over the last */
/* Customer photos (Flipkart): 195px row — large photo 45%, two columns of 2 at 27.5%; "+N" on the 5th */
.rv-photos{display:flex;gap:8px;height:195px;margin-bottom:16px;}
.rv-pcol{display:flex;flex-direction:column;gap:8px;min-width:0;}
.rv-pcol--big{flex:.45 1 0%;}
.rv-pcol--small{flex:.275 1 0%;}
.rv-photo{position:relative;flex:1 1 0%;min-height:0;display:block;border-radius:8px;overflow:hidden;background:#f5f5f5;}
.rv-photo img{width:100%;height:100%;object-fit:cover;display:block;}
.rv-photo-more{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.68);color:#fff;font-size:14px;font-weight:700;}
/* "Photos" page (+N): 3-column square grid, 6px gutters */
.app:has(.rp-grid){background:#fff;}
.rp-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:6px;}
.rp-cell{display:block;aspect-ratio:1;border-radius:2px;overflow:hidden;background:#f1f3f6;}
.rp-cell img{width:100%;height:100%;object-fit:cover;display:block;}
/* Full-screen photo viewer: black, ← back, swipe sideways between photos */
.pv{position:fixed;top:0;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:480px;z-index:300;background:#000;}
.pv[hidden]{display:none;}
.pv:focus{outline:none;}
.pv-back{position:absolute;top:0;left:0;z-index:2;width:52px;height:52px;display:flex;align-items:center;justify-content:center;padding:0;border:0;background:none;cursor:pointer;}
.pv-track{display:flex;height:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior:contain;}
.pv-track::-webkit-scrollbar{display:none;}
.pv-slide{flex:0 0 100%;height:100%;display:flex;align-items:center;justify-content:center;scroll-snap-align:center;scroll-snap-stop:always;padding:52px 0;}
.pv-slide img{max-width:100%;max-height:100%;object-fit:contain;display:block;}
/* per-aspect chips */
.rv-aspects{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;}
.rv-aspect{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;border-radius:8px;background:#eef7ff;color:#333;font-size:14px;line-height:18px;}
.rv-aspect b{font-size:12px;font-weight:700;line-height:16px;margin-left:4px;}
/* review cards: horizontal scroller on the product page, stacked list on reviews.php */
.rv-track{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:0 16px 4px;scroll-snap-type:x mandatory;scroll-padding:0 16px;}
.rv-track::-webkit-scrollbar{display:none;}
.rv-track .rv-card{flex:0 0 288px;scroll-snap-align:start;}
.rv-list{display:flex;flex-direction:column;gap:12px;}
.rv-card{background:#f5f5f5;border-radius:12px;padding:12px;display:flex;flex-direction:column;}
.rv-head{display:flex;align-items:center;gap:8px;min-width:0;margin-bottom:8px;}
.rv-chip{flex:0 0 auto;display:inline-flex;align-items:center;gap:2px;padding:2px 4px;border-radius:4px;background:#fff;color:#333;font-size:12px;font-weight:700;line-height:16px;}
.rv-title{flex:1;min-width:0;font-size:14px;font-weight:700;line-height:18px;color:#333;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.rv-ago{flex:0 0 auto;font-size:11px;line-height:14px;color:#707070;}
.rv-text{font-size:14px;line-height:18px;color:#333;}
.rv-text.clamped{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.rv-more{align-self:flex-start;padding:0;border:0;background:none;color:#1162f2;font:inherit;font-size:14px;font-weight:700;line-height:18px;cursor:pointer;}
.rv-foot{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;margin-top:auto;padding-top:12px;}
.rv-name{font-size:12px;line-height:16px;color:#333;}
.rv-verified{display:flex;align-items:center;gap:3px;font-size:11px;line-height:14px;color:#707070;margin-top:2px;}
.rv-votes{display:flex;align-items:center;gap:10px;font-size:12px;line-height:16px;color:#707070;}
.rv-votes span{display:inline-flex;align-items:center;gap:4px;}
.rv-all{display:flex;align-items:center;justify-content:center;height:44px;margin-top:16px;padding:0 6px;border:1px solid #d6d6d6;border-radius:12px;color:#333;font-size:14px;font-weight:700;line-height:18px;}
button.rv-all{width:100%;background:none;font-family:inherit;cursor:pointer;}   /* "Show More" under the All details showcase uses the same look */
/* reviews.php */
.rv-product{display:flex;align-items:center;gap:12px;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid #ebebeb;color:#333;font-size:14px;}
.rv-product img{width:48px;height:48px;object-fit:contain;flex:0 0 48px;}
.rv-page::before{display:none;}

/* ---------- "All Reviews" popup (product page) ---------- */
.rvp{position:fixed;top:0;bottom:0;left:0;right:0;max-width:480px;margin:0 auto;z-index:100;background:#fff;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;}
.rvp[hidden]{display:none;}
.rvp:focus{outline:none;}
.rvp-head{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:12px;padding:12px 14px;background:#fff;box-shadow:0 1px 4px rgba(0,0,0,.08);}
.rvp-back{display:flex;align-items:center;padding:0;border:0;background:none;color:#1a1a1a;cursor:pointer;}
.rvp-title{font-size:18px;font-weight:700;line-height:24px;color:#1a1a1a;}
.rvp-body{padding:16px;}

/* ---------- "Item added to cart" toast (Flipkart): dark bar 8px in from the sides, slides up above the buy bar ---------- */
.atc-toast{position:fixed;left:50%;bottom:calc(118px + env(safe-area-inset-bottom,0px));z-index:110;width:calc(min(100%,480px) - 16px);
    display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px;border-radius:4px;background:#202020;
    opacity:0;visibility:hidden;transform:translate(-50%,210px);
    transition:transform .3s cubic-bezier(.2,.8,.2,1),opacity .3s ease,visibility 0s .3s;}
.atc-toast.show{opacity:1;visibility:visible;transform:translate(-50%,0);transition-delay:0s;}
.atc-msg{min-width:0;font-size:14px;line-height:17px;color:#fff;}
.atc-go{flex:0 0 auto;padding:4px 8px;border-radius:4px;font-size:14px;line-height:17px;letter-spacing:1.25px;color:#ff9f00;text-decoration:none;}
.atc-go:active{background:rgba(255,159,0,.12);}

/* ---------- Empty cart (Flipkart /viewcart): grey box + "Suggested for You" row ---------- */
.app:has(.ec){background:#f1f2f4;}
.ec{display:flex;flex-direction:column;align-items:center;padding:16px;background:#f1f3f6;text-align:center;}
.ec-art{display:block;width:250px;height:200px;max-width:100%;}
.ec-title{margin:0;font-size:22px;line-height:30px;font-weight:600;color:#111112;}
.ec-sub{margin:4px 0 0;font-size:14px;line-height:20px;color:#717478;}
.ec-btn{display:inline-flex;align-items:center;justify-content:center;min-width:160px;height:36px;margin-top:32px;padding:8px 16px;
    border-radius:4px;background:#2a55e5;color:#fff;font-size:14px;line-height:20px;font-weight:600;}
.ec-btn:active{filter:brightness(.92);}
.ec-sug{margin-top:10px;padding:16px 0 13px;background:#fff;}
.ec-sug-h{margin:0;padding:0 16px;font-size:16px;line-height:20px;font-weight:500;color:#212121;}
.ec-sug-sub{margin:4px 0 0;padding:0 16px;font-size:14px;line-height:16px;color:#878787;}
.ec-row{display:flex;gap:8px;margin-top:42px;padding:0 16px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-padding:0 16px;}
.ec-row::-webkit-scrollbar{display:none;}
.ec-card{flex:0 0 148px;width:148px;border:1px solid #f0f0f0;border-radius:4px;background:#fff;overflow:hidden;}
.ec-img{display:flex;align-items:center;justify-content:center;height:148px;padding:2px;}
.ec-img img{max-width:100%;max-height:100%;object-fit:contain;}
.ec-body{padding:4px 8px 12px;}
.ec-name{display:block;font-size:12px;line-height:16px;color:#111112;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ec-price{display:flex;align-items:baseline;gap:4px;margin-top:4px;font-size:12px;line-height:20px;font-weight:500;}
.ec-price b{font-weight:500;color:#212121;}
.ec-price s{color:#878787;line-height:16px;}
.ec-off{display:flex;align-items:center;gap:4px;height:16px;margin-top:8px;font-size:12px;line-height:15px;font-weight:500;color:#008c00;}
.ec-off img{height:16px;width:auto;}
.ec-add{display:flex;align-items:center;justify-content:center;width:100%;height:32px;margin-top:6px;padding:0;border:1px solid #d5d7db;border-radius:4px;
    background:#fff;color:#2874f0;font:inherit;font-size:14px;line-height:20px;font-weight:500;cursor:pointer;}
.ec-add:active{background:#f5f8ff;}

/* ---------- Payment page (checkout) ---------- */
.pm-total{background:#eef4ff;margin-bottom:8px;}
.pm-total-bar{width:100%;display:flex;align-items:center;justify-content:space-between;background:none;border:0;padding:14px 16px;cursor:pointer;font:inherit;}
.pm-total-label{display:flex;align-items:center;gap:4px;font-size:16px;font-weight:700;color:#2874f0;}
.pm-total-chev{transition:transform .2s;}
.pm-total-bar[aria-expanded="true"] .pm-total-chev{transform:rotate(180deg);}
.pm-total-amt{font-size:18px;font-weight:800;color:#2874f0;}
.pm-total-details{padding:14px 16px 0;}
.pm-total-details[hidden]{display:none;}
.pm-total-details .prow{color:#374151;}
.pm-total-details::after{content:"";display:block;height:1px;background:#d3ddf3;margin:10px 0 0;}
.pm-cashback{display:flex;align-items:center;justify-content:space-between;gap:10px;overflow:hidden;position:relative;
    margin:0 12px 8px;padding:12px 14px;border:1px solid #bbf7d0;border-radius:8px;background:#f0fdf4;}
.pm-cashback-amt{font-size:15px;font-weight:800;color:#15803d;}
.pm-cb-num{display:inline-block;animation:pmPop 1.6s ease-in-out infinite;}
.pm-cashback-sub{font-size:12px;color:#15803d;margin-top:2px;}
/* overlapping app icons on the right of the cashback banner */
.pm-cb-apps{flex:0 0 auto;display:flex;align-items:center;}
.pm-cb-apps>*{margin-left:-8px;}
.pm-app{width:34px;height:34px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.15);display:flex;align-items:center;justify-content:center;overflow:hidden;}
.pm-app--more{font-size:12px;font-weight:700;color:#374151;}
.pm-app svg{display:block;}
.pm-cashback::after{content:"";position:absolute;top:0;bottom:0;left:-40%;width:30%;pointer-events:none;
    background:linear-gradient(100deg,transparent,rgba(255,255,255,.6),transparent);transform:skewX(-18deg);
    animation:pmShine 2.6s ease-in-out 1s infinite;}
@keyframes pmPop{0%,100%{transform:scale(1);}45%{transform:scale(1.18);}}
@keyframes pmShine{0%{left:-40%;}55%,100%{left:130%;}}
@media (prefers-reduced-motion:reduce){.pm-cb-num,.pm-cashback::after{animation:none;}}

.pm-form{background:transparent;}
.pm-group{background:#fff;padding:14px 16px 6px;margin-bottom:8px;}
.pm-head{display:flex;align-items:center;gap:12px;margin-bottom:10px;}
.pm-upi-badge{flex:0 0 auto;padding:4px 7px;border:1.5px solid #1a1a1a;border-radius:6px;font-size:12px;font-weight:800;color:#1a1a1a;letter-spacing:.5px;}
.pm-head b{font-size:14px;color:#1a1a1a;}
.pm-head small{display:block;font-size:12px;color:#6b7280;}
.pm-opt{display:flex;align-items:center;gap:12px;padding:14px;margin-bottom:10px;border:1px solid #e6e8eb;border-radius:8px;cursor:pointer;background:#fff;transition:border-color .15s,background-color .15s;}
.pm-opt--solo{margin:0 12px 8px;background:#fff;}
.pm-opt input{position:absolute;opacity:0;pointer-events:none;}
.pm-ic{flex:0 0 auto;width:34px;height:34px;display:flex;align-items:center;justify-content:center;border-radius:8px;background:#f1f5f9;color:#334155;}
.pm-ic--upi{background:#eef4ff;color:#2874f0;}
.pm-ic--qr{background:#f1f5f9;color:#111;}
.pm-opt > .pm-app{flex:0 0 auto;width:36px;height:36px;box-shadow:none;border:1px solid #eef0f3;}
.pm-opt-text{flex:1;min-width:0;display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.pm-opt-text b{font-size:14px;font-weight:600;color:#1a1a1a;}
.pm-opt-text small{flex-basis:100%;font-size:12px;color:#6b7280;}
.pm-fastest{padding:2px 6px;border-radius:4px;background:#dcfce7;color:#16a34a;font-size:10px;font-weight:700;}
.pm-radio{flex:0 0 auto;width:20px;height:20px;border-radius:50%;border:2px solid #c4c9d0;position:relative;}
.pm-opt input:checked ~ .pm-radio{border-color:#2874f0;}
.pm-opt input:checked ~ .pm-radio::after{content:"";position:absolute;inset:3px;border-radius:50%;background:#2874f0;}
.pm-opt:has(input:checked){border-color:#2874f0;background:#f0f9ff;box-shadow:0 0 0 1px #2874f0;}
.pm-unavail{flex:0 0 auto;padding:4px 8px;border-radius:4px;background:#e5e7eb;color:#4b5563;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;}
.pm-opt--off{cursor:default;opacity:.85;}
.pm-opt--off .pm-opt-text b{color:#6b7280;}
.pm-secure{display:flex;align-items:center;justify-content:center;gap:6px;margin:2px 12px 0;color:#6b7280;font-size:12px;font-weight:600;}
.pm-secure-ic{color:#16a34a;}
/* Pay button: full-width orange bar */
.buybar--summary.buybar--pay{padding:10px 12px;}
.buybar--summary.buybar--pay .buybar-buy{flex:1 1 auto;width:100%;height:50px;padding:0;display:flex;align-items:center;justify-content:center;
    border-radius:10px;background:#fb641b;color:#fff;font-size:16px;font-weight:700;letter-spacing:.02em;}
.buybar--summary.buybar--pay .buybar-buy:active{transform:scale(.99);}

/* "35 Crore happy customers" reassurance block (checkout) */
.pm-happy{text-align:center;color:#9aa0a6;padding:26px 24px 8px;}
.pm-happy p{font-size:20px;font-weight:800;line-height:1.3;margin-bottom:14px;}
.pm-happy svg{color:#b0b4b9;}

/* ================= Login page (phone-number only) ================= */
.login-top{position:relative;background:#2874f0;height:108px;display:flex;align-items:center;justify-content:center;}
.login-close{position:absolute;left:16px;top:18px;color:#fff;display:flex;}
.login-brand{display:flex;align-items:center;gap:9px;}
.login-name{color:#fff;font-style:italic;font-weight:800;font-size:24px;letter-spacing:.3px;}
.login-mark{display:block;}
.login-logo{display:block;height:32px;width:auto;max-width:240px;object-fit:contain;}   /* uploaded Account page logo (.svg) */
.login-sheet{background:#fff;border-radius:18px 18px 0 0;margin-top:-14px;position:relative;padding:26px 20px 90px;min-height:calc(100vh - 94px);}
.login-h1{font-size:21px;font-weight:800;color:#0f1720;margin:2px 0 6px;}
.login-sub{color:#6b7280;font-size:15px;margin:0 0 28px;}
.login-field{position:relative;border:2px solid #2874f0;border-radius:8px;height:56px;display:flex;align-items:center;gap:8px;padding:0 14px;}
.login-flabel{position:absolute;top:-9px;left:12px;background:#fff;padding:0 6px;font-size:12px;font-weight:600;color:#2874f0;}
.login-cc{display:flex;align-items:center;gap:4px;font-size:17px;color:#0f1720;}
.login-input{flex:1;min-width:0;border:0;outline:0;background:transparent;font-size:17px;color:#0f1720;letter-spacing:.5px;}
.login-field.has-err{border-color:#ff5252;}
.login-field.has-err .login-flabel{color:#ff5252;}
.login-err{display:block;color:#ff5252;font-size:13px;margin:9px 2px 0;}
.login-bar{position:fixed;left:0;right:0;bottom:0;z-index:40;background:#fff;padding:12px 16px;box-shadow:0 -2px 10px rgba(0,0,0,.07);max-width:520px;margin:0 auto;}
.login-continue{width:100%;height:52px;border:0;border-radius:4px;background:#c7ccd1;color:#fff;font-size:16px;font-weight:700;cursor:not-allowed;transition:background .15s;}
.login-continue.is-on{background:#fb641b;cursor:pointer;}

/* ================= Account / My Orders ================= */
.acct-user{display:flex;align-items:center;gap:12px;background:#fff;padding:14px 16px;}
.acct-avatar{width:44px;height:44px;border-radius:50%;background:#eaf1ff;display:flex;align-items:center;justify-content:center;color:#2874f0;flex:none;}
.acct-user-name{font-weight:800;font-size:16px;color:#0f1720;}
.acct-user-mob{color:#6b7280;font-size:14px;margin-top:1px;}
.acct-logout{margin-left:auto;color:#2874f0;font-weight:700;font-size:14px;}
.acct-count{padding:12px 16px 2px;font-size:15px;color:#374151;}
.acct-count b{color:#0f1720;}
.acct-empty{text-align:center;padding:52px 24px;background:#fff;margin-top:8px;}
.acct-empty-emoji{font-size:44px;}
.acct-empty h2{font-size:18px;margin:12px 0 6px;color:#0f1720;}
.acct-empty p{color:#6b7280;font-size:14px;margin:0 auto 20px;max-width:280px;}

.order-card{background:#fff;margin:8px 0;padding:14px 16px;}
.order-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;}
.order-id{font-weight:800;font-size:15px;color:#0f1720;}
.order-date{color:#6b7280;font-size:13px;margin-top:2px;}
.order-badge{font-size:12px;font-weight:700;padding:5px 11px;border-radius:20px;white-space:nowrap;}
.order-badge--0,.order-badge--1{background:#eaf1ff;color:#2874f0;}              /* Order Placed, Dispatched */
.order-badge--2,.order-badge--3{background:#fff3e6;color:#fb641b;}              /* In Transit, Out for Delivery */
.order-badge--4{background:#e7f6ec;color:#008042;}                              /* Delivered */

.order-track{display:flex;margin:18px 0 8px;}
.ot-step{flex:1;position:relative;text-align:center;}
.ot-step::before{content:"";position:absolute;top:6px;left:-50%;width:100%;height:2px;background:#e0e4ea;}
.ot-step:first-child::before{display:none;}
.ot-dot{position:relative;z-index:1;display:block;width:14px;height:14px;border-radius:50%;background:#e0e4ea;margin:0 auto 7px;}
.ot-label{display:block;font-size:10.5px;line-height:1.2;color:#9aa3af;padding:0 2px;}
.ot-done::before{background:#008042;}
.ot-done .ot-dot{background:#008042;}
.ot-done .ot-label{color:#374151;}
.ot-now .ot-dot{box-shadow:0 0 0 4px rgba(0,128,66,.15);}
.order-note{font-size:13px;color:#374151;margin:2px 0 10px;}

.order-item{display:flex;gap:12px;padding:10px 0;border-top:1px solid #f0f2f5;}
.oi-img{width:56px;height:56px;flex:none;}
.oi-img img{width:100%;height:100%;object-fit:contain;}
.oi-name{font-size:14px;color:#0f1720;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.oi-meta{font-size:12px;color:#6b7280;margin-top:3px;}
.oi-price{font-weight:700;margin-top:3px;color:#0f1720;}
.order-foot{display:flex;justify-content:space-between;align-items:center;border-top:1px solid #f0f2f5;padding-top:10px;margin-top:6px;font-size:14px;color:#374151;}
.order-foot b{font-size:15px;color:#0f1720;}

/* Checkout: order could not be saved */
.pm-error{margin:10px 12px 0;padding:12px 14px;border-radius:10px;background:#fff1f1;color:#c62828;font-size:14px;font-weight:600;border:1px solid #ffd4d4;}

/* Stock: cart warning + disabled buy bar */
.ci-stock{margin:6px 12px 0;font-size:13px;font-weight:600;color:#c62828;}
/* Out of stock: Flipkart's full-width blue "Notify Me" button, reading "Out of stock" */
.buybar--pd.buybar--oos{justify-content:center;padding:8px 16px;}
.buybar-oos{flex:1;height:44px;padding:0 6px;border:0;border-radius:12px;background:linear-gradient(90deg,#2381fc,#1152e0);color:#fff;
    font-family:inherit;font-size:14px;font-weight:700;line-height:18px;opacity:1;cursor:default;}

/* My Orders: cancelled state, courier line, seller message */
.order-badge--x{background:#fdecec;color:#d93025;}
.order-note--x{color:#d93025;font-weight:600;margin-top:12px;}
.order-ship{display:flex;align-items:flex-start;gap:8px;font-size:13px;color:#374151;background:#f5f8ff;border-radius:8px;padding:9px 10px;margin:0 0 10px;}
.order-ship-ic{flex:none;color:#2874f0;margin-top:1px;}
.order-awb{font-family:ui-monospace,Menlo,monospace;letter-spacing:.3px;}
.order-msg{font-size:13px;color:#374151;background:#fffbea;border:1px solid #f6e7a8;border-radius:8px;padding:9px 10px;margin:0 0 10px;}
.order-msg b{display:block;font-size:12px;color:#8a6d00;margin-bottom:2px;}

/* Uploaded hero banners (Admin → Banners): same 16:9 frame as the built-in ones */
.slide--img img{aspect-ratio:16/9;object-fit:cover;}
.slide--img a{display:block;}
.pd-reviews--none{color:#6b7280;}

/* =====================================================================
   Checkout — UPI payment: QR box + verification popup (assets/js/payment.js)
   ===================================================================== */
.buybar[hidden]{display:none;}
.buybar-buy:disabled{opacity:.55;cursor:not-allowed;}
.pm-app--gp{width:28px;height:28px;}

/* QR box (under "Scan QR Code") */
.pv-qr[hidden]{display:none;}
.pv-qr{margin:-2px 0 12px;padding:14px 14px 16px;border:1px dashed #9cbcf7;border-radius:10px;background:#f5f9ff;text-align:center;}
.pv-qr-title{font-size:15px;font-weight:800;color:var(--blue2);}
.pv-qr-sub{margin-top:4px;font-size:13px;color:#475569;}
.pv-qr-sub b{color:var(--ink);}
.pv-qr-exp{margin-top:4px;font-size:13px;font-weight:700;color:var(--red);}
.pv-qr-exp[hidden]{display:none;}
.pv-qr-stage{position:relative;width:200px;height:200px;margin:12px auto 0;border-radius:10px;background:#fff;box-shadow:0 1px 4px rgba(15,23,42,.12);display:flex;align-items:center;justify-content:center;overflow:hidden;}
.pv-qr-img{display:block;width:200px;height:200px;}
.pv-qr-img[hidden],.pv-qr-spin[hidden]{display:none;}
.pv-qr-spin{display:flex;flex-direction:column;align-items:center;gap:10px;font-size:12px;font-weight:600;color:var(--muted);padding:0 12px;}
#qrSaveWrap{margin-top:10px;}
#qrSaveWrap[hidden]{display:none;}
.pv-link-btn{border:1px solid #c7d7f5;background:#fff;color:var(--blue2);border-radius:8px;padding:6px 12px;font:inherit;font-size:12px;font-weight:700;cursor:pointer;}
.pv-qr-scan{margin-top:12px;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px;font-size:12px;font-weight:600;color:var(--muted);}
.pv-qr-scan .pm-app{width:26px;height:26px;margin:0;}
.pv-qr-vpa{margin-top:12px;display:flex;align-items:center;justify-content:center;gap:10px;}
.pv-mono{font-size:14px;font-weight:700;color:var(--ink);word-break:break-all;}
.pv-paid-btn{margin-top:14px;width:100%;padding:14px 16px;border:0;border-radius:8px;cursor:pointer;color:#fff;font:inherit;font-size:15px;font-weight:800;background:var(--green);box-shadow:0 8px 20px rgba(34,160,107,.3);animation:pvPulse 1.8s ease-in-out infinite;}
.pv-paid-btn:disabled{opacity:.7;animation:none;}
.pv-paid-btn:active{transform:scale(.98);}
@keyframes pvPulse{0%,100%{box-shadow:0 8px 20px rgba(34,160,107,.3),0 0 0 0 rgba(34,160,107,.35);}50%{box-shadow:0 8px 20px rgba(34,160,107,.3),0 0 0 10px rgba(34,160,107,0);}}
.pv-qr-wait{margin-top:14px;display:flex;align-items:center;justify-content:center;gap:8px;font-size:13px;font-weight:600;color:var(--blue2);}

/* Spinners */
.pv-spinner{display:block;width:52px;height:52px;border-radius:50%;border:4px solid rgba(40,116,240,.15);border-top-color:var(--blue2);animation:pvSpin .8s linear infinite;margin:2px auto 14px;}
.pv-spinner--sm{width:34px;height:34px;border-width:3px;margin:0;}
.pv-spinner--xs{width:16px;height:16px;border-width:2px;margin:0;flex:none;}
@keyframes pvSpin{to{transform:rotate(360deg);}}

/* Popup */
body.pv-lock{overflow:hidden;}
.pv-overlay{position:fixed;inset:0;z-index:2500;display:none;align-items:center;justify-content:center;padding:20px;background:rgba(15,23,42,.55);}
.pv-overlay.is-on{display:flex;animation:pvFade .2s ease both;}
@keyframes pvFade{from{opacity:0;}to{opacity:1;}}
.pv-card{width:100%;max-width:360px;max-height:100%;overflow:auto;background:#fff;border-radius:16px;box-shadow:0 24px 60px rgba(2,6,23,.3);padding:24px 20px;display:flex;flex-direction:column;align-items:center;text-align:center;animation:pvIn .25s cubic-bezier(.2,.8,.2,1) both;}
.pv-card[hidden]{display:none;}
.pv-card--form{align-items:stretch;text-align:left;}
.pv-card--form .pv-title,.pv-card--form .pv-sub{text-align:center;}
@keyframes pvIn{from{opacity:0;transform:translateY(14px) scale(.96);}to{opacity:1;transform:none;}}
.pv-title{font-size:19px;font-weight:800;color:var(--ink);}
.pv-title--bad{color:var(--red);}
.pv-sub{margin-top:8px;font-size:13.5px;line-height:1.5;color:var(--muted);}
.pv-sub--tight{margin-top:2px;}
.pv-div{width:100%;height:1px;background:var(--line);margin:18px 0;}
.pv-ask{margin-bottom:14px;font-size:13px;font-weight:700;color:#334155;}
.pv-btns{width:100%;display:flex;gap:10px;}
.pv-btn{flex:1;border:0;border-radius:8px;padding:13px 10px;font:inherit;font-size:14px;font-weight:800;cursor:pointer;color:#fff;}
.pv-btn:active{transform:scale(.98);}
.pv-btn:disabled{opacity:.7;cursor:default;}
.pv-btn--ok{background:var(--green);}
.pv-btn--no{background:var(--red);}
.pv-btn--block{width:100%;flex:none;margin-top:4px;}
.pv-btn--again{width:100%;flex:none;margin-top:16px;background:#fff;color:var(--blue2);border:1.5px solid #c7d7f5;}
.pv-card--form .pv-btn--again{margin-top:8px;}
.pv-icon{width:70px;height:70px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin-bottom:14px;}
.pv-icon--bad{background:var(--red);box-shadow:0 10px 26px rgba(229,72,77,.3);}
.pv-icon svg{width:36px;height:36px;fill:#fff;}
.pv-count{margin-top:12px;font-size:15px;font-weight:800;color:var(--blue2);font-variant-numeric:tabular-nums;}

/* Auto-verify countdown */
.pv-ring{position:relative;width:140px;height:140px;margin:0 auto 8px;}
.pv-ring svg{width:140px;height:140px;transform:rotate(-90deg);}
.pv-ring-bg{fill:none;stroke:#e8edf5;stroke-width:8;}
.pv-ring-fg{fill:none;stroke:var(--blue2);stroke-width:8;stroke-linecap:round;stroke-dasharray:339.292;stroke-dashoffset:0;transition:stroke-dashoffset 1s linear;}
.pv-ring-txt{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:800;color:var(--ink);font-variant-numeric:tabular-nums;}
.pv-store{display:block;width:54px;height:54px;margin:14px auto 10px;}
/* Admin → Settings → Account page logo: made for the blue Account bar, so it sits on the same blue here */
.pv-store--logo{width:auto;height:auto;display:table;padding:10px 16px;border-radius:12px;background:#2874f0;}
.pv-store--logo img{display:block;height:28px;width:auto;max-width:200px;object-fit:contain;}
.pv-auto-amt{font-size:20px;font-weight:800;color:var(--ink);}
.pv-auto-to{margin-top:2px;font-size:15px;font-weight:700;color:var(--ink);}
.pv-auto-oid{margin-top:6px;font-size:12.5px;color:var(--muted);word-break:break-all;}

/* Paid */
.pv-paid{position:relative;width:120px;height:108px;margin:4px auto 12px;}
.pv-paid-check{position:absolute;left:50%;top:6px;transform:translateX(-50%);width:90px;height:90px;border-radius:50%;background:var(--green);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 26px rgba(34,160,107,.35);animation:pvPop .45s cubic-bezier(.2,.8,.3,1.4);}
.pv-paid-ic{stroke-width:2.6;}
@keyframes pvPop{0%{transform:translateX(-50%) scale(.5);opacity:0;}100%{transform:translateX(-50%) scale(1);opacity:1;}}
.pv-cf{position:absolute;left:50%;top:52px;width:9px;height:9px;border-radius:2px;opacity:0;animation:pvConf .7s .15s ease-out forwards;}
@keyframes pvConf{0%{opacity:1;transform:translate(-50%,-50%) scale(.4) rotate(0);}100%{opacity:0;transform:translate(calc(-50% + var(--x)),calc(-50% + var(--y))) scale(1) rotate(200deg);}}
.pv-paid-yay{font-size:17px;color:#374151;margin-bottom:14px;}
.pv-paid-amt{font-size:28px;font-weight:800;color:var(--ink);}
.pv-paid-title{font-size:20px;font-weight:700;color:var(--ink);margin-top:2px;}
#pverPaid .pv-sub b{color:#d97706;}

/* Proof form */
.pv-label{margin-top:16px;font-size:12.5px;font-weight:700;color:#334155;}
.pv-input{margin-top:7px;width:100%;padding:12px 13px;border:1px solid #d6dbe3;border-radius:8px;font:inherit;font-size:15px;font-weight:600;color:var(--ink);}
.pv-input:focus{outline:0;border-color:var(--blue2);box-shadow:0 0 0 3px rgba(40,116,240,.15);}
.pv-or{display:flex;align-items:center;gap:10px;margin:14px 0;color:#94a3b8;font-size:12px;font-weight:700;}
.pv-or::before,.pv-or::after{content:"";flex:1;height:1px;background:var(--line);}
.pv-upload{display:flex;flex-direction:column;align-items:center;gap:6px;width:100%;padding:16px;border:2px dashed #cfd6e0;border-radius:10px;background:#fafbff;color:var(--muted);font:inherit;font-size:13px;font-weight:700;cursor:pointer;word-break:break-all;}
.pv-upload.is-set{border-color:var(--green);color:var(--green);background:#f0fbf4;}
.pv-upload svg{width:26px;height:26px;fill:currentColor;}
.pv-err{margin:10px 0 6px;min-height:16px;color:var(--red);font-size:12.5px;font-weight:700;text-align:center;}

@media (prefers-reduced-motion:reduce){.pv-paid-btn,.pv-spinner,.pv-cf,.pv-paid-check,.pv-card,.pv-overlay.is-on{animation:none;}.pv-cf{display:none;}}

/* Payment app icons (same artwork as the RechargeClub checkout: assets/img/pay/) */
.pm-app img{display:block;width:72%;height:72%;object-fit:contain;}
.pm-app--pp img{width:100%;height:100%;}
.pm-app--pt img{width:82%;height:auto;}
.pm-app--qr{border-radius:8px;}
.pm-opt > .pm-app--qr{border-radius:8px;}