/*
Theme Name: Blinkit Store
Theme URI: https://example.com/blinkit-store
Author: SAT LABS CO
Author URI: https://satlabs.co
Description: A quick-commerce grocery theme inspired by Blinkit. Full WooCommerce support, AJAX slide-in cart drawer, WooCommerce-powered login popup, one-click demo content importer and Elementor compatibility. Built as a UI/demo theme.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: blinkit-store
Tags: e-commerce, woocommerce, two-columns, custom-menu, featured-images, full-width-template
WC requires at least: 7.0
WC tested up to: 8.7
*/

:root{
  --yellow:#F8CB46; --yellow-deep:#F4C430;
  --green:#0c831f; --green-light:#318616;
  --ink:#1c1c1c; --grey:#666; --grey-2:#7e808c;
  --line:#efeff4; --bg:#fff; --card:#fff; --pink:#fffaf2;
  --radius:14px; --shadow:0 6px 18px rgba(0,0,0,.10); --shadow-sm:0 2px 8px rgba(0,0,0,.06);
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html{scroll-behavior:smooth}
body{font-family:'Nunito',system-ui,sans-serif;color:var(--ink);background:#fbfbfb;overflow-x:hidden;line-height:1.5}
img{max-width:100%;height:auto}
button{font-family:inherit;cursor:pointer;border:none;background:none}
a{color:inherit;text-decoration:none}
::-webkit-scrollbar{height:6px;width:6px}
::-webkit-scrollbar-thumb{background:#dcdce0;border-radius:10px}
.wrap{max-width:1280px;margin:0 auto;padding:0 20px}

/* ============ HEADER ============ */
.site-header{position:sticky;top:0;z-index:60;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.06)}
.topbar{background:var(--yellow);height:6px}
.headrow{max-width:1280px;margin:0 auto;display:flex;align-items:center;gap:20px;padding:14px 20px}
.logo{display:flex;flex-direction:column;line-height:1;cursor:pointer;flex-shrink:0}
.logo .mark{font-weight:900;font-size:30px;letter-spacing:-1.5px;color:#0c831f}
.logo .mark span{color:var(--yellow-deep)}
.logo--img img,.custom-logo,.custom-logo-link img{max-height:42px;width:auto;display:block}
.logo--img{display:flex;align-items:center}
.loc{cursor:pointer;flex-shrink:0;min-width:150px}
.loc .eta{font-weight:800;font-size:15px}
.loc .addr{display:flex;align-items:center;gap:4px;font-size:13px;color:var(--grey);max-width:230px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.loc .addr svg{flex-shrink:0}
.searchwrap{flex:1;position:relative;max-width:640px}
.searchbar{display:flex;align-items:center;gap:10px;background:#f8f8f8;border:1px solid #eaeaea;border-radius:12px;padding:13px 16px;cursor:text;color:var(--grey)}
.searchbar svg{flex-shrink:0}
.searchbar .ph{font-size:15px;font-weight:600;overflow:hidden;white-space:nowrap}
.hbtn{display:flex;align-items:center;gap:8px;font-weight:600;font-size:16px;flex-shrink:0}
.cartbtn{background:var(--green);color:#fff;padding:13px 18px;border-radius:12px;display:flex;align-items:center;gap:10px;font-weight:700;font-size:16px;flex-shrink:0;transition:filter .15s;text-align:left}
.cartbtn:hover{filter:brightness(1.07)}
.cartbtn .cc{font-size:13px;opacity:.9}
.login-link{padding:10px 6px}
.login-link:hover{color:#000}

/* ============ LAYOUT ============ */
main{max-width:1280px;margin:0 auto;padding:0 20px 80px;min-height:50vh}
.fade{animation:fade .25s ease}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* category strip */
.catstrip{display:grid;grid-template-columns:repeat(10,1fr);gap:8px;padding:18px 0 6px}
.catcell{text-align:center;cursor:pointer;border-radius:10px;padding:6px 2px;transition:background .15s}
.catcell:hover{background:#fafafa}
.catcell .ci{width:100%;aspect-ratio:1;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:34px;margin-bottom:6px}
.catcell .cn{font-size:12px;font-weight:700;line-height:1.15;color:#333}

/* banners */
.banners{display:flex;gap:16px;overflow-x:auto;padding:14px 0;scroll-snap-type:x mandatory}
.banner{min-width:340px;height:170px;border-radius:18px;scroll-snap-align:start;padding:24px;display:flex;flex-direction:column;justify-content:center;color:#fff;position:relative;overflow:hidden;cursor:pointer}
.banner h3{font-size:24px;font-weight:900;line-height:1.1;max-width:60%;z-index:2}
.banner p{font-size:14px;margin-top:6px;opacity:.95;z-index:2}
.banner .bemoji{position:absolute;right:-10px;bottom:-14px;font-size:120px;opacity:.85;transform:rotate(-10deg)}
.banner .pill{margin-top:14px;background:#fff;color:#222;font-weight:800;font-size:13px;padding:7px 14px;border-radius:30px;width:fit-content;z-index:2}

/* product section */
.section{margin-top:28px}
.sec-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.sec-head h2{font-size:22px;font-weight:800}
.see-all{color:var(--green);font-weight:800;font-size:15px}
.prow{display:flex;gap:14px;overflow-x:auto;padding-bottom:8px;scroll-snap-type:x mandatory}
.pgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}

/* product card */
.pcard{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:10px;min-width:170px;width:170px;scroll-snap-align:start;display:flex;flex-direction:column;position:relative;transition:box-shadow .15s}
.pgrid .pcard{width:auto;min-width:0}
.pcard:hover{box-shadow:var(--shadow-sm)}
.pcard .imgwrap{background:#f7f7f7;border-radius:10px;aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:56px;margin-bottom:8px;cursor:pointer;position:relative;overflow:hidden}
.pcard .imgwrap img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.pcard .eta-badge{position:absolute;left:6px;top:6px;background:rgba(255,255,255,.92);font-size:9px;font-weight:800;color:#555;padding:2px 6px;border-radius:6px;display:flex;align-items:center;gap:3px}
.pcard .off{position:absolute;left:0;top:8px;background:#256fef;color:#fff;font-size:10px;font-weight:800;padding:3px 6px;border-radius:0 6px 6px 0;line-height:1.1;text-align:center}
.pcard .wt{font-size:12px;color:var(--grey-2);font-weight:700;margin-bottom:3px}
.pcard .nm{font-size:13px;font-weight:700;line-height:1.25;height:34px;overflow:hidden;margin-bottom:8px}
.pcard .foot{display:flex;align-items:center;justify-content:space-between;margin-top:auto;gap:6px}
.pcard .price{font-size:14px;font-weight:800}
.pcard .price del{font-size:11px;color:#aaa;font-weight:600;margin-left:2px}
.pcard .price ins{text-decoration:none}
.addbtn{border:1px solid #318616;color:#318616;background:#f7fff9;font-weight:800;font-size:14px;padding:8px 18px;border-radius:8px;transition:all .12s;white-space:nowrap}
.addbtn:hover{background:#eafaee}
.stepper{display:inline-flex;align-items:center;background:var(--green);border-radius:8px;color:#fff;font-weight:800;overflow:hidden}
.stepper button{color:#fff;width:30px;height:34px;font-size:18px;display:flex;align-items:center;justify-content:center}
.stepper .q{min-width:22px;text-align:center;font-size:14px}
.is-loading{opacity:.55;pointer-events:none}

/* category page (archive) */
.breadcrumb{font-size:13px;color:var(--grey);margin:14px 0 10px;display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.breadcrumb a{cursor:pointer}
.breadcrumb b{color:#000}
.catpage{display:grid;grid-template-columns:120px 1fr;gap:0}
.catnav{border-right:1px solid var(--line);position:sticky;top:120px;align-self:start;max-height:calc(100vh - 130px);overflow-y:auto}
.catnav .item{display:block;text-align:center;padding:12px 4px;cursor:pointer;border-left:3px solid transparent;font-size:11px;font-weight:700;color:#555;line-height:1.2}
.catnav .item .ic{width:48px;height:48px;margin:0 auto 5px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:26px}
.catnav .item.active{border-left-color:var(--green);background:#f3fdf5;color:#0c831f}
.catbody{padding:0 4px 0 20px}
.catbody h1{font-size:22px;font-weight:800;margin:6px 0 16px}

/* search */
.results{margin-top:18px}
.empty{text-align:center;padding:60px 0;color:var(--grey)}
.empty .big{font-size:60px;margin-bottom:12px}
.chip-row{display:flex;gap:10px;flex-wrap:wrap}
.chip{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line);border-radius:30px;padding:8px 14px;font-weight:700;font-size:13px;cursor:pointer}
.chip:hover{border-color:var(--green)}

/* ============ OVERLAY + DRAWERS ============ */
.scrim{position:fixed;inset:0;background:rgba(15,15,20,.5);z-index:90;opacity:0;visibility:hidden;transition:opacity .25s}
.scrim.show{opacity:1;visibility:visible}
.drawer{position:fixed;top:0;right:0;height:100%;width:430px;max-width:92vw;background:#f4f6fb;z-index:100;transform:translateX(100%);transition:transform .3s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column}
.drawer.open{transform:translateX(0)}
.drawer .dhead{background:#fff;padding:16px 18px;display:flex;align-items:center;justify-content:space-between;font-weight:800;font-size:17px;flex-shrink:0}
.drawer .dhead .x{font-size:22px;color:#666;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.drawer .dhead .x:hover{background:#f0f0f0}
.dbody{flex:1;overflow-y:auto;padding:14px}

.eta-card{background:#fff;border-radius:14px;padding:14px;display:flex;align-items:center;gap:12px;margin-bottom:12px}
.eta-card .ico{font-size:28px}
.eta-card .t1{font-weight:800;font-size:15px}
.eta-card .t2{font-size:12px;color:var(--grey)}
.citems{background:#fff;border-radius:14px;padding:6px 14px;margin-bottom:12px}
.citem{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line)}
.citem:last-child{border-bottom:none}
.citem .thumb{width:44px;height:44px;border-radius:8px;background:#f5f5f5;display:flex;align-items:center;justify-content:center;font-size:24px;flex-shrink:0;overflow:hidden}
.citem .thumb img{width:100%;height:100%;object-fit:contain}
.citem .info{flex:1;min-width:0}
.citem .info .n{font-size:13px;font-weight:700;line-height:1.2}
.citem .info .w{font-size:11px;color:var(--grey-2);font-weight:600}
.citem .right{text-align:right}
.citem .stepper{transform:scale(.85);margin-bottom:4px}
.citem .pr{font-size:13px;font-weight:800}
.bill{background:#fff;border-radius:14px;padding:16px;margin-bottom:12px}
.bill h4{font-size:15px;margin-bottom:12px}
.bline{display:flex;justify-content:space-between;font-size:13px;color:#444;margin-bottom:9px}
.bline.tot{font-weight:800;color:#000;font-size:15px;border-top:1px dashed #ddd;padding-top:11px;margin-top:4px}
.bline .free{color:var(--green);font-weight:700}
.tipbox{background:#fff;border-radius:14px;padding:14px;margin-bottom:12px;font-size:13px}
.checkout-bar{background:#fff;padding:14px;flex-shrink:0;box-shadow:0 -2px 10px rgba(0,0,0,.06)}
.checkout-btn{width:100%;background:var(--green);color:#fff;border-radius:12px;padding:15px;font-weight:800;font-size:16px;display:flex;align-items:center;justify-content:space-between}
.checkout-btn:hover{filter:brightness(1.07)}
.cart-empty{text-align:center;padding:50px 20px;color:var(--grey)}
.cart-empty .big{font-size:70px;margin-bottom:14px}

/* modal */
.modal{position:fixed;z-index:100;top:50%;left:50%;transform:translate(-50%,-46%) scale(.96);background:#fff;border-radius:18px;width:420px;max-width:92vw;opacity:0;visibility:hidden;transition:all .25s;overflow:hidden;max-height:88vh;display:flex;flex-direction:column}
.modal.open{opacity:1;visibility:visible;transform:translate(-50%,-50%) scale(1)}
.modal .mhead{padding:18px 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}
.modal .mhead h3{font-size:18px;font-weight:800}
.modal .mhead .x{font-size:22px;color:#888;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center}
.modal .mhead .x:hover{background:#f0f0f0}
.mbody{padding:20px;overflow-y:auto}

.login-hero{background:var(--yellow);padding:26px 20px;text-align:center;position:relative}
.login-hero .x{position:absolute;right:14px;top:14px;font-size:22px;color:#5a4a10}
.login-hero .mark{font-weight:900;font-size:34px;letter-spacing:-1.5px;color:#0c831f}
.login-hero .mark span{color:#fff}
.login-hero p{font-weight:700;margin-top:4px;color:#3a3a3a}
.tabs{display:flex;border-bottom:1px solid var(--line)}
.tabs button{flex:1;padding:14px;font-weight:800;color:#999;border-bottom:2px solid transparent}
.tabs button.active{color:var(--green);border-bottom-color:var(--green)}
.field{display:flex;align-items:center;border:1.5px solid #ddd;border-radius:10px;padding:0 14px;margin-bottom:14px;font-size:16px;font-weight:700}
.field .cc{color:#777;margin-right:8px}
.field input{border:none;outline:none;flex:1;font-size:15px;font-weight:600;font-family:inherit;padding:13px 0;background:none}
.bigbtn{width:100%;background:var(--green);color:#fff;border-radius:10px;padding:14px;font-weight:800;font-size:16px;transition:filter .15s}
.bigbtn:hover{filter:brightness(1.07)}
.bigbtn:disabled{background:#cfcfcf;cursor:not-allowed}
.muted{font-size:12px;color:var(--grey);text-align:center;line-height:1.5;margin-top:14px}
.muted a{color:var(--green);font-weight:700}
.form-msg{font-size:13px;font-weight:700;padding:10px;border-radius:8px;margin-bottom:12px;display:none}
.form-msg.err{display:block;background:#fdeaea;color:#c0392b}
.form-msg.ok{display:block;background:#e7f7ea;color:#0c831f}

.addr-row{display:flex;gap:12px;padding:14px;border:1px solid var(--line);border-radius:12px;margin-bottom:10px;cursor:pointer;align-items:flex-start}
.addr-row:hover{border-color:var(--green);background:#f7fff9}
.addr-row .ico{font-size:22px}
.addr-row .at{font-weight:800;font-size:14px}
.addr-row .ad{font-size:12px;color:var(--grey);margin-top:2px}
.locsearch{display:flex;align-items:center;gap:8px;border:1.5px solid #ddd;border-radius:10px;padding:12px 14px;margin-bottom:16px}
.locsearch input{border:none;outline:none;flex:1;font-size:14px;font-weight:600;font-family:inherit}

.toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(20px);background:#1c1c1c;color:#fff;padding:13px 22px;border-radius:30px;font-weight:700;font-size:14px;z-index:200;opacity:0;visibility:hidden;transition:all .3s;box-shadow:var(--shadow)}
.toast.show{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}

/* footer */
.site-footer{background:#f7f7f7;border-top:1px solid var(--line);padding:30px 20px;margin-top:40px}
.foot-in{max-width:1280px;margin:0 auto;display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;font-size:13px;color:var(--grey)}
.foot-in .col{max-width:260px}
.foot-in .col h5{font-size:13px;font-weight:800;color:#333;margin-bottom:10px;text-transform:uppercase;letter-spacing:.5px}
.foot-in .col a{display:block;margin-bottom:6px}
.foot-in .col a:hover{color:#000}
.foot-credit{text-align:center;color:#aaa;font-size:12px;margin-top:24px}

/* ============ WOOCOMMERCE PAGE OVERRIDES ============ */
.woocommerce-shell{max-width:1100px;margin:18px auto;padding:0 20px 60px}
.woocommerce-shell h1.entry-title,.woocommerce-shell .product_title{font-size:26px;font-weight:800;margin-bottom:14px}
.woocommerce .button,.woocommerce a.button,.woocommerce button.button,.woocommerce input.button,.woocommerce #respond input#submit{
  background:var(--green)!important;color:#fff!important;border-radius:10px!important;font-weight:800!important;
  padding:12px 20px!important;font-family:inherit!important;border:none!important;text-transform:none!important;font-size:15px!important}
.woocommerce .button:hover,.woocommerce a.button:hover,.woocommerce button.button:hover{filter:brightness(1.08)}
.woocommerce .button.alt,.woocommerce #place_order{background:var(--green)!important}
.woocommerce-message,.woocommerce-info,.woocommerce-error{border-top-color:var(--green)!important;border-radius:10px;font-weight:600}
.woocommerce-message::before,.woocommerce-info::before{color:var(--green)!important}
.woocommerce form .form-row input.input-text,.woocommerce form .form-row textarea,.woocommerce-page form .form-row input.input-text,.select2-container--default .select2-selection--single{
  border:1.5px solid #ddd!important;border-radius:10px!important;padding:12px 14px!important;font-family:inherit!important}
.woocommerce table.shop_table{border-radius:12px;border-color:var(--line)}
.woocommerce .quantity .qty{border:1.5px solid #ddd;border-radius:8px;padding:8px;font-family:inherit}
.woocommerce div.product span.price,.woocommerce div.product p.price{color:var(--green);font-weight:800}
.woocommerce ul.products li.product .price{color:#000;font-weight:800}
.woocommerce nav.woocommerce-pagination ul li a,.woocommerce nav.woocommerce-pagination ul li span{font-weight:800}
.woocommerce-account .woocommerce-MyAccount-navigation ul li a{font-weight:700}
.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a{color:var(--green)}

/* single product layout */
.single-product .woocommerce-shell div.product{display:flex;gap:36px;flex-wrap:wrap}
.single-product .woocommerce-shell div.product .woocommerce-product-gallery{flex:1;min-width:300px;max-width:440px;background:#f7f7f7;border-radius:16px;padding:20px}
.single-product .woocommerce-shell div.product .summary{flex:1;min-width:300px}
.single-product .emoji-hero{font-size:140px;text-align:center;padding:40px 0}

/* responsive */
@media(max-width:1024px){
  .catstrip{grid-template-columns:repeat(6,1fr)}
  .pgrid{grid-template-columns:repeat(4,1fr)}
}

/* ---- tablet / mobile header: 3 tidy rows ---- */
@media(max-width:760px){
  main{padding:0 12px 90px}
  .headrow{flex-wrap:wrap;gap:10px 8px;padding:10px 12px}
  .logo{order:1}
  .logo .mark{font-size:23px}
  .logo--img img,.custom-logo,.custom-logo-link img{max-height:32px}
  /* login + cart pinned to the right of row 1 */
  .login-link{order:2;margin-left:auto;font-size:14px;padding:8px 6px}
  .cartbtn{order:3;padding:9px 13px;font-size:14px;gap:6px}
  .cartbtn .cc{display:none}
  .cartbtn .blinkit-cart-label{font-size:13px;line-height:1.1}
  /* location on its own full-width row */
  .loc{order:4;flex-basis:100%;min-width:0;padding-top:2px}
  .loc .eta{font-size:14px}
  .loc .addr{font-size:12px;max-width:100%}
  /* search full-width row */
  .searchwrap{order:5;flex-basis:100%;max-width:none}
  .searchbar{padding:11px 14px}

  .catstrip{grid-template-columns:repeat(4,1fr);gap:6px}
  .catcell .ci{font-size:28px}
  .catcell .cn{font-size:11px}
  .pgrid{grid-template-columns:repeat(2,1fr)}
  .banner{min-width:78vw;height:150px;padding:20px}
  .banner h3{font-size:20px}
  .sec-head h2{font-size:18px}

  .catpage{grid-template-columns:76px 1fr}
  .catnav{top:0;position:static;border-right:1px solid var(--line);max-height:none;overflow:visible}
  .catnav .item .ic{width:42px;height:42px;font-size:22px}
  .catnav .item{font-size:10px;padding:10px 2px}
  .catbody{padding-left:12px}
  .catbody h1{font-size:19px}

  .foot-in{flex-direction:column;gap:18px}
}

/* ---- small phones ---- */
@media(max-width:420px){
  .headrow{gap:8px 6px;padding:9px 10px}
  .logo .mark{font-size:21px}
  .login-link{font-size:13px;padding:7px 4px}
  .cartbtn{padding:8px 11px}
  .catstrip{grid-template-columns:repeat(4,1fr)}
  .pcard{padding:8px}
  .pcard .nm{font-size:12px}
  .addbtn{padding:7px 14px;font-size:13px}
  .modal,.drawer{max-width:94vw}
}