@media(max-width:768px){

/* ================= MOBILE BASE ================= */
body{
  padding-top:40px;
  padding-bottom:30px;
  font-size:15px;
  background:#fff;
}

/* ===== HEADER MOBILE PC STYLE ===== */
/* GREEN BAR HEIGHT CONTROL */
.header{
  padding:5px 0 !important;   /* 👈 yahi se green bar patli hogi */
}

.header-inner{
  flex-direction:column !important;
  align-items:stretch !important;
  padding:3px !important;     /* andar ka gap */
  gap:4px !important;
}

.logo{
  font-size:15px !important;
  text-align:left !important;
  width:100% !important;
}

.search-box{
  width:100% !important;
}

.search-box input{
  padding:6px !important;
  font-size:13px !important;
}

.search-box button{
  padding:8px 12px !important;
}

.header-right{
  display:none !important;
}

/* ================= SLIDER ================= */
/* BANNER HEIGHT */
.slider{
  height:230px !important;
}

/* BLACK CARD (TEXT BOX) */
.slide-content{
  width:45%;              /* chaudi (card width) */
  max-width:600px;       /* zyada se zyada itni hogi */
  min-height:2px;      /* lambai (card height) */
  padding:0px;          /* andar ka gap */
  background:rgba(0,0,0,0.5);  /* black transparent */
  border-radius:16px;    /* rounded corner */

  text-align:center;

  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
}

/* HEADING */
.slide-content h2{
  font-size:12px !important;
}

/* PARAGRAPH */
.slide-content p{
  font-size:10px !important;
}

/* BUTTON */
.slide-content a{
  font-size:10px !important;
  padding:6px 12px !important;
}

/* ================= OFFER BAR ================= */
.offer-bar{
  height:30px;        /* pehle 48px ya zyada hogi */
  padding:0;         /* extra space hata do */
}

.offer-track span{
  font-size:12px;    /* text chhota */
  line-height:30px;  /* bar ke center me text */
}


/* ================= WHY SECTION MOBILE SCROLL ================= */
.why-section{
  padding:20px 10px;
}

.why-title{
  font-size:20px;
  margin-bottom:12px;
}

.why-grid{
  display:flex !important;
  overflow-x:auto;
  gap:12px;
  padding:10px 0;
  scroll-snap-type:x mandatory;
}

.why-grid::-webkit-scrollbar{
  display:none;
}

.why-card{
  min-width:160px;
  flex:0 0 auto;
  padding:14px 10px;
  border-radius:12px;
  text-align:center;
  background:#fff;
  box-shadow:0 4px 12px rgba(0,0,0,0.08);
  scroll-snap-align:start;
}

.why-card h3{
  font-size:14px;
}

.why-card p{
  font-size:12px;
}

/* ================= CATEGORY MOBILE SCROLL ================= */
.category-grid{
  display:flex !important;
  overflow-x:auto;
  gap:12px;
  padding:10px;
  scroll-snap-type:x mandatory;
}

.category-grid::-webkit-scrollbar{
  display:none;
}

.cat-card{
  min-width:120px;
  flex:0 0 auto;
  border-radius:14px;
  padding:10px;
  text-align:center;
  background:#fff;
  box-shadow:0 4px 12px rgba(0,0,0,0.08);
  scroll-snap-align:start;
  text-decoration:none;
}

.cat-card img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  border-radius:12px;
}

.cat-card h3{
  font-size:13px;
  margin-top:6px;
}

/* ================= PRODUCTS GRID ================= */
.products{
  grid-template-columns:repeat(2,1fr) !important;
  gap:6px !important;
  padding:6px !important;
}

.card{
  padding:6px !important;
  border-radius:10px;
  background:#fff;
}

.card img{
  width:100%;
  aspect-ratio:1/1;
  object-fit:cover;
  border-radius:12px;
}

.title{
  font-size:12px !important;
  font-weight:600;
  margin-top:4px;
}

.brand{
  font-size:10px !important;
  color:#666;
}

.price span{
  font-size:13px !important;
}

.price del{
  font-size:10px !important;
}

.save{
  font-size:10px !important;
}

.add-btn{
  margin-top:6px !important;
  padding:6px !important;
  font-size:11px !important;
  border-radius:6px;
}

.off{
  font-size:10px !important;
  padding:3px 5px !important;
}

/* ================= MOBILE BOTTOM NAV ================= */
.mobile-bottom-nav{
  position:fixed;
  bottom:0;
  left:0;
  width:100%;
  background:#fff;
  border-top:1px solid #ddd;
  z-index:99999;
  display:flex;
  justify-content:space-around;
  padding:6px 0;
}

.mobile-bottom-nav .nav-item{
  text-decoration:none;
  color:#666;
  font-size:11px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:3px;
}

.mobile-bottom-nav .nav-item i{
  font-size:18px;
}

.mobile-bottom-nav .nav-item.active{
  color:#1f7a3a;
  font-weight:600;
}

/* ================= CART BADGE ================= */
.cart-nav{
  position:relative;
}

.cart-badge{
  position:absolute;
  top:-2px;
  right:12px;
  background:#e53935;
  color:#fff;
  font-size:10px;
  padding:2px 5px;
  border-radius:12px;
  min-width:16px;
  text-align:center;
  font-weight:bold;
}
.mobile-account-menu select{
  width:100%;
  padding:6px;
  border-radius:6px;
  border:1px solid #ccc;
  margin-top:5px;
}