/* ═══════════════════════════════════════════════════════════
   BHATTI FRUIT FARM – OpenCart 4.x Custom Theme Stylesheet
   ═══════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,700;0,900;1,400&family=Outfit:wght@300;400;500;600;700;800;900&family=Nunito:wght@300;400;600;700&display=swap');

:root {
  --green-dark:  #1a4a1f;
  --green-mid:   #2d7a35;
  --green-light: #4caf50;
  --green-pale:  #e8f5e9;
  --gold:        #c8952a;
  --gold-light:  #f5c842;
  --cream:       #fdf8f0;
  --brown:       #5c3d1e;
  --text-dark:   #1a1a1a;
  --text-muted:  #666;
  --white:       #fff;
  --shadow:      0 8px 32px rgba(0,0,0,0.12);
  --shadow-hover:0 16px 48px rgba(0,0,0,0.2);
  --radius:      16px;
  --wa-green:    #25D366;
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }

body {
  font-family:'Nunito', sans-serif;
  background:var(--cream);
  color:var(--text-dark);
  overflow-x:hidden;
}

/* ─── OVERRIDE OC BOOTSTRAP TOP BAR ─────────────────────── */
#top { display:none !important; }
#alert { position:fixed; top:80px; left:50%; transform:translateX(-50%); z-index:9999; min-width:340px; }
#alert .alert { border-radius:12px; box-shadow:var(--shadow); }

/* ─── NAVBAR ─────────────────────────────────────────────── */
#bhatti-nav {
  position:fixed; top:0; left:0; right:0; z-index:999;
  background:rgba(18, 51, 22, 0.88);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  padding:0 5%;
  display:flex; align-items:center; justify-content:space-between;
  height:80px;
  border-bottom: 2px solid var(--gold);
  box-shadow:0 8px 32px rgba(0,0,0,0.15);
  transition: all 0.3s ease;
}

.bhatti-logo {
  display:flex; align-items:center; gap:12px;
  text-decoration:none;
}
.bhatti-logo-icon {
  width:46px; height:46px;
  background:linear-gradient(135deg,var(--gold),var(--gold-light));
  border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  font-size:24px;
  border: 2px solid rgba(255,255,255,0.2);
  box-shadow:0 4px 15px rgba(200,149,42,0.4);
  transition: transform 0.3s ease;
}
.bhatti-logo:hover .bhatti-logo-icon {
  transform: rotate(15deg) scale(1.05);
}
.bhatti-logo-text {
  display:flex; flex-direction:column; line-height:1.1;
}
.bhatti-logo-text span:first-child {
  font-family:'Playfair Display', serif;
  font-weight:900; font-size:1.3rem;
  color:#fff;
  background: linear-gradient(135deg, #fff 30%, var(--gold-light) 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  letter-spacing:0.5px;
}
.bhatti-logo-text span:last-child {
  font-family:'Outfit', sans-serif;
  font-weight:600;
  font-size:0.6rem; color:rgba(255,255,255,0.6);
  letter-spacing:3px; text-transform:uppercase;
  margin-top: 2px;
}

.bhatti-nav-links {
  display:flex; gap:36px; list-style:none; align-items:center;
}
.bhatti-nav-links a {
  color:rgba(255,255,255,0.9); text-decoration:none;
  font-family:'Outfit', sans-serif;
  font-weight:600; letter-spacing:1.5px;
  font-size:0.85rem;
  text-transform:uppercase;
  padding: 6px 0;
  position: relative;
  transition:color 0.3s ease;
}
.bhatti-nav-links a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 0;
  height: 2px;
  background: var(--gold-light);
  transition: all 0.3s ease;
  transform: translateX(-50%);
}
.bhatti-nav-links a:hover {
  color:var(--gold-light);
}
.bhatti-nav-links a:hover::after {
  width: 100%;
}

.bhatti-nav-right {
  display:flex; align-items:center; gap:16px;
}

.nav-wa-btn {
  background:linear-gradient(135deg,var(--wa-green),#1da851);
  color:white !important; padding:10px 22px;
  border-radius:50px; font-weight:700 !important;
  font-family:'Outfit', sans-serif;
  display:flex; align-items:center; gap:8px;
  transition:all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
  box-shadow:0 4px 16px rgba(37,211,102,0.3);
  text-decoration:none; font-size:0.85rem;
  border: 1px solid rgba(255,255,255,0.1);
}
.nav-wa-btn:hover {
  transform:translateY(-3px);
  box-shadow:0 8px 24px rgba(37,211,102,0.5) !important;
}

.nav-cart-btn {
  background:rgba(255,255,255,0.1) !important;
  border:2px solid rgba(255,255,255,0.2) !important;
  color:white !important; padding:9px 20px !important;
  border-radius:50px !important; font-weight:700 !important;
  font-family:'Outfit', sans-serif !important;
  display:flex !important; align-items:center !important; gap:8px !important;
  text-decoration:none !important; font-size:0.85rem !important;
  transition:all 0.3s ease !important;
}
.nav-cart-btn:hover {
  background:rgba(255,255,255,0.2) !important;
  border-color:var(--gold) !important;
  transform: translateY(-2px);
}
.nav-cart-btn .cart-count {
  background:var(--gold-light); color:var(--brown);
  border-radius:50%; width:20px; height:20px;
  display:flex; align-items:center; justify-content:center;
  font-size:0.72rem; font-weight:900;
}

.bhatti-hamburger {
  display:none;
  background:none; border:none; cursor:pointer;
  flex-direction:column; gap:5px; padding:4px;
}
.bhatti-hamburger span {
  display:block; width:24px; height:2px;
  background:white; border-radius:2px; transition:all 0.3s;
}

@media (max-width:768px) {
  .bhatti-nav-links { display:none; }
  .bhatti-hamburger { display:flex; }
  .bhatti-nav-links.open {
    display:flex; flex-direction:column;
    position:fixed; top:80px; left:0; right:0;
    background:rgba(26,74,31,0.98);
    padding:20px 5%; gap:16px; z-index:998;
  }
}

/* ─── PAGE WRAPPER ───────────────────────────────────────── */
#container { padding-top:80px; }

/* ─── HERO SLIDER ────────────────────────────────────────── */
.bhatti-hero {
  position:relative; height:calc(100vh - 70px); min-height:500px;
  overflow:hidden;
}
.bhatti-slides {
  display:flex; height:100%;
  transition:transform 0.8s cubic-bezier(0.77,0,0.175,1);
}
.bhatti-slide {
  min-width:100%; height:100%; position:relative;
  display:flex; align-items:center; justify-content:center;
}
.slide-bg {
  position:absolute; inset:0;
  background-size:cover; background-position:center;
  transform:scale(1.05);
  transition:transform 8s ease;
}
.bhatti-slide.active .slide-bg { transform:scale(1); }
.slide-overlay {
  position:absolute; inset:0;
  background:linear-gradient(135deg,rgba(26,74,31,0.75) 0%,rgba(0,0,0,0.45) 100%);
}
.slide-content {
  position:relative; z-index:2;
  text-align:center; color:white;
  max-width:780px; padding:0 60px;
  opacity:0; transform:translateY(40px);
  transition:opacity 0.8s 0.3s, transform 0.8s 0.3s;
}
.bhatti-slide.active .slide-content { opacity:1; transform:translateY(0); }
.slide-badge {
  display:inline-block;
  background:linear-gradient(135deg,var(--gold),var(--gold-light));
  color:var(--brown); font-size:0.72rem; font-weight:800;
  letter-spacing:3px; text-transform:uppercase;
  padding:6px 20px; border-radius:50px; margin-bottom:20px;
}
.slide-content h1 {
  font-family:'Playfair Display', serif;
  font-size:clamp(2rem,5.5vw,4.5rem);
  font-weight:900; line-height:1.15; margin-bottom:20px;
  text-shadow:0 2px 20px rgba(0,0,0,0.3);
}
.slide-content h1 em { color:var(--gold-light); font-style:normal; }
.slide-content p {
  font-size:clamp(0.95rem,2vw,1.1rem);
  opacity:0.9; margin-bottom:36px;
  line-height:1.6; max-width:560px; margin-left:auto; margin-right:auto;
}
.slide-btns { display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }

.btn-hero-primary {
  background:linear-gradient(135deg,var(--gold),var(--gold-light));
  color:var(--brown); padding:14px 32px; border-radius:50px;
  font-weight:800; font-size:0.95rem; text-decoration:none;
  letter-spacing:0.5px; transition:all 0.3s;
  box-shadow:0 4px 20px rgba(200,149,42,0.4);
}
.btn-hero-primary:hover { transform:translateY(-3px); box-shadow:0 8px 32px rgba(200,149,42,0.6); color:var(--brown); }

.btn-hero-secondary {
  background:rgba(255,255,255,0.15); backdrop-filter:blur(8px);
  color:white; padding:14px 32px; border-radius:50px;
  font-weight:700; font-size:0.95rem; text-decoration:none;
  border:2px solid rgba(255,255,255,0.5);
  transition:all 0.3s;
}
.btn-hero-secondary:hover { background:rgba(255,255,255,0.25); transform:translateY(-3px); color:white; }

.hero-nav {
  position:absolute; bottom:32px; left:50%; transform:translateX(-50%);
  display:flex; gap:10px; z-index:10;
}
.hero-dot {
  width:10px; height:10px; border-radius:50%;
  background:rgba(255,255,255,0.4); cursor:pointer;
  transition:all 0.3s; border:none;
}
.hero-dot.active { background:var(--gold-light); transform:scale(1.3); }

.hero-arrow {
  position:absolute; top:50%; transform:translateY(-50%);
  z-index:10; background:rgba(255,255,255,0.15);
  backdrop-filter:blur(8px); border:2px solid rgba(255,255,255,0.3);
  color:white; width:52px; height:52px; border-radius:50%;
  font-size:1.3rem; cursor:pointer; transition:all 0.3s;
  display:flex; align-items:center; justify-content:center;
}
.hero-arrow:hover { background:rgba(255,255,255,0.3); transform:translateY(-50%) scale(1.1); }
.hero-arrow.left { left:24px; }
.hero-arrow.right { right:24px; }

@media (max-width:768px) {
  .slide-content { padding:0 20px; }
  .hero-arrow { display:none; }
  .btn-hero-primary, .btn-hero-secondary { padding:12px 24px; font-size:0.9rem; width:100%; max-width:280px; }
  .slide-btns { flex-direction:column; align-items:center; gap:10px; }
}

/* ─── TRUST BAR ──────────────────────────────────────────── */
.trust-bar {
  background:linear-gradient(135deg,var(--green-dark),var(--green-mid));
  padding:18px 5%;
  display:flex; justify-content:center; gap:clamp(16px,3.5vw,70px);
  flex-wrap:wrap;
}
.trust-item { display:flex; align-items:center; gap:10px; color:white; }
.trust-item .t-icon { font-size:1.4rem; }
.trust-item .t-label { font-size:0.8rem; font-weight:700; letter-spacing:0.5px; text-transform:uppercase; opacity:0.92; }

/* ─── SECTION HEADER ─────────────────────────────────────── */
.bhatti-section-header { text-align:center; padding:70px 5% 44px; }
.bhatti-section-header .tag {
  display:inline-block;
  background:var(--green-pale); color:var(--green-dark);
  font-size:0.72rem; font-weight:800; letter-spacing:3px;
  text-transform:uppercase; padding:6px 18px; border-radius:50px;
  margin-bottom:16px; border:1.5px solid rgba(45,122,53,0.2);
}
.bhatti-section-header h2 {
  font-family:'Playfair Display', serif;
  font-size:clamp(2rem,4vw,3.2rem);
  font-weight:900; color:var(--green-dark);
  margin-bottom:16px; line-height:1.2;
}
.bhatti-section-header h2 em { color:var(--gold); font-style:italic; }
.bhatti-section-header p { color:var(--text-muted); max-width:560px; margin:0 auto; line-height:1.7; font-size:1.05rem; }
.bhatti-divider {
  width:60px; height:3px; margin:18px auto 0;
  background:linear-gradient(90deg,var(--gold),var(--green-light));
  border-radius:2px;
}

/* ─── PRODUCTS GRID (HOME FEATURED) ─────────────────────── */
.bhatti-products-section { padding:0 5% 80px; }
.bhatti-products-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:28px; max-width:1280px; margin:0 auto;
}

/* ─── PRODUCT CARD (used in thumb.twig + home) ───────────── */
.bhatti-product-card, .product-thumb {
  background:white; border-radius:var(--radius);
  overflow:hidden; box-shadow:var(--shadow);
  transition:all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
  display:flex; flex-direction:column;
  border:1px solid rgba(45,122,53,0.08);
  height:100%;
}
.bhatti-product-card:hover, .product-thumb:hover {
  transform:translateY(-8px);
  box-shadow:var(--shadow-hover);
  border-color:rgba(200,149,42,0.3);
}

.bhatti-product-img, .product-thumb .image {
  position:relative; height:320px; overflow:hidden;
  background:#fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border-bottom: 1px solid rgba(0,0,0,0.05);
}
.bhatti-product-img img, .product-thumb .image img {
  width:100%; height:100%; object-fit:contain;
  transition:transform 0.6s ease;
  background:#fff;
}
.bhatti-product-card:hover .bhatti-product-img img,
.product-thumb:hover .image img { transform:scale(1.04); }

.bhatti-product-badge {
  position:absolute; top:14px; left:14px;
  background:linear-gradient(135deg,var(--green-dark),var(--green-mid));
  color:white; font-size:0.68rem; font-weight:800;
  padding:4px 12px; border-radius:50px; letter-spacing:1px;
  text-transform:uppercase; z-index: 2;
}
.bhatti-product-badge.gold {
  background:linear-gradient(135deg,var(--gold),var(--gold-light));
  color:var(--brown);
}

.bhatti-product-body, .product-thumb .content {
  padding:22px 24px; flex:1; display:flex; flex-direction:column;
}
.product-thumb .content { padding:20px; }

.bhatti-product-body h3, .product-thumb .content h4 {
  font-family:'Playfair Display', serif;
  font-size:1.35rem; font-weight:800; color:var(--green-dark);
  margin-bottom:10px; line-height: 1.2;
}
.bhatti-product-body h3 a, .product-thumb .content h4 a { color:var(--green-dark); text-decoration:none; transition:color 0.2s; }
.bhatti-product-body h3 a:hover, .product-thumb .content h4 a:hover { color:var(--gold); }

.bhatti-product-body p, .product-thumb .content .description p {
  color:var(--text-muted); font-size:0.85rem;
  line-height:1.6; margin-bottom:16px; flex:1;
  font-family: 'Nunito', sans-serif;
}

/* Price */
.bhatti-product-price-wrapper {
  margin-bottom: 16px;
}
.bhatti-product-price-wrapper .price-new {
  font-family:'Playfair Display', serif;
  font-size:1.35rem; font-weight:800; color:var(--green-dark);
}
.bhatti-product-price-wrapper .price-old {
  font-size:0.95rem; color:var(--text-muted); text-decoration:line-through; margin-right:8px;
}
.bhatti-product-price-wrapper .price-tax {
  display:block; font-size:0.72rem; color:var(--text-muted); margin-top:2px;
}

/* Card actions buttons */
.bhatti-card-actions {
  display:flex; gap:10px; margin-top:auto;
}
.btn-card-cart {
  flex:2; background:linear-gradient(135deg,var(--green-mid),var(--green-dark)) !important;
  color:white !important; border:none !important; padding:12px 18px !important;
  border-radius:50px !important; font-weight:700 !important;
  font-size:0.85rem !important; font-family:'Outfit', sans-serif !important;
  display:flex !important; align-items:center !important; justify-content:center !important;
  gap:6px !important; cursor:pointer !important;
  transition:all 0.3s ease !important;
  box-shadow:0 4px 12px rgba(45,122,53,0.15) !important;
}
.btn-card-cart:hover {
  transform:translateY(-2px) !important;
  box-shadow:0 6px 18px rgba(45,122,53,0.3) !important;
}
.btn-card-view {
  flex:1; background:var(--green-pale) !important;
  color:var(--green-dark) !important; border:1px solid rgba(45,122,53,0.15) !important;
  border-radius:50px !important; display:flex !important;
  align-items:center !important; justify-content:center !important;
  font-size:0.9rem !important; transition:all 0.2s ease !important;
  text-decoration:none !important;
}
.btn-card-view:hover {
  background:rgba(45,122,53,0.15) !important;
  color:var(--gold) !important;
  border-color:rgba(45,122,53,0.3) !important;
}

/* Profile and Wishlist buttons next to cart */
.nav-account-btn, .nav-wishlist-btn {
  background:rgba(255,255,255,0.1);
  border:2px solid rgba(255,255,255,0.2);
  color:white; width:44px; height:44px;
  border-radius:50%; display:flex; align-items:center; justify-content:center;
  text-decoration:none; transition:all 0.3s ease;
}
.nav-account-btn:hover, .nav-wishlist-btn:hover {
  background:rgba(255,255,255,0.2);
  border-color:var(--gold);
  color: var(--gold-light) !important;
  transform:translateY(-2px);
}

.bhatti-grid-item {
  display:flex; flex-direction:column;
}

/* WA Order Button */
.wa-order-btn {
  display:flex; align-items:center; justify-content:center; gap:10px;
  background:linear-gradient(135deg,var(--wa-green),#1da851);
  color:white; padding:13px 24px; border-radius:50px;
  text-decoration:none; font-weight:800; font-size:0.9rem;
  transition:all 0.3s; box-shadow:0 4px 16px rgba(37,211,102,0.25);
  letter-spacing:0.3px; border:none; cursor:pointer; width:100%;
}
.wa-order-btn:hover { transform:translateY(-2px); box-shadow:0 8px 28px rgba(37,211,102,0.45); color:white; }
.wa-order-btn svg { width:20px; height:20px; fill:white; flex-shrink:0; }

/* Add to Cart primary green */
.btn-add-cart {
  display:flex; align-items:center; justify-content:center; gap:10px;
  background:linear-gradient(135deg,var(--green-mid),var(--green-dark));
  color:white; padding:13px 24px; border-radius:50px;
  font-weight:800; font-size:0.9rem;
  transition:all 0.3s; box-shadow:0 4px 16px rgba(45,122,53,0.25);
  letter-spacing:0.3px; border:none; cursor:pointer; width:100%;
  text-decoration:none;
}
.btn-add-cart:hover { transform:translateY(-2px); box-shadow:0 8px 28px rgba(45,122,53,0.45); color:white; }

/* ─── ABOUT SECTION ──────────────────────────────────────── */
.bhatti-about-wrapper {
  background:linear-gradient(135deg,var(--green-dark) 0%,#0f2d14 100%);
}
.bhatti-about-inner {
  max-width:1280px; margin:0 auto;
  padding:80px 5%;
  display:grid; grid-template-columns:1fr 1fr; gap:60px;
  align-items:center;
}
@media(max-width:768px){ .bhatti-about-inner { grid-template-columns:1fr; } }

.about-text .tag {
  display:inline-block;
  background:rgba(200,149,42,0.2); color:var(--gold-light);
  font-size:0.72rem; font-weight:800; letter-spacing:3px;
  text-transform:uppercase; padding:6px 18px; border-radius:50px;
  margin-bottom:20px; border:1.5px solid rgba(200,149,42,0.3);
}
.about-text h2 {
  font-family:'Playfair Display', serif;
  font-size:clamp(2rem,3.5vw,2.8rem);
  font-weight:900; color:white; margin-bottom:20px; line-height:1.2;
}
.about-text h2 em { color:var(--gold-light); font-style:italic; }
.about-text p { color:rgba(255,255,255,0.75); line-height:1.8; margin-bottom:16px; }

.about-stats { display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:32px; }
.stat-box {
  background:rgba(255,255,255,0.07); border-radius:12px;
  padding:20px; border:1px solid rgba(255,255,255,0.1);
}
.stat-box .num {
  font-family:'Playfair Display', serif;
  font-size:2.2rem; font-weight:900; color:var(--gold-light); line-height:1;
}
.stat-box .lbl { font-size:0.8rem; color:rgba(255,255,255,0.6); margin-top:4px; }

.about-imgs { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.about-img { border-radius:12px; overflow:hidden; aspect-ratio:1; }
.about-img img { width:100%; height:100%; object-fit:cover; }
.about-img:first-child { grid-column:span 2; aspect-ratio:16/9; }

/* ─── FEATURES ───────────────────────────────────────────── */
.bhatti-features-section { padding:80px 5%; background:white; }
.features-grid {
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:28px; max-width:1280px; margin:0 auto;
}
.feature-card {
  text-align:center; padding:36px 24px;
  border-radius:var(--radius);
  background:var(--cream);
  border:1.5px solid rgba(45,122,53,0.1);
  transition:all 0.3s;
}
.feature-card:hover {
  background:var(--green-pale); border-color:var(--green-light);
  transform:translateY(-6px); box-shadow:var(--shadow);
}
.feature-icon {
  width:64px; height:64px; border-radius:50%;
  background:linear-gradient(135deg,var(--green-pale),rgba(76,175,80,0.15));
  display:flex; align-items:center; justify-content:center;
  font-size:2rem; margin:0 auto 16px;
  border:2px solid rgba(45,122,53,0.15);
}
.feature-card h4 {
  font-family:'Playfair Display', serif;
  font-size:1.1rem; font-weight:700; color:var(--green-dark); margin-bottom:8px;
}
.feature-card p { font-size:0.85rem; color:var(--text-muted); line-height:1.6; }

/* ─── TESTIMONIALS ───────────────────────────────────────── */
.bhatti-testimonials-section {
  padding:80px 5%;
  background:linear-gradient(180deg,var(--cream) 0%,white 100%);
}
.testimonials-grid {
  display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr));
  gap:24px; max-width:1100px; margin:0 auto;
}
.testimonial-card {
  background:white; border-radius:var(--radius);
  padding:28px; box-shadow:var(--shadow);
  border:1.5px solid rgba(0,0,0,0.05);
  transition:transform 0.3s;
}
.testimonial-card:hover { transform:translateY(-4px); }
.t-stars { color:var(--gold-light); font-size:1rem; margin-bottom:14px; }
.testimonial-card p {
  color:var(--text-muted); font-size:0.9rem; line-height:1.7;
  margin-bottom:20px; font-style:italic;
}
.reviewer { display:flex; align-items:center; gap:12px; }
.reviewer-avatar {
  width:44px; height:44px; border-radius:50%;
  background:linear-gradient(135deg,var(--green-mid),var(--green-light));
  display:flex; align-items:center; justify-content:center;
  color:white; font-weight:800; font-size:1.1rem;
}
.reviewer-name { font-weight:700; font-size:0.9rem; color:var(--text-dark); }
.reviewer-loc { font-size:0.75rem; color:var(--text-muted); }

/* ─── CTA BANNER ─────────────────────────────────────────── */
.bhatti-cta-section {
  background:linear-gradient(135deg,var(--gold) 0%,#e8a820 50%,var(--gold-light) 100%);
  padding:70px 5%; text-align:center;
}
.bhatti-cta-section h2 {
  font-family:'Playfair Display', serif;
  font-size:clamp(1.8rem,4vw,3rem);
  color:var(--brown); font-weight:900; margin-bottom:16px;
}
.bhatti-cta-section p { color:rgba(92,61,30,0.8); font-size:1.05rem; margin-bottom:32px; max-width:500px; margin-left:auto; margin-right:auto; }
.cta-btns { display:flex; gap:16px; justify-content:center; flex-wrap:wrap; }
.cta-wa {
  display:flex; align-items:center; justify-content:center; gap:10px;
  background:var(--wa-green); color:white;
  padding:16px 40px; border-radius:50px;
  text-decoration:none; font-weight:800; font-size:1rem;
  box-shadow:0 6px 24px rgba(0,0,0,0.2); transition:all 0.3s;
}
.cta-wa:hover { transform:translateY(-3px); box-shadow:0 10px 36px rgba(0,0,0,0.3); color:white; }
.cta-shop {
  display:flex; align-items:center; justify-content:center; gap:10px;
  background:var(--brown); color:white;
  padding:16px 40px; border-radius:50px;
  text-decoration:none; font-weight:800; font-size:1rem;
  box-shadow:0 6px 24px rgba(0,0,0,0.15); transition:all 0.3s;
}
.cta-shop:hover { transform:translateY(-3px); color:white; }

/* ─── FOOTER ─────────────────────────────────────────────── */
#bhatti-footer {
  background:#0d1f10; color:rgba(255,255,255,0.7);
  padding:60px 5% 30px;
}
.footer-grid {
  display:grid; grid-template-columns:2fr 1fr 1fr 1.5fr;
  gap:48px; max-width:1280px; margin:0 auto 48px;
}
@media(max-width:900px){ .footer-grid { grid-template-columns:1fr 1fr; } }
@media(max-width:560px){ .footer-grid { grid-template-columns:1fr; gap:32px; } }

.footer-brand h3 {
  font-family:'Playfair Display', serif;
  font-size:1.5rem; font-weight:900; color:var(--gold-light); margin-bottom:8px;
}
.footer-brand p { font-size:0.85rem; line-height:1.7; margin-bottom:20px; }
.footer-social { display:flex; gap:12px; margin-top:8px; }
.footer-social a {
  color:white; padding:8px 18px; border-radius:50px;
  text-decoration:none; font-size:0.82rem; font-weight:700;
}
.footer-social .wa-social { background:var(--wa-green); }
.footer-social .fb-social { background:#1877f2; }

.footer-col h4 {
  color:white; font-size:0.85rem; font-weight:800;
  letter-spacing:1px; text-transform:uppercase; margin-bottom:16px;
  padding-bottom:8px; border-bottom:2px solid rgba(200,149,42,0.3);
}
.footer-col ul { list-style:none; }
.footer-col ul li { margin-bottom:8px; }
.footer-col ul li a {
  color:rgba(255,255,255,0.6); text-decoration:none;
  font-size:0.88rem; transition:color 0.2s;
}
.footer-col ul li a:hover { color:var(--gold-light); }

.contact-item { display:flex; gap:10px; margin-bottom:12px; align-items:flex-start; }
.contact-item .ci { font-size:1.1rem; margin-top:1px; }
.contact-item span { font-size:0.85rem; color:rgba(255,255,255,0.65); line-height:1.5; }

.footer-bottom {
  border-top:1px solid rgba(255,255,255,0.1);
  padding-top:24px; max-width:1280px; margin:0 auto;
  display:flex; justify-content:space-between; align-items:center;
  flex-wrap:wrap; gap:12px;
}
.footer-bottom p { font-size:0.8rem; }

/* ─── FLOATING WHATSAPP ──────────────────────────────────── */
.floating-wa {
  position:fixed; bottom:28px; right:28px; z-index:1000;
  width:62px; height:62px; border-radius:50%;
  background:linear-gradient(135deg,var(--wa-green),#1da851);
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 6px 28px rgba(37,211,102,0.5);
  text-decoration:none;
  animation:pulse-wa 2s infinite;
  transition:transform 0.3s;
}
.floating-wa:hover { transform:scale(1.1); animation:none; }
.floating-wa svg { width:32px; height:32px; fill:white; }

@keyframes pulse-wa {
  0%,100% { box-shadow:0 6px 28px rgba(37,211,102,0.5); }
  50% { box-shadow:0 6px 40px rgba(37,211,102,0.8), 0 0 0 12px rgba(37,211,102,0.15); }
}

/* ─── SCROLL FADE-UP ─────────────────────────────────────── */
.fade-up {
  opacity:0; transform:translateY(30px);
  transition:opacity 0.7s, transform 0.7s;
}
.fade-up.visible { opacity:1; transform:translateY(0); }

/* ─── BREADCRUMB ─────────────────────────────────────────── */
.bhatti-breadcrumb {
  background:var(--green-pale);
  padding:14px 5%; border-bottom:1px solid rgba(45,122,53,0.1);
}
.bhatti-breadcrumb .breadcrumb { margin:0; }
.bhatti-breadcrumb .breadcrumb-item a { color:var(--green-mid); text-decoration:none; font-weight:600; }
.bhatti-breadcrumb .breadcrumb-item.active { color:var(--green-dark); font-weight:700; }

/* ─── CATEGORY PAGE ──────────────────────────────────────── */
#product-category { max-width:1280px; margin:0 auto; padding:0 5% 80px; }
/* Premium Category Header Card styling */
.bhatti-category-header-card {
  background: #fff;
  border-radius: 20px;
  border: 1px solid rgba(45, 122, 53, 0.08);
  border-left: 5px solid var(--gold);
  box-shadow: var(--shadow);
  padding: 40px;
  margin: 40px 0 40px;
  display: flex;
  flex-direction: column;
  gap: 28px;
}

.bhatti-category-title-area {
  text-align: center;
  margin-bottom: 8px;
}
.bhatti-category-title-area h1 {
  font-family: 'Playfair Display', serif;
  font-size: 2.8rem !important;
  font-weight: 900;
  color: var(--green-dark);
  margin: 0 0 12px 0 !important;
  text-align: center;
}
.bhatti-category-title-divider {
  width: 80px;
  height: 3px;
  background: linear-gradient(90deg, var(--gold), var(--green-light));
  margin: 0 auto;
  border-radius: 5px;
}

.bhatti-category-body-area {
  display: flex;
  gap: 32px;
  align-items: center;
  flex-wrap: wrap;
}
@media (max-width: 768px) {
  .bhatti-category-body-area {
    flex-direction: column;
    text-align: center;
  }
}

.bhatti-category-img-wrapper {
  flex-shrink: 0;
  width: 180px;
  height: 180px;
  border-radius: 16px;
  overflow: hidden;
  border: 4px solid var(--green-pale);
  box-shadow: 0 8px 24px rgba(26, 74, 31, 0.1);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.bhatti-category-img-wrapper:hover {
  transform: scale(1.03);
  box-shadow: 0 12px 32px rgba(26, 74, 31, 0.15);
}
.bhatti-category-img-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.bhatti-category-desc-wrapper {
  flex: 1;
  font-family: 'Nunito', sans-serif;
  color: var(--text-dark);
  font-size: 1.08rem;
  line-height: 1.8;
  opacity: 0.9;
  position: relative;
  text-align: left;
}
@media (max-width: 768px) {
  .bhatti-category-desc-wrapper {
    text-align: center;
  }
}
.bhatti-category-desc-wrapper::before {
  content: '🌿';
  font-size: 1.5rem;
  display: block;
  margin-bottom: 8px;
}

.bhatti-category-footer-bar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-top: 1px solid rgba(45, 122, 53, 0.12);
  padding-top: 24px;
  margin-top: 8px;
  flex-wrap: wrap;
  gap: 16px;
}
@media (max-width: 576px) {
  .bhatti-category-footer-bar {
    flex-direction: column;
    align-items: stretch;
  }
}

.bhatti-category-guarantee {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--gold);
  font-family: 'Outfit', sans-serif;
  font-weight: 700;
  font-size: 0.88rem;
  text-transform: uppercase;
  letter-spacing: 1px;
}

.bhatti-category-filters {
  display: flex;
  align-items: center;
  gap: 20px;
  flex-wrap: wrap;
}
@media (max-width: 576px) {
  .bhatti-category-filters {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }
}

.bhatti-category-filters .filter-group {
  display: flex;
  align-items: center;
  gap: 12px;
}
@media (max-width: 576px) {
  .bhatti-category-filters .filter-group {
    justify-content: space-between;
  }
}

.bhatti-category-filters label {
  color: var(--green-dark);
  font-family: 'Outfit', sans-serif;
  font-weight: 700;
  font-size: 0.9rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.bhatti-category-filters .form-select {
  border: 1.5px solid rgba(45, 122, 53, 0.2);
  border-radius: 50px;
  padding: 8px 20px;
  color: var(--text-dark);
  font-family: 'Nunito', sans-serif;
  font-weight: 700;
  font-size: 0.9rem;
  background-color: #fff;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(0,0,0,0.02);
  transition: all 0.2s ease;
  min-width: 140px;
}
.bhatti-category-filters .form-select:hover,
.bhatti-category-filters .form-select:focus {
  border-color: var(--gold);
  box-shadow: 0 4px 12px rgba(200, 149, 42, 0.15);
  outline: none;
}
#product-list {
  display: grid !important;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)) !important;
  gap: 28px !important;
}

#product-list.product-list {
  grid-template-columns: 1fr !important;
}

#product-list > * {
  width: 100% !important;
  max-width: 100% !important;
  flex: none !important;
  padding: 0 !important;
}

/* ─── PRODUCT DETAIL PAGE ────────────────────────────────── */
#product-info { max-width:1140px; margin:0 auto; padding:40px 15px 80px; }
#product-info h1 {
  font-family:'Playfair Display', serif;
  font-size:2.4rem; font-weight:900; color:var(--green-dark); margin-bottom:16px;
}
.product-detail-img {
  position: sticky;
  top: 100px;
}
.product-detail-img .image {
  border: 1px solid rgba(45,122,53,0.1);
  background: #fff;
  padding: 12px;
  border-radius: 20px;
  box-shadow: var(--shadow);
  transition: all 0.3s ease;
}
.product-detail-img .image:hover {
  box-shadow: var(--shadow-hover);
}
.product-detail-price {
  background: var(--green-pale);
  padding: 16px 24px;
  border-radius: 16px;
  display: inline-block;
  margin: 20px 0;
  border-left: 4px solid var(--gold);
}
.product-detail-price .price-new {
  font-family:'Playfair Display', serif;
  font-size:2.2rem; font-weight:900; color:var(--green-dark);
}
.product-detail-price .price-old {
  font-size:1.3rem; color:var(--text-muted); text-decoration:line-through; margin-right:12px;
}

/* Custom quantity styling */
.qty-container {
  display: flex;
  align-items: center;
  border: 2px solid rgba(45,122,53,0.2);
  border-radius: 50px;
  background: #fff;
  overflow: hidden;
  max-width: 140px;
}
.qty-btn {
  background: var(--green-pale);
  color: var(--green-dark);
  border: none !important;
  outline: none !important;
  box-shadow: none !important;
  width: 40px;
  height: 44px;
  font-size: 1.1rem;
  font-weight: 800;
  cursor: pointer;
  transition: all 0.2s ease;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0 !important;
  -webkit-appearance: none;
}
.qty-btn:hover {
  background: rgba(45,122,53,0.18);
  color: var(--gold);
}
.qty-input {
  border: none !important;
  text-align: center;
  font-weight: 800;
  font-size: 1.1rem;
  width: 50px;
  height: 44px;
  outline: none;
  font-family: 'Outfit', sans-serif;
  color: var(--green-dark);
}

/* Beautiful Add to Cart Button */
.btn-add-cart-primary {
  background: linear-gradient(135deg, var(--green-mid), var(--green-dark)) !important;
  border: none !important;
  border-radius: 50px !important;
  color: white !important;
  padding: 14px 36px !important;
  font-weight: 800 !important;
  font-size: 0.95rem !important;
  letter-spacing: 1px !important;
  text-transform: uppercase !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
  box-shadow: 0 4px 15px rgba(45,122,53,0.2) !important;
  cursor: pointer !important;
}
.btn-add-cart-primary:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 8px 25px rgba(45,122,53,0.4) !important;
}
.btn-add-cart-primary:active {
  transform: translateY(-1px) !important;
}

/* Secondary Actions: Wishlist and Compare */
.btn-secondary-action {
  background: rgba(45,122,53,0.06) !important;
  color: var(--green-dark) !important;
  border: 1px solid rgba(45,122,53,0.15) !important;
  padding: 12px 20px !important;
  border-radius: 50px !important;
  font-weight: 700 !important;
  font-family: 'Outfit', sans-serif !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  text-decoration: none !important;
  font-size: 0.88rem !important;
  transition: all 0.2s ease !important;
  cursor: pointer !important;
}
.btn-secondary-action:hover {
  background: rgba(45,122,53,0.12) !important;
  border-color: rgba(45,122,53,0.3) !important;
  color: var(--gold) !important;
}

/* Premium WhatsApp Order Button */
.wa-order-btn-premium {
  background: linear-gradient(135deg, var(--wa-green), #19a24c) !important;
  color: white !important;
  padding: 14px 28px !important;
  border-radius: 50px !important;
  font-weight: 800 !important;
  font-size: 0.95rem !important;
  letter-spacing: 0.5px !important;
  text-transform: uppercase !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  text-decoration: none !important;
  transition: all 0.3s ease !important;
  box-shadow: 0 4px 15px rgba(37,211,102,0.2) !important;
}
.wa-order-btn-premium:hover {
  transform: translateY(-3px) !important;
  box-shadow: 0 8px 25px rgba(37,211,102,0.4) !important;
  color: white !important;
}
.wa-order-btn-premium svg {
  width: 20px;
  height: 20px;
  fill: white;
}

.product-tabs { margin-top:48px; }
.product-tabs .nav-tabs { border-bottom: 2px solid var(--green-pale) !important; }
.product-tabs .nav-tabs .nav-link {
  color:var(--green-dark); font-weight:700; border: none;
  background: none; padding: 12px 24px; font-family: 'Outfit', sans-serif;
  font-size: 0.95rem; border-bottom: 3px solid transparent;
  transition: all 0.3s ease;
}
.product-tabs .nav-tabs .nav-link:hover { color: var(--gold); }
.product-tabs .nav-tabs .nav-link.active {
  color:var(--gold); border-bottom: 3px solid var(--gold); background: none;
}

/* ─── PAGINATION ─────────────────────────────────────────── */
.pagination .page-link { color:var(--green-dark); border-radius:8px; margin:0 2px; font-weight:600; }
.pagination .page-item.active .page-link { background:var(--green-dark); border-color:var(--green-dark); color:white; }

/* ─── ALERTS ─────────────────────────────────────────────── */
.alert-success { background:var(--green-pale); color:var(--green-dark); border-color:var(--green-light); }
.alert-danger { background:#fff0f0; }

/* ─── ACCOUNT & FORM PREMIUM STYLING ─────────────────────── */
#account-login, #account-register, #account-account, #account-forgotten, #account-reset, #account-success, #account-address, #account-order, #account-download, #account-newsletter {
  padding-top: 30px !important;
  max-width: 1000px;
  margin: 0 auto 80px;
}

#account-login h2, #account-register h1, #account-forgotten h1, #account-account h1, #account-success h1, #account-login h1 {
  font-family: 'Playfair Display', serif !important;
  color: var(--green-dark) !important;
  font-weight: 800 !important;
  margin-bottom: 24px !important;
}

/* Border boxes styling */
#account-login .border, #account-register form, #account-forgotten form, #account-account .border, #account-address form {
  background: white !important;
  border: 1px solid rgba(45, 122, 53, 0.08) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow) !important;
  padding: 40px !important;
  transition: all 0.3s ease !important;
}
#account-login .border:hover {
  box-shadow: var(--shadow-hover) !important;
}

/* Input Fields styling */
.form-control, .form-select {
  border: 1.5px solid rgba(45, 122, 53, 0.15) !important;
  border-radius: 50px !important;
  padding: 10px 20px !important;
  color: var(--text-dark) !important;
  font-family: 'Nunito', sans-serif !important;
  font-weight: 600 !important;
  background-color: #fff !important;
  box-shadow: none !important;
  transition: all 0.2s ease !important;
}
.form-control:focus, .form-select:focus {
  border-color: var(--gold) !important;
  box-shadow: 0 4px 14px rgba(200, 149, 42, 0.18) !important;
  outline: none !important;
}

/* Form labels */
.col-form-label, label {
  color: var(--green-dark) !important;
  font-family: 'Outfit', sans-serif !important;
  font-weight: 700 !important;
  font-size: 0.88rem !important;
  text-transform: uppercase !important;
  letter-spacing: 0.5px !important;
}

/* Premium Primary Buttons */
.btn-primary, button[type="submit"].btn-primary {
  background: linear-gradient(135deg, var(--green-mid), var(--green-dark)) !important;
  color: white !important;
  border: none !important;
  padding: 12px 28px !important;
  border-radius: 50px !important;
  font-weight: 800 !important;
  font-size: 0.9rem !important;
  font-family: 'Outfit', sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 1px !important;
  box-shadow: 0 4px 12px rgba(45, 122, 53, 0.2) !important;
  transition: all 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) !important;
  cursor: pointer !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
}
.btn-primary:hover {
  transform: translateY(-2px) !important;
  box-shadow: 0 8px 20px rgba(45, 122, 53, 0.35) !important;
  background: linear-gradient(135deg, var(--green-dark), #0f2d14) !important;
}
.btn-primary:active {
  transform: translateY(-1px) !important;
}

/* Secondary Buttons */
.btn-light, .btn-secondary {
  background: var(--green-pale) !important;
  color: var(--green-dark) !important;
  border: 1px solid rgba(45, 122, 53, 0.15) !important;
  border-radius: 50px !important;
  padding: 10px 24px !important;
  font-weight: 700 !important;
  font-family: 'Outfit', sans-serif !important;
  transition: all 0.2s ease !important;
}
.btn-light:hover {
  background: rgba(45, 122, 53, 0.18) !important;
  color: var(--gold) !important;
}

/* Legends */
legend {
  font-family: 'Playfair Display', serif !important;
  color: var(--green-dark) !important;
  font-weight: 800 !important;
  font-size: 1.5rem !important;
  border-bottom: 2px solid var(--green-pale) !important;
  padding-bottom: 10px !important;
  margin-bottom: 24px !important;
}

/* Breadcrumb margins */
#account-login .breadcrumb, #account-register .breadcrumb, #account-forgotten .breadcrumb {
  margin-bottom: 28px !important;
}

/* Premium Account Navigation Sidebar */
#column-right .list-group, #column-left .list-group {
  background: white !important;
  border: 1px solid rgba(45, 122, 53, 0.08) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--shadow) !important;
  padding: 16px 0 !important;
  overflow: hidden;
}

#column-right .list-group-item, #column-left .list-group-item {
  background: transparent !important;
  border: none !important;
  border-left: 4px solid transparent !important;
  color: var(--green-dark) !important;
  font-family: 'Outfit', sans-serif !important;
  font-weight: 600 !important;
  font-size: 0.92rem !important;
  padding: 12px 24px !important;
  transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
  text-decoration: none !important;
  display: block !important;
}

#column-right .list-group-item:hover, #column-left .list-group-item:hover {
  background: var(--green-pale) !important;
  color: var(--gold) !important;
  border-left-color: var(--gold) !important;
  padding-left: 32px !important;
}

#column-right .list-group-item.active, #column-left .list-group-item.active {
  background: var(--green-pale) !important;
  color: var(--gold) !important;
  border-left-color: var(--gold) !important;
  font-weight: 700 !important;
  padding-left: 32px !important;
}

/* Custom styling for Form Switches (Subscribe & Agree) and Checkboxes */
.form-check-input {
  cursor: pointer !important;
  border: 2px solid rgba(45, 122, 53, 0.3) !important;
  background-color: #fff !important;
  transition: all 0.25s ease-in-out !important;
  box-shadow: none !important;
}
.form-check-input:hover {
  border-color: var(--green-mid) !important;
}
.form-check-input:checked {
  background-color: var(--green-mid) !important;
  border-color: var(--green-mid) !important;
}

/* Large Switch sizing */
.form-switch .form-check-input {
  width: 2.8em !important;
  height: 1.4em !important;
  border-radius: 2em !important;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%2845, 122, 53, 0.3%29'/%3e%3c/svg%3e") !important;
}
.form-switch .form-check-input:checked {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e") !important;
}

/* Make reverse form checks align beautifully */
.form-check-reverse {
  text-align: left !important;
}
.form-check-label {
  cursor: pointer !important;
  font-family: 'Nunito', sans-serif !important;
  font-weight: 700 !important;
  font-size: 0.95rem !important;
  color: var(--text-dark) !important;
  text-transform: none !important;
  letter-spacing: 0 !important;
  padding-right: 12px !important;
}