/* ═══════════════════════════════════════════════════════
   ELEGANCE OF INDIA — MAIN JAVASCRIPT
   All page scripts consolidated here with page guards.
═══════════════════════════════════════════════════════ */

document.addEventListener('DOMContentLoaded', () => {

  /* ════════════════════════════════════════════════════
     COMMON — runs on every page
  ════════════════════════════════════════════════════ */

  /* ── Header scroll shadow ── */
  const header = document.getElementById('siteHeader');
  if (header) {
    window.addEventListener('scroll', () => {
      header.classList.toggle('scrolled', window.scrollY > 60);
    }, { passive: true });
  }

  /* ── Cart Badge (localStorage count) ── */
  // Moved to header.php for better synchronization

  /* ── Back to top ── */
  const btt = document.getElementById('backToTop');
  if (btt) {
    window.addEventListener('scroll', () => {
      btt.classList.toggle('visible', window.scrollY > 400);
    }, { passive: true });
    btt.addEventListener('click', () => window.scrollTo({ top: 0, behavior: 'smooth' }));
  }

  /* ── Mega menu (desktop hover) ── */
  document.querySelectorAll('.has-mega').forEach(li => {
    li.addEventListener('mouseenter', () => li.querySelector('.mega-panel')?.classList.add('open'));
    li.addEventListener('mouseleave', () => li.querySelector('.mega-panel')?.classList.remove('open'));
  });

  /* ── Mobile menu ── */
  const mobileBtn = document.getElementById('mobileMenuBtn');
  const mainNav   = document.getElementById('mainNav');
  if (mobileBtn && mainNav) {
    mobileBtn.addEventListener('click', () => {
      mainNav.classList.toggle('open');
      mobileBtn.classList.toggle('active');
    });
    if (window.innerWidth <= 768) {
      document.querySelectorAll('.has-mega > a').forEach(link => {
        link.addEventListener('click', (e) => {
          e.preventDefault();
          link.parentElement.classList.toggle('open');
        });
      });
    }
  }

  /* ── Header search ── */
  // Moved to header.php

  /* ── Search row toggle ── */
  // Moved to header.php


  /* ════════════════════════════════════════════════════
     PAGE: HOME (index.html)
  ════════════════════════════════════════════════════ */
  if (document.getElementById('heroSlider')) {

    /* ── Category Carousel (LEGACY - Redundant if implemented in index.php) ── */
  const catTrack = document.getElementById('catTrack');
  const catPrev  = document.getElementById('catPrev');
  const catNext  = document.getElementById('catNext');
  if (catTrack && catPrev && catNext) {
    try {
      let catIndex = 0;
      const gap = 24;
      const total = catTrack.children.length;
      const card = catTrack.querySelector('.cat-card') || catTrack.querySelector('.home-cat-card');
      if (card) {
        const getCardW = () => card.offsetWidth;
        const getVisible = () => Math.floor((catTrack.parentElement.clientWidth + gap) / (getCardW() + gap));
        const updateCatArrows = () => {
          catPrev.disabled = catIndex === 0;
          catNext.disabled = catIndex >= total - getVisible();
        };
        const catSlideTo = (idx) => {
          catIndex = Math.max(0, Math.min(idx, total - getVisible()));
          catTrack.style.transform = `translateX(-${catIndex * (getCardW() + gap)}px)`;
          updateCatArrows();
        };
        catPrev.addEventListener('click', () => catSlideTo(catIndex - 1));
        catNext.addEventListener('click', () => catSlideTo(catIndex + 1));
        updateCatArrows();
        window.addEventListener('resize', () => catSlideTo(0));
      }
    } catch(e) { console.warn("Legacy Category Carousel error:", e); }
  }

  /* ── Designer Carousel ── */
    const track = document.getElementById('designerTrack');
    if (track) {
      const dcCards   = track.querySelectorAll('.designer-card');
      const cardCount = dcCards.length;
      if (cardCount > 0) {
        let dcIndex     = 0;
        function getVisibleCount() {
          const w = window.innerWidth;
          if (w > 1200) return 7;
          if (w > 1024) return 5;
          if (w > 768)  return 4;
          return 3;
        }
        function slideDesigners(dir) {
          const maxIndex = cardCount - getVisibleCount();
          dcIndex = Math.max(0, Math.min(dcIndex + dir, maxIndex));
          track.style.transform = `translateX(-${dcIndex * (dcCards[0].offsetWidth + 20)}px)`;
        }
        const dPrevBtn = document.getElementById('dPrev');
        const dNextBtn = document.getElementById('dNext');
        if (dPrevBtn) dPrevBtn.addEventListener('click', () => slideDesigners(-1));
        if (dNextBtn) dNextBtn.addEventListener('click', () => slideDesigners(1));
        window.addEventListener('resize', () => { dcIndex = 0; track.style.transform = 'translateX(0)'; });
      }
    }

    /* ── Wishlist toggle (home product cards) ── */
    document.querySelectorAll('.wishlist-btn').forEach(btn => {
      btn.addEventListener('click', () => {
        const icon = btn.querySelector('i');
        icon.classList.toggle('far');
        icon.classList.toggle('fas');
        icon.style.color = icon.classList.contains('fas') ? '#c0392b' : '';
      });
    });

    /* ── Quick View Modal ── */
    const overlay    = document.getElementById('quickViewOverlay');
    const modalClose = document.getElementById('modalClose');
    const productData = [
      { img: 'https://images.unsplash.com/photo-1583391733956-6c78276477e3?w=500&q=80', designer: 'Sabyasachi',       name: 'Ivory Zardozi Bridal Lehenga',      price: '₹3,45,000' },
      { img: 'https://images.unsplash.com/photo-1515886657613-9f3515b0c78f?w=500&q=80', designer: 'Manish Malhotra', name: 'Emerald Sequin Draped Gown',         price: '₹1,85,000' },
      { img: 'https://images.unsplash.com/photo-1605518216938-7c31b7b14ad0?w=500&q=80', designer: 'Anita Dongre',    name: 'Rose Gold Embroidered Anarkali',     price: '₹62,500'   },
      { img: 'https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=500&q=80', designer: 'Masaba Gupta',    name: 'Cobalt Block-Print Kurta Set',       price: '₹38,000'   },
      { img: 'https://images.unsplash.com/photo-1558618666-fcd25c85cd64?w=500&q=80', designer: 'Ridhi Mehra',     name: 'Sage Embroidered Kurta Set',         price: '₹44,000'   },
      { img: 'https://images.unsplash.com/photo-1595341888016-a392ef81b7de?w=500&q=80', designer: 'Tarun Tahiliani', name: 'Midnight Navy Brocade Sherwani',    price: '₹1,20,000' },
      { img: 'https://images.unsplash.com/photo-1539109136881-3be0616acf4b?w=500&q=80', designer: 'Anamika Khanna',  name: 'Crimson Handwoven Banarasi Saree',  price: '₹95,000'   },
      { img: 'https://images.unsplash.com/photo-1605518216938-7c31b7b14ad0?w=500&q=80', designer: 'Gaurav Gupta',    name: 'Molten Gold Sculptural Lehenga',    price: '₹2,75,000' },
    ];

    document.querySelectorAll('.quick-view-btn').forEach((btn, index) => {
      btn.addEventListener('click', () => {
        const data = productData[index] || productData[0];
        document.getElementById('qvImage').src              = data.img;
        document.getElementById('qvImage').alt              = data.name;
        document.getElementById('qvDesigner').textContent   = data.designer;
        document.getElementById('qvName').textContent       = data.name;
        document.getElementById('qvPrice').textContent      = data.price;
        overlay.classList.add('open');
        document.body.style.overflow = 'hidden';
      });
    });

    function closeModal() {
      if (overlay) overlay.classList.remove('open');
      document.body.style.overflow = '';
    }
    if (modalClose) modalClose.addEventListener('click', closeModal);
    if (overlay)    overlay.addEventListener('click', (e) => { if (e.target === overlay) closeModal(); });
    document.addEventListener('keydown', (e) => { if (e.key === 'Escape') closeModal(); });

    /* ── Newsletter Form ── */
    const newsletterForm = document.getElementById('newsletterForm');
    if (newsletterForm) newsletterForm.addEventListener('submit', (e) => {
      e.preventDefault();
      const input = e.target.querySelector('input');
      const btn   = e.target.querySelector('button');
      const orig  = btn.textContent;
      btn.textContent = 'Subscribed! ✓';
      btn.style.background = '#2ecc71';
      input.value = '';
      setTimeout(() => { btn.textContent = orig; btn.style.background = ''; }, 3000);
    });

    /* ── Add to Cart Counter ── */
    const cartCount = document.querySelector('.cart-count');
    let count = 0;
    document.querySelectorAll('.product-name').forEach(name => {
      name.style.cursor = 'pointer';
      name.addEventListener('click', () => {
        count++;
        if (cartCount) {
          cartCount.textContent = count;
          cartCount.style.transform = 'scale(1.4)';
          setTimeout(() => { cartCount.style.transform = ''; }, 300);
        }
      });
    });

    /* ── Intersection Observer: fade-in sections ── */
    const fadeEls = document.querySelectorAll('.product-card, .occ-card, .cat-card, .journal-card, .designer-card, .trust-item');
    fadeEls.forEach(el => {
      el.style.opacity = '0';
      el.style.transform = 'translateY(24px)';
      el.style.transition = 'opacity 0.55s ease, transform 0.55s ease';
    });
    const observer = new IntersectionObserver((entries) => {
      entries.forEach(entry => {
        if (entry.isIntersecting) {
          setTimeout(() => { entry.target.style.opacity = '1'; entry.target.style.transform = 'translateY(0)'; }, (entry.target.dataset.delay || 0));
          observer.unobserve(entry.target);
        }
      });
    }, { threshold: 0.12 });
    document.querySelectorAll('.products-grid .product-card, .occasion-grid .occ-card').forEach((el, i) => { el.dataset.delay = i * 60; });
    fadeEls.forEach(el => observer.observe(el));

    /* ── Cycle images on hover ── */
    document.querySelectorAll('.product-card[data-cycle]').forEach(card => {
      const imgs = Array.from(card.querySelectorAll('.cycle-img'));
      let idx = 0, timer = null;
      card.addEventListener('mouseenter', () => {
        idx = 0;
        imgs.forEach(img => { img.style.opacity = '0'; });
        imgs[idx].style.opacity = '1';
        timer = setInterval(() => { imgs[idx].style.opacity = '0'; idx = (idx + 1) % imgs.length; imgs[idx].style.opacity = '1'; }, 900);
      });
      card.addEventListener('mouseleave', () => { clearInterval(timer); timer = null; idx = 0; imgs.forEach(img => { img.style.opacity = '0'; }); });
    });



  } // end HOME PAGE


  /* ════════════════════════════════════════════════════
     PAGE: PLPs — Mens / Womens / Boys / Girls
  ════════════════════════════════════════════════════ */
  if (document.querySelector('.plp-card')) {

    // Filter accordion
    document.querySelectorAll('.filter-group__header').forEach(btn => {
      btn.addEventListener('click', () => btn.closest('.filter-group').classList.toggle('open'));
    });

    const filterLabels = {
      'salwar-kameez': 'Salwar Kameez',
      'sarees':        'Sarees',
      'lehengas':      'Lehenga Choli',
      'palazzo':       'Palazzo-Bottom Suits'
    };

    function applyFilter(filter) {
      document.querySelectorAll('.cat-pill').forEach(p => {
        p.classList.toggle('active', p.dataset.filter === filter);
      });
      document.querySelectorAll('.plp-card').forEach(card => {
        card.style.display = (filter === 'all' || card.dataset.category === filter) ? '' : 'none';
      });
      // Update count label if present (girls page)
      const countEl = document.getElementById('plpCount');
      if (countEl) {
        const visible = [...document.querySelectorAll('.plp-card')].filter(c => c.style.display !== 'none').length;
        countEl.textContent = visible + ' style' + (visible !== 1 ? 's' : '');
      }
      // Update breadcrumb
      const bc = document.getElementById('plpBreadcrumb');
      if (bc) {
        const label = filterLabels[filter];
        const existing = bc.querySelector('.current');
        const existingSep = bc.querySelector('.sep');
        if (label) {
          if (existing) existing.textContent = label;
          else {
            if (!existingSep) bc.insertAdjacentHTML('beforeend', `<span class="sep"><i class="fas fa-chevron-right"></i></span>`);
            bc.insertAdjacentHTML('beforeend', `<span class="current">${label}</span>`);
          }
        } else {
          if (existing) existing.remove();
          if (existingSep) existingSep.remove();
        }
      }
      const url = new URL(window.location);
      if (filter === 'all') url.searchParams.delete('filter');
      else url.searchParams.set('filter', filter);
      window.history.replaceState({}, '', url);
    }

    // Category pills
    document.querySelectorAll('.cat-pill').forEach(pill => {
      pill.addEventListener('click', e => { e.preventDefault(); applyFilter(pill.dataset.filter); });
    });

    // Filter checkboxes
    document.querySelectorAll('.clothing-filter-option').forEach(cb => {
      cb.addEventListener('change', () => {
        const checked = document.querySelector('.clothing-filter-option:checked');
        applyFilter(checked ? checked.value : 'all');
      });
    });

    // Apply filter from URL on load
    const urlParams = new URLSearchParams(window.location.search);
    const urlFilter = urlParams.get('filter');
    if (urlFilter) {
      applyFilter(urlFilter);
      const matchingCb = document.querySelector(`.clothing-filter-option[value="${urlFilter}"]`);
      if (matchingCb) matchingCb.checked = true;
    }

  } // end PLPs


  /* ════════════════════════════════════════════════════
     PAGE: PRODUCT DETAIL (PDP)
  ════════════════════════════════════════════════════ */
  if (document.getElementById('mainImg')) {

    const mainImg = document.getElementById('mainImg');
    document.querySelectorAll('.pdp-thumb').forEach(thumb => {
      thumb.addEventListener('click', () => {
        document.querySelectorAll('.pdp-thumb').forEach(t => t.classList.remove('active'));
        thumb.classList.add('active');
        mainImg.src = thumb.dataset.img;
      });
    });

    // Size selector
    document.querySelectorAll('.size-btn:not(.unavailable)').forEach(btn => {
      btn.addEventListener('click', () => {
        document.querySelectorAll('.size-btn').forEach(b => b.classList.remove('active'));
        btn.classList.add('active');
      });
    });

    // Colour selector
    document.querySelectorAll('.colour-dot').forEach(dot => {
      dot.addEventListener('click', () => {
        document.querySelectorAll('.colour-dot').forEach(d => d.classList.remove('active'));
        dot.classList.add('active');
        document.getElementById('selectedColour').textContent = dot.dataset.name;
      });
    });

    // Wishlist toggle
    const wishBtn = document.getElementById('pdpWishlistBtn');
    if (wishBtn) {
      wishBtn.addEventListener('click', () => {
        const icon  = wishBtn.querySelector('i');
        const label = wishBtn.querySelector('span');
        const saved = icon.classList.toggle('fas');
        icon.classList.toggle('far', !saved);
        icon.style.color = saved ? '#c0392b' : '';
        label.textContent = saved ? 'Saved to Wishlist' : 'Save to Wishlist';
      });
    }

    // Accordion
    document.querySelectorAll('.accord-header').forEach(btn => {
      btn.addEventListener('click', () => btn.closest('.accord-item').classList.toggle('open'));
    });

  } // end PDP

  /* ════════════════════════════════════════════════════
     LOGIN MODAL & AUTHENTICATION
  ════════════════════════════════════════════════════ */
  const loginBtn   = document.getElementById('loginBtn');
  const accountBtn = document.getElementById('accountBtn');
  const loginModal = document.getElementById('loginModal');
  const loginClose = document.getElementById('loginClose');

  function openLogin() {
    if (!loginModal) return;
    loginModal.classList.add('open');
    document.body.style.overflow = 'hidden';
  }
  function closeLogin() {
    if (!loginModal) return;
    loginModal.classList.remove('open');
    document.body.style.overflow = '';
  }

  if (loginBtn)   loginBtn.addEventListener('click', (e) => { e.preventDefault(); openLogin(); });
  if (loginClose) loginClose.addEventListener('click', closeLogin);
  if (loginModal) loginModal.addEventListener('click', e => { if (e.target === loginModal) closeLogin(); });

  // Logout dropdown/action
  if (accountBtn) {
    const accountMenu = document.getElementById('accountMenu');
    accountBtn.addEventListener('click', function(e) {
      e.stopPropagation();
      if (accountMenu) accountMenu.classList.toggle('active');
    });
    // Close menu when clicking outside
    document.addEventListener('click', () => {
      if (accountMenu) accountMenu.classList.remove('active');
    });
  }

  const menuLogoutBtn = document.getElementById('menuLogoutBtn');
  if (menuLogoutBtn) {
    menuLogoutBtn.addEventListener('click', function(e) {
      e.preventDefault();
      if (confirm('Are you sure you want to log out?')) {
          const params = new URLSearchParams();
          params.append('action', 'logout');
          
          fetch('auth_action.php', {
              method: 'POST',
              headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
              body: params.toString()
          })
          .then(res => res.json())
          .then(data => {
              if (data.success) {
                  window.location.reload();
              }
          });
      }
    });
  }

  // Tabs within login modal
  document.querySelectorAll('.login-tab').forEach(tab => {
    tab.addEventListener('click', () => {
      document.querySelectorAll('.login-tab').forEach(t => t.classList.remove('active'));
      document.querySelectorAll('.login-panel').forEach(p => p.classList.remove('active'));
      tab.classList.add('active');
      const target = document.getElementById(tab.dataset.target);
      if (target) target.classList.add('active');
    });
  });

  /* ── Auth form submissions ── */
  const submitLogin = document.getElementById('loginSubmitBtn');
  if (submitLogin) {
      submitLogin.addEventListener('click', function() {
          const email = document.getElementById('loginEmail').value;
          const pass = document.getElementById('loginPassword').value;
          const errorDiv = document.getElementById('loginError');
          if (errorDiv) errorDiv.style.display = 'none';

          if (!email || !pass) {
              if (errorDiv) {
                  errorDiv.textContent = 'Please enter both email and password.';
                  errorDiv.style.display = 'block';
              }
              return;
          }

          submitLogin.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Directing...';

          const params = new URLSearchParams();
          params.append('action', 'login');
          params.append('email', email);
          params.append('password', pass);

          fetch('auth_action.php', {
              method: 'POST',
              headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
              body: params.toString()
          })
          .then(res => {
              if (!res.ok) throw new Error('Network response was not ok');
              return res.json();
          })
          .then(data => {
              if (data.success) {
                  window.location.reload();
              } else {
                  submitLogin.innerHTML = '<i class="far fa-user"></i> Sign In';
                  if (errorDiv) {
                      errorDiv.textContent = data.message;
                      errorDiv.style.display = 'block';
                  }
              }
          })
          .catch(err => {
              console.error('Login error:', err);
              submitLogin.innerHTML = '<i class="far fa-user"></i> Sign In';
              if (errorDiv) {
                  errorDiv.textContent = 'An error occurred. Please check your connection.';
                  errorDiv.style.display = 'block';
              }
          });
      });
  }

  /* ── Registration logic ── */
  const regSubmit = document.getElementById('registerSubmitBtn');
  if (regSubmit) {
      regSubmit.addEventListener('click', function() {
          const name = document.getElementById('regName').value;
          const email = document.getElementById('regEmail').value;
          const pass = document.getElementById('regPassword').value;
          const errorDiv = document.getElementById('regError');
          if (errorDiv) errorDiv.style.display = 'none';

          if (!name || !email || !pass) {
              if (errorDiv) {
                  errorDiv.textContent = 'Please fill out all fields.';
                  errorDiv.style.display = 'block';
              }
              return;
          }
          
          regSubmit.innerHTML = '<i class="fas fa-spinner fa-spin"></i> Creating...';

          const params = new URLSearchParams();
          params.append('action', 'register');
          params.append('full_name', name);
          params.append('email', email);
          params.append('password', pass);

          fetch('auth_action.php', {
              method: 'POST',
              headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
              body: params.toString()
          })
          .then(res => {
              if (!res.ok) throw new Error('Network response was not ok');
              return res.json();
          })
          .then(data => {
              if (data.success) {
                  // Show success message and login link
                  const panel = document.getElementById('registerPanel');
                  if (panel) {
                      panel.innerHTML = `
                        <div style="text-align:center;padding:40px 20px;">
                          <div style="width:60px;height:60px;background:#f1f8e9;color:#4caf50;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 20px;font-size:24px;">
                            <i class="fas fa-check"></i>
                          </div>
                          <h4 style="margin-bottom:10px;color:#333;">Account Created!</h4>
                          <p style="color:#666;font-size:14px;margin-bottom:25px;">${data.message}</p>
                          <button class="btn-login-submit" id="switchToLoginBtn" type="button">Login Now</button>
                        </div>
                      `;
                      const switchBtn = document.getElementById('switchToLoginBtn');
                      if (switchBtn) {
                          switchBtn.addEventListener('click', () => {
                              const loginTab = document.querySelector('.login-tab[data-target="loginPanel"]');
                              if (loginTab) loginTab.click();
                          });
                      }
                  }
              } else {
                  regSubmit.innerHTML = '<i class="fas fa-user-plus"></i> Create Account';
                  if (errorDiv) {
                      errorDiv.textContent = data.message;
                      errorDiv.style.display = 'block';
                  }
              }
          })
          .catch(err => {
              console.error('Registration error:', err);
              regSubmit.innerHTML = '<i class="fas fa-user-plus"></i> Create Account';
              if (errorDiv) {
                  errorDiv.textContent = 'An error occurred. Please check your connection.';
                  errorDiv.style.display = 'block';
              }
          });
      });
  }

  /* ════════════════════════════════════════════════════
     CART DRAWER
  ════════════════════════════════════════════════════ */
  const cartBtn     = document.getElementById('cartBtn');
  const cartDrawer  = document.getElementById('cartDrawer');
  const cartOverlay = document.getElementById('cartDrawerOverlay');
  const cartClose   = document.getElementById('cartClose');

  function openCart() {
    if (!cartDrawer) return;
    cartDrawer.classList.add('open');
    if (cartOverlay) cartOverlay.classList.add('open');
    document.body.style.overflow = 'hidden';
  }
  function closeCart() {
    if (!cartDrawer) return;
    cartDrawer.classList.remove('open');
    if (cartOverlay) cartOverlay.classList.remove('open');
    document.body.style.overflow = '';
  }

  if (cartBtn)     cartBtn.addEventListener('click', openCart);
  if (cartClose)   cartClose.addEventListener('click', closeCart);
  if (cartOverlay) cartOverlay.addEventListener('click', closeCart);

  /* ════════════════════════════════════════════════════
     WISHLIST DRAWER
  ════════════════════════════════════════════════════ */
  const wishlistBtn     = document.getElementById('wishlistBtn');
  const wishlistDrawer  = document.getElementById('wishlistDrawer');
  const wishlistOverlay = document.getElementById('wishlistOverlay');
  const wishlistClose   = document.getElementById('wishlistClose');

  function openWishlist() {
    if (!wishlistDrawer) return;
    wishlistDrawer.classList.add('open');
    if (wishlistOverlay) wishlistOverlay.classList.add('open');
    document.body.style.overflow = 'hidden';
  }
  function closeWishlist() {
    if (!wishlistDrawer) return;
    wishlistDrawer.classList.remove('open');
    if (wishlistOverlay) wishlistOverlay.classList.remove('open');
    document.body.style.overflow = '';
  }

  if (wishlistBtn)     wishlistBtn.addEventListener('click', openWishlist);
  if (wishlistClose)   wishlistClose.addEventListener('click', closeWishlist);
  if (wishlistOverlay) wishlistOverlay.addEventListener('click', closeWishlist);

});

/* ════════════════════════════════════════════════════
   CART HELPERS — global scope for inline onclick attrs
════════════════════════════════════════════════════ */
const _cartBase = { cartItem1: 115, cartItem2: 55 };
const _cartQty  = { cartItem1: 1,   cartItem2: 1  };

function changeQty(itemId, priceElId, qtyElId, delta) {
  _cartQty[itemId] = Math.max(1, (_cartQty[itemId] || 1) + delta);
  const qEl = document.getElementById(qtyElId);
  const pEl = document.getElementById(priceElId);
  if (qEl) qEl.textContent = _cartQty[itemId];
  if (pEl) pEl.textContent = 'USD ' + (_cartBase[itemId] * _cartQty[itemId]);
  _refreshCartSubtotal();
}

function removeCartItem(itemId) {
  const el = document.getElementById(itemId);
  if (el) el.style.display = 'none';
  _cartQty[itemId] = 0;
  _refreshCartSubtotal();
  const remaining = Object.values(_cartQty).filter(v => v > 0).length;
  const countEl = document.getElementById('cartDrawerCount');
  if (countEl) countEl.textContent = remaining + ' item' + (remaining !== 1 ? 's' : '');
}

function _refreshCartSubtotal() {
  const total = Object.keys(_cartBase).reduce((s, id) => s + _cartBase[id] * (_cartQty[id] || 0), 0);
  const el = document.getElementById('cartSubtotal');
  if (el) el.textContent = 'USD ' + total;
}

/* ── WISHLIST HELPERS (global — called from inline onclick) ── */
function removeWishItem(btn) {
  const item = btn.closest('.cart-drawer-item');
  if (item) item.remove();
  const drawer = document.getElementById('wishlistDrawer');
  const countEl = document.getElementById('wishlistCount');
  if (drawer && countEl) {
    const remaining = drawer.querySelectorAll('.cart-drawer-item').length;
    countEl.textContent = remaining + ' item' + (remaining !== 1 ? 's' : '');
    const itemsContainer = drawer.querySelector('.cart-drawer-items');
    if (remaining === 0 && itemsContainer) {
      itemsContainer.innerHTML = '<div class="cart-empty-state"><i class="far fa-heart" style="font-size:2rem;color:var(--mid-gray);display:block;margin-bottom:12px;"></i>Your wishlist is empty</div>';
    }
  }
}

function moveToCart(btn, name) {
  const item = btn.closest('.cart-drawer-item');
  if (item) item.remove();
  const wishDrawer = document.getElementById('wishlistDrawer');
  const countEl = document.getElementById('wishlistCount');
  if (wishDrawer && countEl) {
    const remaining = wishDrawer.querySelectorAll('.cart-drawer-item').length;
    countEl.textContent = remaining + ' item' + (remaining !== 1 ? 's' : '');
    const itemsContainer = wishDrawer.querySelector('.cart-drawer-items');
    if (remaining === 0 && itemsContainer) {
      itemsContainer.innerHTML = '<div class="cart-empty-state"><i class="far fa-heart" style="font-size:2rem;color:var(--mid-gray);display:block;margin-bottom:12px;"></i>Your wishlist is empty</div>';
    }
  }
  // Close wishlist and open cart
  if (wishDrawer) {
    wishDrawer.classList.remove('open');
    const wOverlay = document.getElementById('wishlistOverlay');
    if (wOverlay) wOverlay.classList.remove('open');
  }
  const cartDrawer = document.getElementById('cartDrawer');
  const cartOverlay = document.getElementById('cartDrawerOverlay');
  if (cartDrawer) cartDrawer.classList.add('open');
  if (cartOverlay) cartOverlay.classList.add('open');
  document.body.style.overflow = 'hidden';
}