(function(c,l,a,r,i,t,y){ c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)}; t=l.createElement(r);t.async=1;t.src=”https://www.clarity.ms/tag/”+i; y=l.getElementsByTagName(r)[0];y.parentNode.insertBefore(t,y); })(window, document, “clarity”, “script”, “vc4hmdzw2k”); window.__CLARITY_DATA__ = { template_id: “BPCaG4Y6E8N1oHV”, user_id: “ZFpOOWQyS2RRUEJ4c2VPS2dkQ3dydz09”, merchant_id: “ZFpOOWQyS2RRUEJ4c2VPS2dkQ3dydz09”, product_id: “prod_6937e8c4c7c4a9.84199526”, product_name: “nike_sneakers_1”, funnel_name: “CouponShoupon”, group_id: “IlLugEVAsi”, link_domain: “test.automora.site”, link_domain_id: “P6nhL”, mode: “published”, session_id: “” }; (function() { // Wait for Clarity to load function initTracking() { if (!window.clarity) { setTimeout(initTracking, 2000); return; } // Extract URL parameters – check both current window and parent (for iframe) let urlParams; let currentUrl = window.location.href; try { // Try to get parent URL if in iframe (may be blocked by CORS) if (window.parent && window.parent !== window && window.parent.location) { urlParams = new URLSearchParams(window.parent.location.search); currentUrl = window.parent.location.href; } else { urlParams = new URLSearchParams(window.location.search); } } catch (e) { // CORS blocked, use current window urlParams = new URLSearchParams(window.location.search); } // Check for injected data (from published pages) const injectedData = window.__CLARITY_DATA__ || {}; // Check for hardcoded values (legacy support) const hardcodedTemplate = window.__CLARITY_TEMPLATE__ || ”; const hardcodedUser = window.__CLARITY_USER__ || ”; // Check meta tags as fallback const getMeta = (name) => { const meta = document.querySelector(`meta[name=”${name}”]`); return meta ? meta.getAttribute(‘content’) : ”; }; const editorData = { // Priority: 1. Injected data, 2. Hardcoded values, 3. URL params, 4. Meta tags template_id: injectedData.template_id || hardcodedTemplate || urlParams.get(‘template’) || getMeta(‘template-id’) || ”, user_id: injectedData.user_id || hardcodedUser || urlParams.get(‘user’) || getMeta(‘user-id’) || ”, merchant_id: injectedData.merchant_id || hardcodedUser || urlParams.get(‘user’) || getMeta(‘user-id’) || ”, product_id: injectedData.product_id || urlParams.get(‘product_id’) || getMeta(‘product-id’) || ”, product_name: injectedData.product_name || urlParams.get(‘brand_name’) || getMeta(‘product-name’) || ”, funnel_name: injectedData.funnel_name || urlParams.get(‘funnel’) || getMeta(‘funnel’) || ”, group_id: injectedData.group_id || urlParams.get(‘group_id’) || getMeta(‘group-id’) || ”, link_domain: injectedData.link_domain || urlParams.get(‘link_domain’) || window.location.hostname || ”, link_domain_id: injectedData.link_domain_id || urlParams.get(‘link_domain_id’) || ”, session_id: injectedData.session_id || urlParams.get(‘sid’) || ”, page_type: ‘landing’ }; // Basic tracking (mirrors Naturali page approach) if (editorData.template_id) { clarity(“set”, “template_id”, editorData.template_id); } if (editorData.user_id) { clarity(“set”, “publisher_id”, editorData.user_id); } clarity(“set”, “page_type”, editorData.page_type); // TrustBadges tracking const hasTrustBadges = !!document.querySelector(‘[class*=”trust”], [class*=”badge”]’) || /b(authentic|secure payment|verified)b/i.test(document.body.innerText); clarity(“set”, “TrustBadges”, hasTrustBadges ? “true” : “false”); if (hasTrustBadges) { clarity(“event”, “TrustBadges”); } // Show info about data source const hasUrlParams = urlParams.toString().length > 0; const hasHardcoded = hardcodedTemplate || hardcodedUser; const hasInjected = Object.keys(injectedData).length > 0 && injectedData.template_id; if (hasInjected) { console.log(‘[Clarity Debug] ✅ Using injected data from published page’); } else if (hasHardcoded) { console.log(‘[Clarity Debug] ✅ Using hardcoded values from server’); } else if (hasUrlParams) { console.log(‘[Clarity Debug] ✅ Using URL parameters’); } else { console.log(‘[Clarity Debug] ℹ️ Using fallback values’); console.log(‘[Clarity Debug] Domain:’, editorData.link_domain); } // Send Editor Data as Smart Events (only if data exists) console.log(‘[Clarity Debug] editorData:’, JSON.stringify(editorData, null, 2)); if (editorData.template_id) { const templateData = { template_id: editorData.template_id, funnel: editorData.funnel_name, group_id: editorData.group_id }; console.log(‘[Clarity Debug] Sending TemplateLoaded:’, JSON.stringify(templateData)); window.clarity(“event”, “TemplateLoaded”, templateData); console.log(‘[Clarity Debug] ✅ TemplateLoaded sent’); } else { console.log(‘[Clarity Debug] ⏭️ Skipping TemplateLoaded (no template_id)’); } if (editorData.user_id) { const userData = { user_id: editorData.user_id, merchant_id: editorData.merchant_id }; console.log(‘[Clarity Debug] Sending UserIdentified:’, JSON.stringify(userData)); window.clarity(“event”, “UserIdentified”, userData); console.log(‘[Clarity Debug] ✅ UserIdentified sent’); } else { console.log(‘[Clarity Debug] ⏭️ Skipping UserIdentified (no user_id)’); } if (editorData.product_id) { const productData = { product_id: editorData.product_id, product_name: editorData.product_name }; console.log(‘[Clarity Debug] Sending ProductLoaded:’, JSON.stringify(productData)); window.clarity(“event”, “ProductLoaded”, productData); console.log(‘[Clarity Debug] ✅ ProductLoaded sent’); } else { console.log(‘[Clarity Debug] ⏭️ Skipping ProductLoaded (no product_id)’); } // Only send EditorContext if we have any data const hasAnyData = Object.values(editorData).some(v => v !== ”); if (hasAnyData) { console.log(‘[Clarity Debug] Sending EditorContext:’, JSON.stringify(editorData)); window.clarity(“event”, “EditorContext”, editorData); console.log(‘[Clarity Debug] ✅ EditorContext sent’); } else { console.log(‘[Clarity Debug] ⏭️ Skipping EditorContext (all fields empty)’); } // CRO Detection const html = document.documentElement.innerHTML.toLowerCase(); const text = document.body.innerText.toLowerCase(); const croEvents = { ‘UrgencyElements’: /b(hurry|limited time|act now|countdown)b/i.test(text), ‘ScarcityIndicators’: /b(limited stock|only d+ left|low stock)b/i.test(text), ‘SocialProof’: !!document.querySelector(‘[class*=”review”], [class*=”testimonial”]’) || /b(review|rating)b/i.test(text), ‘AuthoritySignals’: /b(as seen on|featured in|expert|certified)b/i.test(text), ‘TrustBadges’: !!document.querySelector(‘[class*=”trust”], [class*=”badge”]’) || /b(authentic|secure payment|verified)b/i.test(text), ‘RiskReversal’: /b(30.day|money.back|free returns|satisfaction guarantee)b/i.test(text), ‘AboveFoldCTA’: !!document.querySelector(‘a[href=”#purchase”], button[class*=”buy”], [class*=”cta”]’), ‘StickyNavbar’: !!document.querySelector(‘nav[style*=”position:fixed”], nav[class*=”sticky”]’), ‘StickyBuyButton’: !!document.querySelector(‘[class*=”sticky-buy”], [class*=”sticky-bar”]’), ‘ExitIntentPopup’: html.includes(‘mouseleave’) || html.includes(‘beforeunload’), ‘FAQSection’: !!document.querySelector(‘section#faq, [class*=”faq”], [id*=”faq”]’), ‘PriceAnchoring’: !!document.querySelector(‘[class*=”line-through”], [class*=”compare”]’), ‘VisualHierarchy’: !!document.querySelector(‘h1’) && document.querySelectorAll(‘section’).length > 2, ‘MobileOptimization’: !!document.querySelector(‘meta[name=”viewport”]’), ‘SEOMetaTags’: !!document.querySelector(‘title’) && !!document.querySelector(‘meta[name=”description”]’), ‘Accessibility’: document.querySelectorAll(‘[aria-label], [alt], [role]’).length > 5, ‘RetargetingReady’: html.includes(‘fbq’) || html.includes(‘gtag’) || html.includes(‘googletagmanager’) }; // Log all CRO detection results console.log(‘[Clarity Debug] === CRO ELEMENTS DETECTED ===’); Object.entries(croEvents).forEach(([eventName, isPresent]) => { console.log(`[Clarity Debug] ${eventName}: ${isPresent ? ‘✅ YES’ : ‘❌ NO’}`); }); console.log(‘[Clarity Debug] =============================’); // Send CRO events as BOTH Custom Tags (Dashboard) AND Smart Events (API) let activeCROCount = 0; Object.entries(croEvents).forEach(([eventName, isPresent]) => { if (isPresent) { activeCROCount++; // Method 1: Custom Tag (Dashboard filtering only) window.clarity(“set”, eventName, “true”); // Method 2: Smart Event (Dashboard + API access) window.clarity(“event”, eventName); } }); // Calculate CRO score const croScore = activeCROCount; const croPercentage = Math.round((croScore / 17) * 100); // Send CRO score as BOTH methods window.clarity(“set”, “cro_score”, String(croScore)); window.clarity(“set”, “cro_total”, “17”); window.clarity(“set”, “cro_percentage”, String(croPercentage)); window.clarity(“event”, “CROScore”, { score: croScore, total: 17, percentage: croPercentage }); // Export event for MCP/API querying (includes all CRO data) window.clarity(“event”, “Export”, { export_type: “cro_analysis”, template_id: editorData.template_id || ”, product_id: editorData.product_id || ”, cro_score: croScore, cro_total: 17, cro_percentage: croPercentage, has_urgency: croEvents.UrgencyElements, has_scarcity: croEvents.ScarcityIndicators, has_social_proof: croEvents.SocialProof, has_authority: croEvents.AuthoritySignals, has_trust_badges: croEvents.TrustBadges, has_risk_reversal: croEvents.RiskReversal, has_above_fold_cta: croEvents.AboveFoldCTA, has_sticky_navbar: croEvents.StickyNavbar, has_sticky_buy: croEvents.StickyBuyButton, has_exit_intent: croEvents.ExitIntentPopup, has_faq: croEvents.FAQSection, has_price_anchoring: croEvents.PriceAnchoring, has_visual_hierarchy: croEvents.VisualHierarchy, has_mobile_opt: croEvents.MobileOptimization, has_seo_meta: croEvents.SEOMetaTags, has_accessibility: croEvents.Accessibility, has_retargeting: croEvents.RetargetingReady }); console.log(‘✅ Clarity tracking initialized. CRO Score:’, croScore + ‘/17 (‘ + croPercentage + ‘%)’); } // Run when ready if (document.readyState === ‘complete’) { setTimeout(initTracking, 3000); } else { window.addEventListener(‘load’, () => setTimeout(initTracking, 3000)); } })(); * { font-family: ‘Poppins’, sans-serif; } .font-bebas { font-family: ‘Bebas Neue’, sans-serif; } html { scroll-behavior: smooth; } @keyframes float { 0%, 100% { transform: translateY(0px) rotate(0deg); } 50% { transform: translateY(-20px) rotate(2deg); } } @keyframes pulse-glow { 0%, 100% { box-shadow: 0 0 20px rgba(212, 175, 55, 0.3); } 50% { box-shadow: 0 0 40px rgba(212, 175, 55, 0.6); } } @keyframes gradient-shift { 0% { background-position: 0% 50%; } 50% { background-position: 100% 50%; } 100% { background-position: 0% 50%; } } @keyframes slide-up { from { opacity: 0; transform: translateY(60px); } to { opacity: 1; transform: translateY(0); } } @keyframes fade-in { from { opacity: 0; } to { opacity: 1; } } @keyframes scale-in { from { opacity: 0; transform: scale(0.9); } to { opacity: 1; transform: scale(1); } } @keyframes shimmer { 0% { background-position: -200% center; } 100% { background-position: 200% center; } } .animate-float { animation: float 6s ease-in-out infinite; } .animate-pulse-glow { animation: pulse-glow 3s ease-in-out infinite; } .animate-gradient { animation: gradient-shift 8s ease infinite; background-size: 200% 200%; } .animate-slide-up { animation: slide-up 0.8s ease-out forwards; } .animate-fade-in { animation: fade-in 0.6s ease-out forwards; } .animate-scale-in { animation: scale-in 0.6s ease-out forwards; } .animate-shimmer { background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.4) 50%, transparent 100%); background-size: 200% 100%; animation: shimmer 2s infinite; } .reveal { opacity: 0; transform: translateY(40px); transition: all 0.8s cubic-bezier(0.16, 1, 0.3, 1); } .reveal.active { opacity: 1; transform: translateY(0); } .reveal-delay-1 { transition-delay: 0.1s; } .reveal-delay-2 { transition-delay: 0.2s; } .reveal-delay-3 { transition-delay: 0.3s; } .reveal-delay-4 { transition-delay: 0.4s; } .glass { background: rgba(26, 26, 26, 0.8); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); } .glass-light { background: rgba(255, 255, 255, 0.1); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); } .text-gradient { background: linear-gradient(135deg, #D4AF37 0%, #F5F5F5 50%, #D4AF37 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; } .text-gradient-green { background: linear-gradient(135deg, #2D5016 0%, #4a7c23 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; } .card-hover { transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1); } .card-hover:hover { transform: translateY(-8px); box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.5); } .btn-primary { background: linear-gradient(135deg, #D4AF37 0%, #b8962f 100%); transition: all 0.3s ease; position: relative; overflow: hidden; } .btn-primary::before { content: ”; position: absolute; top: 0; left: -100%; width: 100%; height: 100%; background: linear-gradient(90deg, transparent, rgba(255,255,255,0.3), transparent); transition: left 0.5s ease; } .btn-primary:hover::before { left: 100%; } .btn-primary:hover { transform: translateY(-2px); box-shadow: 0 10px 30px rgba(212, 175, 55, 0.4); } .variant-btn { transition: all 0.3s ease; border: 2px solid transparent; } .variant-btn:hover { border-color: #D4AF37; transform: scale(1.05); } .variant-btn.selected { border-color: #D4AF37; background: rgba(212, 175, 55, 0.1); } .image-zoom { transition: transform 0.5s ease; } .image-zoom:hover { transform: scale(1.1); } ::-webkit-scrollbar { width: 8px; } ::-webkit-scrollbar-track { background: #1A1A1A; } ::-webkit-scrollbar-thumb { background: #D4AF37; border-radius: 4px; } ::-webkit-scrollbar-thumb:hover { background: #b8962f; } .line-clamp-2 { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .line-clamp-3 { display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } .parallax-container { perspective: 1px; overflow-x: hidden; overflow-y: auto; height: 100vh; } .parallax-layer { transform-style: preserve-3d; } .mobile-menu { transition: max-height 0.4s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.3s ease; } .nav-link { position: relative; } .nav-link::after { content: ”; position: absolute; bottom: -4px; left: 0; width: 0; height: 2px; background: #D4AF37; transition: width 0.3s ease; } .nav-link:hover::after { width: 100%; } @media (max-width: 640px) { .hero-title { font-size: clamp(2.5rem, 10vw, 4rem); } .section-title { font-size: clamp(1.8rem, 6vw, 2.5rem); } } window.wcProductData = { productId: 13, productName: “AIR JORDAN 1 HIGH OG FLIGHT CLUB”, baseUrl: “https://wooname.online”, price: “16995”, sku: “II9811-001”, variations: { 14: { size: “7”, color: “Black”, sku: “Var-001”, price: “16995” }, 15: { size: “8”, color: “Black”, sku: “Var-002”, price: “16995” }, 16: { size: “9”, color: “Black”, sku: “Var-003”, price: “16995” }, 17: { size: “10”, color: “Black”, sku: “Var-004”, price: “16995” }, 18: { size: “11”, color: “Black”, sku: “Var-005”, price: “16995” }, 19: { size: “12”, color: “Black”, sku: “Var-006”, price: “16995” } } }; window.zedConfig = {“shiprocketDomain”:””}; @font-face { font-family: ‘Bebas Neue’; font-style: normal; font-weight: 400; font-display: swap; src: url(https://fonts.gstatic.com/s/bebasneue/v16/JTUSjIg69CK48gW7PXooxW4.ttf) format(‘truetype’); } @font-face { font-family: ‘Poppins’; font-style: normal; font-weight: 300; font-display: swap; src: url(https://fonts.gstatic.com/s/poppins/v24/pxiByp8kv8JHgFVrLDz8V1s.ttf) format(‘truetype’); } @font-face { font-family: ‘Poppins’; font-style: normal; font-weight: 400; font-display: swap; src: url(https://fonts.gstatic.com/s/poppins/v24/pxiEyp8kv8JHgFVrFJA.ttf) format(‘truetype’); } @font-face { font-family: ‘Poppins’; font-style: normal; font-weight: 500; font-display: swap; src: url(https://fonts.gstatic.com/s/poppins/v24/pxiByp8kv8JHgFVrLGT9V1s.ttf) format(‘truetype’); } @font-face { font-family: ‘Poppins’; font-style: normal; font-weight: 600; font-display: swap; src: url(https://fonts.gstatic.com/s/poppins/v24/pxiByp8kv8JHgFVrLEj6V1s.ttf) format(‘truetype’); } @font-face { font-family: ‘Poppins’; font-style: normal; font-weight: 700; font-display: swap; src: url(https://fonts.gstatic.com/s/poppins/v24/pxiByp8kv8JHgFVrLCz7V1s.ttf) format(‘truetype’); } lucide.createIcons(); const mobileMenuBtn = document.getElementById(‘mobileMenuBtn’); const mobileMenu = document.getElementById(‘mobileMenu’); let isMenuOpen = false; mobileMenuBtn.addEventListener(‘click’, () => { isMenuOpen = !isMenuOpen; if (isMenuOpen) { mobileMenu.style.maxHeight = ‘400px’; mobileMenu.style.opacity = ‘1’; mobileMenuBtn.innerHTML = ‘‘; } else { mobileMenu.style.maxHeight = ‘0’; mobileMenu.style.opacity = ‘0’; mobileMenuBtn.innerHTML = ‘‘; } lucide.createIcons(); }); document.querySelectorAll(‘#mobileMenu a’).forEach(link => { link.addEventListener(‘click’, () => { isMenuOpen = false; mobileMenu.style.maxHeight = ‘0’; mobileMenu.style.opacity = ‘0’; mobileMenuBtn.innerHTML = ‘‘; lucide.createIcons(); }); }); const revealElements = document.querySelectorAll(‘.reveal’); const revealObserver = new IntersectionObserver((entries) => { entries.forEach(entry => { if (entry.isIntersecting) { entry.target.classList.add(‘active’); } }); }, { threshold: 0.1, rootMargin: ‘0px 0px -50px 0px’ }); revealElements.forEach(el => revealObserver.observe(el)); const variantButtons = document.querySelectorAll(‘[variant-option]’); const productImage = document.getElementById(‘mainProductImage’); const selectedColorEl = document.getElementById(‘selectedColor’); const currentPriceEl = document.getElementById(‘currentPrice’); function handleVariantSelection(event) { const button = event.currentTarget; variantButtons.forEach(btn => btn.classList.remove(‘selected’)); button.classList.add(‘selected’); window.selectedVariantId = button.getAttribute(‘data-variant-id’); const title = button.getAttribute(‘data-variant-title’); const price = button.getAttribute(‘data-variant-price’); const image = button.getAttribute(‘data-variant-image’); selectedColorEl.innerHTML = title.includes(‘/’) ? title.split(‘/’)[1] : title; currentPriceEl.innerHTML = ‘₹’ + price; const addToCartBtn = document.querySelector(‘[add-to-cart]’); addToCartBtn.innerHTML = `Add to Bag – ₹${price}`; lucide.createIcons(); if (image) { productImage.src = image; } } variantButtons.forEach(btn => { btn.addEventListener(‘click’, handleVariantSelection); }); const quantityEl = document.getElementById(‘quantity’); const decreaseBtn = document.getElementById(‘decreaseQty’); const increaseBtn = document.getElementById(‘increaseQty’); let quantity = 1; decreaseBtn.addEventListener(‘click’, () => { if (quantity > 1) { quantity–; quantityEl.innerHTML = quantity; } }); increaseBtn.addEventListener(‘click’, () => { if (quantity { const currentScrollY = window.scrollY; if (currentScrollY > 100) { navbar.classList.add(‘shadow-lg’); } else { navbar.classList.remove(‘shadow-lg’); } lastScrollY = currentScrollY; }); document.querySelectorAll(‘a[href^=”#”]’).forEach(anchor => { anchor.addEventListener(‘click’, function(e) { e.preventDefault(); const target = document.querySelector(this.getAttribute(‘href’)); if (target) { const offset = 80; const targetPosition = target.getBoundingClientRect().top + window.pageYOffset – offset; window.scrollTo({ top: targetPosition, behavior: ‘smooth’ }); } }); }); .drawer-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); opacity: 0; visibility: hidden; transition: opacity 0.3s ease, visibility 0.3s ease; z-index: 2000; } .drawer-overlay.active { opacity: 1; visibility: visible; } .cart-drawer { position: fixed; top: 0; right: -480px; width: 480px; height: 100vh; background: white; transition: right 0.3s ease; z-index: 2001; display: flex; flex-direction: column; } .cart-drawer.active { right: 0; } @media (max-width: 768px) { .cart-drawer { width: 100%; right: -100%; } } .cart-drawer .products-section { flex: 1; overflow-y: auto; min-height: 0; } .cart-drawer .order-summary-section { flex-shrink: 0; display: flex; flex-direction: column; height: auto; }

Products In Cart

× Close

Subtotal ₹0.00

Total ₹0.00

Proceed to Checkout

// Simple WooCommerce Cart Implementation (function() { var wcData = window.wcProductData || {}; var CART_KEY = ‘wc_cart_v1’; function getCart() { try { return JSON.parse(localStorage.getItem(CART_KEY)) || []; } catch(e) { return []; } } function saveCart(cart) { localStorage.setItem(CART_KEY, JSON.stringify(cart)); updateCartBadge(cart); } function updateCartBadge(cart) { var total = 0; var items = cart || getCart(); for (var i = 0; i < items.length; i++) { total += parseInt(items[i].quantity, 10) || 0; } var badges = document.querySelectorAll('[cart-icon] span'); for (var j = 0; j 0 ? ‘flex’ : ‘none’; } } window.addToCart = function(variationId, qty) { console.log(‘Adding to cart:’, variationId, qty); if (!variationId) { alert(‘Please select a size before adding to cart’); return; } if (!qty) qty = 1; var variation = wcData.variations ? wcData.variations[variationId] : null; if (!variation) { console.error(‘Variation not found:’, variationId); alert(‘Invalid size selected’); return; } var cart = getCart(); var cartItemId = ‘var_’ + variationId; var existing = null; for (var k = 0; k < cart.length; k++) { if (cart[k].id === cartItemId) { existing = cart[k]; break; } } if (existing) { existing.quantity += qty; } else { cart.push({ id: cartItemId, productId: wcData.productId, name: wcData.productName, variantId: variationId, size: variation.size, color: variation.color, sku: variation.sku, price: parseFloat(variation.price) || 0, quantity: qty, image: 'https://wooname.online/wp-content/uploads/2026/04/nikess.webp', currency: 'INR' }); } saveCart(cart); console.log('Cart updated:', cart); // Show cart drawer var drawer = document.querySelector('.cart-drawer'); var overlay = document.querySelector('.drawer-overlay'); if (drawer) drawer.classList.add('active'); if (overlay) overlay.classList.add('active'); document.body.style.overflow = 'hidden'; renderCart(); }; window.removeFromCart = function(id) { var cart = getCart(); var newCart = []; for (var i = 0; i < cart.length; i++) { if (cart[i].id !== id) { newCart.push(cart[i]); } } saveCart(newCart); renderCart(); }; window.updateQuantity = function(id, delta) { var cart = getCart(); for (var i = 0; i < cart.length; i++) { if (cart[i].id === id) { cart[i].quantity += delta; if (cart[i].quantity < 1) cart[i].quantity = 1; break; } } saveCart(cart); renderCart(); }; window.closeCart = function() { var drawer = document.querySelector('.cart-drawer'); var overlay = document.querySelector('.drawer-overlay'); if (drawer) drawer.classList.remove('active'); if (overlay) overlay.classList.remove('active'); document.body.style.overflow = ''; }; window.renderCart = function() { var container = document.getElementById('cart-items-container'); if (!container) return; var cart = getCart(); container.innerHTML = ''; if (cart.length === 0) { container.innerHTML = '

‘ + ” + ” + ‘

Your cart is empty’; document.getElementById(‘cart-subtotal’).innerHTML = ‘₹0.00’; document.getElementById(‘cart-total’).innerHTML = ‘₹0.00’; return; } var subtotal = 0; for (var i = 0; i < cart.length; i++) { var item = cart[i]; subtotal += item.price * item.quantity; var itemDiv = document.createElement('div'); itemDiv.className = 'flex gap-3 pb-4 border-b border-gray-200 mb-4'; itemDiv.innerHTML = '‘ + ‘

‘ + ‘

‘ + item.name + ” + ‘

Size: ‘ + item.size + ‘ / Color: ‘ + item.color + ” + ‘

‘ + ‘-‘ + ‘‘ + item.quantity + ” + ‘+’ + ‘Remove’ + ” + ‘

₹’ + (item.price * item.quantity).toLocaleString(‘en-IN’) + ” + ”; container.appendChild(itemDiv); } document.getElementById(‘cart-subtotal’).innerHTML = ‘₹’ + subtotal.toLocaleString(‘en-IN’); document.getElementById(‘cart-total’).innerHTML = ‘₹’ + subtotal.toLocaleString(‘en-IN’); }; // Wire up buttons when DOM is ready function init() { console.log(‘Initializing cart…’); // Add to Bag button var addToBagBtn = document.querySelector(‘[add-to-cart]’); if (addToBagBtn) { addToBagBtn.addEventListener(‘click’, function(e) { e.preventDefault(); e.stopPropagation(); var selectedVariant = document.querySelector(‘[variant-option].selected’); if (!selectedVariant) { alert(‘Please select a size’); return; } var variationId = selectedVariant.getAttribute(‘data-variant-id’); var quantityEl = document.getElementById(‘quantity’); var quantity = quantityEl ? parseInt(quantityEl.textContent) || 1 : 1; console.log(‘Adding to cart:’, variationId, quantity); window.addToCart(variationId, quantity); }); console.log(‘Add to Bag button wired’); } // Proceed to Checkout var checkoutBtn = document.getElementById(‘zed-proceed-checkout’); if (checkoutBtn) { checkoutBtn.addEventListener(‘click’, function() { var cart = getCart(); if (!cart.length) { alert(‘Your cart is empty’); return; } var baseUrl = wcData.baseUrl || ‘https://wooname.online’; // For single item, use standard WooCommerce format: ?add-to-cart=VARIATION_ID if (cart.length === 1) { window.location.href = baseUrl + ‘/checkout/?add-to-cart=’ + cart[0].variantId + ‘&quantity=’ + cart[0].quantity; } else { // For multiple items, redirect to cart page window.location.href = baseUrl + ‘/cart/’; } }); console.log(‘Checkout button wired’); } // Cart icon var cartIcons = document.querySelectorAll(‘[cart-icon]’); for (var i = 0; i < cartIcons.length; i++) { cartIcons[i].style.cursor = 'pointer'; cartIcons[i].addEventListener('click', function(e) { e.preventDefault(); var drawer = document.querySelector('.cart-drawer'); var overlay = document.querySelector('.drawer-overlay'); if (drawer) drawer.classList.add('active'); if (overlay) overlay.classList.add('active'); document.body.style.overflow = 'hidden'; renderCart(); }); } updateCartBadge(); console.log('Cart initialized successfully'); } // Run when DOM is ready if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', init); } else { init(); } })();