﻿:root{
  --primary-color:#df4b0b;
  --primary-dark:#b73d08;
  --accent:#0c831f;
  --yellow:#ffc60b;
  --inactive-color:#9aa0a6;
  --bg-light:#f5f6fa;
  --white:#fff;
  --text:#1a1a1a;
  --muted:#6b7280;
  --border:#eef0f3;
  --shadow-sm:0 2px 8px rgba(0,0,0,.05);
  --shadow-md:0 6px 20px rgba(0,0,0,.08);
  --shadow-lg:0 12px 30px rgba(0,0,0,.12);
}
*{margin:0;padding:0;box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter','Segoe UI',sans-serif;
  background:var(--bg-light);
  color:var(--text);
  overflow-x:hidden;
  padding-top:130px;
  padding-bottom:90px;
}

/* ── SPLASH ─────────────────────────── */
#splash-screen{position:fixed;inset:0;background:#fff;display:flex;flex-direction:column;
  justify-content:center;align-items:center;z-index:9999;
  animation:splashHide 0s 4s forwards;}
@keyframes splashHide{to{display:none;opacity:0;pointer-events:none;}}
.splash-logo{width:220px;max-width:70%;margin-bottom:18px;animation:zoomIn 1s ease;}
.splash-subtitle{font-size:16px;color:var(--primary-color);font-weight:600;letter-spacing:.3px;}
.splash-loader{display:flex;gap:6px;margin-top:22px;}
.splash-loader span{width:8px;height:8px;background:var(--primary-color);border-radius:50%;animation:bounce 1.2s infinite;}
.splash-loader span:nth-child(2){animation-delay:.2s;}
.splash-loader span:nth-child(3){animation-delay:.4s;}
@keyframes bounce{0%,80%,100%{transform:scale(.6);opacity:.5}40%{transform:scale(1);opacity:1}}
@keyframes zoomIn{from{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}

/* ── HEADER ─────────────────────────── */
.app-header{position:fixed;top:0;left:0;width:100%;z-index:1000;
  background:linear-gradient(135deg,#ffdf3e 0%,#ffc60b 100%);
  box-shadow:0 4px 20px rgba(0,0,0,.08);}
.header-top{display:flex;justify-content:space-between;align-items:center;padding:10px 16px 8px;}
.location-block{cursor:pointer;flex:1;min-width:0;}
.loc-title{display:flex;align-items:center;gap:6px;font-size:15px;font-weight:800;color:#1a1a1a;}
.loc-title b{color:var(--primary-color);}
.loc-title .chev{font-size:11px;margin-left:2px;}
.loc-address{font-size:12px;color:#333;margin-top:2px;font-weight:500;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:75vw;}
.header-right{display:flex;align-items:center;gap:10px;}
.profile-btn{width:40px;height:40px;border-radius:50%;overflow:hidden;border:2px solid #fff;
  box-shadow:var(--shadow-sm);cursor:pointer;background:#fff;transition:.2s;}
.profile-btn:hover{transform:scale(1.05);}
.profile-btn img{width:100%;height:100%;object-fit:cover;}
.header-search{padding:4px 12px 10px;}
.search-container{position:relative;background:#fff;border-radius:12px;box-shadow:0 2px 6px rgba(0,0,0,.06);}
.search-icon-inside{position:absolute;top:50%;left:14px;transform:translateY(-50%);color:var(--primary-color);}
.mic-icon{position:absolute;top:50%;right:14px;transform:translateY(-50%);color:#666;cursor:pointer;}
#searchInput{width:100%;border:none;outline:none;background:transparent;
  padding:12px 40px 12px 40px;border-radius:12px;font-size:14px;font-weight:500;}

/* ── PROFILE DROPDOWN ───────────────── */
.profile-menu{position:fixed;top:70px;right:12px;width:280px;background:#fff;
  border-radius:16px;box-shadow:var(--shadow-lg);padding:16px;z-index:1500;
  opacity:0;visibility:hidden;transform:translateY(-8px);transition:.25s;}
.profile-menu.open{opacity:1;visibility:visible;transform:translateY(0);}
.pm-header{display:flex;gap:12px;align-items:center;padding-bottom:14px;border-bottom:1px solid var(--border);}
.pm-header i{font-size:38px;color:var(--primary-color);}
.pm-header img{width:46px;height:46px;border-radius:50%;object-fit:cover;}
.pm-header h4{font-size:15px;margin:0;}
.pm-header p{font-size:12px;color:var(--muted);margin:2px 0 0;}
.google-btn{width:100%;margin-top:14px;padding:11px;display:flex;align-items:center;
  justify-content:center;gap:10px;background:#fff;border:1px solid #dadce0;
  border-radius:10px;font-weight:600;cursor:pointer;font-size:14px;color:#3c4043;transition:.2s;}
.google-btn:hover{background:#f8f9fa;box-shadow:var(--shadow-sm);}
.google-btn img{width:18px;height:18px;}
.pm-list{list-style:none;margin-top:8px;}
.pm-list li{display:flex;align-items:center;gap:12px;padding:11px 8px;border-radius:8px;
  font-size:14px;font-weight:500;cursor:pointer;transition:.2s;}
.pm-list li:hover{background:#fdece2;color:var(--primary-color);}
.pm-list li i{width:20px;text-align:center;color:var(--primary-color);}
.pm-list li.logout{color:#e53935;border-top:1px solid var(--border);margin-top:6px;}
.pm-list li.logout i{color:#e53935;}

/* ── BANNER SLIDER — FULL WIDTH ─────── */
.banner-slider{position:relative;overflow:hidden;width:100%;}
.banner-track{display:flex;transition:transform .5s cubic-bezier(.4,0,.2,1);}
.banner-slide{min-width:100%;position:relative;overflow:hidden;}
.banner-full-img{width:100%;height:200px;object-fit:cover;display:block;}
.banner-overlay{position:absolute;inset:0;background:linear-gradient(to right,rgba(0,0,0,.65) 0%,rgba(0,0,0,.1) 100%);
  display:flex;flex-direction:column;justify-content:center;padding:0 22px;gap:6px;}
.banner-pill{display:inline-block;background:var(--primary-color);color:#fff;
  font-size:11px;font-weight:700;padding:3px 10px;border-radius:20px;width:fit-content;}
.banner-overlay h2{font-size:22px;font-weight:800;color:#fff;line-height:1.25;margin:0;}
.banner-overlay h2 b{color:#ffc60b;}
.banner-cta{display:inline-block;background:#fff;color:var(--primary-color);border:none;
  padding:8px 18px;border-radius:20px;font-size:13px;font-weight:700;cursor:pointer;
  width:fit-content;margin-top:2px;transition:.2s;}
.banner-cta:hover{background:var(--primary-color);color:#fff;}
.banner-dots{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);
  display:flex;gap:6px;z-index:10;}
.dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.5);cursor:pointer;transition:.3s;}
.dot.active{width:22px;border-radius:4px;background:#fff;}

/* ── PROMO STRIP ─────────────────────── */
.promo-strip{display:flex;justify-content:space-around;align-items:center;
  background:#fff;margin:10px 14px;border-radius:12px;padding:11px 10px;
  box-shadow:var(--shadow-sm);}
.promo-item{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:#333;}
.promo-divider{width:1px;height:22px;background:#eee;}

/* ── CATEGORY CHIPS ─────────────────── */
.cat-chips-row{display:flex;gap:8px;overflow-x:auto;padding-bottom:4px;
  scrollbar-width:none;margin-bottom:14px;}
.cat-chips-row::-webkit-scrollbar{display:none;}
.cat-chip{padding:7px 16px;border-radius:20px;font-size:13px;font-weight:600;
  color:#555;background:#fff;border:1.5px solid #e5e7eb;cursor:pointer;
  white-space:nowrap;transition:.2s;flex-shrink:0;}
.cat-chip:hover{border-color:var(--primary-color);color:var(--primary-color);}
.cat-chip.active-chip{background:var(--primary-color);color:#fff;border-color:var(--primary-color);}

/* ── MINI BANNERS ───────────────────── */
.mini-banners-row{display:flex;gap:10px;margin-bottom:16px;}
.mini-banner{flex:1;display:flex;justify-content:space-between;align-items:center;
  padding:14px 16px;border-radius:14px;box-shadow:var(--shadow-sm);}
.mb-label{font-size:11px;font-weight:700;color:#333;margin-bottom:3px;}
.mb-value{font-size:17px;font-weight:800;color:#111;}

/* ── SECTION TITLES ─────────────────── */
.sec-title{font-size:18px;font-weight:800;color:#111;}
.sec-sub{font-size:12px;color:var(--muted);margin-top:2px;}

/* ── CONTENT AREA ───────────────────── */
.content-area{max-width:1200px;margin:auto;padding:0 15px 15px;}
.section-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:14px;}
.section-header h3{color:#111;font-size:19px;font-weight:800;}
.section-header p{color:var(--muted);font-size:13px;margin-top:2px;}
.see-all{color:var(--primary-color);font-weight:700;font-size:13px;cursor:pointer;}

/* ── PRODUCTS ───────────────────────── */
.product-grid,#productList,#categoryProductList{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:14px;}
.card{background:#fff;border-radius:14px;padding:10px;box-shadow:var(--shadow-sm);
  transition:.3s;position:relative;overflow:hidden;animation:fadeCard .5s ease;border:1px solid #f0f0f0;}
.card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--primary-color);}
.card img{width:100%;height:120px;object-fit:contain;transition:.3s;}
.card:hover img{transform:scale(1.06);}
.card h2{font-size:13px;margin:8px 0 4px;color:#222;font-weight:600;line-height:1.3;min-height:34px;}
.offer{position:absolute;top:8px;left:8px;background:linear-gradient(135deg,#0c831f,#0a6b19);
  color:#fff;font-size:10px;font-weight:700;padding:3px 8px;border-radius:6px;}
.card p{margin:4px 0;font-size:15px;font-weight:800;color:#111;}
.card del{color:#999;font-size:12px;margin-left:5px;font-weight:500;}
.qty{width:60px;padding:6px;border:1px solid #e0e0e0;border-radius:8px;text-align:center;
  margin:6px auto;font-weight:600;display:block;}
.card button{width:100%;border:1.5px solid var(--primary-color);background:#fff5f0;
  color:var(--primary-color);padding:9px;border-radius:10px;font-weight:700;
  font-size:13px;cursor:pointer;transition:.2s;}
.card button:hover{background:var(--primary-color);color:#fff;}
@keyframes fadeCard{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}

/* Loading */
.loading-products{grid-column:1/-1;text-align:center;padding:40px;color:#999;}
.spinner{width:32px;height:32px;border:3px solid #eee;border-top-color:var(--primary-color);
  border-radius:50%;animation:spin .7s linear infinite;margin:0 auto 12px;}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── CATEGORY ───────────────────────── */
.categories-container{display:flex;height:calc(100vh - 200px);}
.category-sidebar{width:90px;background:#fff;overflow-y:auto;border-right:1px solid var(--border);}
.store-card{padding:12px 6px;text-align:center;cursor:pointer;border-bottom:1px solid var(--border);
  transition:.2s;position:relative;}
.store-card:hover{background:#fff5f0;}
.store-card.active-cat{background:#fff5f0;}
.store-card.active-cat::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;
  background:var(--primary-color);border-radius:0 4px 4px 0;}
.store-card p{font-size:10px;font-weight:600;color:#555;margin-top:5px;line-height:1.2;}
.store-card.active-cat p{color:var(--primary-color);font-weight:700;}
.category-img{width:54px;height:54px;object-fit:contain;display:block;margin:0 auto;
  padding:4px;background:#f8f8f8;border-radius:10px;}
.category-content{flex:1;padding:14px;overflow-y:auto;background:var(--bg-light);}
.category-content h2{font-size:17px;margin-bottom:12px;font-weight:700;}

/* ── CART ───────────────────────────── */
.cart-item{display:flex;align-items:center;background:#fff;padding:14px;
  border-radius:14px;margin-bottom:10px;box-shadow:var(--shadow-sm);gap:10px;}
.cart-item img{width:60px;height:60px;object-fit:contain;background:#f8f8f8;
  border-radius:10px;padding:5px;flex-shrink:0;}
.cart-details{flex:1;min-width:0;}
.cart-details h4{margin:0;font-size:14px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cart-details p{margin:3px 0;color:var(--muted);font-size:13px;}
.cart-discount-tag{display:inline-block;background:#e8f5e9;color:#0c831f;
  font-size:10px;font-weight:700;padding:2px 6px;border-radius:4px;margin-top:3px;}
.cart-qty-controls{display:flex;align-items:center;gap:6px;flex-shrink:0;}
.cart-qty-controls button{width:28px;height:28px;border-radius:50%;border:1.5px solid #e0e0e0;
  background:#fff;font-size:16px;font-weight:700;cursor:pointer;display:flex;
  align-items:center;justify-content:center;color:#333;transition:.2s;}
.cart-qty-controls button:hover{background:var(--primary-color);color:#fff;border-color:var(--primary-color);}
.cart-qty-controls span{font-weight:700;font-size:15px;min-width:20px;text-align:center;}
.remove-btn{background:#fff0f0;border:none;color:#e53935;font-size:14px;
  padding:8px 10px;border-radius:8px;cursor:pointer;flex-shrink:0;}

/* ── CART SUMMARY ───────────────────── */
.cart-summary{background:#fff;border-radius:14px;padding:18px;margin-top:16px;box-shadow:var(--shadow-sm);}
.summary-row{display:flex;justify-content:space-between;margin-bottom:10px;
  font-weight:600;color:#333;font-size:14px;}
.grand-total-row{font-size:17px;font-weight:800;color:#111;padding-top:10px;}

/* COUPON */
.coupon-row{margin:10px 0;}
.coupon-input-wrap{display:flex;gap:8px;}
.coupon-input-wrap input{flex:1;padding:10px 14px;border:1.5px solid #e5e7eb;
  border-radius:10px;font-size:14px;font-family:inherit;outline:none;}
.coupon-input-wrap input:focus{border-color:var(--primary-color);}
.coupon-input-wrap button{padding:10px 16px;background:var(--primary-color);color:#fff;
  border:none;border-radius:10px;font-weight:700;cursor:pointer;white-space:nowrap;}
.coupon-msg{font-size:12px;margin-top:6px;font-weight:600;}
.coupon-msg.success{color:#0c831f;}
.coupon-msg.error{color:#e53935;}

/* PROGRESS */
.progress-box{background:#f8f8f8;border-radius:10px;padding:12px;margin:14px 0;}
.progress-box p{font-size:13px;font-weight:600;color:#333;margin-bottom:8px;}
.progress-bar-track{background:#e0e0e0;border-radius:20px;height:8px;overflow:hidden;}
.progress-bar-fill{height:100%;background:linear-gradient(90deg,var(--primary-color),#ff8c00);
  border-radius:20px;transition:width .5s ease;}

/* OFFERS */
.offers-box{background:#fffbf0;border:1px dashed var(--yellow);border-radius:10px;
  padding:10px 14px;margin:10px 0;font-size:13px;}
.offers-box summary{font-weight:700;cursor:pointer;color:#b8860b;}
.offers-box ul{margin-top:8px;padding-left:16px;color:#555;line-height:1.9;}
.delivery-time{text-align:center;font-size:13px;color:var(--muted);margin:10px 0 4px;}

/* BUTTONS */
.checkout-btn,.place-order-btn{width:100%;background:linear-gradient(135deg,var(--primary-color),var(--primary-dark));
  color:#fff;border:none;padding:14px;border-radius:12px;cursor:pointer;
  font-size:15px;font-weight:700;transition:.3s;margin-top:8px;
  box-shadow:0 6px 16px rgba(223,75,11,.3);display:flex;align-items:center;justify-content:center;gap:8px;}
.checkout-btn:hover,.place-order-btn:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(223,75,11,.4);}
.checkout-btn:disabled,.place-order-btn:disabled{opacity:.7;cursor:not-allowed;transform:none;}
.btn-spinner{width:18px;height:18px;border:2px solid rgba(255,255,255,.4);
  border-top-color:#fff;border-radius:50%;animation:spin .6s linear infinite;}

/* ── CHECKOUT ───────────────────────── */
.checkout-header{display:flex;align-items:center;gap:14px;padding:16px 0 10px;}
.checkout-header h3{font-size:18px;font-weight:800;margin:0;}
.back-btn{width:38px;height:38px;border-radius:50%;border:1.5px solid #e5e7eb;
  background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;
  color:#333;font-size:15px;flex-shrink:0;transition:.2s;}
.back-btn:hover{background:var(--primary-color);color:#fff;border-color:var(--primary-color);}
.checkout-form{background:#fff;padding:20px;border-radius:16px;box-shadow:var(--shadow-sm);margin-bottom:14px;}
.checkout-form label{font-weight:600;display:block;margin-bottom:6px;font-size:13px;color:#444;}
.checkout-form input,.checkout-form textarea,.checkout-form select{
  width:100%;padding:12px;margin-bottom:14px;border:1.5px solid #e5e7eb;
  border-radius:10px;font-size:14px;font-family:inherit;transition:.2s;background:#fafbfc;}
.checkout-form input:focus,.checkout-form textarea:focus,.checkout-form select:focus{
  border-color:var(--primary-color);background:#fff;outline:none;}
.loc-detect-inline{display:flex;align-items:center;gap:10px;padding:12px;
  background:#fff5f0;border:1.5px dashed var(--primary-color);border-radius:10px;
  cursor:pointer;margin-bottom:14px;font-size:13px;font-weight:600;color:#333;}
.checkout-coords{font-size:12px;color:var(--muted);margin-top:-10px;margin-bottom:12px;padding-left:4px;}
.checkout-summary-box{background:#fff;padding:18px;border-radius:14px;box-shadow:var(--shadow-sm);margin-bottom:14px;}
.radio-option{display:flex;align-items:center;gap:10px;padding:12px;
  border:1.5px solid #e5e7eb;border-radius:10px;cursor:pointer;margin-bottom:10px;
  font-size:14px;font-weight:600;transition:.2s;}
.radio-option:has(input:checked){border-color:var(--primary-color);background:#fff5f0;}
.radio-option input{accent-color:var(--primary-color);}

/* ── MY ORDERS ──────────────────────── */
.order-card{background:#fff;border-radius:14px;padding:16px;margin-bottom:14px;
  box-shadow:var(--shadow-sm);border:1px solid var(--border);}
.order-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:10px;}
.order-id{font-size:13px;font-weight:800;color:#111;display:block;}
.order-date{font-size:11px;color:var(--muted);margin-top:3px;display:block;}
.order-status-badge{display:inline-flex;align-items:center;gap:5px;padding:5px 10px;
  border-radius:20px;font-size:12px;font-weight:700;white-space:nowrap;}
.order-items{font-size:13px;color:var(--muted);margin:8px 0;line-height:1.5;}
.order-card-footer{display:flex;justify-content:space-between;align-items:center;margin-top:10px;}
.order-total{font-size:16px;font-weight:800;color:#111;}
.order-payment{font-size:12px;color:var(--muted);background:#f5f5f5;
  padding:4px 10px;border-radius:20px;font-weight:600;}

/* ORDER PROGRESS STEPS */
.order-progress{display:flex;justify-content:space-between;margin-top:14px;
  padding-top:12px;border-top:1px solid var(--border);overflow-x:auto;}
.op-step{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:60px;flex:1;}
.op-dot{width:14px;height:14px;border-radius:50%;background:#e0e0e0;
  border:2px solid #ccc;transition:.3s;flex-shrink:0;}
.op-step.done .op-dot{background:var(--accent);border-color:var(--accent);}
.op-step span{font-size:9px;color:#999;font-weight:600;text-align:center;line-height:1.2;}
.op-step.done span{color:var(--accent);}

/* ── ADMIN ──────────────────────────── */
.admin-order-card{background:#fff;border-radius:14px;padding:16px;margin-bottom:12px;
  box-shadow:var(--shadow-sm);border-left:4px solid var(--primary-color);}
.admin-order-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
.admin-order-header b{font-size:14px;color:#111;}
.admin-order-card p{font-size:13px;color:#444;margin:5px 0;line-height:1.4;}
.admin-order-items{color:var(--muted) !important;font-size:12px !important;}
.admin-order-footer{display:flex;justify-content:space-between;align-items:center;
  margin-top:12px;padding-top:10px;border-top:1px solid var(--border);}
.status-select{padding:7px 10px;border:1.5px solid #e5e7eb;border-radius:8px;
  font-size:12px;font-weight:600;cursor:pointer;outline:none;background:#fff;}
.status-select:focus{border-color:var(--primary-color);}
.wa-btn{width:36px;height:36px;background:#25d366;color:#fff;border-radius:50%;
  display:flex;align-items:center;justify-content:center;text-decoration:none;font-size:18px;}
.maps-link{display:inline-flex;align-items:center;gap:6px;color:#1976d2;
  font-size:12px;font-weight:600;text-decoration:none;margin:4px 0;}
.maps-link:hover{text-decoration:underline;}
.logout-btn{background:#ffebee;color:#e53935;border:none;padding:9px 14px;
  border-radius:10px;cursor:pointer;font-weight:600;}

/* ── LOCATION MODAL ─────────────────── */
.location-modal-box{max-width:440px;max-height:90vh;overflow-y:auto;text-align:left;}
.loc-search-row{display:flex;gap:8px;margin-bottom:10px;}
.loc-search-row input{flex:1;padding:11px 14px;border:1.5px solid #e5e7eb;
  border-radius:10px;font-size:14px;font-family:inherit;outline:none;}
.loc-search-row input:focus{border-color:var(--primary-color);}
.loc-search-btn{padding:11px 14px;background:var(--primary-color);color:#fff;
  border:none;border-radius:10px;cursor:pointer;font-size:14px;}
.loc-suggestions{background:#fff;border:1px solid #e5e7eb;border-radius:10px;
  max-height:180px;overflow-y:auto;margin-bottom:10px;}
.loc-sug-item{padding:11px 14px;font-size:13px;cursor:pointer;border-bottom:1px solid #f0f0f0;
  display:flex;align-items:flex-start;gap:8px;line-height:1.4;}
.loc-sug-item:hover{background:#fff5f0;}
.loc-sug-item:last-child{border-bottom:none;}
.loc-detect-btn{width:100%;margin-bottom:10px;padding:11px;border-radius:10px;
  font-size:14px;font-weight:700;border:none;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:8px;}
.loc-status{font-size:13px;font-weight:600;margin-bottom:8px;min-height:18px;}
.map-preview{margin:10px 0;}
.map-coords{font-size:11px;color:var(--muted);margin-top:6px;text-align:center;}
.selected-addr-box{display:flex;align-items:flex-start;gap:10px;background:#fff5f0;
  border:1.5px solid var(--primary-color);border-radius:10px;padding:12px;margin:10px 0;font-size:13px;}
.saved-addr-title{font-size:13px;font-weight:700;color:#333;margin-bottom:8px;}
.saved-addr-item{padding:10px 12px;background:#f8f8f8;border-radius:8px;
  margin-bottom:6px;cursor:pointer;font-size:13px;display:flex;align-items:center;gap:8px;transition:.2s;}
.saved-addr-item:hover{background:#fff5f0;color:var(--primary-color);}

/* ── MODAL ──────────────────────────── */
.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.6);backdrop-filter:blur(4px);
  display:flex;justify-content:center;align-items:center;z-index:999999;padding:20px;}
.modal-box{background:#fff;width:100%;max-width:360px;padding:26px;
  border-radius:20px;text-align:center;box-shadow:var(--shadow-lg);animation:pop .3s;}
@keyframes pop{from{transform:scale(.9);opacity:0}to{transform:scale(1);opacity:1}}
.modal-box h3{margin-bottom:8px;font-size:18px;}
.modal-box p{color:var(--muted);margin-bottom:18px;font-size:13px;}
.modal-box input{width:100%;padding:12px;border:1.5px solid #e5e7eb;
  border-radius:10px;margin-bottom:14px;font-size:14px;font-family:inherit;}
.modal-box input:focus{border-color:var(--primary-color);outline:none;}
.modal-buttons{display:flex;gap:10px;}
.cancel-btn,.login-btn{flex:1;border:none;padding:12px;border-radius:10px;cursor:pointer;font-weight:700;font-size:14px;}
.cancel-btn{background:#f1f2f5;color:#333;}
.login-btn{background:var(--primary-color);color:#fff;}

/* ── FOOTER ─────────────────────────── */
.site-footer{background:#fff;padding:30px 15px;margin-top:40px;margin-bottom:70px;
  border-top:1px solid var(--border);text-align:center;}
.footer-wrap{max-width:600px;margin:0 auto;}
.site-footer h3{color:var(--primary-color);margin-bottom:10px;}
.site-footer>.footer-wrap>p{color:#555;font-size:13px;line-height:1.6;margin-bottom:20px;}
.footer-buttons{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-bottom:24px;}
.fb{display:inline-flex;align-items:center;gap:8px;color:#fff;padding:10px 16px;
  border-radius:25px;text-decoration:none;font-size:13px;font-weight:700;box-shadow:var(--shadow-sm);}
.fb.email{background:#ea4335;}.fb.wa{background:#25d366;}
.fb.ig{background:linear-gradient(135deg,#e1306c,#f77737);}
.branch-title{margin:24px 0 16px;}
.branch-title .line{height:3px;width:50px;background:var(--primary-color);margin:8px auto;border-radius:2px;}
.branch-card{background:#fafbfc;padding:14px;border-radius:12px;margin-bottom:12px;
  border:1px solid var(--border);text-align:left;transition:.2s;}
.branch-card:active{transform:scale(.98);}
.branch-card h5{margin:0 0 4px;font-size:14px;color:#111;display:flex;justify-content:space-between;align-items:center;}
.branch-card h5 span{background:var(--primary-color);color:#fff;font-size:10px;padding:2px 8px;border-radius:10px;font-weight:600;}
.branch-card p{font-size:12px;color:var(--muted);margin:0 0 10px;}
.btn-row{display:flex;gap:8px;}
.mini{flex:1;padding:9px;text-align:center;border-radius:8px;text-decoration:none;
  font-size:12px;font-weight:700;color:#fff;display:flex;align-items:center;justify-content:center;gap:6px;}
.mini.call{background:var(--primary-color);}.mini.wa{background:#25d366;}
.copyright{color:#999;font-size:12px;margin-top:20px;}

/* ── BOTTOM NAV ─────────────────────── */
.bottom-nav{position:fixed;bottom:0;left:0;width:100%;height:70px;background:#fff;
  display:none;justify-content:space-around;align-items:center;
  box-shadow:0 -6px 24px rgba(0,0,0,.08);border-top-left-radius:22px;
  border-top-right-radius:22px;z-index:1000;padding:0 10px;}
.nav-item{display:flex;flex-direction:column;align-items:center;justify-content:center;
  color:var(--inactive-color);cursor:pointer;position:relative;width:70px;height:100%;transition:.35s;}
.icon-wrapper{font-size:19px;display:flex;align-items:center;justify-content:center;
  width:40px;height:40px;border-radius:50%;transition:.35s;}
.nav-item span{font-size:11px;font-weight:600;margin-top:3px;opacity:.85;}
.nav-item.active{color:var(--primary-color);}
.nav-item.active .icon-wrapper{transform:translateY(-10px);background:rgba(223,75,11,.12);font-size:21px;}
.nav-item.active span{transform:translateY(-4px);font-weight:700;opacity:1;}
.badge{position:absolute;top:-6px;right:-8px;background:#e53935;color:#fff;
  font-size:10px;min-width:18px;height:18px;border-radius:50%;
  align-items:center;justify-content:center;font-weight:700;border:2px solid #fff;}

/* ── TOAST ──────────────────────────── */
#toast{position:fixed;bottom:100px;left:50%;transform:translateX(-50%);
  background:#111;color:#fff;padding:12px 20px;border-radius:50px;
  font-size:14px;font-weight:600;max-width:90%;white-space:nowrap;
  opacity:0;visibility:hidden;z-index:99999;transition:.3s;box-shadow:var(--shadow-lg);}
#toast.show{opacity:1;visibility:visible;bottom:120px;}

/* ── SCROLLBAR ──────────────────────── */
::-webkit-scrollbar{width:6px;height:6px;}
::-webkit-scrollbar-track{background:transparent;}
::-webkit-scrollbar-thumb{background:var(--primary-color);border-radius:20px;}

/* ── RESPONSIVE ─────────────────────── */
@media(max-width:768px){
  body{padding-top:125px;}
  .product-grid,#productList,#categoryProductList{grid-template-columns:repeat(2,1fr);gap:10px;}
  .card{padding:10px;border-radius:12px;}
  .card img{height:100px;}
  .card h2{font-size:12px;min-height:32px;}
  .card p{font-size:14px;}
  .banner{height:170px;}
  .bannerText h1{font-size:19px;}
  .bannerText p{font-size:11px;}
  .quick-cats{padding:12px;gap:10px;}
  .qc-icon{width:52px;height:52px;font-size:22px;}
  .order-progress{gap:0;}
  .op-step span{font-size:8px;}
}
@media(max-width:400px){
  .card img{height:90px;}
  .loc-address{max-width:60vw;}
}

/* ── SKELETON LOADING ───────────────── */
@keyframes shimmer{0%{background-position:-400px 0}100%{background-position:400px 0}}
.skel{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);
  background-size:800px 100%;animation:shimmer 1.5s infinite;border-radius:8px;}
.skeleton-card{pointer-events:none;}
.skel-img{height:120px;width:100%;margin-bottom:8px;}
.skel-title{height:14px;width:80%;margin-bottom:6px;}
.skel-price{height:18px;width:50%;margin-bottom:8px;}
.skel-btn{height:36px;width:100%;}

/* ── PRODUCT CARD UPDATED ───────────── */
.card-img-wrap{position:relative;overflow:hidden;border-radius:10px;margin-bottom:8px;background:#f8f8f8;}
.card-img-wrap img{width:100%;height:110px;object-fit:contain;display:block;padding:6px;transition:.3s;}
.card:hover .card-img-wrap img{transform:scale(1.04);}
.wish-btn{position:absolute;top:4px;right:4px;background:none !important;border:none !important;
  outline:none !important;box-shadow:none !important;width:22px;height:22px;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  font-size:15px;z-index:5;padding:0;line-height:1;transition:transform .2s;}
.wish-btn:hover{transform:scale(1.3);}
.wish-btn:active{transform:scale(.85);}
.card-price-row{display:flex;align-items:center;gap:6px;margin:4px 0;}
.card-price{font-size:15px;font-weight:800;color:#111;}
.card-mrp{font-size:12px;color:#999;text-decoration:line-through;}
.card-stock{font-size:11px;color:#666;margin-bottom:6px;}
.low-stock{color:#e53935 !important;font-weight:700;}
.card-btn-row{display:flex;gap:6px;margin-top:6px;}
.card-add-btn{flex:1;border:1.5px solid var(--primary-color);background:#fff5f0;
  color:var(--primary-color);padding:8px 4px;border-radius:8px;font-weight:700;
  font-size:12px;cursor:pointer;transition:.2s;}
.card-add-btn:hover{background:var(--primary-color);color:#fff;}
.card-buy-btn{flex:1;border:none;background:var(--primary-color);
  color:#fff;padding:8px 4px;border-radius:8px;font-weight:700;
  font-size:12px;cursor:pointer;transition:.2s;}
.card-buy-btn:hover{background:var(--primary-dark);}

/* ── SORT BAR ───────────────────────── */
.sort-bar{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;
  margin-bottom:14px;padding-bottom:4px;}
.sort-bar::-webkit-scrollbar{display:none;}
.sort-btn{padding:6px 14px;border-radius:20px;font-size:12px;font-weight:600;
  color:#555;background:#fff;border:1.5px solid #e5e7eb;cursor:pointer;
  white-space:nowrap;transition:.2s;flex-shrink:0;}
.sort-btn:hover{border-color:var(--primary-color);color:var(--primary-color);}
.sort-btn.active-sort{background:var(--primary-color);color:#fff;border-color:var(--primary-color);}

/* ── REORDER BUTTON ─────────────────── */
.reorder-btn{width:100%;margin-top:10px;padding:10px;background:#fff5f0;
  color:var(--primary-color);border:1.5px solid var(--primary-color);
  border-radius:10px;font-weight:700;font-size:13px;cursor:pointer;transition:.2s;
  display:flex;align-items:center;justify-content:center;gap:8px;}
.reorder-btn:hover{background:var(--primary-color);color:#fff;}

/* ── ADMIN STATS ────────────────────── */
.admin-stats-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:20px;}
.stat-card{padding:14px;border-radius:14px;box-shadow:var(--shadow-sm);}
.stat-label{font-size:11px;color:#555;font-weight:600;margin-bottom:4px;}
.stat-value{font-size:22px;font-weight:800;color:#111;}

/* ── PWA INSTALL BTN ────────────────── */
#pwaInstallBtn{background:linear-gradient(135deg,#e3f2fd,#bbdefb) !important;color:#1565c0 !important;}
#pwaInstallBtn i{color:#1565c0;}

/* ── SCROLL TO TOP ──────────────────── */
.scroll-top-btn{position:fixed;bottom:90px;right:14px;width:38px;height:38px;
  background:var(--primary-color);color:#fff;border:none;border-radius:50%;
  display:none;align-items:center;justify-content:center;font-size:16px;
  cursor:pointer;box-shadow:0 4px 12px rgba(223,75,11,.35);z-index:900;
  transition:.3s;}
.scroll-top-btn.visible{display:flex;}
.scroll-top-btn:hover{transform:translateY(-2px);}

/* ── ORDER SUCCESS POPUP ────────────── */
.order-success-overlay{position:fixed;inset:0;background:rgba(0,0,0,.55);
  display:flex;align-items:center;justify-content:center;z-index:99999;
  animation:fadeIn .3s ease;}
.order-success-box{background:#fff;border-radius:24px;padding:36px 28px;
  text-align:center;max-width:290px;width:88%;
  animation:popUp .5s cubic-bezier(.34,1.56,.64,1);}
@keyframes popUp{from{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.success-circle{width:90px;height:90px;margin:0 auto 18px;}
.tick-svg{width:90px;height:90px;}
.tick-circle{stroke:#0c831f;stroke-width:2.5;stroke-dasharray:160;stroke-dashoffset:160;
  animation:drawCircle .7s ease forwards;}
.tick-check{stroke:#0c831f;stroke-width:4;stroke-linecap:round;stroke-linejoin:round;
  stroke-dasharray:55;stroke-dashoffset:55;
  animation:drawTick .5s ease .6s forwards;}
@keyframes drawCircle{to{stroke-dashoffset:0}}
@keyframes drawTick{to{stroke-dashoffset:0}}
.success-title{font-size:22px;font-weight:800;color:#0c831f;margin-bottom:6px;}
.success-sub{font-size:13px;color:#555;margin-bottom:8px;}
.success-id{font-size:11px;color:#999;margin-bottom:10px;}
.success-time{font-size:13px;color:#333;background:#f0fdf4;padding:8px 16px;
  border-radius:20px;display:inline-block;font-weight:600;}

/* ── ADMIN INLINE BUTTONS ───────────── */
.scroll-top-btn-inline{background:#f5f5f5;border:1.5px solid #e0e0e0;color:#333;
  padding:8px 14px;border-radius:10px;cursor:pointer;font-size:13px;font-weight:600;
  display:flex;align-items:center;gap:6px;transition:.2s;}
.scroll-top-btn-inline:hover{background:var(--primary-color);color:#fff;border-color:var(--primary-color);}
.go-to-form-btn{width:100%;margin:16px 0;padding:13px;background:var(--primary-color);
  color:#fff;border:none;border-radius:12px;font-size:14px;font-weight:700;
  cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:.2s;}
.go-to-form-btn:hover{background:var(--primary-dark);}

/* ── MIC ACTIVE ─────────────────────── */
.mic-icon{transition:.2s;}
.mic-icon.listening{color:#e53935 !important;}

/* ── NEW FOOTER ─────────────────────── */
.site-footer{background:#fff;border-top:1px solid var(--border);margin-bottom:70px;}
.footer-wrap{max-width:600px;margin:0 auto;padding:0 15px 20px;}
.footer-section{padding:20px 0;border-bottom:1px solid var(--border);}
.footer-section-title{font-size:14px;font-weight:800;color:#111;margin-bottom:14px;
  display:flex;align-items:center;gap:8px;}

/* ABOUT */
.about-section{padding:24px 0 20px;border-bottom:1px solid var(--border);}
.about-logo-row{display:flex;align-items:center;gap:14px;margin-bottom:16px;}
.about-logo{width:52px;height:52px;border-radius:12px;object-fit:contain;
  background:#fff8e1;padding:4px;}
.about-name{font-size:20px;font-weight:800;color:#111;margin:0;}
.about-tagline{font-size:13px;color:var(--primary-color);font-weight:600;margin:2px 0 0;}
.about-stats-row{display:flex;align-items:center;background:#f8f8f8;border-radius:12px;
  padding:14px;margin-bottom:14px;}
.about-stat{flex:1;text-align:center;}
.as-value{display:block;font-size:20px;font-weight:800;color:#111;}
.as-label{font-size:11px;color:var(--muted);font-weight:600;}
.about-stat-divider{width:1px;height:36px;background:#e0e0e0;}
.about-desc{font-size:13px;color:#555;line-height:1.7;margin-bottom:14px;}
.about-features{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.af-item{display:flex;align-items:center;gap:8px;background:#f8f9fa;
  padding:10px 12px;border-radius:10px;font-size:12px;font-weight:600;color:#333;}
.af-item i{font-size:16px;flex-shrink:0;}

/* SUPPORT */
.support-btns{display:flex;flex-direction:column;gap:10px;margin-bottom:10px;}
.support-btn{display:flex;align-items:center;gap:14px;padding:13px 16px;
  border-radius:12px;text-decoration:none;transition:.2s;}
.support-btn i{font-size:22px;flex-shrink:0;}
.support-btn p{margin:0;font-size:14px;font-weight:700;color:#111;}
.support-btn span{font-size:12px;color:var(--muted);}
.support-btn:active{transform:scale(.98);}
.wa-support{background:#e8f5e9;border:1px solid #c8e6c9;}
.wa-support i{color:#25d366;}
.call-support{background:#fff3e0;border:1px solid #ffe0b2;}
.call-support i{color:#e65100;}
.email-support{background:#e3f2fd;border:1px solid #bbdefb;}
.email-support i{color:#1565c0;}
.ig-support{background:#fce4ec;border:1px solid #f8bbd0;}
.ig-support i{color:#e91e63;}
.support-timing{font-size:12px;color:var(--muted);text-align:center;
  margin-top:4px;display:flex;align-items:center;justify-content:center;gap:6px;}

/* LEGAL */
.legal-links{display:flex;align-items:center;gap:8px;flex-wrap:wrap;}
.legal-link{font-size:13px;color:var(--primary-color);cursor:pointer;font-weight:600;}
.legal-link:hover{text-decoration:underline;}
.legal-dot{color:#ccc;font-size:10px;}

/* PRIVACY MODAL */
.privacy-box{max-width:460px;max-height:85vh;overflow-y:auto;text-align:left;padding:20px;}
.privacy-content h4{font-size:14px;font-weight:700;color:#111;margin:14px 0 4px;}
.privacy-content p{font-size:13px;color:#555;line-height:1.6;margin-bottom:8px;}

/* ── FAQ ────────────────────────────── */
.faq-list{display:flex;flex-direction:column;gap:8px;}
.faq-item{border:1px solid var(--border);border-radius:10px;overflow:hidden;cursor:pointer;}
.faq-q{display:flex;justify-content:space-between;align-items:center;
  padding:12px 14px;font-size:13px;font-weight:600;color:#333;}
.faq-q i{font-size:11px;color:#999;transition:.3s;flex-shrink:0;margin-left:8px;}
.faq-item.open .faq-q i{transform:rotate(180deg);}
.faq-a{display:none;padding:0 14px 12px;font-size:13px;color:#555;line-height:1.6;}
.faq-item.open .faq-a{display:block;}
.faq-item.open{border-color:var(--primary-color);}
.faq-item.open .faq-q{color:var(--primary-color);}

/* ── DARK MODE ──────────────────────── */
.dark-mode{background:#121212 !important;color:#e0e0e0 !important;}

/* Cards & containers */
.dark-mode .card,
.dark-mode .cart-item,
.dark-mode .cart-summary,
.dark-mode .checkout-form,
.dark-mode .checkout-summary-box,
.dark-mode .order-card,
.dark-mode .admin-order-card,
.dark-mode .modal-box,
.dark-mode .promo-strip,
.dark-mode .mini-banner,
.dark-mode .site-footer,
.dark-mode .branch-card,
.dark-mode .faq-item,
.dark-mode .step,
.dark-mode .ostep,
.dark-mode .about-section,
.dark-mode .footer-section,
.dark-mode .support-btn,
.dark-mode .admin-stats-row .stat-card{
  background:#1e1e1e !important;
  border-color:#333 !important;
}

/* Text colors */
.dark-mode h1,.dark-mode h2,.dark-mode h3,.dark-mode h4,.dark-mode h5,
.dark-mode p,.dark-mode span,.dark-mode label,.dark-mode div{
  color:#e0e0e0;
}
.dark-mode .card h2,
.dark-mode .cart-details h4,
.dark-mode .card-price,
.dark-mode .otx,.dark-mode .sr-title,
.dark-mode .feat-name,.dark-mode .step-text,
.dark-mode .order-id,.dark-mode .order-total{
  color:#ffffff !important;
}
.dark-mode .card-stock,
.dark-mode .card-mrp,
.dark-mode .cart-details p,
.dark-mode .sr-sub,.dark-mode .odx,
.dark-mode .order-date,.dark-mode .sec-sub{
  color:#aaa !important;
}

/* Header */
.dark-mode .app-header{background:linear-gradient(135deg,#1a1200,#2a1e00) !important;}
.dark-mode #searchInput{background:#2a2a2a !important;color:#e0e0e0 !important;}
.dark-mode .search-container{background:#2a2a2a !important;}
.dark-mode .search-icon-inside{color:#ffc60b !important;}

/* Bottom nav */
.dark-mode .bottom-nav{background:#1a1a1a !important;border-color:#333 !important;}
.dark-mode .nav-item{color:#888 !important;}
.dark-mode .nav-item.active{color:var(--primary-color) !important;}

/* Category chips */
.dark-mode .cat-chip{background:#2a2a2a !important;border-color:#444 !important;color:#ccc !important;}
.dark-mode .cat-chip.active-chip{background:var(--primary-color) !important;color:#fff !important;border-color:var(--primary-color) !important;}

/* Category sidebar */
.dark-mode .category-sidebar{background:#1a1a1a !important;}
.dark-mode .store-card{background:#1a1a1a !important;border-color:#333 !important;}
.dark-mode .store-card p{color:#ccc !important;}
.dark-mode .store-card.active-cat{background:#2a1500 !important;}
.dark-mode .category-content{background:#121212 !important;}
.dark-mode .category-content h2{color:#fff !important;}

/* Profile menu */
.dark-mode .profile-menu{background:#1e1e1e !important;border-color:#333 !important;}
.dark-mode .pm-list li{color:#e0e0e0 !important;}
.dark-mode .pm-list li:hover{background:#2a1500 !important;}
.dark-mode .pm-header h4{color:#fff !important;}
.dark-mode .pm-header p{color:#aaa !important;}

/* Settings */
.dark-mode .settings-box{background:#1e1e1e !important;}
.dark-mode .settings-header{background:#1e1e1e !important;border-color:#333 !important;}
.dark-mode .settings-row{border-color:#333 !important;}
.dark-mode .settings-row-left i{background:#2a2a2a !important;}
.dark-mode .settings-label{color:#888 !important;}

/* Buttons */
.dark-mode .card-add-btn{background:#2a2a2a !important;color:var(--primary-color) !important;border-color:var(--primary-color) !important;}
.dark-mode .checkout-btn,.dark-mode .place-order-btn{color:#fff !important;}
.dark-mode .back-btn{background:#2a2a2a !important;color:#e0e0e0 !important;border-color:#444 !important;}

/* Summary rows */
.dark-mode .summary-row{color:#e0e0e0 !important;}
.dark-mode .grand-total-row{color:#fff !important;}
.dark-mode hr{border-color:#333 !important;}

/* Progress bar track */
.dark-mode .progress-bar-track{background:#333 !important;}
.dark-mode .offers-box{background:#1e1e1e !important;border-color:#444 !important;}
.dark-mode .offers-box summary{color:#ffc60b !important;}
.dark-mode .offers-box ul{color:#ccc !important;}

/* Order cards */
.dark-mode .order-card{background:#1e1e1e !important;border-color:#333 !important;}
.dark-mode .order-items{color:#aaa !important;}
.dark-mode .order-payment{background:#2a2a2a !important;color:#ccc !important;}
.dark-mode .op-dot{background:#333 !important;border-color:#555 !important;}
.dark-mode .op-step span{color:#888 !important;}

/* Forms */
.dark-mode input,.dark-mode textarea,.dark-mode select{
  background:#2a2a2a !important;color:#e0e0e0 !important;border-color:#444 !important;}
.dark-mode input::placeholder,.dark-mode textarea::placeholder{color:#666 !important;}

/* Coupon */
.dark-mode .coupon-input-wrap input{background:#2a2a2a !important;color:#e0e0e0 !important;}
.dark-mode .delivery-time{color:#aaa !important;}

/* Footer */
.dark-mode .copyright{color:#666 !important;}
.dark-mode .about-desc{color:#aaa !important;}
.dark-mode .about-stats-row{background:#2a2a2a !important;}
.dark-mode .as-label{color:#888 !important;}
.dark-mode .as-value{color:#fff !important;}
.dark-mode .af-item{background:#2a2a2a !important;color:#ccc !important;}

/* Toast */
.dark-mode #toast{background:#333 !important;}

/* Admin dark mode */
.dark-mode .admin-order-card{background:#1e1e1e !important;border-color:#df4b0b !important;}
.dark-mode .admin-order-card p{color:#ccc !important;}
.dark-mode .admin-order-card b{color:#fff !important;}
.dark-mode .status-select{background:#2a2a2a !important;color:#e0e0e0 !important;border-color:#444 !important;}
.dark-mode .admin-stats-row .stat-card{background:#1e1e1e !important;}
.dark-mode .stat-label{color:#aaa !important;}
.dark-mode .stat-value{color:#fff !important;}
.dark-mode #adminInventoryGrid .cart-item{background:#1e1e1e !important;}
.dark-mode .logout-btn{background:#2a0a0a !important;color:#ff6b6b !important;}
.dark-mode .scroll-top-btn-inline{background:#2a2a2a !important;color:#e0e0e0 !important;border-color:#444 !important;}
.dark-mode .go-to-form-btn{opacity:.9;}
.dark-mode .see-all-orders-btn{background:#2a2a2a !important;border-color:#444 !important;color:#ccc !important;}
.dark-mode #adminInventoryGrid .cart-details h4{color:#fff !important;}
.dark-mode #adminInventoryGrid .cart-details p{color:#aaa !important;}

/* ── SETTINGS ───────────────────────── */
.settings-box{background:#fff;width:100%;max-width:420px;max-height:90vh;
  overflow-y:auto;border-radius:20px 20px 0 0;position:fixed;bottom:0;left:50%;
  transform:translateX(-50%);padding:0 0 20px;box-shadow:0 -8px 30px rgba(0,0,0,.15);}
.settings-header{display:flex;align-items:center;gap:14px;padding:18px 20px 14px;
  border-bottom:1px solid var(--border);position:sticky;top:0;background:#fff;z-index:10;}
.settings-header h3{font-size:17px;font-weight:800;margin:0;}
.settings-section{padding:16px 20px 0;}
.settings-label{font-size:11px;font-weight:700;color:#999;text-transform:uppercase;
  letter-spacing:.8px;margin-bottom:8px;}
.settings-row{display:flex;justify-content:space-between;align-items:center;
  padding:14px 0;border-bottom:1px solid #f5f5f5;cursor:pointer;}
.settings-row:last-child{border:none;}
.settings-row-left{display:flex;align-items:center;gap:14px;}
.settings-row-left i{width:36px;height:36px;border-radius:10px;background:#f5f5f5;
  display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;}
.sr-title{font-size:14px;font-weight:600;color:#111;}
.sr-sub{font-size:12px;color:#999;margin-top:1px;}

/* TOGGLE SWITCH */
.toggle-switch{width:46px;height:26px;background:#e0e0e0;border-radius:13px;
  position:relative;transition:.3s;flex-shrink:0;}
.toggle-switch.on{background:var(--primary-color);}
.toggle-knob{width:22px;height:22px;background:#fff;border-radius:50%;
  position:absolute;top:2px;left:2px;transition:.3s;box-shadow:0 2px 4px rgba(0,0,0,.2);}
.toggle-switch.on .toggle-knob{left:22px;}

/* ── SMART SEARCH ───────────────────── */
.search-suggestions{position:absolute;top:100%;left:0;right:0;background:#fff;
  border-radius:0 0 14px 14px;box-shadow:0 8px 24px rgba(0,0,0,.12);
  z-index:2000;max-height:280px;overflow-y:auto;}
.sug-item{display:flex;align-items:center;gap:12px;padding:10px 14px;
  cursor:pointer;border-bottom:1px solid #f5f5f5;transition:.15s;}
.sug-item:hover{background:#fff5f0;}
.sug-item:last-child{border:none;}
.sug-item img{width:36px;height:36px;object-fit:contain;border-radius:8px;background:#f8f8f8;}
.sug-name{font-size:13px;font-weight:600;color:#111;}
.sug-price{font-size:12px;color:var(--primary-color);font-weight:700;}
.header-search{position:relative;}

/* ── ANALYTICS BTN ──────────────────── */
.analytics-btn{width:36px;height:36px;background:#e3f2fd;border:none;border-radius:10px;
  display:flex;align-items:center;justify-content:center;color:#1976d2;font-size:15px;
  text-decoration:none;cursor:pointer;transition:.2s;}
.analytics-btn:hover{background:#1976d2;color:#fff;}

/* ── SEE ALL ORDERS BTN ─────────────── */
.see-all-orders-btn{width:100%;padding:12px;background:#f8f8f8;border:1.5px dashed #ddd;
  border-radius:12px;font-size:13px;font-weight:700;color:#555;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:8px;margin:10px 0;transition:.2s;}
.see-all-orders-btn:hover{background:#fff5f0;border-color:var(--primary-color);color:var(--primary-color);}

/* ── BILL BTN ───────────────────────── */
.order-card-actions{display:flex;gap:8px;margin-top:10px;}
.bill-btn{flex:1;padding:10px;background:#e3f2fd;color:#1565c0;border:1.5px solid #bbdefb;
  border-radius:10px;font-weight:700;font-size:13px;cursor:pointer;transition:.2s;
  display:flex;align-items:center;justify-content:center;gap:6px;}
.bill-btn:hover{background:#1976d2;color:#fff;border-color:#1976d2;}
.reorder-btn{flex:1;}

/* ── PRODUCT UNIT (Blinkit style) ─────── */
.product-unit{display:inline-block;background:#f0f4f8;color:#555;
  font-size:11px;font-weight:700;padding:2px 8px;border-radius:6px;
  margin:2px 0 4px;border:1px solid #e0e8f0;}
.dark-mode .product-unit{background:#2a2a2a !important;color:#aaa !important;border-color:#444 !important;}

/* ── PRODUCT VARIANTS (Blinkit style) ── */
.variant-row{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0;}
.variant-btn{padding:5px 10px;border-radius:8px;border:1.5px solid #e0e0e0;
  background:#fff;cursor:pointer;text-align:center;transition:.2s;min-width:54px;}
.variant-btn .vb-unit{display:block;font-size:11px;font-weight:700;color:#333;}
.variant-btn .vb-price{display:block;font-size:12px;font-weight:800;color:#111;margin-top:1px;}
.variant-btn.active-variant{border-color:var(--primary-color);background:#fff5f0;}
.variant-btn.active-variant .vb-unit{color:var(--primary-color);}
.variant-btn.active-variant .vb-price{color:var(--primary-color);}
.dark-mode .variant-btn{background:#2a2a2a !important;border-color:#444 !important;}
.dark-mode .variant-btn .vb-unit{color:#ccc !important;}
.dark-mode .variant-btn .vb-price{color:#fff !important;}
.dark-mode .variant-btn.active-variant{border-color:var(--primary-color) !important;background:#2a1500 !important;}

/* ── PRODUCT CARD — CLEAN (no variant boxes) ── */
.card{cursor:pointer;}
.card-unit-tag{font-size:11px;color:#777;font-weight:600;margin:3px 0 2px;
  background:#f5f5f5;display:inline-block;padding:2px 8px;border-radius:6px;}
.card-add-quick{width:100%;margin-top:8px;padding:9px;border:1.5px solid var(--primary-color);
  background:#fff5f0;color:var(--primary-color);border-radius:10px;font-weight:700;
  font-size:13px;cursor:pointer;transition:.2s;}
.card-add-quick:hover{background:var(--primary-color);color:#fff;}
.dark-mode .card-unit-tag{background:#2a2a2a !important;color:#aaa !important;}
.dark-mode .card-add-quick{background:#2a1500 !important;}

/* ── PRODUCT DETAIL MODAL ───────────────── */
.pd-box{background:#fff;width:100%;max-width:480px;max-height:92vh;
  overflow-y:auto;border-radius:24px 24px 0 0;position:fixed;bottom:0;
  left:50%;transform:translateX(-50%);animation:slideUp .3s ease;
  box-shadow:0 -8px 40px rgba(0,0,0,.18);}
@keyframes slideUp{from{transform:translateX(-50%) translateY(100%)}to{transform:translateX(-50%) translateY(0)}}
.pd-close{position:absolute;top:14px;right:16px;background:none;border:none;
  font-size:22px;cursor:pointer;color:#555;z-index:10;width:36px;height:36px;
  border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:#f5f5f5;}
.pd-close:hover{background:#eee;}

/* Image */
.pd-img-wrap{position:relative;background:#f8f8f8;border-radius:24px 24px 0 0;
  display:flex;align-items:center;justify-content:center;padding:30px;min-height:220px;}
.pd-img-wrap img{width:180px;height:180px;object-fit:contain;}
.pd-offer{position:absolute;top:16px;left:16px;background:#0c831f;color:#fff;
  font-size:12px;font-weight:700;padding:4px 10px;border-radius:20px;}

/* Body */
.pd-body{padding:18px 20px 30px;}
.pd-cat{font-size:12px;color:#999;font-weight:600;text-transform:uppercase;
  letter-spacing:.5px;margin-bottom:4px;}
.pd-name{font-size:19px;font-weight:800;color:#111;margin-bottom:14px;line-height:1.3;}

/* Unit selector */
.pd-unit-label{font-size:13px;font-weight:700;color:#333;margin-bottom:10px;}
.pd-variants{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;}
.pd-variant-btn{padding:8px 14px;border:2px solid #e0e0e0;border-radius:10px;
  background:#fff;cursor:pointer;text-align:left;transition:.2s;min-width:72px;}
.pd-variant-btn:hover{border-color:var(--primary-color);}
.pd-variant-active{border-color:var(--primary-color) !important;background:#fff5f0 !important;}
.pdv-unit{display:block;font-size:12px;font-weight:700;color:#333;}
.pdv-price{display:block;font-size:14px;font-weight:800;color:#111;margin-top:2px;}
.pd-variant-active .pdv-unit,.pd-variant-active .pdv-price{color:var(--primary-color);}
.pd-single-unit{display:inline-block;background:#f0f4f8;color:#555;font-size:13px;
  font-weight:700;padding:6px 14px;border-radius:10px;margin-bottom:14px;}

/* Price */
.pd-price-row{display:flex;align-items:center;gap:10px;margin-bottom:4px;}
.pd-price{font-size:24px;font-weight:900;color:#111;}
.pd-mrp{font-size:14px;color:#999;text-decoration:line-through;}
.pd-save{font-size:13px;font-weight:700;color:#0c831f;background:#e8f5e9;
  padding:3px 8px;border-radius:6px;}
.pd-tax{font-size:11px;color:#999;margin-bottom:8px;}
.pd-stock{font-size:13px;font-weight:700;margin-bottom:14px;}

/* Qty + Add */
.pd-qty-row{display:flex;align-items:center;gap:12px;margin-bottom:20px;}
.pd-qty-ctrl{display:flex;align-items:center;border:2px solid #e0e0e0;border-radius:12px;overflow:hidden;}
.pd-qty-ctrl button{width:40px;height:44px;border:none;background:#fff;
  font-size:20px;font-weight:700;cursor:pointer;color:#333;transition:.2s;}
.pd-qty-ctrl button:hover{background:#f5f5f5;}
.pd-qty-ctrl span{min-width:40px;text-align:center;font-size:16px;font-weight:800;}
.pd-add-btn{flex:1;background:var(--primary-color);color:#fff;border:none;
  padding:13px 20px;border-radius:12px;font-size:15px;font-weight:700;cursor:pointer;
  display:flex;align-items:center;justify-content:center;gap:8px;transition:.2s;
  box-shadow:0 4px 14px rgba(223,75,11,.3);}
.pd-add-btn:hover{background:var(--primary-dark);}
.pd-add-btn:disabled{opacity:.5;cursor:not-allowed;}

/* Why shop */
.pd-why{border-top:1px solid #f0f0f0;padding-top:16px;}
.pd-why h4{font-size:14px;font-weight:800;color:#111;margin-bottom:12px;}
.pd-why-row{display:flex;align-items:flex-start;gap:12px;margin-bottom:10px;}
.pd-why-icon{font-size:24px;flex-shrink:0;}
.pd-why-row b{font-size:13px;display:block;color:#111;}
.pd-why-row p{font-size:12px;color:#999;margin:2px 0 0;}

/* Dark mode */
.dark-mode .pd-box{background:#1e1e1e !important;}
.dark-mode .pd-img-wrap{background:#2a2a2a !important;}
.dark-mode .pd-name{color:#fff !important;}
.dark-mode .pd-price{color:#fff !important;}
.dark-mode .pd-variant-btn{background:#2a2a2a !important;border-color:#444 !important;}
.dark-mode .pdv-unit,.dark-mode .pdv-price{color:#ccc !important;}
.dark-mode .pd-variant-active{background:#2a1500 !important;border-color:var(--primary-color) !important;}
.dark-mode .pd-why{border-color:#333 !important;}
.dark-mode .pd-why h4,.dark-mode .pd-why-row b{color:#fff !important;}
.dark-mode .pd-qty-ctrl{border-color:#444 !important;}
.dark-mode .pd-qty-ctrl button{background:#2a2a2a !important;color:#e0e0e0 !important;}
