<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, viewport-fit=cover">
  <meta name="dealzkart-android-package" content="com.dealzkart.app">
  <meta name="dealzkart-app-version" content="2.9">
  <meta name="dealzkart-app-build" content="20">
  <meta name="dealzkart-app-updated" content="2026-08-06">
  <script>
  (function(){try{if('scrollRestoration' in history)history.scrollRestoration='manual';scrollTo(0,0);if(document.documentElement)document.documentElement.scrollTop=0;if(document.body)document.body.scrollTop=0;}catch(e){}})();
  </script>
  <script>
  /* App Google return (Chrome handoff) — no APK rebuild needed for users */
  (function () {
    try {
      var u = new URL(window.location.href);
      var ct = u.searchParams.get("dd_app_ct");
      if (ct) {
        localStorage.setItem("dealzkart_pending_native_auth", String(ct).trim());
        localStorage.setItem("dealzkart_native_app", "1");
        u.searchParams.delete("dd_app_ct");
        var q = u.searchParams.toString();
        window.history.replaceState({}, "", u.pathname + (q ? "?" + q : "") + (u.hash || ""));
      }
    } catch (e) {}
    /* Cookie handoff: Android CookieManager may set __dd_ct before localStorage */
    try {
      if (localStorage.getItem("dealzkart_pending_native_auth")) return;
      var m = String(document.cookie || "").match(/(?:^|;\s*)__dd_ct=([^;]+)/);
      if (m && m[1]) {
        localStorage.setItem("dealzkart_pending_native_auth", decodeURIComponent(m[1]).trim());
        localStorage.setItem("dealzkart_native_app", "1");
      }
    } catch (e2) {}
  })();
  </script>
  <script src="/js/dd-console-guard.js"></script>
  <script defer src="/js/dd-no-zoom.js"></script>
  <meta name="google-play-app" content="app-id=com.dealzkart.app">
  <script defer src="/js/app-links.js"></script>
  <script defer src="/js/deep-link-origin.js"></script>
  <script defer src="/js/deep-link-trace.js"></script>
  <script defer src="/js/deep-link-router.js"></script>
  <script defer src="/js/dd-navigation.js?v=20260801scrollfix"></script>
  <script defer src="/js/dd-wait-hint.js?v=20260803restore"></script>
  <script defer src="/js/dd-notify-permission.js?v=8"></script>
  <script defer src="/js/dd-home-boot.js?v=20260601fast"></script>
  <script defer src="/js/dd-startup.js?v=20260805perf"></script>
  <script defer src="/js/dd-header-stack.js?v=6"></script>
  <script defer src="/js/dd-relevance-engine.js?v=20260725search"></script>
  <script defer src="/js/dd-smart-search.js?v=20260725search"></script>
  <script defer src="/js/dd-seo.js?v=20260806seo"></script>
  <script src="/js/dd-team-seo.js?v=20260722team4" data-mode="home"></script>
  <link rel="preload" href="/script.js?v=107" as="script">
  <link rel="alternate" hreflang="en-in" href="https://dealzkart.shop/">
  <link rel="alternate" hreflang="x-default" href="https://dealzkart.shop/">
  <meta name="theme-color" content="#0f172a">

  <!-- PRIMARY SEO TITLE -->
  <title>Dealzkart - Best Deals, Offers & Cashback in India | Up to 90% Off + ₹500 Cashback</title>

  <!-- META DESCRIPTION -->
  <meta name="description" content="Shop the best deals in India on Dealzkart. Lowest prices on electronics, fashion, mobiles & more. Earn up to ₹500 cashback, free spin rewards, and claim cashback on Amazon & Flipkart orders.">

  <!-- META KEYWORDS -->
  <meta name="keywords" content="deals India, cashback, spin and win, free spin, CashClaim, Amazon cashback, Flipkart cashback, lowest price, online shopping deals, flash sale, Dealzkart, coupon, daily deals">

  <!-- AUTHOR -->
  <meta name="author" content="Dealzkart">

  <!-- ROBOTS -->
  <meta name="robots" content="index, follow, max-image-preview:large, max-snippet:-1, max-video-preview:-1">
  <meta name="googlebot" content="index, follow, max-image-preview:large, max-snippet:-1">

  <!-- CANONICAL -->
  <link rel="canonical" href="https://dealzkart.shop/">

  <!-- LANGUAGE / GEO -->
  <meta name="language" content="English">
  <meta name="geo.region" content="IN">
  <meta name="geo.placename" content="India">

  <!-- PRELOAD CRITICAL ASSETS -->
  <link rel="preload" as="image" href="/favicon.png">
  <link rel="preload" as="image" href="/logo.png">

  <!-- FAVICON (Google / logo detection) -->
  <link rel="icon" type="image/png" href="/favicon.png">
  <link rel="shortcut icon" href="/favicon.png">
  <link rel="icon" type="image/png" sizes="32x32" href="/favicon.png">
  <link rel="icon" type="image/png" sizes="192x192" href="/favicon.png">
  <link rel="apple-touch-icon" href="/favicon.png">

  <!-- OPEN GRAPH (Facebook / WhatsApp) -->
  <meta property="og:title" content="Dealzkart - Best Deals, Offers & Cashback in India">
  <meta property="og:description" content="Shop top brands at lowest prices. Up to 90% off + up to ₹500 cashback. Free spin rewards & CashClaim for Amazon/Flipkart orders.">
  <meta property="og:image" content="https://dealzkart.shop/logo.png">
  <meta property="og:image:width" content="512">
  <meta property="og:image:height" content="512">
  <meta property="og:url" content="https://dealzkart.shop">
  <meta property="og:type" content="website">
  <meta property="og:site_name" content="Dealzkart">
  <meta property="og:locale" content="en_IN">

  <!-- TWITTER -->
  <meta name="twitter:card" content="summary_large_image">
  <meta name="twitter:title" content="Dealzkart - Best Deals & Discounts in India">
  <meta name="twitter:description" content="Shop top brands at lowest prices. Up to 90% off + cashback rewards. Electronics, fashion, gadgets & more.">
  <meta name="twitter:image" content="https://dealzkart.shop/logo.png">
  <meta name="twitter:site" content="@dealzkart">

  <!-- STRUCTURED DATA: Organization + OnlineStore -->
  <script type="application/ld+json">
  {
    "@context": "https://schema.org",
    "@type": ["Organization", "OnlineStore"],
    "name": "Dealzkart",
    "alternateName": "Dealzkart India",
    "url": "https://dealzkart.shop",
    "logo": "https://dealzkart.shop/logo.png",
    "image": "https://dealzkart.shop/logo.png",
    "description": "Dealzkart is India's AI-powered deal discovery platform. Shop the lowest prices on electronics, fashion, home & kitchen, mobiles, gadgets and more. Up to 90% off with up to ₹500 cashback, free spin rewards, and CashClaim for Amazon & Flipkart orders.",
    "foundingDate": "2024",
    "founder": {
      "@type": "Person",
      "name": "Manoselvan A",
      "jobTitle": "Founder, Startup Founder & Tech Content Creator",
      "url": "https://dealzkart.shop/founder",
      "sameAs": ["https://www.instagram.com/o2b_____/"],
      "telephone": "+919363316461",
      "knowsAbout": ["Technology", "Startups", "Tech content creation", "E-commerce", "Deal discovery"],
      "description": "Founder of Dealzkart and Sivion Technology Enterprises. Tech content creator. B.E. ECE.",
      "alumniOf": {
        "@type": "CollegeOrUniversity",
        "name": "Vel Tech Multi Tech Dr. Rangarajan Dr. Sakunthala Engineering College",
        "alternateName": "Vel Tech Multi Tech",
        "description": "An Autonomous Institution. Approved by AICTE, New Delhi and affiliated to Anna University, Chennai.",
        "url": "https://www.veltechmultitech.org/",
        "address": {
          "@type": "PostalAddress",
          "streetAddress": "42, Vel Tech Road, Vel Nagar",
          "addressLocality": "Avadi, Chennai",
          "postalCode": "600062",
          "addressRegion": "Tamil Nadu",
          "addressCountry": "IN"
        }
      },
      "hasCredential": {
        "@type": "EducationalOccupationalCredential",
        "credentialCategory": "Bachelor of Engineering",
        "name": "B.E. Electronics and Communication Engineering"
      }
    },
    "employee": [
      {
        "@type": "Person",
        "name": "Mohamed Ameer J",
        "jobTitle": "Editing Team Head",
        "alumniOf": {
          "@type": "CollegeOrUniversity",
          "name": "Vel Tech Multi Tech Dr. Rangarajan Dr. Sakunthala Engineering College",
          "url": "https://www.veltechmultitech.org/",
          "address": {
            "@type": "PostalAddress",
            "streetAddress": "42, Vel Tech Road, Vel Nagar",
            "addressLocality": "Avadi, Chennai",
            "postalCode": "600062",
            "addressRegion": "Tamil Nadu",
            "addressCountry": "IN"
          }
        },
        "hasCredential": {
          "@type": "EducationalOccupationalCredential",
          "name": "B.E. Electronics and Communication Engineering"
        }
      },
      {
        "@type": "Person",
        "name": "Pooja Patel N",
        "jobTitle": "Finance Advisor & UI/UX Designer",
        "alumniOf": {
          "@type": "CollegeOrUniversity",
          "name": "Vel Tech Multi Tech Dr. Rangarajan Dr. Sakunthala Engineering College",
          "url": "https://www.veltechmultitech.org/",
          "address": {
            "@type": "PostalAddress",
            "addressLocality": "Avadi, Chennai",
            "addressRegion": "Tamil Nadu",
            "addressCountry": "IN"
          }
        },
        "hasCredential": {
          "@type": "EducationalOccupationalCredential",
          "name": "B.E. Biomedical Engineering"
        }
      }
    ],
    "areaServed": { "@type": "Country", "name": "India" },
    "currenciesAccepted": "INR",
    "paymentAccepted": "UPI, Credit Card, Debit Card, Net Banking",
    "priceRange": "₹99 - ₹99999",
    "hasMerchantReturnPolicy": {
      "@type": "MerchantReturnPolicy",
      "applicableCountry": "IN",
      "returnPolicyCategory": "https://schema.org/MerchantReturnFiniteReturnWindow",
      "merchantReturnDays": 7,
      "returnMethod": "https://schema.org/ReturnByMail"
    },
    "shippingDetails": {
      "@type": "OfferShippingDetails",
      "shippingDestination": { "@type": "DefinedRegion", "addressCountry": "IN" },
      "shippingRate": { "@type": "MonetaryAmount", "value": "0", "currency": "INR" }
    }
  }
  </script>

  <!-- BREADCRUMB SCHEMA -->
  <script type="application/ld+json">
  {
    "@context": "https://schema.org",
    "@type": "BreadcrumbList",
    "itemListElement": [{
      "@type": "ListItem",
      "position": 1,
      "name": "Home",
      "item": "https://dealzkart.shop/"
    }]
  }
  </script>

  <!-- WEBSITE SEARCH BOX (Google sitelinks search) -->
  <script type="application/ld+json">
  {
    "@context": "https://schema.org",
    "@type": "WebSite",
    "name": "Dealzkart",
    "url": "https://dealzkart.shop/",
    "potentialAction": {
      "@type": "SearchAction",
      "target": {
        "@type": "EntryPoint",
        "urlTemplate": "https://dealzkart.shop/search?q={search_term_string}"
      },
      "query-input": "required name=search_term_string"
    }
  }
  </script>

  <!-- FAQ SCHEMA (boosts rich results for common questions) -->
  <script type="application/ld+json">
  {
    "@context": "https://schema.org",
    "@type": "FAQPage",
    "mainEntity": [
      {
        "@type": "Question",
        "name": "What is Dealzkart?",
        "acceptedAnswer": { "@type": "Answer", "text": "Dealzkart is India's AI-powered deal discovery platform that helps you find the lowest prices on electronics, fashion, home & kitchen, mobiles, gadgets, and more. Get up to 90% off with up to ₹500 cashback rewards." }
      },
      {
        "@type": "Question",
        "name": "How does Dealzkart Spin & Win work?",
        "acceptedAnswer": { "@type": "Answer", "text": "Dealzkart Spin lets you play a free spin to win cashback rewards credited to your wallet. Grow your streak for more spin unlocks. Visit dealzkart.shop/spin to play." }
      },
      {
        "@type": "Question",
        "name": "How do I claim cashback with CashClaim?",
        "acceptedAnswer": { "@type": "Answer", "text": "CashClaim lets you submit Amazon or Flipkart order details and claim cashback up to ₹500. Track your claim and get paid to UPI. Start at dealzkart.shop/cashclaim." }
      },
      {
        "@type": "Question",
        "name": "How does cashback work on Dealzkart?",
        "acceptedAnswer": { "@type": "Answer", "text": "When you shop deals on Dealzkart or claim via CashClaim, cashback is credited to your Dealzkart wallet. You can withdraw to UPI or use it on future purchases. Many products show up to ₹500 cashback." }
      },
      {
        "@type": "Question",
        "name": "Does Dealzkart offer free shipping?",
        "acceptedAnswer": { "@type": "Answer", "text": "Yes, Dealzkart offers free shipping on eligible orders across India. Delivery typically takes 2-7 business days depending on your location." }
      },
      {
        "@type": "Question",
        "name": "Is Dealzkart safe to shop from?",
        "acceptedAnswer": { "@type": "Answer", "text": "Yes. Dealzkart helps you discover trusted partner deals (including Amazon-style offers). Transactions follow partner checkout security, and CashClaim payouts go to your verified UPI." }
      }
    ]
  }
  </script>

  <!-- Product + category URLs: sitemap-index.xml + sitemap-products.xml (Search Console) -->

  <noscript>
    <nav aria-label="Dealzkart categories" style="padding:12px;font-family:sans-serif;">
      <p><strong>Dealzkart</strong> — lowest price deals + up to ₹500 cashback in India</p>
      <ul>
        <li><a href="https://dealzkart.shop/">Home</a></li>
        <li><a href="https://dealzkart.shop/deals">Today&apos;s deals</a></li>
        <li><a href="https://dealzkart.shop/spin">Spin &amp; win cashback</a></li>
        <li><a href="https://dealzkart.shop/cashclaim">CashClaim Amazon &amp; Flipkart cashback</a></li>
        <li><a href="https://dealzkart.shop/c/electronics">Electronics</a></li>
        <li><a href="https://dealzkart.shop/c/mobiles">Mobiles</a></li>
        <li><a href="https://dealzkart.shop/c/fashion">Fashion</a></li>
        <li><a href="https://dealzkart.shop/c/home-kitchen">Home &amp; kitchen</a></li>
      </ul>
    </nav>
  </noscript>

  <!-- CSS -->
  <link rel="stylesheet" href="/styles.css?v=58">
  <link rel="stylesheet" href="/components/design-tokens.css?v=1">
  <link rel="stylesheet" href="/css/dd-product-cards.css?v=7">
  <link rel="stylesheet" href="/css/dd-layout-grid.css?v=4">
  <link rel="stylesheet" href="/css/dd-pdp-premium.css?v=10">
  <link rel="stylesheet" href="/css/dd-luxury-store.css?v=15">
  <link rel="stylesheet" href="/css/dd-design-polish.css?v=6">
  <link rel="stylesheet" href="/css/dd-responsive.css?v=8">
  <link rel="stylesheet" href="/css/dd-hero-responsive.css?v=4">
  <link rel="stylesheet" href="/css/dd-store-calm.css?v=3">
  <link rel="stylesheet" href="/css/dd-notify-permission.css?v=4">
  <link rel="stylesheet" href="/css/dd-discovery.css?v=3">
  <link rel="stylesheet" href="/css/dd-breakpoints.css?v=7">
  <link rel="stylesheet" href="/css/dd-components-production.css?v=20">
  <link rel="stylesheet" href="/css/dd-help-panel.css?v=4">
  <link rel="stylesheet" href="/css/dd-bug-report.css?v=1">
  <link rel="stylesheet" href="/css/dd-cashclaim.css?v=12">
  <link rel="stylesheet" href="/css/dd-cashclaim-return-protection.css?v=2">
  <link rel="stylesheet" href="/css/dd-cashclaim-detail.css?v=4">
  <link rel="stylesheet" href="/css/dd-cashclaim-submit.css?v=5">
  <link rel="stylesheet" href="/css/dd-cashclaim-claims.css?v=3">
  <link rel="stylesheet" href="/css/dd-cashclaim-notify.css?v=2">
  <link rel="stylesheet" href="/css/dd-cashclaim-activity.css?v=1">
  <link rel="stylesheet" href="/css/dd-device-lock.css?v=4">
  <link rel="stylesheet" href="/css/dd-app-menu.css?v=12">
  <link rel="stylesheet" href="/css/dd-settings-layout.css?v=11">
  <link rel="stylesheet" href="/css/dd-product-request-history.css?v=2">

  <script>
    (function () {
      try {
        if (localStorage.getItem("dealzkart_native_app") === "1") {
          document.documentElement.classList.add("dd-native-app");
        }
      } catch (e) {}
    })();
  </script>

  <!-- Guest mode: body stays visible; logged-in flow still initializes after Firebase auth -->
  <style>
    /* Auth boot overlay REMOVED — was blocking the app as a stuck flash screen */
    #authBootOverlay,
    #homeEntryPendulumRoot,
    .home-entry-pendulum-overlay {
      display: none !important;
      visibility: hidden !important;
      pointer-events: none !important;
      opacity: 0 !important;
      z-index: -1 !important;
    }
    body.dd-auth-boot-hidden {
      overflow: auto !important;
    }
    body.dd-auth-boot-hidden .main-content,
    body.dd-auth-boot-hidden .top-header,
    body.dd-auth-boot-hidden .bottom-nav {
      pointer-events: auto !important;
    }
    .dd-startup-skeleton { padding: 12px 12px 24px; }
    .dd-feed-page-skeleton {
      padding: 10px 10px 20px;
      overflow-anchor: none;
      min-height: 55vh;
    }
    .dd-feed-page-skeleton__hero {
      height: 140px;
      border-radius: 14px;
      margin-bottom: 14px;
      background: linear-gradient(90deg, #eef2f7 25%, #f8fafc 50%, #eef2f7 75%);
      background-size: 200% 100%;
      animation: ddSkelShimmer 1.2s ease-in-out infinite;
    }
    .dd-feed-page-skeleton__hero--deals { height: 120px; }
    .dd-feed-page-skeleton__promo-strip {
      height: 96px;
      border-radius: 14px;
      margin: 0 0 10px;
      background: linear-gradient(90deg, #eef2f7 25%, #f8fafc 50%, #eef2f7 75%);
      background-size: 200% 100%;
      animation: ddSkelShimmer 1.2s ease-in-out infinite;
    }
    .dd-feed-page-skeleton__row { display: flex; gap: 8px; overflow: hidden; margin-bottom: 16px; }
    .dd-feed-page-skeleton__chip {
      flex: 0 0 72px;
      height: 32px;
      border-radius: 999px;
      background: #e2e8f0;
    }
    .dd-feed-page-skeleton__sec { margin-bottom: 18px; }
    .dd-feed-page-skeleton__sec-head {
      height: 18px;
      width: 42%;
      border-radius: 8px;
      margin-bottom: 12px;
      background: #e2e8f0;
    }
    .dd-feed-page-skeleton__sec-head--short { width: 28%; }
    .dd-feed-page-skeleton__grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 12px;
    }
    .dd-feed-page-skeleton__card,
    .dd-feed-page-skeleton__rail-card {
      border-radius: 12px;
      padding: 10px;
      background: #fff;
      border: 1px solid #e2e8f0;
    }
    .dd-feed-page-skeleton__thumb {
      height: 92px;
      border-radius: 10px;
      margin-bottom: 10px;
      background: linear-gradient(90deg, #eef2f7 25%, #f8fafc 50%, #eef2f7 75%);
      background-size: 200% 100%;
      animation: ddSkelShimmer 1.2s ease-in-out infinite;
    }
    .dd-feed-page-skeleton__line {
      height: 12px;
      border-radius: 6px;
      margin-bottom: 8px;
      background: #e2e8f0;
    }
    .dd-feed-page-skeleton__line--short { width: 55%; margin-bottom: 0; }
    .dd-feed-page-skeleton__rail {
      display: flex;
      gap: 10px;
      overflow: hidden;
    }
    .dd-feed-page-skeleton__rail-card { flex: 0 0 42%; min-width: 0; }
    html.dd-feed-scroll-lock,
    html.dd-feed-scroll-lock body {
      overflow-anchor: none;
    }
    html,
    body {
      overflow-anchor: none;
    }
    #homeSmartContainer,
    #dealz-container,
    .page.active,
    .site-footer {
      overflow-anchor: none;
    }
    body.dd-feed-page-loading .page.active.dd-page-feed-loading {
      min-height: 50vh;
    }
    /* Hide legacy home chrome while skeleton is the first paint */
    #home:has(.dd-feed-page-skeleton) #resultCount,
    #home:has(.dd-feed-page-skeleton) #multiSection,
    #home:has(.dd-feed-page-skeleton) #bigProductRow,
    #home:has(.dd-feed-page-skeleton) #homeCashKaroLayout {
      display: none !important;
    }
    .page.active.dd-page-feed-ready {
      animation: ddFeedPageIn 0.32s ease;
    }
    @keyframes ddFeedPageIn {
      from { opacity: 0.55; }
      to { opacity: 1; }
    }
    .dd-startup-skeleton__hero {
      height: 140px; border-radius: 14px; margin-bottom: 14px;
      background: linear-gradient(90deg, rgba(255,255,255,.06) 25%, rgba(255,255,255,.12) 50%, rgba(255,255,255,.06) 75%);
      background-size: 200% 100%; animation: ddSkelShimmer 1.2s ease-in-out infinite;
    }
    .dd-startup-skeleton__row { display: flex; gap: 8px; overflow: hidden; margin-bottom: 16px; }
    .dd-startup-skeleton__chip {
      flex: 0 0 72px; height: 32px; border-radius: 999px;
      background: rgba(255,255,255,.08);
    }
    .dd-startup-skeleton__grid {
      display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px;
    }
    #homeSmartContainer .dd-startup-skeleton {
      overflow-anchor: none;
    }
    @keyframes ddSkelShimmer {
      0% { background-position: 200% 0; }
      100% { background-position: -200% 0; }
    }
  </style>
  
  <!-- FORCE BOTTOM NAV VISIBLE - INLINE STYLES -->
  <style>
    .bottom-nav {
      display: flex !important;
      visibility: visible !important;
      opacity: 1 !important;
      position: fixed !important;
      bottom: 0 !important;
      left: 0 !important;
      right: 0 !important;
      width: 100% !important;
      /* Above #appLoader so tabs stay tappable during load (Instagram-style) */
      z-index: 10000030 !important;
      pointer-events: auto !important;
      /* Keep tabs interactive during momentum / inertial scroll */
      touch-action: manipulation;
      -webkit-user-select: none;
      user-select: none;
    }
    .bottom-nav .bottom-item {
      pointer-events: auto !important;
      touch-action: manipulation;
      -webkit-tap-highlight-color: transparent;
      -webkit-user-select: none;
      user-select: none;
    }
    .bottom-nav .bottom-item.dd-nav-press {
      transform: scale(0.96);
      opacity: 0.85;
    }
    
    @media (min-width: 768px) {
      .bottom-nav {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
      }
    }
    
    @media (min-width: 1024px) {
      .bottom-nav {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
      }
    }
    
    @media (min-width: 1366px) {
      .bottom-nav {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
      }
    }
    
    /* Cover all possible laptop sizes */
    @media (min-width: 768px) and (max-width: 1920px) {
      .bottom-nav {
        display: flex !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: fixed !important;
        bottom: 0 !important;
      }
    }
    
    /* Ensure body doesn't cut it off */
    body {
      padding-bottom: 70px !important;
      overflow-x: hidden !important;
    }
    
    html {
      overflow-x: hidden !important;
    }

    /* Keep all bottom nav items equally visible. Access control stays in JS routing. */
    body.guest-nav-tight .bottom-item[data-page="spin"],
    body.guest-nav-tight .bottom-item[data-page="cashclaim"],
    body.guest-nav-tight .bottom-item[data-page="account"] {
      opacity: 1;
    }
    body.guest-nav-expanded .bottom-item[data-page="spin"],
    body.guest-nav-expanded .bottom-item[data-page="cashclaim"],
    body.guest-nav-expanded .bottom-item[data-page="account"] {
      opacity: 1;
    }
  </style>

  <!-- Fonts / icons: preconnect helps Android WebView cold starts; Font Awesome is same-origin for CDN-blocked WebViews -->
  <link rel="dns-prefetch" href="https://fonts.gstatic.com">
  <link rel="preconnect" href="https://fonts.googleapis.com">
  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>

  <!-- GOOGLE FONT (display=swap avoids invisible text during load) -->
  <link rel="preload" as="style" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Outfit:wght@500;600;700;800&display=swap" onload="this.onload=null;this.rel='stylesheet'">
  <noscript><link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Outfit:wght@500;600;700;800&display=swap"></noscript>

  <!-- FONT AWESOME (self-hosted under /vendor — paths in CSS resolve to ../webfonts/) -->
  <link rel="stylesheet" href="/vendor/font-awesome/css/all.min.css">
</head>

<body>

<div id="global-loader"></div>

<!-- Notification permission — first launch (native app) -->
<div id="ddNotifyOnboard" class="dd-notify-shell dd-notify-shell--onboard" aria-hidden="true" role="dialog" aria-modal="true" aria-labelledby="ddNotifyOnboardTitle">
  <div class="dd-notify-card">
    <div class="dd-notify-anim" aria-hidden="true">
      <span class="dd-notify-anim__ring"></span>
      <span class="dd-notify-anim__ring"></span>
      <span class="dd-notify-anim__bell">🔔</span>
    </div>
    <p class="dd-notify-eyebrow">Stay in the loop</p>
    <h2 id="ddNotifyOnboardTitle" class="dd-notify-title">Enable deal alerts</h2>
    <p class="dd-notify-msg">Dealzkart uses notifications for cashback, wallet updates, withdrawals, and new deals — so you never miss a save.</p>
    <ul class="dd-notify-benefits">
      <li><span>🔥</span><span>Instant deal &amp; price-drop alerts</span></li>
      <li><span>💰</span><span>Cashback &amp; wallet credit updates</span></li>
      <li><span>🎁</span><span>Spin reminders &amp; reward unlocks</span></li>
      <li><span>📦</span><span>Order &amp; partner checkout status</span></li>
      <li><span>🔔</span><span>Withdrawal confirmations &amp; account security</span></li>
    </ul>
    <div class="dd-notify-actions">
      <button type="button" id="ddNotifyEnableBtn" class="dd-notify-btn dd-notify-btn--primary">Enable notifications</button>
      <button type="button" id="ddNotifyBrowseBtn" class="dd-notify-btn dd-notify-btn--ghost">Browse deals first</button>
    </div>
  </div>
</div>

<!-- Discovery overlay DISABLED — was blank dark screen blocking every page -->
<div id="ddDiscoveryOverlay" class="dd-discovery-shell" aria-hidden="true" hidden style="display:none!important"></div>

<!-- Notification required — rewards / login / withdraw -->
<div id="ddNotifyRequired" class="dd-notify-shell" aria-hidden="true" role="dialog" aria-modal="true" aria-labelledby="ddNotifyRequiredTitle">
  <div class="dd-notify-card">
    <div class="dd-notify-anim" aria-hidden="true">
      <span class="dd-notify-anim__ring"></span>
      <span class="dd-notify-anim__bell">🔔</span>
    </div>
    <h2 id="ddNotifyRequiredTitle" class="dd-notify-title">Notifications required</h2>
    <p class="dd-notify-msg">Enable alerts to unlock spins, cashback, wallet withdrawals, login, and reward notifications.</p>
    <p id="ddNotifySettingsHint" class="dd-notify-settings-hint" hidden>
      <strong>Android settings:</strong> Settings → Apps → Dealzkart → Notifications → Allow
    </p>
    <div class="dd-notify-actions">
      <button type="button" id="ddNotifyRequiredEnableBtn" class="dd-notify-btn dd-notify-btn--primary">Enable notifications</button>
      <button type="button" id="ddNotifyRequiredBrowseBtn" class="dd-notify-btn dd-notify-btn--ghost">Keep browsing</button>
      <button type="button" id="ddNotifyExitBtn" class="dd-notify-btn dd-notify-btn--danger">Exit app</button>
    </div>
  </div>
</div>

<!-- One-time rewards promo (spin · streak · referrals — checkout narrative) -->
<div id="rewardsHubPromo" class="rewards-hub-promo" hidden role="dialog" aria-modal="true" aria-labelledby="rewardsHubPromoHeadline">
  <div class="rewards-hub-promo__backdrop" onclick="if(typeof dismissRewardsHubPromo==='function')dismissRewardsHubPromo(false)"></div>
  <div class="rewards-hub-promo__panel">
    <button type="button" class="rewards-hub-promo__close" onclick="if(typeof dismissRewardsHubPromo==='function')dismissRewardsHubPromo(false)" aria-label="Close">&times;</button>
    <p class="rewards-hub-promo__eyebrow">New on Dealzkart</p>
    <h2 id="rewardsHubPromoHeadline" class="rewards-hub-promo__title">Earn spins as you shop &amp; share.</h2>
    <p class="rewards-hub-promo__tagline">Share deals, complete partner checkouts, invite friends &amp; collect tokens — your streak shows how active you are in the program.</p>
    <div class="rewards-hub-promo__grid">
      <article class="rewards-hub-promo__tile rewards-hub-promo__tile--spin">
        <span class="rewards-hub-promo__tile-icon" aria-hidden="true">🎡</span>
        <h3>Prize wheel</h3>
        <p class="rewards-hub-promo__tile-slogan">Checkout-powered spins — wallet rewards that land fast.</p>
      </article>
      <article class="rewards-hub-promo__tile rewards-hub-promo__tile--streak">
        <span class="rewards-hub-promo__tile-icon" aria-hidden="true">🔥</span>
        <h3>Shopping streak</h3>
        <p class="rewards-hub-promo__tile-slogan">Repeat purchases keep your streak alive — VIP unlock rhythm.</p>
      </article>
      <article class="rewards-hub-promo__tile rewards-hub-promo__tile--ref">
        <span class="rewards-hub-promo__tile-icon" aria-hidden="true">🎁</span>
        <h3>Referral codes</h3>
        <p class="rewards-hub-promo__tile-slogan">Share your code — friends shop, you stack tokens.</p>
      </article>
    </div>
    <p class="rewards-hub-promo__fine">Always finish purchase through our partner links so orders qualify.</p>
    <div class="rewards-hub-promo__actions">
      <button type="button" class="rewards-hub-promo__cta primary-btn" onclick="if(typeof dismissRewardsHubPromo==='function')dismissRewardsHubPromo(true)">Open Rewards Hub</button>
      <button type="button" class="rewards-hub-promo__ghost secondary-btn" onclick="if(typeof dismissRewardsHubPromo==='function')dismissRewardsHubPromo(false)">Maybe later</button>
    </div>
  </div>
</div>

<!-- Spin page — streak & rewards education (daily on Rewards hub visit) -->
<div id="spinRewardsEdu" class="spin-rewards-edu" hidden role="dialog" aria-modal="true" aria-labelledby="spinRewardsEduTitle">
  <div class="spin-rewards-edu__backdrop" data-spin-edu-dismiss="0"></div>
  <div class="spin-rewards-edu__panel">
    <button type="button" class="spin-rewards-edu__close" data-spin-edu-dismiss="0" aria-label="Close">&times;</button>
    <div class="spin-rewards-edu__scroll">
    <p class="spin-rewards-edu__eyebrow">How rewards work</p>
    <h2 id="spinRewardsEduTitle" class="spin-rewards-edu__title">🔥 Grow Your Dealzkart Streak</h2>
    <p class="spin-rewards-edu__subtitle">Complete simple activities daily to unlock rewards and spins.</p>

    <ul class="spin-rewards-edu__steps">
      <li class="spin-rewards-edu__step">
        <span class="spin-rewards-edu__step-icon" aria-hidden="true">📤</span>
        <div class="spin-rewards-edu__step-body">
          <h3 class="spin-rewards-edu__step-title">Share Products</h3>
          <p class="spin-rewards-edu__step-text">Share products with friends to increase your streak.</p>
        </div>
        <span class="spin-rewards-edu__step-pill">+1</span>
      </li>
      <li class="spin-rewards-edu__step">
        <span class="spin-rewards-edu__step-icon" aria-hidden="true">🛒</span>
        <div class="spin-rewards-edu__step-body">
          <h3 class="spin-rewards-edu__step-title">Shop Through Dealzkart</h3>
          <p class="spin-rewards-edu__step-text">Purchase products through Dealzkart partner links.</p>
        </div>
        <span class="spin-rewards-edu__step-pill spin-rewards-edu__step-pill--hot">+3</span>
      </li>
      <li class="spin-rewards-edu__step">
        <span class="spin-rewards-edu__step-icon" aria-hidden="true">🎡</span>
        <div class="spin-rewards-edu__step-body">
          <h3 class="spin-rewards-edu__step-title">Unlock Daily Rewards</h3>
          <p class="spin-rewards-edu__step-text">Maintain streaks to unlock spins, cashback, and rewards.</p>
        </div>
        <span class="spin-rewards-edu__step-pill spin-rewards-edu__step-pill--unlock">Unlock</span>
      </li>
    </ul>

    <div class="spin-rewards-edu__progress" aria-hidden="true">
      <div class="spin-rewards-edu__progress-track">
        <span class="spin-rewards-edu__progress-seg spin-rewards-edu__progress-seg--share" style="--w: 25%"></span>
        <span class="spin-rewards-edu__progress-seg spin-rewards-edu__progress-seg--shop" style="--w: 50%"></span>
        <span class="spin-rewards-edu__progress-seg spin-rewards-edu__progress-seg--streak" style="--w: 25%"></span>
      </div>
      <div class="spin-rewards-edu__progress-labels">
        <span>📤 Share = +1 streak</span>
        <span>🛒 Purchase = +3 streak</span>
        <span>🔥 Maintain streak = better rewards</span>
      </div>
    </div>

    <p class="spin-rewards-edu__trust">Real wallet rewards · Fair unlocks · Partner checkout counts</p>
    </div>

    <div class="spin-rewards-edu__footer">
      <div class="spin-rewards-edu__actions">
        <button type="button" class="spin-rewards-edu__btn spin-rewards-edu__btn--ghost" data-spin-edu-dismiss="0">Got it</button>
        <button type="button" class="spin-rewards-edu__btn spin-rewards-edu__btn--primary" data-spin-edu-dismiss="1">Start Earning</button>
      </div>
    </div>
  </div>
</div>

<noscript>
  <p style="text-align:center;color:red;">
    This site requires JavaScript to work.
  </p>
</noscript>

<!-- Amazon-style Top Header (primary row + secondary strip) -->
  <header class="top-header" role="banner">
    <div class="header-container header-container--primary">
      <div class="logo-container logo" id="logoClickable">
        <img src="/favicon.png" alt="dealzkart" class="logo-img" width="40" height="40" loading="lazy" decoding="async">
        <span class="logo-text">dealzkart</span>
      </div>

      <div class="search-container">
        <button type="button" class="search-dept-btn" id="searchDeptBtn" aria-label="All categories" title="All categories">All</button>
        <div class="search-wrapper">
          <input type="text" id="topSearchInput" placeholder="Search dealzkart" autocomplete="off">
          <div id="suggestionsBox" class="suggestions-box"></div>
        </div>
        <button type="button" id="topSearchVoice" class="search-voice-btn mic-btn" aria-label="Voice search" title="Voice search"><i class="fas fa-microphone" aria-hidden="true"></i></button>
        <button type="button" class="search-btn" id="topSearchBtn" aria-label="Search"><i class="fas fa-search" aria-hidden="true"></i></button>
        <div id="voiceStatus" class="voice-status"><i class="fas fa-microphone" aria-hidden="true"></i> Listening...</div>
      </div>

      <div class="custom-menu header-links">
        <div class="nav-link header-account-teaser" data-page="account">
          <span class="header-account-teaser__small">Hello</span>
          <span class="header-account-teaser__main">Account &amp; Lists</span>
          <span id="ddHeaderNotifBadge" class="dd-header-notif-badge" hidden aria-hidden="true"></span>
        </div>
        <div class="nav-link header-cart-nav" data-page="cart" title="Cart">
          <span class="header-cart-inner">
            <span class="header-cart-icon-wrap" aria-hidden="true"><i class="fas fa-cart-shopping"></i></span>
            <span class="header-cart-label">Cart</span>
          </span>
        </div>
        <div class="menu-btn" id="menuBtn" onclick="toggleMenu()" aria-label="More menu"><i class="fas fa-bars" aria-hidden="true"></i></div>
      </div>
    </div>

    <nav class="top-header-subnav" aria-label="Quick navigation">
      <div class="top-header-subnav__inner">
        <button type="button" class="top-header-subnav__all" onclick="toggleMenu()" aria-label="Open menu">
          <i class="fas fa-bars" aria-hidden="true"></i><span>All</span>
        </button>
        <div class="top-header-subnav__links">
          <span class="nav-link top-header-subnav__link" data-page="home">Home</span>
          <span class="nav-link top-header-subnav__link" data-page="deals">Today&apos;s Deals</span>
          <span class="nav-link top-header-subnav__link" data-page="spin-history">Spin &amp; Rewards</span>
          <span class="nav-link top-header-subnav__link" data-page="faq">Help</span>
          <span class="nav-link top-header-subnav__link" data-page="about">About</span>
        </div>
      </div>
    </nav>
  </header>

  <div class="site-deal-trust-bar" id="siteDealTrustBar" role="note">
    <div class="site-deal-trust-bar__inner">
      <span class="site-deal-trust-bar__pulse" aria-hidden="true"></span>
      <span class="site-deal-trust-bar__text" id="siteDealTrustBarText">Live partner deals · prices shown from retailer listings · today&apos;s window resets at midnight</span>
      <button type="button" class="site-deal-trust-bar__close" id="siteDealTrustBarClose" aria-label="Dismiss message">×</button>
    </div>
  </div>

  <div id="menuBackdrop" class="app-menu-backdrop" aria-hidden="true"></div>
  <nav id="menuDropdown" class="menu-dropdown app-menu-drawer" aria-label="Dealzkart menu" aria-hidden="true">
    <header class="app-menu-drawer__head">
      <div class="app-menu-drawer__brand-wrap">
        <img src="/logo.png" alt="" width="44" height="44" loading="lazy">
        <div class="app-menu-drawer__brand">
          dealzkart
          <small>India · deals &amp; rewards</small>
        </div>
      </div>
      <button type="button" class="app-menu-drawer__close" id="appMenuCloseBtn" aria-label="Close menu">&times;</button>
    </header>
    <div class="app-menu-panels-track" id="appMenuPanelsTrack">
      <div class="app-menu-panel" id="appMenuMainPanel">
    <div class="app-menu-drawer__scroll">
      <p class="app-menu-section-label">Shop</p>
      <button type="button" class="app-menu-row menu-dropdown-item" data-page="home">
        <span class="app-menu-row__icon"><i class="fas fa-home" aria-hidden="true"></i></span>
        <span class="app-menu-row__label">Home</span>
      </button>
      <button type="button" class="app-menu-row menu-dropdown-item" data-page="deals">
        <span class="app-menu-row__icon"><i class="fas fa-tags" aria-hidden="true"></i></span>
        <span class="app-menu-row__label">Today&apos;s Deals</span>
      </button>
      <button type="button" class="app-menu-row menu-dropdown-item" data-page="cart">
        <span class="app-menu-row__icon"><i class="fas fa-shopping-cart" aria-hidden="true"></i></span>
        <span class="app-menu-row__label">Cart</span>
      </button>

      <p class="app-menu-section-label">Account</p>
      <button type="button" class="app-menu-row menu-dropdown-item" data-page="account">
        <span class="app-menu-row__icon"><i class="fas fa-user" aria-hidden="true"></i></span>
        <span class="app-menu-row__label">Your Account</span>
      </button>
      <button type="button" class="app-menu-row menu-dropdown-item" data-page="spin-history">
        <span class="app-menu-row__icon"><i class="fas fa-sync-alt" aria-hidden="true"></i></span>
        <span class="app-menu-row__label">Spin &amp; Rewards</span>
      </button>
      <button type="button" class="app-menu-row menu-dropdown-item" data-page="refer">
        <span class="app-menu-row__icon"><i class="fas fa-gift" aria-hidden="true"></i></span>
        <span class="app-menu-row__label">Refer &amp; Earn</span>
      </button>
      <button type="button" class="app-menu-row menu-dropdown-item" data-menu-view="settings">
        <span class="app-menu-row__icon"><i class="fas fa-cog" aria-hidden="true"></i></span>
        <span class="app-menu-row__label">Settings</span>
      </button>

      <p class="app-menu-section-label">Support</p>
      <button type="button" class="app-menu-row menu-dropdown-item app-menu-row--help app-menu-item--help" data-page="faq">
        <span class="app-menu-row__icon"><i class="fas fa-headset" aria-hidden="true"></i></span>
        <span class="app-menu-row__label">Help Center</span>
      </button>
      <button type="button" class="app-menu-row menu-dropdown-item" data-page="about">
        <span class="app-menu-row__icon"><i class="fas fa-info-circle" aria-hidden="true"></i></span>
        <span class="app-menu-row__label">About Dealzkart</span>
      </button>

      <p class="app-menu-section-label">Legal</p>
      <button type="button" class="app-menu-row menu-dropdown-item" data-page="terms">
        <span class="app-menu-row__icon"><i class="fas fa-file-contract" aria-hidden="true"></i></span>
        <span class="app-menu-row__label">Terms &amp; Conditions</span>
      </button>
      <button type="button" class="app-menu-row menu-dropdown-item" data-page="terms" data-help-section="legal">
        <span class="app-menu-row__icon"><i class="fas fa-shield-alt" aria-hidden="true"></i></span>
        <span class="app-menu-row__label">Privacy Policy</span>
      </button>
    </div>
      </div>

      <div class="app-menu-panel app-menu-settings-panel" id="appMenuSettingsPanel">
        <div class="app-menu-drawer__scroll app-menu-settings-scroll">
          <button type="button" class="app-menu-settings-back" id="appMenuSettingsBack">
            <i class="fas fa-arrow-left" aria-hidden="true"></i> Back to menu
          </button>
          <header class="settings-hero app-menu-settings-hero">
            <h2 class="settings-hero__title">Settings</h2>
            <p class="settings-hero__lead">Security, payout PIN, and account control.</p>
          </header>
          <div class="settings-list">
            <button type="button" class="settings-list__item" id="settingsSetQrPinBtn">
              <span class="settings-list__icon"><i class="fas fa-lock" aria-hidden="true"></i></span>
              <span class="settings-list__label">Set QR change PIN</span>
              <span class="settings-list__chevron" aria-hidden="true"><i class="fas fa-chevron-right"></i></span>
            </button>
            <button type="button" class="settings-list__item" id="settingsDeviceResetBtn">
              <span class="settings-list__icon"><i class="fas fa-mobile-alt" aria-hidden="true"></i></span>
              <span class="settings-list__label">Device reset request</span>
              <span class="settings-list__chevron" aria-hidden="true"><i class="fas fa-chevron-right"></i></span>
            </button>
            <button type="button" class="settings-list__item" id="settingsReportBugBtn">
              <span class="settings-list__icon"><i class="fas fa-bug" aria-hidden="true"></i></span>
              <span class="settings-list__label">🐞 Report a Bug</span>
              <span class="settings-list__chevron" aria-hidden="true"><i class="fas fa-chevron-right"></i></span>
            </button>
            <button type="button" class="settings-list__item settings-list__item--danger" id="settingsDeleteAccountBtn">
              <span class="settings-list__icon"><i class="fas fa-user-slash" aria-hidden="true"></i></span>
              <span class="settings-list__label">Delete account permanently</span>
              <span class="settings-list__chevron" aria-hidden="true"><i class="fas fa-chevron-right"></i></span>
            </button>
            <button type="button" class="settings-list__item settings-list__item--danger settings-list__item--logout" id="settingsLogoutBtn">
              <span class="settings-list__icon"><i class="fas fa-sign-out-alt" aria-hidden="true"></i></span>
              <span class="settings-list__label">Log out</span>
              <span class="settings-list__chevron" aria-hidden="true"><i class="fas fa-chevron-right"></i></span>
            </button>
          </div>

          <div id="settingsPreferencesRoot">
            <section class="settings-section" aria-labelledby="settingsShoppingTitle">
              <h3 class="settings-section__title" id="settingsShoppingTitle">🛍️ Shopping Preferences</h3>
              <div class="settings-card">
                <label class="settings-field" for="prefPreferredPlatform">
                  <span class="settings-field__label">Preferred Shopping Platform</span>
                  <select id="prefPreferredPlatform" class="settings-select"></select>
                </label>
              </div>
              <div class="settings-card">
                <p class="settings-field__label settings-field__label--block">Favorite Categories</p>
                <p class="settings-field__hint">Select all that apply — saved automatically.</p>
                <div id="prefCategoryGrid" class="settings-chip-grid"></div>
              </div>
              <div class="settings-card settings-card--row">
                <div class="settings-row__text">
                  <span class="settings-row__title">Deal Personalization</span>
                  <span class="settings-row__desc">Show more deals based on your preferred shopping categories.</span>
                </div>
                <label class="settings-switch">
                  <input type="checkbox" id="prefDealPersonalization" checked />
                  <span class="settings-switch__track" aria-hidden="true"></span>
                </label>
              </div>
              <div class="settings-card settings-card--row">
                <div class="settings-row__text">
                  <span class="settings-row__title">Platform Priority</span>
                  <span class="settings-row__desc">Prefer deals from your selected shopping platform whenever available.</span>
                </div>
                <label class="settings-switch">
                  <input type="checkbox" id="prefPlatformPriority" checked />
                  <span class="settings-switch__track" aria-hidden="true"></span>
                </label>
              </div>
            </section>

            <section class="settings-section" aria-labelledby="settingsAppTitle">
              <h3 class="settings-section__title" id="settingsAppTitle">📱 App Settings</h3>
              <div class="settings-card settings-card--row">
                <div class="settings-row__text">
                  <span class="settings-row__title">Data Saver Mode</span>
                  <span class="settings-row__desc">Reduce image quality and background loading to save mobile data.</span>
                </div>
                <label class="settings-switch">
                  <input type="checkbox" id="prefDataSaverMode" />
                  <span class="settings-switch__track" aria-hidden="true"></span>
                </label>
              </div>
              <div class="settings-card settings-card--row">
                <div class="settings-row__text">
                  <span class="settings-row__title">Notification Sound</span>
                  <span class="settings-row__desc">Play sound when receiving Dealzkart notifications.</span>
                </div>
                <label class="settings-switch">
                  <input type="checkbox" id="prefNotificationSound" checked />
                  <span class="settings-switch__track" aria-hidden="true"></span>
                </label>
              </div>
              <div class="settings-card settings-card--row">
                <div class="settings-row__text">
                  <span class="settings-row__title">Haptic Feedback</span>
                  <span class="settings-row__desc">Enable vibration for supported actions.</span>
                </div>
                <label class="settings-switch">
                  <input type="checkbox" id="prefHapticFeedback" checked />
                  <span class="settings-switch__track" aria-hidden="true"></span>
                </label>
              </div>
              <div class="settings-card">
                <p class="settings-field__label settings-field__label--block">About App</p>
                <dl class="settings-about-list">
                  <div class="settings-about-list__row"><dt>Current Version</dt><dd id="prefAppVersion">—</dd></div>
                  <div class="settings-about-list__row"><dt>Build Number</dt><dd id="prefAppBuild">—</dd></div>
                  <div class="settings-about-list__row"><dt>Last Updated</dt><dd id="prefAppUpdated">—</dd></div>
                  <div class="settings-about-list__row"><dt>Source</dt><dd id="prefAppSource">—</dd></div>
                </dl>
                <button type="button" class="settings-btn settings-btn--primary" id="prefCheckUpdatesBtn">Check for Updates</button>
                <button type="button" class="settings-btn settings-btn--secondary" id="prefOpenPlayStoreBtn" hidden>Open Play Store</button>
                <p class="settings-field__hint" id="prefUpdateStatus" aria-live="polite"></p>
              </div>
              <div class="settings-card">
                <button type="button" class="settings-btn settings-btn--secondary" id="prefResetPreferencesBtn">Reset Preferences</button>
                <p class="settings-field__hint">Resets shopping and app settings only — not PIN, QR, or account.</p>
              </div>
            </section>
          </div>
        </div>
      </div>
    </div>
    <footer class="app-menu-drawer__foot" id="appMenuFootMain">
      <button type="button" class="app-menu-logout-btn" id="appMenuLogoutBtn">
        <i class="fas fa-sign-out-alt" aria-hidden="true"></i> Log out
      </button>
      <p>Need help? <a href="#" data-page="faq" class="app-menu-foot-help">Open Help Center</a> · WhatsApp <a href="https://wa.me/919363316461" target="_blank" rel="noopener noreferrer">9363316461</a></p>
    </footer>
  </nav>

  <!-- Main content (other pages) -->
  <main class="main-content" id="mainContent">
     <!-- HOME PAGE -->
<section class="page active ls-store-page dd-page-feed-loading" id="home" data-page="home">

  <!-- Legacy / fallback blocks (shown when smart home is off) -->
  <div class="big-product-row" id="bigProductRow"></div>
  <p id="resultCount" class="result-count">
    <span class="result-count-badge"><span>0</span> items found</span>
  </p>
  <div class="multi-section" id="multiSection"></div>
  <!-- Static skeleton first-paint: visible before deferred JS (slow devices / slow net) -->
  <div id="homeSmartContainer" class="dd-feed-skeleton-host" style="display:block;" aria-busy="true">
    <div class="dd-feed-page-skeleton dd-feed-page-skeleton--home dd-startup-skeleton" aria-busy="true" aria-label="Loading">
      <div class="dd-feed-page-skeleton__hero"></div>
      <div class="dd-feed-page-skeleton__row">
        <div class="dd-feed-page-skeleton__chip"></div>
        <div class="dd-feed-page-skeleton__chip"></div>
        <div class="dd-feed-page-skeleton__chip"></div>
        <div class="dd-feed-page-skeleton__chip"></div>
        <div class="dd-feed-page-skeleton__chip"></div>
      </div>
      <div class="dd-feed-page-skeleton__sec">
        <div class="dd-feed-page-skeleton__sec-head"></div>
        <div class="dd-feed-page-skeleton__grid">
          <div class="dd-feed-page-skeleton__card"><div class="dd-feed-page-skeleton__thumb"></div><div class="dd-feed-page-skeleton__line"></div><div class="dd-feed-page-skeleton__line dd-feed-page-skeleton__line--short"></div></div>
          <div class="dd-feed-page-skeleton__card"><div class="dd-feed-page-skeleton__thumb"></div><div class="dd-feed-page-skeleton__line"></div><div class="dd-feed-page-skeleton__line dd-feed-page-skeleton__line--short"></div></div>
          <div class="dd-feed-page-skeleton__card"><div class="dd-feed-page-skeleton__thumb"></div><div class="dd-feed-page-skeleton__line"></div><div class="dd-feed-page-skeleton__line dd-feed-page-skeleton__line--short"></div></div>
          <div class="dd-feed-page-skeleton__card"><div class="dd-feed-page-skeleton__thumb"></div><div class="dd-feed-page-skeleton__line"></div><div class="dd-feed-page-skeleton__line dd-feed-page-skeleton__line--short"></div></div>
          <div class="dd-feed-page-skeleton__card"><div class="dd-feed-page-skeleton__thumb"></div><div class="dd-feed-page-skeleton__line"></div><div class="dd-feed-page-skeleton__line dd-feed-page-skeleton__line--short"></div></div>
          <div class="dd-feed-page-skeleton__card"><div class="dd-feed-page-skeleton__thumb"></div><div class="dd-feed-page-skeleton__line"></div><div class="dd-feed-page-skeleton__line dd-feed-page-skeleton__line--short"></div></div>
        </div>
      </div>
      <div class="dd-feed-page-skeleton__sec">
        <div class="dd-feed-page-skeleton__sec-head dd-feed-page-skeleton__sec-head--short"></div>
        <div class="dd-feed-page-skeleton__rail">
          <div class="dd-feed-page-skeleton__rail-card"><div class="dd-feed-page-skeleton__thumb"></div><div class="dd-feed-page-skeleton__line"></div><div class="dd-feed-page-skeleton__line dd-feed-page-skeleton__line--short"></div></div>
          <div class="dd-feed-page-skeleton__rail-card"><div class="dd-feed-page-skeleton__thumb"></div><div class="dd-feed-page-skeleton__line"></div><div class="dd-feed-page-skeleton__line dd-feed-page-skeleton__line--short"></div></div>
          <div class="dd-feed-page-skeleton__rail-card"><div class="dd-feed-page-skeleton__thumb"></div><div class="dd-feed-page-skeleton__line"></div><div class="dd-feed-page-skeleton__line dd-feed-page-skeleton__line--short"></div></div>
          <div class="dd-feed-page-skeleton__rail-card"><div class="dd-feed-page-skeleton__thumb"></div><div class="dd-feed-page-skeleton__line"></div><div class="dd-feed-page-skeleton__line dd-feed-page-skeleton__line--short"></div></div>
        </div>
      </div>
    </div>
  </div>

  <!-- CashKaro-style home (smart layout) -->
  <div id="homeCashKaroLayout" class="home-cashkaro-layout" style="display:none;">

    <!-- 1. Hero: single highest-priority Amazon banner -->
    <div id="homeHeroBanner" class="ck-hero-banner-wrap" aria-label="Featured offer"></div>

    <!-- 2. Horizontal scroll banner carousel -->
    <section class="ck-section ck-section--carousel ck-animate" id="homeBannerCarouselSection">
      <div class="ck-section-head">
        <h2 class="ck-section-title">Offers for you</h2>
      </div>
      <div class="ck-scroll-shell">
        <button type="button" class="ck-scroll-arrow ck-scroll-arrow-left" aria-label="Scroll left">‹</button>
        <div id="homeBannerCarousel" class="ck-horizontal-scroll ck-banner-carousel-track"></div>
        <button type="button" class="ck-scroll-arrow ck-scroll-arrow-right" aria-label="Scroll right">›</button>
      </div>
    </section>

    <div id="homeBannerAfterCategories" class="home-banner-zone ck-banner-strip ck-banner-mid" aria-label="Promo"></div>

    <!-- Product rows: Trending + Best Deals -->
    <section class="ck-section ck-animate">
      <div class="ck-section-head">
        <h2 class="ck-section-title">Trending on Amazon</h2>
        <button type="button" class="ck-view-all" data-page="deals">View all</button>
      </div>
      <div class="ck-scroll-shell">
        <button type="button" class="ck-scroll-arrow ck-scroll-arrow-left" aria-label="Scroll left">‹</button>
        <div id="homeTrendingAmazon" class="ck-horizontal-scroll"></div>
        <button type="button" class="ck-scroll-arrow ck-scroll-arrow-right" aria-label="Scroll right">›</button>
      </div>
    </section>

    <section class="ck-section ck-animate">
      <div class="ck-section-head">
        <h2 class="ck-section-title">Best Deals</h2>
        <button type="button" class="ck-view-all" data-page="deals">View all</button>
      </div>
      <div class="ck-scroll-shell">
        <button type="button" class="ck-scroll-arrow ck-scroll-arrow-left" aria-label="Scroll left">‹</button>
        <div id="homeBestDeals" class="ck-horizontal-scroll"></div>
        <button type="button" class="ck-scroll-arrow ck-scroll-arrow-right" aria-label="Scroll right">›</button>
      </div>
    </section>

    <div id="homeBannerAfterRow1" class="home-banner-zone ck-banner-strip ck-banner-mid" aria-label="Promo"></div>

    <section class="ck-section ck-animate">
      <div class="ck-section-head">
        <h2 class="ck-section-title">Under ₹999</h2>
        <button type="button" class="ck-view-all" data-page="deals">View all</button>
      </div>
      <div class="ck-scroll-shell">
        <button type="button" class="ck-scroll-arrow ck-scroll-arrow-left" aria-label="Scroll left">‹</button>
        <div id="homeUnder999" class="ck-horizontal-scroll"></div>
        <button type="button" class="ck-scroll-arrow ck-scroll-arrow-right" aria-label="Scroll right">›</button>
      </div>
    </section>

    <section class="ck-section ck-animate">
      <div class="ck-section-head">
        <h2 class="ck-section-title">Top Picks</h2>
        <button type="button" class="ck-view-all" data-page="deals">View all</button>
      </div>
      <div class="ck-scroll-shell">
        <button type="button" class="ck-scroll-arrow ck-scroll-arrow-left" aria-label="Scroll left">‹</button>
        <div id="homeTopPicks" class="ck-horizontal-scroll"></div>
        <button type="button" class="ck-scroll-arrow ck-scroll-arrow-right" aria-label="Scroll right">›</button>
      </div>
    </section>

    <div id="homeBannerAfterRow2" class="home-banner-zone ck-banner-strip ck-banner-mid" aria-label="Promo"></div>

    <p class="trust-note ck-home-trust">
      🔒 You pay the same price on the store. We may earn a small affiliate commission when you use our links.
    </p>
  </div>

  <h2 id="homeMoreProductsHeading" class="home-more-products-heading" style="display:none;">More products</h2>
  <div class="products-grid" id="homeProducts"></div>

  <p class="trust-note trust-note-fallback">
    🔒 You pay same price. We earn small affiliate commission.
  </p>

</section>


    <!-- Admin dashboard moved to /admin-dashboard.html -->
    <!-- SEARCH -->
    <section class="page" id="search" data-page="search">
      <div class="search-page-shell">
        <nav class="search-breadcrumb" aria-label="Breadcrumb">
          <a href="#" data-page="home" class="search-bc-link">Home</a>
          <span class="search-bc-sep" aria-hidden="true">›</span>
          <span class="search-bc-current" id="searchBreadcrumbQuery">Search</span>
        </nav>
        <p class="search-trust-strip" id="searchTrustStrip" hidden>
          Prices are indicative; open a product for cashback estimates and the latest store price.
        </p>

        <header class="search-page-header">
          <div class="search-page-title-block">
            <h1 class="search-page-title" id="searchPageTitle">Search results</h1>
            <p class="search-page-sub" id="searchPageSub" hidden></p>
          </div>
          <div class="search-page-controls">
            <label class="search-sort-label" for="searchSortSelect">Sort by</label>
            <select id="searchSortSelect" class="search-sort-select" aria-label="Sort search results">
              <option value="smart">Relevance</option>
              <option value="price-asc">Price: Low to High</option>
              <option value="price-desc">Price: High to Low</option>
              <option value="discount-desc">Discount: High to Low</option>
            </select>
          </div>
        </header>

        <div class="search-page-body">
          <aside class="search-sidebar" id="searchSidebar" aria-label="Filter results">
            <div class="search-filter-block">
              <h2 class="search-filter-heading">Category</h2>
              <div class="search-filter-chips search-filter-chips--col" id="searchCategoryFilters"></div>
            </div>
            <div class="search-filter-block">
              <h2 class="search-filter-heading">Brand</h2>
              <div class="search-filter-chips search-filter-chips--col" id="searchBrandFilters"></div>
            </div>
            <div class="search-filter-block">
              <h2 class="search-filter-heading">Price</h2>
              <div class="search-filter-chips search-filter-chips--col" id="searchPriceFilters"></div>
            </div>
            <button type="button" class="search-clear-filters" id="searchClearFilters" hidden>Clear filters</button>
          </aside>

          <div class="search-results-column">
            <div class="search-results-toolbar">
              <p class="search-result-meta" id="searchResultMeta" aria-live="polite" hidden></p>
              <div class="search-active-bar" id="searchActiveBar" hidden>
                <span class="search-active-label" id="searchActiveLabel"></span>
              </div>
            </div>
            <div class="products-grid search-results-grid" id="searchResults"></div>
            <div class="search-load-more-wrap">
              <button type="button" class="search-load-more-btn" id="searchLoadMoreBtn" hidden>Load more results</button>
            </div>
            <p class="search-empty-msg" id="searchEmptyState" role="status" hidden>
              No products match your filters. Try clearing filters or a different search.
            </p>
          </div>
        </div>
      </div>
    </section>

    <!-- DEALS -->
    <section class="page deals-page ls-store-page" id="deals" data-page="deals">
      <div class="deals-page-shell">
        <div id="dealz-container" class="dealz-container"></div>
      </div>
    </section>


    <!-- ================= SPIN PAGE ================= -->
  <section class="page spin-page" id="spin" data-page="spin">

  <div class="spin-page-wrapper">
  <div class="spin-container">

    <header class="spin-hero">
      <p class="spin-hero__eyebrow">Rewards hub</p>
      <h2 class="spin-hero__title">Daily spin &amp; cashback wallet</h2>
      <p class="spin-hero__lead">Grow your streak by sharing products, shopping through partner checkout, referring friends &amp; earning tokens — then unlock spins when you qualify. Wallet rewards credit as usual.</p>
    </header>

    <div class="spin-main-grid">
      <div class="spin-main-grid__aside">
        <div class="game-bar" role="group" aria-label="Account progress">
          <div class="level-box game-stat">
            <span class="game-stat__label">Level</span>
            <span class="game-stat__value" id="userLevel">1</span>
          </div>
          <div class="token-box game-stat">
            <span class="game-stat__label">Tokens</span>
            <span class="game-stat__value" id="userTokens">0</span>
          </div>
        </div>

        <div class="level-progress-card">
          <div class="progress-top">
            <span class="progress-top__label">Experience</span>
            <span id="progressText">0 / 100</span>
          </div>
          <div class="progress-bar" role="progressbar" aria-valuemin="0" aria-valuemax="100" aria-valuenow="0" aria-label="XP progress">
            <div id="progressFill"></div>
          </div>
        </div>

        <div class="spin-card spin-status">
          <p class="spin-status__title" id="spinProgressText">Spins unlock when your streak &amp; rewards activity qualify</p>
          <p class="spin-status__hint">Your streak rises when you share deals, buy via partner links, refer friends &amp; stack tokens — stay consistent to unlock.</p>
        </div>

        <section class="streak-card" id="streakCard" aria-label="Streak progress">
          <div class="streak-card__top">
            <div class="streak-pill">
              <span class="streak-pill__icon" aria-hidden="true"></span>
              <span class="streak-pill__label">Rewards streak</span>
            </div>
            <div class="streak-box">
              <span id="streakCount">0</span>
              <small>pts</small>
            </div>
          </div>

          <aside class="streak-grow-tip" id="streakGrowTip" aria-hidden="true" aria-live="polite">
            <button type="button" class="streak-grow-tip__dismiss" aria-label="Dismiss tip">&times;</button>
            <p class="streak-grow-tip__title">Boost your streak</p>
            <p class="streak-grow-tip__body">
              Order through partner checkout and share products from deals — it takes real activity to move this meter. Unlocked spins can pay <strong>up to ₹500</strong> cashback on the wheel (high prizes are rare).
            </p>
          </aside>

          <div class="streak-meter" role="progressbar" aria-valuemin="0" aria-valuemax="21" aria-valuenow="0">
            <div class="streak-meter__fill" id="streakMeterFill"></div>
          </div>

          <div class="streak-sub" id="streakVisual">Start sharing &amp; shopping to grow your streak score</div>
          <p class="streak-note">Sharing products, partner orders, referrals &amp; tokens all strengthen what you see here — unlocks stay fair and paced.</p>
        </section>
      </div>

      <div class="spin-main-grid__wheel">
        <div class="spin-wheel-card">
          <div class="spin-wheel-card__header">
            <h3 class="spin-wheel-card__title">Prize wheel</h3>
            <p class="spin-wheel-card__sub">One spin per day when unlocked · up to 3 streak unlocks per month</p>
          </div>
          <div class="spin-wheel-centering">
            <div class="spin-wheel-pointer" aria-hidden="true"></div>
            <div class="spin-wheel-wrapper" id="spinWheelWrapper">
              <canvas id="spinCanvas" width="260" height="260"></canvas>
            </div>
          </div>
          <button type="button" class="spin-cta" id="spinButton" disabled>Build streak to unlock spin</button>
          <p id="spinResult" class="spin-result-message" style="display:none;" role="status"></p>
          <p class="spin-hint">Unlocks weigh your overall rewards streak — share often, shop partner deals &amp; stay engaged.</p>
        </div>
      </div>
    </div>

    <div class="spin-lower-grid">
      <div class="spin-lower-grid__pair">
        <div class="spin-card spin-card--compact">
          <h3 class="spin-card__h">Daily bonus</h3>
          <p class="spin-card__p" id="dailyText">Claim your free daily XP</p>
          <button type="button" id="dailyBtn" class="primary-btn" disabled>Claim daily XP</button>
        </div>
        <div id="tokenSection" class="spin-token-wrap">
          <div class="spin-card spin-card--compact" id="tokenCashoutCard">
            <h3 class="spin-card__h">Token payout</h3>
            <p class="spin-card__p">Collect <strong>9 tokens</strong> to request a <strong>₹30</strong> withdrawal review.</p>
            <div class="progress-bar progress-bar--tokens">
              <div class="progress-fill" id="tokenProgress"></div>
            </div>
            <div id="tokenProgressText" class="token-progress-caption">0 / 9 tokens</div>
            <button type="button" class="primary-btn" id="claimTokenRewardBtn" onclick="claimTokenReward()" disabled>Need 9 more tokens</button>
          </div>
        </div>
      </div>

      <div class="spin-lower-grid__wallet-row">
        <div class="savings-card">
          <div class="savings-card__head">
            <h3 id="piggyIcon">Cashback balance</h3>
            <span class="savings-card__badge">Wallet</span>
          </div>
          <div class="savings-amount" aria-live="polite">
            ₹<span id="spinWalletAvailable">0</span>
          </div>
          <div class="savings-status" id="savingsStatus">Rewards from spins can unlock your balance for withdrawal.</div>
          <div class="savings-progress">
            <div class="savings-bar" id="savingsBar"></div>
          </div>
          <div class="withdraw-info">Total withdrawn · ₹<span id="spinWalletWithdrawn">0</span></div>
          <div class="savings-viz" id="savingsViz" data-state="idle" aria-hidden="true">
            <div class="savings-viz__scene">
              <div class="savings-viz__ring"></div>
              <div class="savings-viz__ring savings-viz__ring--inner"></div>
              <div class="savings-viz__wallet">
                <svg viewBox="0 0 48 48" width="40" height="40" aria-hidden="true" focusable="false">
                  <rect x="6" y="14" width="36" height="26" rx="6" fill="currentColor" opacity="0.18"/>
                  <path d="M8 18h32a4 4 0 0 1 4 4v2H4v-2a4 4 0 0 1 4-4z" fill="currentColor"/>
                  <circle cx="34" cy="28" r="4" fill="currentColor" opacity="0.85"/>
                </svg>
              </div>
              <span class="savings-viz__coin" style="--i:0">₹</span>
              <span class="savings-viz__coin" style="--i:1">₹</span>
              <span class="savings-viz__coin" style="--i:2">₹</span>
              <span class="savings-viz__coin" style="--i:3">₹</span>
              <span class="savings-viz__spark" style="--i:0"></span>
              <span class="savings-viz__spark" style="--i:1"></span>
              <span class="savings-viz__spark" style="--i:2"></span>
            </div>
            <p class="savings-viz__caption" id="savingsVizCaption">Spin rewards flow into your wallet</p>
          </div>
          <button type="button" id="claimBtn" class="primary-btn" disabled>Release to wallet</button>
        </div>

        <div class="bank-card" id="upiQrCard">
          <h3 class="upi-qr-title">UPI QR for payouts</h3>
          <p class="info-small bank-card__intro">Upload a clear UPI QR from your bank or UPI app so approved cashback can be sent.</p>
          <p class="info-small upi-qr-lock-hint">To replace a saved QR, use phone lock in the app or your 4–6 digit QR change PIN.</p>
          <input type="file" id="upiQrUpload" accept="image/*" hidden />
          <div class="upi-qr-actions">
            <button type="button" class="bank-toggle-btn" id="upiQrSetPinBtn">Set QR PIN</button>
            <button type="button" class="bank-toggle-btn" id="upiQrPickBtn">Choose QR image</button>
          </div>
          <div id="upiQrPreviewWrap" class="upi-qr-preview-wrap" style="display:none;">
            <img id="upiQrPreview" alt="UPI QR preview" width="140" height="140" />
          </div>
          <button type="button" class="spin-cta" id="upiQrSaveBtn" disabled>Save UPI QR</button>
          <p id="upiQrStatus" class="info-small upi-qr-status"></p>
        </div>
      </div>

      <p class="wallet-instruction">Spin winnings and eligible rewards credit your in-app wallet. Complete checkout through our links so every order counts toward unlocks.</p>
    </div>

  </div>
  </div>

</section>

<!-- PRODUCT DETAIL — responsive content-driven layout -->
<section class="page ls-pdp-page" id="productDetail" data-page="productDetail">

  <div class="pdp-shell">
    <div class="pdp-shell__upper">
      <div class="pdp-gallery">
        <div id="detailImageBox"></div>
      </div>

      <aside class="pdp-shop" id="detailBuyPanel">
        <div id="detailUrgencyStrip" class="detail-urgency-strip" hidden></div>
        <h1 id="detailTitle" class="product-title">Loading product...</h1>
        <div id="detailRatingInline" class="pdp-rating-inline" hidden></div>
        <div id="detailDiscountBadge" class="detail-discount-badge-wrap"></div>
        <div id="detailPlatformBadgeWrap" class="detail-platform-badge-wrap" aria-live="polite"></div>
        <p id="detailPrice" class="detail-price-row product-description"></p>
        <p id="detailPriceCaption" class="detail-price-caption"></p>
        <div id="detailPremiumPerks" class="detail-premium-perks"></div>
        <div id="detailTrustPanel" class="detail-trust-panel" hidden></div>
        <div id="detailChooseDealSection" class="detail-choose-deal-wrap"></div>
        <div id="detailBuyButtons"></div>
      </aside>
    </div>

    <div class="pdp-shell__flow">
      <div class="pdp-block pdp-block--highlights" id="detailHighlightsBlock"></div>
      <div class="pdp-block pdp-block--desc">
        <div id="detailDesc" class="detail-desc-block"></div>
      </div>
      <div class="pdp-block pdp-block--delivery" id="detailDeliveryBlock"></div>
      <div class="pdp-block pdp-block--reviews" id="detailReviewsBlock"></div>
    </div>

    <div class="pdp-shell__below">
      <section class="pdp-section" id="detailFrequentlyBought" hidden></section>
      <section class="pdp-section" id="detailRecentlyViewed" hidden></section>
      <section class="pdp-section ls-pdp-more" id="moreProductsCard">
        <h2 class="ls-pdp-more__title">Related products</h2>
        <div id="moreProductsList" role="list"></div>
      </section>
    </div>
  </div>

  <div id="detailStickyBar" class="detail-sticky-cta pdp-sticky-bar" hidden>
    <div class="detail-sticky-cta__inner">
      <div class="detail-sticky-cta__copy">
        <span class="detail-sticky-cta__label">Deal price</span>
        <span class="detail-sticky-cta__amt" id="detailStickyPriceAmt"></span>
      </div>
      <button type="button" class="detail-sticky-cta__primary" id="detailStickyPrimaryBtn">Buy now</button>
    </div>
  </div>

</section>
<!-- ================= END PRODUCT DETAIL PAGE ================= -->




    <!-- CART -->
    <section class="page cart-page" id="cart" data-page="cart">
      <div class="cart-page-shell">
      <div class="cart-container">
        <header class="cart-hero">
          <nav class="cart-breadcrumb" aria-label="Breadcrumb">
            <a href="#" data-page="home" class="cart-bc-link">Home</a>
            <span class="cart-bc-sep" aria-hidden="true">›</span>
            <span class="cart-bc-current">Cart</span>
          </nav>
          <h2 class="cart-hero__title">Shopping cart</h2>
          <p class="cart-subtitle">
            Saved items open on retailer sites — complete checkout where you usually shop.
          </p>
          <div class="cart-trust" role="list">
            <span class="cart-trust__pill" role="listitem">Retailer checkout</span>
            <span class="cart-trust__pill" role="listitem">No extra Dealzkart fee</span>
            <span class="cart-trust__pill" role="listitem">Indicative prices</span>
          </div>
        </header>

        <div class="cart-layout">
          <div class="cart-items-col">
            <div class="cart-card cart-items-panel" id="cartItemsCard">
              <div class="cart-items-panel__head">
                <h3 class="cart-items-panel__title">Items</h3>
                <span class="cart-items-panel__hint" id="cartPanelHint"></span>
              </div>
              <div id="cartItems"></div>
            </div>
          </div>

          <div class="cart-summary-col">
            <div class="cart-card cart-price-box" id="cartPriceBox">
              <h3 class="cart-price-box__title">Order summary</h3>
              <p class="cart-price-box__sub">Totals reflect cart quantities × listed price.</p>
              <div class="price-row">
                <span>Items</span>
                <span id="cartItemCount">0</span>
              </div>
              <div class="price-row savings-row" id="cartSavingsRow" style="display:none;">
                <span>Est. savings vs MRP</span>
                <span class="savings-amount">₹<span id="cartSavings">0</span></span>
              </div>
              <div class="price-row price-total">
                <span>Subtotal</span>
                <span>₹<span id="cartTotal">0</span></span>
              </div>
              <p class="cart-summary-footnote">Tap <strong>Buy</strong> on an item to open the live deal on the partner store.</p>
            </div>
          </div>
        </div>

        <div id="smartCartSection" class="cart-card cart-smart-section" style="display:none;">
          <div class="cart-section-head">
            <h3 class="smart-cart-title">Recommended with your cart</h3>
            <p class="cart-section-desc">Based on categories and price range</p>
          </div>
          <div id="smart-cart" class="smart-row"></div>
        </div>

        <div id="betterDealsSection" class="cart-card cart-better-deals" style="display:none;">
          <div class="cart-section-head">
            <h3 class="better-deals-title">Lower-priced picks</h3>
            <p class="cart-section-desc">Same category — compare before you buy</p>
          </div>
          <div id="better-deals"></div>
        </div>
      </div>
      </div>
    </section>

    <!-- ================= ACCOUNT PAGE ================= -->
<section class="page account-page" id="account" data-page="account">

  <div class="account-page-shell">

  <!-- ================= GUEST VIEW ================= -->
  <div id="guestView" class="guest-wrapper" style="display:none;" hidden>
    <div class="guest-card">
      <i class="fas fa-user-circle guest-card__icon" aria-hidden="true"></i>
      <h2 class="guest-card__title">Sign in to continue</h2>
      <p class="guest-card__text">Open your wallet, referrals, spin progress, and saved profile.</p>
      <button type="button" class="primary-btn pulse" id="goToLoginBtn">Log in</button>
    </div>
  </div>

 <!-- ================= USER VIEW ================= -->
<div id="userView" style="display:none">

  <header class="account-hero">
    <nav class="account-breadcrumb" aria-label="Breadcrumb">
      <a href="#" data-page="home" class="account-bc-link">Home</a>
      <span class="account-bc-sep" aria-hidden="true">›</span>
      <span class="account-bc-current">Account</span>
    </nav>
    <h2 class="account-hero__title">Your account</h2>
    <p class="account-hero__lead">Profile, wallet balance, referrals, and rewards — all in one dashboard.</p>
  </header>

  <!-- PROFILE CONTAINER (inline, no redirect) -->
  <div class="account-dashboard">
  <div class="profile-container account-grid__profile">
    <div class="profile-left profile-expand-trigger" id="profileExpandTrigger">
      <img id="profileImage" src="" alt="Profile" class="profile-display-img" style="display:none;">
      <div id="profileImagePlaceholder" class="profile-avatar-placeholder"><i class="fas fa-user" aria-hidden="true"></i></div>
      <h2 id="userName" class="profile-username-text"></h2>
      <p id="userEmail" class="profile-email-text"></p>
      <p id="profileBio" class="profile-bio-text"></p>
      <button type="button" class="primary-btn" id="editProfileBtn">Edit profile</button>
    </div>
    <div class="profile-right">
      <div class="stat-box">
        <h3 id="profileStreak">0</h3>
        <p>Streak</p>
      </div>
      <div class="stat-box">
        <h3 id="profileCashback">₹0</h3>
        <p>Cashback</p>
      </div>
      <div class="stat-box">
        <h3 id="profileSpins">0</h3>
        <p>Spins</p>
      </div>
      <div class="ref-box">
        <p>Invite link</p>
        <div class="ref-box-row">
          <input type="text" id="refLink" readonly aria-label="Your referral invite link">
          <button type="button" id="copyRefBtn">Copy</button>
        </div>
      </div>
    </div>
  </div>

  <!-- PROFILE EXPAND MODAL (big profile picture only) -->
  <div id="profileExpandModal" class="profile-expand-modal" style="display:none;">
    <div class="profile-expand-backdrop"></div>
    <div class="profile-expand-card profile-expand-simple">
      <button type="button" class="profile-expand-close" aria-label="Close">✕</button>
      <div class="profile-expand-avatar-wrap">
        <img id="profileExpandImage" src="" alt="Profile" class="profile-expand-img" style="display:none;">
        <div id="profileExpandPlaceholder" class="profile-expand-placeholder"><i class="fas fa-user" aria-hidden="true"></i></div>
      </div>
    </div>
  </div>

  <!-- EDIT PROFILE MODAL -->
  <div id="editProfileModal" class="profile-modal" style="display:none;">
    <div class="profile-modal-backdrop"></div>
    <div class="profile-modal-content">
      <h3>Edit Profile</h3>
      <div class="edit-profile-row">
        <div class="profile-avatar-wrap">
          <img id="profileImagePreview" src="" alt="Profile" class="profile-avatar" style="display:none;">
          <div id="profileImagePreviewPlaceholder" class="profile-avatar placeholder"><i class="fas fa-user" aria-hidden="true"></i></div>
          <label class="profile-upload-btn" for="profileImageInput">Change Photo</label>
          <input type="file" id="profileImageInput" accept="image/*" style="display:none;">
        </div>
        <div class="edit-profile-fields">
          <label for="profileUsernameInput">Username</label>
          <input type="text" id="profileUsernameInput" maxlength="30" placeholder="Your username">
          <label for="profileBioInput">Bio</label>
          <textarea id="profileBioInput" rows="3" maxlength="150" placeholder="Tell us about yourself"></textarea>
          <div class="profile-modal-actions">
            <button type="button" class="secondary-btn" id="closeEditProfileBtn">Cancel</button>
            <button type="button" class="primary-btn" id="saveProfileBtn">Save Profile</button>
          </div>
        </div>
      </div>
    </div>
  </div>

  <!-- PROFILE PHOTO CROP -->
  <div id="profilePhotoCropModal" class="profile-crop-modal" hidden aria-hidden="true" role="dialog" aria-labelledby="profileCropTitle" aria-modal="true">
    <div id="profileCropBackdrop" class="profile-crop-modal__backdrop"></div>
    <div class="profile-crop-modal__panel">
      <h3 id="profileCropTitle">Crop profile photo</h3>
      <p class="profile-crop-modal__hint">Drag to reposition · use slider to zoom</p>
      <div id="profileCropStage" class="profile-crop-stage">
        <canvas id="profileCropCanvas" aria-hidden="true"></canvas>
        <div class="profile-crop-circle" aria-hidden="true"></div>
      </div>
      <label class="profile-crop-zoom-label" for="profileCropZoom">Zoom</label>
      <input type="range" id="profileCropZoom" class="profile-crop-zoom" min="1" max="3" step="0.01" value="1" aria-label="Zoom photo">
      <div class="profile-crop-actions">
        <button type="button" class="secondary-btn" id="profileCropCancel">Cancel</button>
        <button type="button" class="primary-btn" id="profileCropApply">Use photo</button>
      </div>
    </div>
  </div>

  <!-- MAIN GRID (2 columns × 3 rows + full-width info) -->
  <div class="account-grid">

    <!-- Row 1 -->
    <div class="info-card account-card account-card--wallet">
      <h3 class="account-card__title">Wallet</h3>
      <p class="account-card__sub">Balances shown here mirror your rewards wallet.</p>
      <div class="wallet-row">
        <span>Available</span>
        <strong>₹<span id="walletAvailable" class="wallet-amount">0</span></strong>
      </div>
      <div class="wallet-row">
        <span>Withdrawn</span>
        <strong>₹<span id="walletWithdrawn" class="wallet-amount">0</span></strong>
      </div>
    </div>

    <div class="lb-container account-grid__leaderboard">
      <div class="lb-header">
        <div class="lb-header-icon">&#9876;</div>
        <div>
          <h3 class="lb-title">LEADERBOARD</h3>
          <p class="lb-subtitle">Top referrers this season</p>
        </div>
      </div>
      <div id="leaderboardList" class="lb-body">Loading...</div>
    </div>

    <!-- Row 2 -->
    <div class="info-card account-card">
      <h3 class="account-card__title">Rewards overview</h3>
      <ul class="account-metric-list">
        <li class="account-metric">
          <span class="account-metric__label">Spins used</span>
          <span id="spinsUsed" class="account-metric__value">0</span>
        </li>
        <li class="account-metric">
          <span class="account-metric__label">Streak points</span>
          <span id="rewardsStreakPoints" class="account-metric__value">0</span>
        </li>
        <li class="account-metric account-metric--highlight">
          <span class="account-metric__label">Rewards tracked</span>
          <strong id="cashbackEarned" class="account-metric__strong">₹0</strong>
        </li>
      </ul>
    </div>

    <div class="info-card account-card" id="cashclaimStatsSection">
      <h3 class="account-card__title">CashClaim statistics</h3>
      <p class="account-card__sub">Your CashClaim submissions and cashback received through Dealzkart.</p>
      <div id="cashclaimStatsEmpty" class="cc-profile-stats-empty" hidden>
        <p class="cc-profile-stats-empty__title">No cashback received yet.</p>
        <p class="cc-profile-stats-empty__hint">Shop through Dealzkart to earn your first CashClaim reward.</p>
        <button type="button" class="secondary-btn" data-page="cashclaim">Explore CashClaim</button>
      </div>
      <ul id="cashclaimStatsGrid" class="account-metric-list cc-profile-stats-grid">
        <li class="account-metric">
          <span class="account-metric__label">Total CashClaims Submitted</span>
          <span id="ccStatSubmitted" class="account-metric__value">0</span>
        </li>
        <li class="account-metric">
          <span class="account-metric__label">Approved CashClaims</span>
          <span id="ccStatApproved" class="account-metric__value">0</span>
        </li>
        <li class="account-metric">
          <span class="account-metric__label">Rejected CashClaims</span>
          <span id="ccStatRejected" class="account-metric__value">0</span>
        </li>
        <li class="account-metric account-metric--highlight">
          <span class="account-metric__label">Total Cashback Received</span>
          <strong id="ccStatReceived" class="account-metric__strong">₹0</strong>
        </li>
      </ul>
    </div>

    <!-- Row 3 -->
    <div class="info-card account-card" id="ddNotifyCenterSection">
      <div class="dd-notify-center__head">
        <h3 class="account-card__title">Notifications</h3>
        <span id="ddNotifyCenterUnreadBadge" class="dd-notify-center__badge" hidden aria-live="polite"></span>
      </div>
      <p class="account-card__sub">CashClaim updates and payout alerts — tap an item to open the related screen.</p>
      <div id="ddNotifyCenterList" class="dd-notify-center__list" role="list" aria-label="Notification history">
        <div class="dd-notify-center__loading" aria-busy="true" aria-live="polite">
          <div class="dd-notify-center__loading-anim" aria-hidden="true">
            <span class="dd-notify-center__loading-dot"></span>
            <span class="dd-notify-center__loading-dot"></span>
            <span class="dd-notify-center__loading-dot"></span>
          </div>
          <p>Loading notifications…</p>
        </div>
      </div>
    </div>

    <div class="info-card account-card account-card--refer" id="referralSection">
      <h3 class="account-card__title">Referral program</h3>
      <p class="account-card__sub">Share your code — earn tokens when friends join.</p>

      <div class="referral-box">
        <span class="referral-code-label">Your code</span>
        <span id="referralCode" class="referral-code-display">------</span>
      </div>
      <input type="hidden" id="referralLinkInput" aria-hidden="true">

      <div class="referral-actions">
        <button type="button" id="copyReferralBtn" class="ref-btn copy-code-btn">Copy code</button>
        <button type="button" id="copyReferralLinkBtn" class="ref-btn copy-link-btn">Copy link</button>
      </div>

      <div class="referral-stats">
        <div class="ref-stat-box">
          <div class="stat-number" id="friendsJoinedCount">0</div>
          <div class="stat-label">Friends joined</div>
        </div>
        <div class="ref-stat-box">
          <div class="stat-number" id="totalRewardsCount">0</div>
          <div class="stat-label">Rewards won</div>
        </div>
      </div>

      <button type="button" class="primary-btn account-share-ref-btn" id="shareReferralBtn">Share referral link</button>
    </div>

    <!-- Full-width info row -->
    <div class="info-card account-card account-grid__full">
      <h3 class="account-card__title">How rewards work</h3>
      <ul class="info-list reward-list account-reward-list account-reward-list--grid">
        <li>Spins unlock when verified purchases meet streak milestones.</li>
        <li>Regular shoppers reach unlock thresholds faster — monthly caps still apply.</li>
        <li>Tokens come from referrals and certain reward milestones.</li>
        <li>Approved withdrawals are processed via your saved payout method.</li>
      </ul>
    </div>

  </div>
  </div>

</div>

  </div>
</section>
<section class="page report-bug-page" id="report-bug" data-page="report-bug">
  <div class="report-bug-shell">
    <header class="report-bug-hero">
      <button type="button" class="secondary-btn report-bug-back-btn" id="bugReportBackBtn">Back to Settings</button>
      <h2 class="report-bug-hero__title">Report a Bug</h2>
      <p class="report-bug-hero__lead">Help us improve Dealzkart by reporting issues you encounter.</p>
    </header>

    <div id="bugReportSuccessWrap" class="report-bug-card report-bug-success" hidden>
      <div class="report-bug-success__icon" aria-hidden="true">🐞</div>
      <h3 class="report-bug-success__title">Bug Report Submitted</h3>
      <p class="report-bug-success__msg">Thank you for helping improve Dealzkart. Our team will review your report as soon as possible.</p>
      <button type="button" class="primary-btn" id="bugReportDoneBtn">Done</button>
    </div>

    <div id="bugReportFormWrap">
      <p id="bugReportError" class="report-bug-error" hidden role="alert"></p>
      <form id="bugReportForm" class="report-bug-form" novalidate>
        <div class="report-bug-card">
          <label class="report-bug-field" for="bugReportCategory">
            <span class="report-bug-label">Bug category</span>
            <select id="bugReportCategory" class="report-bug-select" required>
              <option value="">Select category</option>
            </select>
          </label>
          <label class="report-bug-field" for="bugReportTitle">
            <span class="report-bug-label">Bug title</span>
            <input type="text" id="bugReportTitle" class="report-bug-input" maxlength="160" placeholder="Example: CashClaim page not loading" required />
          </label>
          <label class="report-bug-field" for="bugReportDescription">
            <span class="report-bug-label">Description</span>
            <span class="report-bug-hint">Describe what happened, what you were trying to do, and how we can reproduce it.</span>
            <textarea id="bugReportDescription" class="report-bug-textarea" maxlength="8000" placeholder="Describe what happened…&#10;What were you trying to do?&#10;What went wrong?&#10;How can we reproduce it?" required></textarea>
          </label>
        </div>

        <div class="report-bug-card">
          <span class="report-bug-label">Screenshot</span>
          <p class="report-bug-hint">Attach one or more screenshots (optional, max 6, 5 MB each).</p>
          <div class="report-bug-upload-row">
            <button type="button" class="report-bug-upload-btn" id="bugReportPickBtn">
              <i class="fas fa-image" aria-hidden="true"></i> Upload screenshot
            </button>
            <input type="file" id="bugReportFileInput" accept="image/*" multiple hidden />
          </div>
          <div id="bugReportShots" class="report-bug-shots"></div>
        </div>

        <div class="report-bug-card">
          <span class="report-bug-label">Device information</span>
          <p class="report-bug-hint">Collected automatically — you do not need to enter this manually.</p>
          <div id="bugReportDeviceGrid" class="report-bug-device-grid"></div>
        </div>

        <div class="report-bug-card">
          <label class="report-bug-field" for="bugReportEmail">
            <span class="report-bug-label">Contact email</span>
            <input type="email" id="bugReportEmail" class="report-bug-input" maxlength="160" placeholder="you@example.com" required autocomplete="email" />
          </label>
          <button type="submit" class="report-bug-submit" id="bugReportSubmitBtn">Submit Bug Report</button>
        </div>
      </form>
    </div>
  </div>
</section>
<section class="page account-delete-page" id="delete-account" data-page="delete-account">
  <div class="delete-account-shell">
    <div class="delete-account-hero">
      <button type="button" class="secondary-btn delete-account-back-btn" id="deleteAccountBackBtn">Back to account</button>
      <span class="delete-account-hero__badge">Google Play compliant</span>
      <h2 class="delete-account-hero__title">Delete account</h2>
      <p class="delete-account-hero__lead">
        Remove your Dealzkart account directly from the app. This action is permanent and cannot be undone.
      </p>
    </div>

    <div id="deleteAccountGuestView" class="guest-wrapper" style="display:none;">
      <div class="guest-card">
        <i class="fas fa-user-lock guest-card__icon" aria-hidden="true"></i>
        <h2 class="guest-card__title">Sign in to delete your account</h2>
        <p class="guest-card__text">For your security, only the signed-in account owner can start permanent deletion.</p>
        <button type="button" class="primary-btn" id="deleteAccountLoginBtn">Go to login</button>
      </div>
    </div>

    <div id="deleteAccountUserView" class="delete-account-layout" style="display:none;">
      <div class="delete-account-panel delete-account-panel--warning">
        <span class="delete-account-panel__icon" aria-hidden="true"><i class="fas fa-triangle-exclamation"></i></span>
        <div>
          <h3>What gets deleted</h3>
          <ul class="delete-account-impact-list">
            <li>Your profile, rewards dashboard, and personalized feed data</li>
            <li>Wallet history, spin history, saved preferences, and device reset requests</li>
            <li>Firestore account records, linked authentication access, and local session data</li>
          </ul>
        </div>
      </div>

      <div class="delete-account-panel">
        <div class="delete-account-account-row">
          <div>
            <span class="delete-account-label">Signed-in account</span>
            <strong id="deleteAccountEmail">Loading...</strong>
          </div>
          <span class="delete-account-pill">Permanent action</span>
        </div>

        <form id="deleteAccountForm" class="delete-account-form">
          <fieldset class="delete-account-fieldset">
            <legend>Why are you deleting your account?</legend>
            <div class="delete-account-reason-grid">
              <label class="delete-account-reason-card">
                <input type="radio" name="deleteAccountReason" value="privacy">
                <span>Privacy concerns</span>
              </label>
              <label class="delete-account-reason-card">
                <input type="radio" name="deleteAccountReason" value="better_app">
                <span>I found a better app</span>
              </label>
              <label class="delete-account-reason-card">
                <input type="radio" name="deleteAccountReason" value="too_many_notifications">
                <span>Too many notifications</span>
              </label>
              <label class="delete-account-reason-card">
                <input type="radio" name="deleteAccountReason" value="duplicate_account">
                <span>I have another account</span>
              </label>
              <label class="delete-account-reason-card">
                <input type="radio" name="deleteAccountReason" value="other">
                <span>Other reason</span>
              </label>
            </div>
          </fieldset>

          <label class="delete-account-textarea-label" for="deleteAccountReasonText">
            Tell us more
            <span>Optional, but required if you select “Other reason”.</span>
          </label>
          <textarea
            id="deleteAccountReasonText"
            maxlength="500"
            rows="5"
            placeholder="Share a short reason so we can improve Dealzkart."
          ></textarea>

          <label class="delete-account-checkbox">
            <input type="checkbox" id="deleteAccountAcknowledge">
            <span>I understand this permanently deletes my account and all associated Dealzkart data.</span>
          </label>

          <div class="delete-account-actions">
            <button type="button" class="secondary-btn" id="deleteAccountCancelBtn">Cancel</button>
            <button type="submit" class="primary-btn delete-account-submit-btn" id="deleteAccountSubmitBtn">
              Delete account permanently
            </button>
          </div>
        </form>
      </div>
    </div>
  </div>
</section>
   <!-- TERMS & CONDITIONS -->
<section class="page" id="terms" data-page="terms">
  <div class="about-container">
    <h2>Terms &amp; Conditions</h2>
    <p class="info-highlight" style="margin-bottom:1rem;">Last updated: May 2026. These terms are written in plain language so you know what to expect when you use Dealzkart.</p>

    <div class="info-card">
      <h3>What Dealzkart is</h3>
      <p>Dealzkart helps you discover deals and track rewards when you shop through links we provide. We are not a shop: when you buy something, you complete checkout on the retailer or marketplace (for example Amazon or Flipkart). Prices shown follow those sites — we don’t add markup on products.</p>
    </div>

    <div class="info-card">
      <h3>Accounts &amp; eligibility</h3>
      <ul class="info-list">
        <li>You need a valid account to earn personalised rewards and use certain features.</li>
        <li>Only genuine personal use is allowed. Shared logins, scripted clicks, or attempts to game the system may limit rewards or access so the programme stays fair.</li>
        <li>We may ask you to verify contact details (for example phone OTP) to protect payouts and comply with reasonable security checks.</li>
      </ul>
    </div>

    <div class="info-card">
      <h3>Affiliate links &amp; payments</h3>
      <p>Some outbound links are affiliate links. That means we may earn a small commission from retailers when you purchase — at no extra cost to you. It helps us keep Dealzkart running.</p>
    </div>

    <div class="info-card">
      <h3>Rewards, spins, tokens &amp; cashback</h3>
      <ul class="info-list">
        <li>Rewards (including spins, tokens, streak milestones, and wallet credits) depend on qualifying actions we can verify, programme rules, and fair-use limits.</li>
        <li>Reward amounts, schedules, and eligibility can change as we improve the product; we’ll aim to keep rules understandable in-app.</li>
        <li>Payouts are subject to verification, minimum thresholds, and any taxes or charges required by law or payment partners.</li>
      </ul>
    </div>

    <div class="info-card">
      <h3>Acceptable use</h3>
      <p>Please don’t use bots, fake referrals, duplicate accounts, or other misuse that hurts other users or partners. We may pause rewards or accounts if we need to investigate — we’ll try to be proportionate and explain when we can.</p>
    </div>

    <div class="info-card">
      <h3>Changes &amp; availability</h3>
      <p>We may update these terms, rewards mechanics, or features as the service evolves. Continuing to use Dealzkart after changes means you accept the updated terms for new activity.</p>
    </div>

    <div class="info-card">
      <h3>Disclaimer</h3>
      <p>Product information comes from partners and may change without notice. Deals and availability are controlled by retailers. Nothing here is financial or legal advice.</p>
    </div>

    <div class="info-card">
      <h3>Contact</h3>
      <p>Email: <a href="mailto:dronedealz8@gmail.com">dronedealz8@gmail.com</a> · Mobile / WhatsApp: <a href="https://wa.me/919363316461">+91 9363316461</a></p>
      <p style="margin-top:12px;">Or use the <strong>Help</strong> tab on the right side of the app for quick answers.</p>
    </div>
  </div>
</section>

<!-- ================= SPIN HISTORY ================= -->
<section class="page spin-history-page" id="spin-history" data-page="spin-history">
  <div class="spin-history-shell">
    <header class="spin-history-hero">
      <nav class="spin-history-breadcrumb" aria-label="Breadcrumb">
        <a href="#" data-page="home" class="spin-history-bc-link">Home</a>
        <span class="spin-history-bc-sep" aria-hidden="true">›</span>
        <a href="#" data-page="spin" class="spin-history-bc-link">Rewards</a>
        <span class="spin-history-bc-sep" aria-hidden="true">›</span>
        <span class="spin-history-bc-current">Spin history</span>
      </nav>
      <h2 class="spin-history-hero__title">Rewards &amp; cashback history</h2>
      <p class="spin-history-hero__lead">Free spins, wheel wins, wallet credits, and admin payout confirmations — newest first.</p>
    </header>

    <div class="spin-history-layout">
      <div class="info-card spin-history-card spin-history-card--list history-card">
        <div class="spin-history-card__head">
          <h3 class="spin-history-card__title">Reward timeline</h3>
          <p class="spin-history-card__sub">Spins, cashback credits, CashClaim payouts, and admin confirmations</p>
          <div class="spin-history-filters" id="spinHistoryFilters" role="tablist" aria-label="Filter reward history">
            <button type="button" class="spin-history-filter spin-history-filter--active" data-spin-history-filter="all">All</button>
            <button type="button" class="spin-history-filter" data-spin-history-filter="spin">Spin Cashback</button>
            <button type="button" class="spin-history-filter" data-spin-history-filter="cashclaim">CashClaim</button>
          </div>
        </div>
        <div id="spinHistoryList" class="spin-history-list reward-timeline" role="list">
          <p class="spin-history-msg spin-history-msg--muted">Loading rewards history…</p>
        </div>
      </div>

      <aside class="info-card spin-history-card spin-history-card--summary history-card">
        <h3 class="spin-history-card__title">Lifetime spin rewards</h3>
        <p class="spin-history-card__sub">Running total from your profile (updates when rewards credit).</p>
        <p class="spin-history-total" aria-live="polite">
          <span class="spin-history-total__inner">₹<span id="totalSpinRewards">0</span></span>
        </p>
      </aside>
    </div>
  </div>
</section>

<!-- ================= PRODUCT REQUEST HISTORY ================= -->
<section class="page spin-history-page dd-prh-page" id="product-request-history" data-page="product-request-history">
  <div class="spin-history-shell dd-prh-shell">
    <header class="spin-history-hero dd-prh-hero">
      <nav class="spin-history-breadcrumb" aria-label="Breadcrumb">
        <a href="#" data-page="home" class="spin-history-bc-link">Home</a>
        <span class="spin-history-bc-sep" aria-hidden="true">›</span>
        <a href="#" data-page="spin" class="spin-history-bc-link">Rewards</a>
        <span class="spin-history-bc-sep" aria-hidden="true">›</span>
        <span class="spin-history-bc-current">Product requests</span>
      </nav>
      <div class="dd-prh-hero__row">
        <div class="dd-prh-hero__copy">
          <h2 class="spin-history-hero__title">Product request history</h2>
          <p class="spin-history-hero__lead">Track products you asked us to add from Amazon, Flipkart, Myntra, and more.</p>
        </div>
        <button type="button" class="dd-prh-hero__cta" id="productRequestHistoryNewBtn" aria-label="Request a new product">
          <span class="dd-prh-hero__cta-icon" aria-hidden="true">+</span>
          <span>New request</span>
        </button>
      </div>
    </header>

    <div id="productRequestHistoryStats" class="dd-prh-stats" aria-live="polite"></div>

    <div class="spin-history-layout dd-prh-layout">
      <div class="info-card spin-history-card spin-history-card--list history-card dd-prh-card-shell">
        <div class="spin-history-card__head">
          <h3 class="spin-history-card__title">Your requests</h3>
          <p class="spin-history-card__sub">Newest first · filter by status or search</p>
          <div class="spin-history-filters dd-prh-filters" id="productRequestHistoryFilters" role="tablist" aria-label="Filter requests">
            <button type="button" class="spin-history-filter spin-history-filter--active" data-prh-filter="all">All</button>
            <button type="button" class="spin-history-filter" data-prh-filter="pending">Pending</button>
            <button type="button" class="spin-history-filter" data-prh-filter="added">Added</button>
            <button type="button" class="spin-history-filter" data-prh-filter="rejected">Rejected</button>
          </div>
          <div class="dd-prh-search-wrap">
            <label class="dd-prh-search-label" for="productRequestHistorySearch">Search</label>
            <div class="dd-prh-search-field">
              <span class="dd-prh-search-icon" aria-hidden="true">⌕</span>
              <input type="search" id="productRequestHistorySearch" class="dd-prh-search" placeholder="Product name or platform…" autocomplete="off" />
            </div>
          </div>
        </div>
        <div id="productRequestHistoryList" class="spin-history-list dd-prh-list" role="list">
          <div class="dd-prh-skeleton" aria-hidden="true"><span></span><span></span><span></span></div>
        </div>
      </div>
    </div>
  </div>
</section>



   <section class="page" id="about" data-page="about">
  <div class="about-container">

    <h2>About Dealzkart</h2>

    <!-- INTRO -->
    <div class="info-card">
      <p class="info-highlight">
        Dealzkart is a smart shopping rewards platform for India — discover curated deals,
        shop through verified partner stores, and earn real cashback, spins, and premium
        CashClaim rewards on eligible purchases.
      </p>
      <p>
        Browse products from <strong>Amazon, Flipkart, Myntra, Ajio</strong>, and more in one
        place. Categories include <strong>electronics, mobiles, fashion, home &amp; kitchen,
        beauty, books, sports, and daily essentials</strong> — updated with fresh deals every day.
      </p>
    </div>

    <!-- HOW SHOPPING WORKS -->
    <div class="info-card">
      <h3>How Shopping Works</h3>
      <p>
        Dealzkart curates products using official affiliate programs. When you tap
        <strong>Shop Deal</strong>, your order is tracked securely and you are redirected to
        the partner store to complete checkout at the <strong>same price</strong> as buying
        directly — we never add markup.
      </p>
      <ul class="info-list">
        <li>🔍 Smart search and personalized deal feeds based on your interests</li>
        <li>🛒 Save favourites and get deal alerts for products you care about</li>
        <li>📱 Works on web and in the Dealzkart Android app</li>
      </ul>
    </div>

    <!-- CASHCLAIM -->
    <div class="info-card">
      <h3>CashClaim — Premium Cashback</h3>
      <p>
        <strong>CashClaim</strong> is our premium verified-cashback feature for bigger purchases.
        When you shop through Dealzkart, eligible orders are tracked automatically — no manual
        entry needed.
      </p>
      <ul class="info-list">
        <li>💸 Eligible orders (typically ₹4,999+ individually or combined) unlock CashClaim</li>
        <li>📦 Estimated delivery, return protection period, and claim window shown on each order</li>
        <li>⏳ Claim within <strong>45 days after delivery</strong> once return protection ends</li>
        <li>✅ Submit verification proof; approved cashback is paid to your wallet</li>
        <li>📋 Track every step from purchase → delivery → eligible → submitted → paid</li>
      </ul>
      <p style="font-size:0.9rem;color:#6b7280;">
        CashClaim is separate from spin rewards and follows its own verification timeline.
      </p>
    </div>

    <!-- SPIN & STREAKS -->
    <div class="info-card">
      <h3>Spin, Streaks &amp; Order Rewards</h3>
      <ul class="info-list">
        <li>🎡 Unlock spins through genuine browsing, partner checkouts, and streak consistency</li>
        <li>💰 Spin the wheel for instant wallet rewards (up to ₹500 on eligible spins)</li>
        <li>🔥 Build activity streaks with regular Dealzkart shopping journeys</li>
        <li>💳 Withdraw earned balance via UPI when payout rules are met</li>
      </ul>
      <p style="font-size:0.9rem;color:#6b7280;">
        Rewards are designed for real shoppers — automated or fake activity is blocked server-side.
      </p>
    </div>

    <!-- NOTIFICATIONS -->
    <div class="info-card">
      <h3>Deal Alerts &amp; Notifications</h3>
      <p>
        Stay updated without spam. Dealzkart sends personalized product picks and important
        account updates when you enable notifications.
      </p>
      <ul class="info-list">
        <li>🔔 Up to <strong>2 curated deal notifications per day</strong> (not hourly spam)</li>
        <li>📬 CashClaim status, payout, spin, and wallet updates when relevant</li>
        <li>⚙️ Control notification sound in <strong>Settings</strong> inside the app menu</li>
      </ul>
    </div>

    <!-- TOKENS + REFERRAL -->
    <div class="info-card">
      <h3>Tokens &amp; Referral Rewards</h3>
      <ul class="info-list">
        <li>👥 Share your referral code and invite friends to Dealzkart</li>
        <li>🎁 Earn token rewards when referrals join and engage</li>
        <li>🪙 Collect tokens through referrals and reward actions</li>
        <li>💸 Convert tokens into wallet payout requests when thresholds are met</li>
      </ul>
    </div>

    <!-- XP + LEVEL SYSTEM -->
    <div class="info-card">
      <h3>XP, Levels &amp; Progress</h3>
      <ul class="info-list">
        <li>⚡ Earn XP from daily activity and partner shopping journeys</li>
        <li>⭐ Level up as your XP grows over time</li>
        <li>🏆 Higher levels unlock recognition and future bonus benefits</li>
        <li>🎯 Built for long-term genuine users, not one-time bonus hunters</li>
      </ul>
    </div>

    <!-- WALLET -->
    <div class="info-card">
      <h3>Wallet &amp; Transparency</h3>
      <p>Your Dealzkart wallet shows everything in one place:</p>
      <ul class="info-list">
        <li>Available balance ready to withdraw</li>
        <li>Pending and completed payout history</li>
        <li>Spin rewards, order rewards, and CashClaim payouts</li>
        <li>In-app notification centre for account updates</li>
      </ul>
      <p>
        All rewards and transactions are recorded transparently in your account.
      </p>
    </div>

    <!-- AFFILIATE DISCLOSURE -->
    <div class="info-card">
      <h3>Affiliate Disclosure</h3>
      <p>
        Dealzkart participates in affiliate programs with partner stores. We may earn a small
        commission when you purchase through our links — at <strong>no extra cost to you</strong>.
      </p>
      <p>
        Commissions help fund cashback, CashClaim, spins, and platform maintenance.
      </p>
    </div>

    <!-- GOAL -->
    <div class="info-card">
      <h3>Our Mission</h3>
      <p>
        We want online shopping in India to feel <strong>simpler, smarter, and more rewarding</strong>
        — with honest tracking, clear timelines, and real payouts you can trust.
      </p>
      <p class="info-highlight">
        Thank you for being part of Dealzkart 💚
      </p>
    </div>

  </div>
</section>

    <!-- SUPPORT -->
    <section class="page support-page" id="support" data-page="support">

  <!-- HERO -->
  <div class="support-hero fade-up">
    <h1>We’re here to help 🤝</h1>
    <p>
      Shopping rewards should be simple, transparent, and safe.
      Our support team is always ready to assist you.
    </p>
  </div>

  <!-- SUPPORT ACTIONS -->
  <div class="support-actions">

    <div class="support-box fade-up delay-1">
      <div class="support-emoji">📧</div>
      <h3>Email Support</h3>
      <p>For spins, rewards, wallet &amp; account issues</p>
      <div class="support-email"><a href="mailto:dronedealz8@gmail.com">dronedealz8@gmail.com</a></div>
      <span class="support-meta">Reply within 24 hours</span>
    </div>

    <div class="support-box fade-up delay-2">
      <div class="support-emoji">💬</div>
      <h3>WhatsApp &amp; Phone</h3>
      <p>Fast help for order rewards and account questions</p>
      <div class="support-email"><a href="https://wa.me/919363316461" rel="noopener noreferrer" target="_blank">+91 9363316461</a></div>
      <span class="support-meta"><a href="tel:+919363316461">Call</a> · <a href="https://wa.me/919363316461" rel="noopener noreferrer" target="_blank">WhatsApp</a></span>
    </div>

    <div class="support-box fade-up delay-3">
      <div class="support-emoji">🔐</div>
      <h3>Secure Accounts</h3>
      <p>
        Your data is protected with secure authentication
        and verified systems.
      </p>
      <span class="support-meta">We never ask OTPs</span>
    </div>

    <div class="support-box fade-up delay-4">
      <div class="support-emoji">🎯</div>
      <h3>Reward Assurance</h3>
      <p>
        Rewards are unlocked through order checks
        and anti-abuse protection.
      </p>
      <span class="support-meta">No fake promises</span>
    </div>

  </div>

  <!-- HOW WE PROTECT YOU -->
  <div class="support-timeline fade-up delay-5">
    <h2>How Dealz protects users</h2>

    <div class="timeline-item">
      <span>1</span>
      <p>You always buy from official platforms like Amazon & Flipkart</p>
    </div>

    <div class="timeline-item">
      <span>2</span>
      <p>Orders are tracked using secure affiliate systems</p>
    </div>

    <div class="timeline-item">
      <span>3</span>
      <p>Cashback is released only after genuine confirmation</p>
    </div>

    <div class="timeline-item">
      <span>4</span>
      <p>Wallet & payout records remain transparent</p>
    </div>
  </div>

  <!-- FAQ -->
  <div class="support-faq fade-up delay-5">
    <h2>Common questions</h2>

    <div class="faq-item">
      <h4>When will I receive rewards?</h4>
      <p>
        Rewards are credited as soon as order and spin checks pass.
      </p>
    </div>

    <div class="faq-item">
      <h4>Does Dealz increase product price?</h4>
      <p>
        No. You pay the same price as the original platform.
      </p>
    </div>

    <div class="faq-item">
      <h4>Is my money safe?</h4>
      <p>
        Yes. Dealz never handles your payment directly.
        You buy from trusted platforms only.
      </p>
    </div>
  </div>

  <!-- FOOTER NOTE -->
  <div class="support-bottom fade-up delay-6">
    <p>
      Dealz is built for honest savings and long-term trust.
    </p>
    <strong>— Team Dealz 💚</strong>
  </div>

</section>

  <!-- ================= REFER & EARN ================= -->
  <section class="page" id="refer" data-page="refer">
    <div class="about-container">
      <h2>Refer &amp; Earn 🎁</h2>
      <p style="margin-bottom:16px;color:#4b5563;">
        Invite friends to Dealzkart — when they join, shop, and earn rewards, you collect
        <strong>bonus tokens</strong> and strengthen your activity streak.
      </p>

      <div class="info-card">
        <p class="info-highlight" style="margin-bottom:12px;">
          Your personal referral code, copy buttons, share link, and live stats are in
          <a href="#account" class="inline-link" data-page="account" data-scroll="referralSection">Account → Referral program</a>.
        </p>
        <p style="font-size:0.92rem;color:#6b7280;margin:0;">
          Sign in to copy your code, share on WhatsApp, and track friends joined &amp; rewards earned.
        </p>
      </div>

      <div class="info-card">
        <h3>How it works</h3>
        <ol class="info-list" style="list-style:decimal;padding-left:20px;">
          <li>Open <strong>Account</strong> and copy your referral link or code.</li>
          <li>Share it with friends on WhatsApp, Instagram, or anywhere you like.</li>
          <li>Your friend signs up using your link and starts using Dealzkart.</li>
          <li>When they shop through partner deals and engage with rewards, you earn <strong>referral tokens</strong>.</li>
          <li>Convert tokens to wallet payout requests when you reach the threshold.</li>
        </ol>
      </div>

      <div class="info-card">
        <h3>What you earn</h3>
        <ul class="info-list">
          <li>🪙 <strong>Referral tokens</strong> when friends join and stay active on Dealzkart</li>
          <li>🔥 <strong>Streak progress</strong> — referring friends counts toward your rewards streak</li>
          <li>🏆 <strong>Leaderboard recognition</strong> for top referrers each season</li>
          <li>💸 Tokens can be exchanged for wallet balance and UPI withdrawal (see Account for rules)</li>
        </ul>
      </div>

      <div class="info-card">
        <h3>Best ways to share</h3>
        <ul class="info-list">
          <li>📲 Send your link directly — easiest for friends to sign up</li>
          <li>🛍️ Share a product deal you love + your referral link in the same message</li>
          <li>💸 Tell friends about <strong>CashClaim</strong> on big purchases and Spin rewards on daily deals</li>
          <li>🎡 Mention that Dealzkart tracks orders automatically — no extra forms for normal shopping</li>
        </ul>
      </div>

      <div class="info-card">
        <h3>What your friends get</h3>
        <ul class="info-list">
          <li>Curated deals from Amazon, Flipkart, Myntra, Ajio &amp; more in one app</li>
          <li>Spin rewards, wallet cashback, and XP as they shop genuinely</li>
          <li>Access to CashClaim on eligible premium orders (when they qualify)</li>
          <li>Personalized deal alerts — up to 2 helpful notifications per day</li>
        </ul>
      </div>

      <div class="info-card">
        <h3>Fair play</h3>
        <ul class="info-list">
          <li>Self-referrals, fake accounts, bots, and spam invites are blocked automatically</li>
          <li>Rewards credit only for genuine sign-ups and real shopping activity</li>
          <li>Abuse may pause referral rewards while we review — we aim to be fair</li>
        </ul>
        <p style="margin-top:12px;margin-bottom:0;">
          <a href="#account" class="inline-link primary-btn" data-page="account" data-scroll="referralSection" style="display:inline-block;text-decoration:none;padding:10px 18px;border-radius:10px;">
            Go to my referral code →
          </a>
        </p>
      </div>
    </div>
  </section>

  <!-- ================= REWARDS GUIDE ================= -->
  <section class="page" id="rewards-guide" data-page="rewards-guide">
    <div class="about-container">
      <h2>How Rewards Work ⭐</h2>
      <p style="margin-bottom:16px;color:#4b5563;">
        Dealzkart rewards genuine shoppers with spins, wallet cashback, tokens, XP, and
        <strong>CashClaim</strong> on eligible orders — all tracked transparently in your Account.
      </p>

      <div class="info-card">
        <h3>Spin Rewards</h3>
        <ul class="info-list">
          <li>🎡 Spins unlock through qualifying checkout patterns, browsing activity, and streak milestones</li>
          <li>💰 Spin the wheel for instant wallet rewards (up to ₹500 on eligible spins)</li>
          <li>📅 Monthly spin unlock limits apply per user — regular shoppers reach thresholds faster</li>
          <li>✅ Rewards are credited automatically after a successful spin</li>
        </ul>
        <p style="font-size:0.9rem;color:#6b7280;margin-bottom:0;">
          Open <a href="#spin" class="inline-link" data-page="spin">Spin &amp; Rewards</a> when your next spin is ready.
        </p>
      </div>

      <div class="info-card">
        <h3>Streaks &amp; Activity</h3>
        <ul class="info-list">
          <li>🔥 Build a rewards streak with consistent Dealzkart shopping journeys</li>
          <li>🛍️ Partner checkouts, sharing deals, referrals, and tokens all strengthen your streak</li>
          <li>📈 Higher streaks help unlock spins and keep you visible on the leaderboard</li>
          <li>⏸️ Long gaps in activity can reset streak progress — stay consistent for best results</li>
        </ul>
      </div>

      <div class="info-card">
        <h3>CashClaim (Premium Cashback)</h3>
        <p>
          <strong>CashClaim</strong> is separate from spin rewards — it covers verified cashback on
          bigger eligible purchases tracked through Dealzkart.
        </p>
        <ul class="info-list">
          <li>💸 Eligible orders (typically ₹4,999+ individually or combined) unlock CashClaim</li>
          <li>📦 Delivery, return protection, and your 45-day claim window are shown on each order</li>
          <li>⏳ Submit your claim after return protection ends — before the expiry date shown</li>
          <li>✅ Approved cashback is paid to your wallet with full status tracking</li>
        </ul>
        <p style="font-size:0.9rem;color:#6b7280;margin-bottom:0;">
          Track orders in <a href="#cashclaim" class="inline-link" data-page="cashclaim">CashClaim</a>.
        </p>
      </div>

      <div class="info-card">
        <h3>Daily XP &amp; Levels</h3>
        <ul class="info-list">
          <li>⚡ Claim free XP once every day from your Account dashboard</li>
          <li>⭐ XP helps you level up over time — higher levels unlock recognition and future perks</li>
          <li>🎯 Built for long-term genuine users, not one-time bonus hunters</li>
        </ul>
      </div>

      <div class="info-card">
        <h3>Token Rewards &amp; Referrals</h3>
        <ul class="info-list">
          <li>🪙 Tokens are earned through referrals and certain reward milestones</li>
          <li>👥 Share your referral code — earn when friends join and stay active</li>
          <li>💸 Convert tokens into wallet payout requests when thresholds are met</li>
        </ul>
        <p style="font-size:0.9rem;color:#6b7280;margin-bottom:0;">
          Your code and stats live in <a href="#account" class="inline-link" data-page="account" data-scroll="referralSection">Account → Referral program</a>.
        </p>
      </div>

      <div class="info-card">
        <h3>Wallet &amp; Payouts</h3>
        <ul class="info-list">
          <li>💳 Your wallet shows available balance, pending rewards, and payout history</li>
          <li>🏦 Withdraw via UPI when payout rules and minimum thresholds are met</li>
          <li>📋 Spin rewards, order rewards, CashClaim payouts, and token conversions all appear in one place</li>
          <li>📬 Important wallet and payout updates arrive in your in-app notification centre</li>
        </ul>
      </div>

      <div class="info-card">
        <h3>Deal Alerts &amp; Notifications</h3>
        <ul class="info-list">
          <li>🔔 Up to <strong>2 curated deal notifications per day</strong> — helpful picks, not hourly spam</li>
          <li>📬 CashClaim status, spin unlocks, payout updates, and wallet alerts when relevant</li>
          <li>⚙️ Toggle notification sound in <strong>Settings</strong> inside the app menu</li>
        </ul>
      </div>

      <div class="info-card">
        <h3>Fair play protection</h3>
        <ul class="info-list">
          <li>🛡️ Automated, fake, bot, or spam behaviour is blocked by server-side checks</li>
          <li>🚫 Self-referrals, duplicate accounts, and suspicious patterns may pause rewards</li>
          <li>⚖️ We review flagged activity and aim to be fair — genuine shoppers are protected</li>
        </ul>
        <p style="margin-top:12px;margin-bottom:0;">
          <a href="#account" class="inline-link primary-btn" data-page="account" style="display:inline-block;text-decoration:none;padding:10px 18px;border-radius:10px;margin-right:8px;">
            View my rewards →
          </a>
          <a href="#about" class="inline-link" data-page="about" style="font-size:0.92rem;">
            Learn more on About
          </a>
        </p>
      </div>
    </div>
  </section>

  <!-- ================= FAQ ================= -->
  <section class="page" id="faq" data-page="faq">
    <div class="about-container">
      <h2>Frequently Asked Questions</h2>

      <div class="info-card faq-item">
        <h4>When does spin unlock?</h4>
        <p>Spin unlocks when eligible order goals and streak conditions are met.</p>
      </div>

      <div class="info-card faq-item">
        <h4>How are rewards credited?</h4>
        <p>Rewards are credited through spin and order-based reward actions.</p>
      </div>

      <div class="info-card faq-item">
        <h4>Can I spin multiple times per day?</h4>
        <p>No. Each user can spin only once per day.</p>
      </div>

      <div class="info-card faq-item">
        <h4>What happens for invalid behavior?</h4>
        <p>Fraudulent or automated behavior can suspend reward eligibility.</p>
      </div>

      <div class="info-card faq-item">
        <h4>How do I withdraw rewards?</h4>
        <p>Once you collect enough tokens, you can request withdrawal through your account.</p>
      </div>
    </div>
  </section>

  <!-- ================= CASHCLAIM (premium feature home) ================= -->
  <section class="page cashclaim-page" id="cashclaim" data-page="cashclaim" aria-label="CashClaim">
    <div class="cashclaim-shell">

      <header class="cashclaim-header cc-animate">
        <h1 class="cashclaim-header__title">💸 CashClaim</h1>
        <p class="cashclaim-header__subtitle">Claim verified cashback on eligible premium purchases.</p>
      </header>

      <button type="button" class="cashclaim-my-claims-btn cc-animate cc-animate--1" id="cashclaimOpenMyClaims">
        <i class="fas fa-list-check" aria-hidden="true"></i>
        My Claims
      </button>

      <div class="cashclaim-hero-card cc-animate cc-animate--1" aria-label="CashClaim highlights">
        <div class="cashclaim-hero-card__shine" aria-hidden="true"></div>
        <ul class="cashclaim-hero-card__grid">
          <li class="cashclaim-hero-card__item">
            <span class="cashclaim-hero-card__icon" aria-hidden="true"><i class="fas fa-shield"></i></span>
            <span class="cashclaim-hero-card__label">Verified Cashback</span>
          </li>
          <li class="cashclaim-hero-card__item">
            <span class="cashclaim-hero-card__icon" aria-hidden="true"><i class="fas fa-receipt"></i></span>
            <span class="cashclaim-hero-card__label">Eligible Orders</span>
          </li>
          <li class="cashclaim-hero-card__item">
            <span class="cashclaim-hero-card__icon" aria-hidden="true"><i class="fas fa-bolt"></i></span>
            <span class="cashclaim-hero-card__label">Fast Verification</span>
          </li>
          <li class="cashclaim-hero-card__item">
            <span class="cashclaim-hero-card__icon" aria-hidden="true"><i class="fas fa-lock"></i></span>
            <span class="cashclaim-hero-card__label">Secure Process</span>
          </li>
        </ul>
        <p class="cashclaim-hero-card__footnote">Cashback is available only after successful verification.</p>
      </div>

      <section class="cashclaim-section cashclaim-section--card cc-animate cc-animate--2" aria-labelledby="cashclaim-how-title">
        <h2 class="cashclaim-section__title" id="cashclaim-how-title">How it works</h2>
        <ol class="cashclaim-stepper">
          <li class="cashclaim-step">
            <div class="cashclaim-step__marker" aria-hidden="true"><span>1</span></div>
            <div class="cashclaim-step__body">
              <div class="cashclaim-step__head">
                <span class="cashclaim-step__emoji" aria-hidden="true">🛒</span>
                <h3 class="cashclaim-step__title">Shop through Dealzkart</h3>
              </div>
              <p class="cashclaim-step__desc">Purchase premium products using Dealzkart.</p>
            </div>
          </li>
          <li class="cashclaim-step">
            <div class="cashclaim-step__marker" aria-hidden="true"><span>2</span></div>
            <div class="cashclaim-step__body">
              <div class="cashclaim-step__head">
                <span class="cashclaim-step__emoji" aria-hidden="true">📦</span>
                <h3 class="cashclaim-step__title">Wait for Delivery</h3>
              </div>
              <p class="cashclaim-step__desc">Receive your order before submitting a cashback request.</p>
            </div>
          </li>
          <li class="cashclaim-step">
            <div class="cashclaim-step__marker" aria-hidden="true"><span>3</span></div>
            <div class="cashclaim-step__body">
              <div class="cashclaim-step__head">
                <span class="cashclaim-step__emoji" aria-hidden="true">📝</span>
                <h3 class="cashclaim-step__title">Submit CashClaim</h3>
              </div>
              <p class="cashclaim-step__desc">Upload your order details and proof.</p>
            </div>
          </li>
          <li class="cashclaim-step">
            <div class="cashclaim-step__marker" aria-hidden="true"><span>4</span></div>
            <div class="cashclaim-step__body">
              <div class="cashclaim-step__head">
                <span class="cashclaim-step__emoji" aria-hidden="true">🔍</span>
                <h3 class="cashclaim-step__title">Verification</h3>
              </div>
              <p class="cashclaim-step__desc">Our team verifies your request.</p>
            </div>
          </li>
          <li class="cashclaim-step">
            <div class="cashclaim-step__marker" aria-hidden="true"><span>5</span></div>
            <div class="cashclaim-step__body">
              <div class="cashclaim-step__head">
                <span class="cashclaim-step__emoji" aria-hidden="true">💰</span>
                <h3 class="cashclaim-step__title">Cashback Approved</h3>
              </div>
              <p class="cashclaim-step__desc">Cashback is credited after successful verification.</p>
            </div>
          </li>
        </ol>
      </section>

      <div class="cashclaim-card cc-animate cc-animate--3" aria-labelledby="cashclaim-eligibility-title">
        <h2 class="cashclaim-card__title" id="cashclaim-eligibility-title">Who can use CashClaim?</h2>
        <ul class="cashclaim-checklist">
          <li><i class="fas fa-check-circle" aria-hidden="true"></i> Premium purchases only</li>
          <li><i class="fas fa-check-circle" aria-hidden="true"></i> Eligible orders appear automatically</li>
          <li><i class="fas fa-check-circle" aria-hidden="true"></i> Cashback can only be claimed after delivery</li>
          <li><i class="fas fa-check-circle" aria-hidden="true"></i> Cashback is approved after successful verification</li>
        </ul>
      </div>

      <div class="cashclaim-notice cc-animate cc-animate--4" role="note" aria-labelledby="cashclaim-notice-title">
        <div class="cashclaim-notice__icon" aria-hidden="true"><i class="fas fa-triangle-exclamation"></i></div>
        <div class="cashclaim-notice__content">
          <h2 class="cashclaim-notice__title" id="cashclaim-notice-title">Important</h2>
          <p class="cashclaim-notice__text">Screenshots alone do not guarantee cashback approval. Cashback is processed only after successful verification according to Dealzkart policies.</p>
        </div>
      </div>

      <section class="cashclaim-section cc-animate cc-animate--5" aria-labelledby="cashclaim-claims-home-title" id="cashclaimClaimsHomeSection" hidden>
        <div class="cashclaim-orders-head">
          <h2 class="cashclaim-section__title" id="cashclaim-claims-home-title">My Claims</h2>
          <button type="button" class="cashclaim-claims-home__link" id="cashclaimClaimsViewAll" hidden>View all</button>
        </div>
        <div id="cashclaimClaimsHomePanel" class="cashclaim-claims-home-panel" aria-live="polite"></div>
      </section>

      <section class="cashclaim-section cc-animate cc-animate--5b" aria-labelledby="cashclaim-orders-title">
        <div class="cashclaim-orders-head">
          <h2 class="cashclaim-section__title" id="cashclaim-orders-title">Your Purchases</h2>
          <span class="cashclaim-orders-pull" id="cashclaimPullIndicator" aria-hidden="true"></span>
        </div>
        <div id="cashclaimOrdersPanel" class="cashclaim-orders-panel" data-no-tab-swipe aria-live="polite"></div>
      </section>

      <div class="cashclaim-help cc-animate cc-animate--6" aria-labelledby="cashclaim-help-title">
        <div class="cashclaim-help__icon" aria-hidden="true"><i class="fas fa-circle-question"></i></div>
        <div class="cashclaim-help__body">
          <h2 class="cashclaim-help__title" id="cashclaim-help-title">Need Help?</h2>
          <p class="cashclaim-help__text">Learn how CashClaim works before submitting your first cashback request.</p>
          <button type="button" class="cashclaim-help__btn" id="cashclaimLearnMoreBtn">Learn More</button>
        </div>
      </div>

    </div>
  </section>

  <!-- ================= CASHCLAIM DETAIL (review before submit) ================= -->
  <section class="page cashclaim-detail-page" id="cashclaim-detail" data-page="cashclaim-detail" aria-label="CashClaim Details">
    <div class="cc-detail-app">
      <header class="cc-detail-topbar">
        <button type="button" class="cc-detail-back" id="cashclaimDetailBack" aria-label="Back to CashClaim">
          <i class="fas fa-arrow-left" aria-hidden="true"></i>
        </button>
        <div class="cc-detail-topbar__copy">
          <h1 class="cc-detail-topbar__title">CashClaim</h1>
          <p class="cc-detail-topbar__subtitle">Review your purchase before submitting your cashback request.</p>
        </div>
      </header>
      <main id="cashclaimDetailRoot" class="cc-detail-root" aria-live="polite"></main>
      <footer class="cc-detail-footer" id="cashclaimDetailFooter" hidden>
        <button type="button" class="cc-detail-continue" id="cashclaimDetailContinue">Continue</button>
      </footer>
    </div>
  </section>

  <!-- ================= CASHCLAIM REQUEST FORM ================= -->
  <section class="page cashclaim-submit-page" id="cashclaim-submit" data-page="cashclaim-submit" aria-label="CashClaim Request">
    <div class="cc-submit-app">
      <header class="cc-detail-topbar cc-detail-topbar--compact">
        <button type="button" class="cc-detail-back" id="cashclaimSubmitBack" aria-label="Back to review">
          <i class="fas fa-arrow-left" aria-hidden="true"></i>
        </button>
        <div class="cc-detail-topbar__copy">
          <h1 class="cc-detail-topbar__title">CashClaim Request</h1>
          <p class="cc-detail-topbar__subtitle">Submit your cashback verification request.</p>
        </div>
      </header>
      <main id="cashclaimSubmitRoot" class="cc-submit-root" aria-live="polite"></main>
      <footer class="cc-submit-footer" id="cashclaimSubmitFooter" hidden>
        <p class="cc-submit-footer__hint" id="cashclaimSubmitHint" role="status" aria-live="polite"></p>
        <button type="button" class="cc-submit-btn" id="cashclaimSubmitBtn" disabled aria-disabled="true">Submit CashClaim</button>
      </footer>
    </div>
  </section>

  <!-- ================= CASHCLAIM SUCCESS ================= -->
  <section class="page cashclaim-success-page" id="cashclaim-success" data-page="cashclaim-success" aria-label="CashClaim Submitted">
    <div class="cc-success-app">
      <main id="cashclaimSuccessRoot" class="cc-success-root" aria-live="polite"></main>
      <footer class="cc-success-footer">
        <button type="button" class="cc-success-btn cc-success-btn--primary" id="cashclaimSuccessViewClaims">View My Claims</button>
        <button type="button" class="cc-success-btn cc-success-btn--ghost" id="cashclaimSuccessShop">Back To Shopping</button>
      </footer>
    </div>
  </section>

  <!-- ================= MY CASHCLAIMS DASHBOARD ================= -->
  <section class="page cashclaim-claims-page" id="cashclaim-claims" data-page="cashclaim-claims" aria-label="My CashClaims">
    <div class="cc-claims-app">
      <header class="cc-detail-topbar cc-detail-topbar--compact">
        <button type="button" class="cc-detail-back" id="cashclaimClaimsBack" aria-label="Back to CashClaim">
          <i class="fas fa-arrow-left" aria-hidden="true"></i>
        </button>
        <div class="cc-detail-topbar__copy">
          <h1 class="cc-detail-topbar__title">My CashClaims</h1>
          <p class="cc-detail-topbar__subtitle">Track all your cashback requests.</p>
        </div>
        <span class="cc-claims-pull" id="cashclaimClaimsPull" aria-hidden="true"></span>
      </header>
      <main id="cashclaimClaimsRoot" class="cc-claims-root" aria-live="polite"></main>
    </div>
  </section>

  <!-- ================= CASHCLAIM REQUEST DETAIL ================= -->
  <section class="page cashclaim-claim-detail-page" id="cashclaim-claim-detail" data-page="cashclaim-claim-detail" aria-label="CashClaim Details">
    <div class="cc-claims-detail-app">
      <header class="cc-detail-topbar cc-detail-topbar--compact">
        <button type="button" class="cc-detail-back" id="cashclaimClaimDetailBack" aria-label="Back to My Claims">
          <i class="fas fa-arrow-left" aria-hidden="true"></i>
        </button>
        <div class="cc-detail-topbar__copy">
          <h1 class="cc-detail-topbar__title">Claim Details</h1>
          <p class="cc-detail-topbar__subtitle">Full submission and verification progress.</p>
        </div>
      </header>
      <main id="cashclaimClaimDetailRoot" class="cc-claims-detail-root" aria-live="polite"></main>
    </div>
  </section>

</main>

  

  <!-- Bottom navigation bar -->
  <nav class="bottom-nav" style="display: flex !important; visibility: visible !important; opacity: 1 !important; position: fixed !important; bottom: 0 !important; z-index: 10000030 !important; pointer-events: auto !important;">
    <button class="bottom-item active" data-page="home" type="button">
      <i class="fas fa-home"></i>
      <span>Home</span>
    </button>
    <button class="bottom-item" data-page="deals" type="button">
      <i class="fas fa-tags"></i>
      <span>Dealz</span>
    </button>
    <button class="bottom-item" data-page="spin" type="button">
      <i class="fas fa-sync-alt"></i>
      <span>Spin</span>
    </button>
    <button class="bottom-item" data-page="cashclaim" type="button" aria-label="CashClaim">
      <i class="fas fa-money-bill-wave"></i>
      <span>CashClaim</span>
    </button>
    <button class="bottom-item" data-page="account" type="button">
      <span class="bottom-account-wrap">
        <img id="bottomProfileIcon" src="" alt="Profile" class="bottom-profile-avatar" style="display:none;">
        <i class="fas fa-user-circle bottom-account-fallback"></i>
        <span id="ddAccountNotifBadge" class="dd-account-notif-badge" hidden aria-hidden="true"></span>
      </span>
      <span>Account</span>
    </button>
  </nav>

  <!-- IMMEDIATE BOTTOM NAV: visible + clickable before script.js / Firebase finish -->
  <script>
    (function () {
      var NAV_CSS =
        "display:flex!important;visibility:visible!important;opacity:1!important;position:fixed!important;bottom:0!important;left:0!important;right:0!important;width:100%!important;z-index:10000030!important;pointer-events:auto!important;";

      function forceBottomNavVisible() {
        var bottomNav = document.querySelector(".bottom-nav");
        if (bottomNav) bottomNav.style.cssText = NAV_CSS;
      }

      function flushQueuedNav() {
        var page = window.__ddPendingBottomNavPage;
        if (!page || typeof window.showPage !== "function") return;
        window.__ddPendingBottomNavPage = null;
        try {
          window.__dd_nav_instant = true;
          window.showPage(page, true);
        } catch (e) {}
        window.__dd_nav_instant = false;
      }

      function onBottomNavActivate(page, btn) {
        if (!page) return;
        try {
          document.querySelectorAll(".bottom-item").forEach(function (b) {
            b.classList.toggle("active", b.getAttribute("data-page") === page);
            b.classList.remove("dd-nav-press");
          });
          if (btn) {
            btn.classList.add("dd-nav-press");
            setTimeout(function () {
              try {
                btn.classList.remove("dd-nav-press");
              } catch (e0) {}
            }, 160);
          }
        } catch (e1) {}

        function go() {
          if (typeof window.showPage === "function") {
            window.__dd_nav_instant = true;
            try {
              window.showPage(page, true);
            } catch (e2) {}
            window.__dd_nav_instant = false;
            return;
          }
          window.__ddPendingBottomNavPage = page;
        }

        /* Prefetch route chunk before showPage (code-split pages). */
        if (window.ddLazy && typeof window.ddLazy.ensurePage === "function") {
          try {
            window.ddLazy.prefetch(page);
          } catch (ePref) {}
          if (!window.ddLazy.isPageReady(page)) {
            window.ddLazy.ensurePage(page).then(go, go);
            return;
          }
        }
        go();
      }

      function bindEarlyBottomNav() {
        var nav = document.querySelector(".bottom-nav");
        if (!nav || nav.__ddEarlyNavBound) return;
        nav.__ddEarlyNavBound = true;
        forceBottomNavVisible();

        /* Mobile browsers often suppress `click` while momentum scroll is
           decelerating (~1–2s). Activate on pointer/touch down so tabs work mid-scroll. */
        var lastPage = "";
        var lastAt = 0;
        var DEDUPE_MS = 450;

        function stopScrollInertia() {
          try {
            var y = window.scrollY || window.pageYOffset || 0;
            if (typeof window.scrollTo === "function") {
              window.scrollTo(0, y);
            }
            if (document.documentElement) document.documentElement.scrollTop = y;
            if (document.body) document.body.scrollTop = y;
          } catch (eStop) {}
        }

        function activateFromEvent(ev) {
          var btn = ev.target && ev.target.closest ? ev.target.closest(".bottom-item") : null;
          if (!btn || !nav.contains(btn)) return false;
          var page = btn.getAttribute("data-page");
          if (!page) return false;
          var now = Date.now();
          if (page === lastPage && now - lastAt < DEDUPE_MS) {
            if (ev.cancelable) {
              try {
                ev.preventDefault();
              } catch (ePrev) {}
            }
            try {
              ev.stopPropagation();
            } catch (eStop2) {}
            return true;
          }
          lastPage = page;
          lastAt = now;
          if (ev.cancelable) {
            try {
              ev.preventDefault();
            } catch (ePrev2) {}
          }
          try {
            ev.stopPropagation();
          } catch (eStop3) {}
          stopScrollInertia();
          onBottomNavActivate(page, btn);
          return true;
        }

        nav.addEventListener(
          "pointerdown",
          function (ev) {
            if (ev.pointerType === "mouse" && ev.button !== 0) return;
            activateFromEvent(ev);
          },
          true
        );

        /* Older Android WebViews without reliable Pointer Events */
        nav.addEventListener(
          "touchstart",
          function (ev) {
            if (typeof window.PointerEvent === "function") return;
            activateFromEvent(ev);
          },
          { capture: true, passive: false }
        );

        nav.addEventListener(
          "click",
          function (ev) {
            var btn = ev.target && ev.target.closest ? ev.target.closest(".bottom-item") : null;
            if (!btn || !nav.contains(btn)) return;
            var page = btn.getAttribute("data-page");
            if (page && page === lastPage && Date.now() - lastAt < DEDUPE_MS) {
              ev.preventDefault();
              ev.stopPropagation();
              return;
            }
            activateFromEvent(ev);
          },
          true
        );
      }

      if (document.readyState === "loading") {
        document.addEventListener("DOMContentLoaded", function () {
          forceBottomNavVisible();
          bindEarlyBottomNav();
        });
      } else {
        forceBottomNavVisible();
        bindEarlyBottomNav();
      }
      window.addEventListener("load", function () {
        forceBottomNavVisible();
        flushQueuedNav();
      });
      /* Poll briefly until showPage exists so early taps still route */
      var tries = 0;
      var poll = setInterval(function () {
        tries += 1;
        if (typeof window.showPage === "function") {
          clearInterval(poll);
          flushQueuedNav();
        } else if (tries > 80) {
          clearInterval(poll);
        }
      }, 50);
    })();
  </script>

  <!-- Firebase SDKs (compat v12) – App Check must be last -->
  <script src="https://www.gstatic.com/firebasejs/12.6.0/firebase-app-compat.js"></script>
  <script src="https://www.gstatic.com/firebasejs/12.6.0/firebase-auth-compat.js"></script>
  <script src="/js/dd-google-auth.js?v=20260802restore"></script>
  <script src="https://www.gstatic.com/firebasejs/12.6.0/firebase-firestore-compat.js"></script>
  <script src="https://www.gstatic.com/firebasejs/12.6.0/firebase-storage-compat.js"></script>
  <script src="https://www.gstatic.com/firebasejs/12.6.0/firebase-functions-compat.js"></script>
  <script src="https://www.gstatic.com/firebasejs/12.6.0/firebase-app-check-compat.js"></script>

<script>
  /* Capture deep-link path + hash BEFORE auth/boot (App Links + hash routes). */
  if (typeof window.ddDeepLinkSealIncomingUrl === "function") {
    window.ddDeepLinkSealIncomingUrl(window.location.href, "index-inline");
  } else {
    window.__dd_deep_link_hash = window.location.hash || "";
    window.__dd_deep_link_path = window.__dd_deep_link_path || (window.location.pathname + window.location.search);
    window.__dd_deep_link_full_url = window.location.href || "";
  }
  console.log(
    "[DEEP_LINK_TRACE] ORIGINAL=" +
      (window.__dd_original_incoming_deep_link_url || window.__dd_deep_link_full_url) +
      " CURRENT=" +
      window.location.href
  );
  if (typeof window.ddDeepLinkCapturePendingProduct === "function") {
    window.ddDeepLinkCapturePendingProduct(null, "index-inline");
  }

  /* Notification / deep-link entry: skip home hanging banner — go straight to target page. */
  (function () {
    function markSkipHomePendulum() {
      window.__dd_skip_home_entry_pendulum = true;
      try {
        sessionStorage.setItem("dk_skip_home_entry_pendulum_v1", "1");
      } catch (eSkip) {}
    }
    var path = String(window.location.pathname || "");
    if (/^\/go\//i.test(path) || /^\/(?:product|deal)\//i.test(path)) {
      markSkipHomePendulum();
      return;
    }
    var orig =
      window.__dd_original_incoming_deep_link_url ||
      window.__dd_deep_link_full_url ||
      window.location.href ||
      "";
    if (/\/go\//i.test(orig) || /\/(?:product|deal)\//i.test(orig)) {
      markSkipHomePendulum();
      return;
    }
    var hash = String(window.__dd_deep_link_hash || window.location.hash || "")
      .replace(/^#\/?/, "")
      .trim();
    var first = hash.split("/")[0].split("?")[0].toLowerCase();
    if (first && first !== "home") {
      markSkipHomePendulum();
    }
  })();

  /* Referral → signup ONLY when NOT a product/deal deep link (product ?ref= stays on product page). */
  (function () {
    var originalUrl =
      (typeof window.ddDeepLinkGetOriginalIncomingUrl === "function" &&
        window.ddDeepLinkGetOriginalIncomingUrl()) ||
      window.__dd_original_incoming_deep_link_url ||
      window.location.href;
    var isProductLink =
      (typeof window.ddDeepLinkIsProductIncomingUrl === "function" &&
        window.ddDeepLinkIsProductIncomingUrl(originalUrl)) ||
      /\/(?:product|deal)\//i.test(String(originalUrl || ""));

    var urlHash = window.location.hash || "";
    var urlParams = new URLSearchParams(window.location.search);
    var pathRef = (function () {
      try {
        var p = (window.location.pathname || "").replace(/\/+$/, "");
        var m = p.match(/^\/ref\/([^/]+)$/i);
        if (m && m[1]) return String(m[1]).trim();
        m = p.match(/^\/signup\/ref\/([^/]+)$/i);
        if (m && m[1]) return String(m[1]).trim();
      } catch (eP) {}
      return "";
    })();
    var hasReferral =
      !isProductLink &&
      (pathRef ||
        urlHash.includes("signup") ||
        urlHash.includes("ref=") ||
        urlParams.has("ref") ||
        urlParams.has("code"));
    if (hasReferral) {
      var ref = pathRef || urlParams.get("ref") || urlParams.get("code");
      if (!ref && urlHash.indexOf("ref=") !== -1) {
        var hashPart = urlHash.split("?")[1];
        if (hashPart) {
          var hp = new URLSearchParams(hashPart);
          ref = hp.get("ref") || hp.get("code");
        }
      }
      ref = (ref || "").trim();
      window.location.replace("signup.html" + (ref ? "?ref=" + encodeURIComponent(ref) : ""));
      return;
    }
    if (isProductLink) {
      try {
        var refOnProduct = urlParams.get("ref") || urlParams.get("code");
        if (refOnProduct && String(refOnProduct).trim()) {
          localStorage.setItem("pendingReferral", String(refOnProduct).trim().toUpperCase());
        }
      } catch (eProdRef) {}
    }
  })();

  /* Web Push: supports inline config, meta tag, or localStorage fallback after deploy changes. */
  window.__FCM_VAPID_KEY__ =
    window.__FCM_VAPID_KEY__ ||
    (function () {
      try {
        var meta = document.querySelector('meta[name="fcm-vapid-key"]');
        var metaValue = meta ? String(meta.getAttribute("content") || "").trim() : "";
        if (metaValue) return metaValue;
      } catch (eMeta) {}
      try {
        var stored = localStorage.getItem("dd_fcm_vapid_key");
        if (stored && String(stored).trim()) return String(stored).trim();
      } catch (eStored) {}
      return "";
    })();

  var __DD_AUTH_DOMAIN__ = (function () {
    try {
      var h = window.location && window.location.hostname;
      if (/^(dealzkart\.shop|www\.dealzkart\.shop)$/i.test(h || "")) return "dealzkart.shop";
    } catch (e) {}
    return "dronedealz-6c6be.firebaseapp.com";
  })();

  const firebaseConfig = {
    apiKey: "AIzaSyBpdGTUyYikdXiyQez4HF34cA3Sgmy3JNw",
    authDomain: __DD_AUTH_DOMAIN__,
    projectId: "dronedealz-6c6be",
    storageBucket: "dronedealz-6c6be.firebasestorage.app"
,
    messagingSenderId: "995697001234",
    appId: "1:995697001234:web:73c7891f400f258a17e9cb",
    measurementId: "G-QGH3Q76ZH0"
  };

  if (!firebase.apps.length) {
    firebase.initializeApp(firebaseConfig);
  }

  /* ===============================================================
     ✅ DEALZKART CHROME PRODUCT LOADING FIX
     App starts ONLY after Firebase is ready (onAuthStateChanged + wait + appCheckReadyPromise).
     FIREBASE CONSOLE: App Check → Allowed Domains: dealzkart.shop, www.dealzkart.shop
  =============================================================== */

  /* ============================================================
     APP CHECK (DEV: set false to avoid 403 on Buy/Spin/Claim)
     Production: set TRUE and turn ON Enforce in Console.
     Console: App Check → Turn OFF "Enforce" for:
       Cloud Firestore, Authentication, Functions, Hosting
  ============================================================= */
  var APP_CHECK_ENABLED = false;
  if (APP_CHECK_ENABLED) {
    self.FIREBASE_APPCHECK_DEBUG_TOKEN = true;
    var RECAPTCHA_SITE_KEY = "6LdsenUsAAAAANj0rQNiNYGZYCxCSeDYL9DTRRrq";
    firebase.appCheck().activate(RECAPTCHA_SITE_KEY, true);
  }

  window.firebase = firebase;
  window.auth = firebase.auth();
  window.storage = firebase.storage();

  /* ✅ Callables: same region as deployed (asia-south1). Avoids default us-central1 → 403 / not found. */
  window.functions = firebase.app().functions("asia-south1");

  /* =========================================================
     ✅ CURSOR FIX: FIREBASE READY INITIALIZER
     Chrome loads faster than Firebase AppCheck/Auth.
     Wait for Auth + AppCheck before loading data.
  ========================================================= */
  function wait(ms) {
    return new Promise(function (resolve) { setTimeout(resolve, ms); });
  }
  window.completeAuthBoot = function completeAuthBoot() {
    if (window.__ddAuthBootComplete) return;
    window.__ddAuthBootComplete = true;
    window.__ddShellRevealed = true;
    try {
      document.body.classList.remove("dd-auth-boot-hidden");
    } catch (eBody) {}
    /* authBootOverlay flash screen removed — do not recreate or wait on it */
    var ov = document.getElementById("authBootOverlay");
    if (ov && ov.parentNode) {
      try {
        ov.parentNode.removeChild(ov);
      } catch (eOv) {}
    }
    var pend = document.getElementById("homeEntryPendulumRoot");
    if (pend && pend.parentNode) {
      try {
        pend.parentNode.removeChild(pend);
      } catch (ePend) {}
    }
    if (typeof window.ddRecoverStuckUi === "function") window.ddRecoverStuckUi();
    if (typeof window.__ddLoadFirebaseMessaging === "function") {
      window.__ddLoadFirebaseMessaging();
    }
  };
  /* Reveal app immediately — no flash / boot overlay */
  window.completeAuthBoot();
  if (false && window.ddWaitHint) {
    window.ddWaitHint.start(
      "authBoot",
      document.getElementById("authBootWaitSub"),
      window.ddWaitHint.AUTH_BOOT,
      1400
    );
  }
  window.__ddLoadFirebaseMessaging = function () {
    if (typeof isNotificationEnabled === "function" && !isNotificationEnabled()) return;
    if (window.__ddMessagingScriptLoading || (window.firebase && window.firebase.messaging)) return;
    window.__ddMessagingScriptLoading = true;
    var s = document.createElement("script");
    s.src = "https://www.gstatic.com/firebasejs/12.6.0/firebase-messaging-compat.js";
    s.async = true;
    s.onload = function () {
      var tries = 0;
      (function pollFcmInit() {
        try {
          if (typeof initDealzkartWebPush === "function") {
            initDealzkartWebPush();
            return;
          }
        } catch (eFcm) {}
        if (++tries < 50) setTimeout(pollFcmInit, 50);
      })();
    };
    document.head.appendChild(s);
  };
  function stripDdGuestQueryParam() {
    try {
      var url = new URL(window.location.href);
      if (url.searchParams.get("dd_guest") !== "1") return;
      url.searchParams.delete("dd_guest");
      var q = url.searchParams.toString();
      /* Drop hash so a previous #account session does not stick for guest browse. */
      window.history.replaceState({}, "", url.pathname + (q ? "?" + q : ""));
    } catch (eStrip) {}
  }
  var __indexAuthBootResolved = false;
  firebase.auth().onAuthStateChanged(async function (user) {
    console.log("[DEEP_LINK_TRACE] onAuthStateChanged user=" + (user ? user.uid : "null") +
      " resolved=" + __indexAuthBootResolved + " hash=" + window.__dd_deep_link_hash);
    try {
      if (sessionStorage.getItem("dd_google_oauth_in_progress") === "1") {
        var __isNativeShell = false;
        try {
          __isNativeShell =
            window.__DEALZKART_NATIVE_APP__ === true ||
            localStorage.getItem("dealzkart_native_app") === "1" ||
            sessionStorage.getItem("dealzkart_native_app") === "1" ||
            !!(window.AndroidBridge || window.Android);
        } catch (eNatDetect) {}
        if (__isNativeShell) {
          /* Native Google uses custom token — never wait on getRedirectResult (hangs in WebView). */
          try { sessionStorage.removeItem("dd_google_oauth_in_progress"); } catch (eClrN) {}
        } else {
          var __ddOauthResult = await Promise.race([
            firebase.auth().getRedirectResult().catch(function () { return null; }),
            new Promise(function (resolve) { setTimeout(function () { resolve(null); }, 8000); })
          ]);
          sessionStorage.removeItem("dd_google_oauth_in_progress");
          user = firebase.auth().currentUser;
          if (user && __ddOauthResult && __ddOauthResult.user) {
            var __loginOk =
              (function () {
                try {
                  var h = String(location.hostname || "").toLowerCase();
                  if (h === "dealzkart.shop" || h === "www.dealzkart.shop") return "https://dealzkart.shop/login-success";
                } catch (e) {}
                return location.origin + "/login-success";
              })();
            window.location.replace(__loginOk);
            return;
          }
        }
      }
    } catch (eOauth) {}
    /* ── Native app auth: consume Android custom token (old correct flow) ── */
    var __pendingNativeToken = null;
    try { __pendingNativeToken = localStorage.getItem('dealzkart_pending_native_auth'); } catch (eNT) {}
    console.log("[DEEP_LINK_TRACE] nativeToken=" + (!!__pendingNativeToken) + " user=" + (!!user));
    if (__pendingNativeToken && !user) {
      console.log('[DEEP_LINK_TRACE] consuming native token, len=' + __pendingNativeToken.length);
      try {
        try { sessionStorage.removeItem('dd_google_oauth_in_progress'); } catch (eGo0) {}
        await firebase.auth().setPersistence(firebase.auth.Auth.Persistence.LOCAL);
        var __nativeCred = await Promise.race([
          firebase.auth().signInWithCustomToken(__pendingNativeToken),
          new Promise(function (_, reject) {
            setTimeout(function () { reject(new Error("DD_NATIVE_TOKEN_TIMEOUT")); }, 20000);
          })
        ]);
        try { localStorage.removeItem('dealzkart_pending_native_auth'); } catch (eNTR) {}
        user = (__nativeCred && __nativeCred.user) || firebase.auth().currentUser;
        console.log('[dd-native-auth] signInWithCustomToken OK uid=' + (user && user.uid));
        if (typeof window.showAppLoader === 'function') window.showAppLoader(false);
      } catch (eNativeAuth) {
        console.error('[dd-native-auth] token signin failed', eNativeAuth);
        /* Do NOT delete the token on failure — auth page / retry may still need it. */
        if (typeof window.showAppLoader === 'function') window.showAppLoader(false);
        user = firebase.auth().currentUser;
      }
    }
    /* ── End native app auth ── */

    if (!user) {
      if (window.appCheckReadyPromise) {
        await Promise.race([
          window.appCheckReadyPromise,
          wait(300)
        ]);
      }
    }
    var guestBrowseIntent = false;
    try {
      guestBrowseIntent = new URLSearchParams(window.location.search).get("dd_guest") === "1";
    } catch (eGb) {}
    if (!__indexAuthBootResolved && !user && !guestBrowseIntent) {
      var __waitAuthMs = 30;
      try {
        if (
          localStorage.getItem("dealzkart_pending_native_auth") ||
          localStorage.getItem("dealzkart_native_app") === "1" ||
          window.__DEALZKART_NATIVE_APP__ === true
        ) {
          __waitAuthMs = 2000;
        }
      } catch (eWaitN) {}
      await wait(__waitAuthMs);
      user = firebase.auth().currentUser;
    }
    __indexAuthBootResolved = true;
    if (guestBrowseIntent) {
      if (user) {
        if (typeof window.ddSignOutComplete === "function") {
          await window.ddSignOutComplete(firebase.auth());
        } else {
          await firebase.auth().signOut();
        }
        return;
      }
      stripDdGuestQueryParam();
    }
    if (!user) {
      /* Guest browse mode — referral params still route to signup */
      var params = new URLSearchParams(window.location.search);
      var ref = params.get("ref") || params.get("code");
      var hash = (window.location.hash || "");
      if (!ref && hash.indexOf("ref=") !== -1) {
        var hashQuery = hash.split("?")[1];
        if (hashQuery) {
          var hp = new URLSearchParams(hashQuery);
          ref = hp.get("ref") || hp.get("code");
        }
      }
      var __origProduct =
        (typeof window.ddDeepLinkGetOriginalIncomingUrl === "function" &&
          window.ddDeepLinkGetOriginalIncomingUrl()) ||
        "";
      var __guestProductDeepLink =
        (typeof window.ddDeepLinkIsProductIncomingUrl === "function" &&
          window.ddDeepLinkIsProductIncomingUrl(__origProduct)) ||
        /\/(?:product|deal)\//i.test(String(__origProduct || "")) ||
        (typeof window.ddDeepLinkIsProductColdStart === "function" && window.ddDeepLinkIsProductColdStart());
      if (ref && !__guestProductDeepLink) {
        window.location.replace("signup.html?ref=" + encodeURIComponent(ref.trim()));
        return;
      }
      if (ref && __guestProductDeepLink) {
        try {
          localStorage.setItem("pendingReferral", String(ref).trim().toUpperCase());
        } catch (eGr) {}
      }
      console.log("[DEEP_LINK_TRACE] entering GUEST path, hash=" + window.__dd_deep_link_hash);
      if (typeof window.ddRevealAppShellEarly === "function") {
        window.ddRevealAppShellEarly();
      } else {
        completeAuthBoot();
      }
      (async function bootGuestApp() {
        try {
          while (typeof window.initializeApplication !== "function") {
            await wait(40);
          }
          if (window.appCheckReadyPromise) await window.appCheckReadyPromise;
          var __productCold =
            typeof window.ddDeepLinkIsProductColdStart === "function" &&
            window.ddDeepLinkIsProductColdStart();
          if (__productCold && typeof window.ddDeepLinkRunProductFirstBoot === "function") {
            console.log("[DEEP_LINK_TRACE] product-first boot (GUEST)");
            await window.ddDeepLinkRunProductFirstBoot();
            window.initializeApplication({ productDeepLinkFast: true }).catch(function (eBg) {
              console.error("[DEEP_LINK_TRACE] background init (GUEST)", eBg);
            });
          } else {
            console.log("[DEEP_LINK_TRACE] calling initializeApplication (GUEST)");
            window.initializeApplication().catch(function (eGuestInit) {
              console.error("[DEEP_LINK_TRACE] init (GUEST)", eGuestInit);
            });
          }
        } catch (eGuestBoot) {
          console.error(eGuestBoot);
        } finally {
          if (!window.__ddShellRevealed) completeAuthBoot();
        }
      })();
      return;
    }
    console.log("[DEEP_LINK_TRACE] entering AUTHENTICATED path uid=" + user.uid + " hash=" + window.__dd_deep_link_hash);
    if (typeof window.ddRevealAppShellEarly === "function") {
      window.ddRevealAppShellEarly();
    } else {
      completeAuthBoot();
    }
    user.reload().catch(function () {});
    user.getIdToken(false).catch(function () {});
    (function restoreDeepLinkAfterAuth() {
      var __dlh = (window.__dd_deep_link_hash || "").replace(/^#\/?/, "").trim();
      var __dlp = "";
      try { __dlp = String(window.__dd_deep_link_path || window.location.pathname || "").split("?")[0]; } catch (_) {}
      var __productPath = /^\/(?:product|deal)\//i.test(__dlp) ||
        (typeof window.ddDeepLinkIsProductColdStart === "function" && window.ddDeepLinkIsProductColdStart());
      if ((__dlh && __dlh !== "home") || __productPath) {
        try { sessionStorage.removeItem("dealzkart_return_after_auth"); } catch (_) {}
        console.log("[deep-link] skipping consumeReturn — deep link present:", __dlh || __dlp);
      } else if (typeof window.consumeReturnAfterAuthIfNeeded === "function") {
        window.consumeReturnAfterAuthIfNeeded();
      } else {
        setTimeout(restoreDeepLinkAfterAuth, 40);
      }
    })();
    if (!window.functions) {
      window.functions = firebase.app().functions("asia-south1");
    }
    try {
      (async function bootAuthenticatedApp() {
        try {
          while (typeof window.initializeApplication !== "function") {
            await wait(40);
          }
          if (window.appCheckReadyPromise) await window.appCheckReadyPromise;
          var __productColdAuth =
            typeof window.ddDeepLinkIsProductColdStart === "function" &&
            window.ddDeepLinkIsProductColdStart();
          if (__productColdAuth && typeof window.ddDeepLinkRunProductFirstBoot === "function") {
            console.log("[DEEP_LINK_TRACE] product-first boot (AUTHENTICATED)");
            await window.ddDeepLinkRunProductFirstBoot();
            window.initializeApplication({ productDeepLinkFast: true }).catch(function (eBgA) {
              console.error("[DEEP_LINK_TRACE] background init (AUTH)", eBgA);
            });
          } else {
            console.log("[DEEP_LINK_TRACE] calling initializeApplication (AUTHENTICATED)");
            window.initializeApplication().catch(function (eAuthInit) {
              console.error("[DEEP_LINK_TRACE] init (AUTH)", eAuthInit);
            });
          }
          console.log("[DEEP_LINK_TRACE] initializeApplication dispatched, consumed=" + !!window.__dd_deep_link_consumed);
        } catch (eSignedBoot) {
          console.error("[DEEP_LINK_TRACE] initializeApplication ERROR", eSignedBoot);
        } finally {
          if (!window.__ddShellRevealed) completeAuthBoot();
        }
      })();
    } catch (eSignedBootOuter) {
      console.error("[DEEP_LINK_TRACE] authenticated boot ERROR", eSignedBootOuter);
      if (!window.__ddShellRevealed) completeAuthBoot();
    }
    if (!window.__FINALIZE_RAN__) {
      window.__FINALIZE_RAN__ = true;
      setTimeout(function () {
        if (typeof window.finalizeUserSignup === "function") {
          window.finalizeUserSignup().catch(function (e) { console.error(e); });
        }
      }, 2000);
    }
    setTimeout(function () {
      if (typeof window.showRewardsHubPromoOnce === "function") window.showRewardsHubPromoOnce();
    }, 650);
    /* In-app payout listener: ensure it attaches after script.js + db (retries inside if needed). */
    setTimeout(function () {
      if (typeof window.listenInAppPayoutNotifications === "function") {
        window.listenInAppPayoutNotifications();
      }
    }, 0);
    setTimeout(function () {
      if (typeof window.listenInAppPayoutNotifications === "function") {
        window.listenInAppPayoutNotifications();
      }
    }, 600);
  });

  async function updateTokenText(uid) {
    try {
      if (!window.db) return;
      const doc = await window.db.collection("users").doc(uid).get();
      const el = document.getElementById("userTokens");
      if (el) el.textContent = doc.data()?.tokens ?? 0;
    } catch (e) {
      console.warn("updateTokenText:", e.message);
    }
  }

  // App Check token ready (or skip when APP_CHECK_ENABLED is false) → set window.db
  function setDbAndTokenListener() {
    window.db = firebase.firestore();
    window.db.enablePersistence().catch(function () {});
    window.auth.onAuthStateChanged(function (u) {
      if (u) updateTokenText(u.uid);
    });
    if (typeof window.ddDeepLinkSetState === "function") {
      window.ddDeepLinkSetState("firebase", true);
    }
  }
  if (APP_CHECK_ENABLED) {
    window.appCheckReadyPromise = firebase.appCheck().getToken(true)
      .then(function () {
        window.appCheckReady = true;
        setDbAndTokenListener();
        return true;
      })
      .catch(function (err) {
        console.warn("App Check token failed:", err.message || err);
        window.appCheckReady = false;
        setDbAndTokenListener();
        return false;
      });
  } else {
    window.appCheckReady = false;
    window.appCheckReadyPromise = Promise.resolve();
    setDbAndTokenListener();
  }
</script>

  <!-- Route modules (CashClaim / synth reviews / jsQR / bug): on-demand via dd-lazy.js -->
<script src="/js/dd-lazy.js?v=3" defer></script>
<script src="/auth-errors.js?v=20260515a"></script>
<script src="/js/dd-confirm-dialog.js?v=20260526a" defer></script>
<script src="/components/shared.js" defer></script>
<script src="/components/primitives.js" defer></script>
<script src="/components/product-card.js?v=6" defer></script>
<script src="/components/hero-banner.js?v=2" defer></script>
<script src="/components/section-header.js" defer></script>
<script src="/components/product-grid.js?v=2" defer></script>
<script src="/components/carousel.js?v=2" defer></script>
<script src="/components/category-pill.js" defer></script>
<script src="/components/category-grid.js" defer></script>
<script src="/components/sticky-bottom-bar.js" defer></script>
<script src="/components/search-bar.js" defer></script>
<script src="/components/header.js" defer></script>
<script src="/components/footer.js" defer></script>
<script src="/components/bottom-navigation.js" defer></script>
<script src="/components/skeleton-loader.js" defer></script>
<script src="/components/empty-state.js" defer></script>
<script src="/components/error-state.js" defer></script>
<script src="/components/store-composer.js?v=10" defer></script>
<script src="/components/index.js" defer></script>
<!-- Home + Dealz layout composer (must stay eager — empty feeds without this) -->
<script src="/js/dd-luxury-store.js" defer></script>
<script src="/js/dd-pdp-premium.js?v=4" defer></script>
<script src="/js/dd-feed-infinite.js?v=1" defer></script>
<script src="/js/dd-bottom-tab-swipe.js" defer></script>
<script src="/js/dd-app-version.js?v=4" defer></script>
<script src="/js/dd-user-preferences.js?v=7" defer></script>
<script src="/js/dd-device-lock.js?v=6" defer></script>
<script src="/script.js?v=107" defer></script>
<script src="/js/dd-app-menu.js?v=15" defer></script>

  <!-- Site footer (Amazon-style rails + SEO hook class for keyword injection) -->
  <footer class="site-footer seo-footer" role="contentinfo">
    <div class="site-footer-trust">
      <div class="site-footer-trust-inner">
        <p class="site-footer-trust-lead"><strong>You pay the same price at the retailer.</strong> Prices shown follow each store listing—Dealzkart never collects card or UPI details on-site.</p>
        <p class="site-footer-trust-sub">We may earn a small affiliate commission when you shop through our links. That helps keep personalized deals and discovery free for everyone.</p>
      </div>
    </div>

    <div class="site-footer-main">
      <div class="site-footer-columns">
        <nav class="site-footer-col" aria-labelledby="footer-heading-know">
          <h2 id="footer-heading-know" class="site-footer-heading">Get to know us</h2>
          <ul class="site-footer-list">
            <li><a href="#" data-page="about">About Dealzkart</a></li>
            <li><a href="#" data-page="faq">Help Center</a></li>
            <li><a href="#" data-page="rewards-guide">Rewards guide</a></li>
          </ul>
        </nav>
        <nav class="site-footer-col" aria-labelledby="footer-heading-shop">
          <h2 id="footer-heading-shop" class="site-footer-heading">Shop &amp; discover</h2>
          <ul class="site-footer-list">
            <li><a href="#" data-page="home">Home</a></li>
            <li><a href="#" data-page="deals">Today&apos;s deals</a></li>
            <li><a href="#" data-page="search">Search products</a></li>
            <li><a href="#" data-page="cart">Your cart</a></li>
          </ul>
        </nav>
        <nav class="site-footer-col" aria-labelledby="footer-heading-earn">
          <h2 id="footer-heading-earn" class="site-footer-heading">Rewards &amp; account</h2>
          <ul class="site-footer-list">
            <li><a href="#" data-page="spin">Daily spin &amp; wallet</a></li>
            <li><a href="#" data-page="refer">Refer &amp; earn</a></li>
            <li><a href="#" data-page="account">Your account</a></li>
            <li><a href="#" data-page="spin-history">Spin history</a></li>
          </ul>
        </nav>
        <nav class="site-footer-col" aria-labelledby="footer-heading-policies">
          <h2 id="footer-heading-policies" class="site-footer-heading">Policies</h2>
          <ul class="site-footer-list">
            <li><a href="#" data-page="terms">Privacy Policy</a></li>
            <li><a href="#" data-page="terms">Terms &amp; Conditions</a></li>
            <li><a href="#" data-page="about">About affiliate links</a></li>
          </ul>
        </nav>
      </div>
    </div>

    <div class="site-footer-brand">
      <div class="site-footer-brand-inner">
        <a href="#" class="site-footer-brand-logo" data-page="home" aria-label="Dealzkart home"><span class="site-footer-brand-mark">dealz</span><span class="site-footer-brand-accent">kart</span></a>
        <p class="site-footer-brand-tagline">Smart deals · India · Electronics, fashion, home &amp; more</p>
      </div>
    </div>

    <div class="site-footer-programs" aria-label="How Dealzkart works">
      <div class="site-footer-programs-inner">
        <div class="site-footer-program-card">
          <h3 class="site-footer-program-title">Retailer checkout</h3>
          <p class="site-footer-program-desc">Purchases complete on Amazon, Flipkart, or other partner sites—not inside Dealzkart.</p>
        </div>
        <div class="site-footer-program-card">
          <h3 class="site-footer-program-title">Personalized picks</h3>
          <p class="site-footer-program-desc">Rails blend discounts, freshness, and engagement signals—without exposing payment data.</p>
        </div>
        <div class="site-footer-program-card">
          <h3 class="site-footer-program-title">Rewards hub</h3>
          <p class="site-footer-program-desc">Spin, streaks, and wallet rewards are optional perks on top of shopping through our links.</p>
        </div>
      </div>
    </div>

    <div class="site-footer-legal">
      <div class="site-footer-legal-inner">
        <nav class="site-footer-legal-links" aria-label="Legal">
          <a href="#" data-page="terms">Conditions of Use</a>
          <span class="site-footer-legal-sep" aria-hidden="true">|</span>
          <a href="#" data-page="terms">Privacy Notice</a>
          <span class="site-footer-legal-sep" aria-hidden="true">|</span>
          <a href="#" data-page="about">Affiliate disclosure</a>
        </nav>
        <p class="site-footer-copy">&copy; <span id="footerYear"></span> Dealzkart · Best deals in India. All trademarks belong to their respective owners.</p>
      </div>
    </div>
  </footer>

  <script>
    (function () {
      var y = document.getElementById("footerYear");
      if (y) y.textContent = new Date().getFullYear();
    })();
  </script>

  <!-- LOGIN REQUIRED MODAL -->
<div id="loginRequiredModal" class="modal-overlay" style="display:none;">
  <div class="modal-card login-modal">
    <div class="login-modal-icon">🎁</div>
    <h3>Unlock Cashback Spins</h3>
    <p>Log in for Spin &amp; Wallet rewards tied to qualifying checkout.</p>

    <div class="modal-actions">
      <button class="secondary-btn" onclick="closeLoginModal()">Not now</button>
      <button type="button" class="primary-btn pulse" onclick="if(typeof signInWithGoogleFromApp==='function')signInWithGoogleFromApp();">Continue with Google</button>
      <button type="button" class="secondary-btn" onclick="goToLogin()">Other sign-in options</button>
    </div>
  </div>
</div>
<!-- Phone verification (new Google accounts — Firestore profile created after OTP + checks) -->
<div id="phoneVerificationModal" class="modal-overlay" style="display:none;" aria-hidden="true">
  <div class="modal-card login-modal">
    <h3 style="margin-top:0;">Verify your phone</h3>
    <p style="color:#6b7280;font-size:14px;">Enter your Indian mobile number. One account per phone and per device.</p>
    <label for="phoneVerifyInput" style="display:block;margin-top:12px;font-weight:600;font-size:13px;">Mobile (+91)</label>
    <input id="phoneVerifyInput" type="tel" inputmode="tel" autocomplete="tel" placeholder="9876543210" style="width:100%;padding:12px;margin-top:6px;border-radius:10px;border:1px solid #e5e7eb;box-sizing:border-box;" />
    <div id="phone-verify-recaptcha" style="margin-top:10px;"></div>
    <button type="button" class="primary-btn" id="phoneVerifySendBtn" style="width:100%;margin-top:12px;">Send OTP</button>
    <div id="phoneVerifyOtpSection" style="display:none;margin-top:14px;">
      <label for="phoneVerifyOtp" style="display:block;font-weight:600;font-size:13px;">Enter OTP</label>
      <input id="phoneVerifyOtp" type="text" inputmode="numeric" maxlength="8" autocomplete="one-time-code" style="width:100%;padding:12px;margin-top:6px;border-radius:10px;border:1px solid #e5e7eb;box-sizing:border-box;" />
      <button type="button" class="primary-btn" id="phoneVerifyVerifyBtn" style="width:100%;margin-top:12px;">Verify &amp; continue</button>
    </div>
    <p id="phoneVerifyMessage" style="color:#ef4444;font-size:13px;margin-top:10px;min-height:18px;"></p>
    <button type="button" class="secondary-btn" id="phoneVerifySignOutBtn" style="width:100%;margin-top:8px;">Sign out</button>
  </div>
</div>
<!-- WALLET PAYOUT DETAIL (paid row tap) -->
<div id="walletTxDetailModal" class="modal-overlay" style="display:none;" aria-hidden="true">
  <div class="modal-card wallet-tx-detail-card">
    <button type="button" class="wallet-tx-detail-close" id="walletTxDetailCloseX" aria-label="Close">&times;</button>
    <h3 id="walletTxDetailTitle">Payout details</h3>
    <div id="walletTxDetailBody" class="wallet-tx-detail-body"></div>
    <div class="modal-actions">
      <button type="button" class="primary-btn" id="walletTxDetailCloseBtn">Close</button>
    </div>
  </div>
</div>
<!-- UPI REQUIRED MODAL -->
<div id="upiRequiredModal" class="modal-overlay" style="display:none;">
  <div class="modal-card">
    <div class="modal-icon">💳</div>
    <h3>Add UPI ID</h3>
    <p>Please add your UPI ID to receive your rewards.</p>

    <div class="modal-actions">
      <button class="modal-btn secondary" onclick="closeUpiModal()">Later</button>
      <button class="modal-btn primary" onclick="goToUpiSection()">Add UPI ID</button>
    </div>
  </div>
</div>
<!-- REFERRAL REWARD POPUP -->
<div id="referralRewardPopup" class="reward-popup" style="display:none;">
  <div class="reward-card">
    <div class="reward-emoji">🎉</div>
    <h2>Referral Bonus Earned!</h2>
    <p>You received <b>1 Token</b> because your friend completed Break Piggy Bank.</p>

    <button onclick="closeReferralPopup()" class="primary-btn">
      Awesome 🚀
    </button>
  </div>
</div>
<!-- TOKEN REWARD POPUP (shown after Break Piggy Bank) -->
<div id="tokenRewardPopup" class="reward-popup" style="display:none;">
  <div class="reward-card">
    <div class="reward-emoji">🎉</div>
    <h2>Token Earned!</h2>
    <p>You earned <span id="tokenRewardCount">1</span> Token for breaking your Piggy Bank!</p>
    <button onclick="document.getElementById('tokenRewardPopup').style.display='none'" class="primary-btn">Awesome 🚀</button>
  </div>
</div>
<!-- LEVEL UP POPUP -->
<div id="levelUpPopup" class="popup">
  <div class="popup-box">
    ⭐ <span id="levelUpTextMini"></span>

  </div>
</div>

<!-- HEROIC EMBLEM POPUP -->
<div id="heroicPopup" class="popup">
  <div class="popup-box heroic">
    🏆 HEROIC EMBLEM UNLOCKED!
  </div>
</div>
<!-- LEVEL UP CELEBRATION -->
<div id="levelUpModal" class="levelup-hidden">
  <div class="levelup-box">
    <h2>🎉 Level Up!</h2>
    <p id="levelUpText">You reached Level 2</p>
    <button onclick="closeLevelUp()">Awesome 🚀</button>
  </div>
</div>

<canvas id="confettiCanvas"></canvas>

<audio id="levelUpSound" src="/assets/sounds/spin.mp3" preload="auto"></audio>
<audio id="spinWinSound" src="/assets/sounds/win.mp3" preload="auto"></audio>

<div id="xpFloatingContainer"></div>

<!-- PRODUCT REQUEST (Floating button + popup) — FAB alternates + ↔ streak -->
<div class="request-fab-wrap" id="requestFabWrap">
  <div id="requestFabHint" class="request-fab-hint" hidden role="tooltip">
    <div class="request-fab-hint__chrome" aria-hidden="true"></div>
    <p class="request-fab-hint__title"></p>
    <p class="request-fab-hint__body"></p>
  </div>
  <div id="requestBtn" title="Request Product" aria-label="Request Product" role="button" tabindex="0">
    <span class="request-fab__inner">
      <span class="request-fab__face request-fab__face--plus" aria-hidden="true">+</span>
      <span class="request-fab__face request-fab__face--streak" aria-hidden="true">
        <span class="request-fab__streak-stack">
          <span class="request-fab__streak-label">Streak</span>
          <span class="request-fab__streak-main">
            <i class="fa-solid fa-fire request-fab__fire-icon" aria-hidden="true"></i>
            <span id="requestFabStreakValue" class="request-fab__streak-num">0</span>
          </span>
        </span>
      </span>
    </span>
  </div>
</div>
<div id="requestPopup" class="hidden" role="dialog" aria-modal="true" aria-labelledby="requestPopupTitle">
  <div class="popup-box">
    <h3 id="requestPopupTitle">Request Product</h3>
    <p id="requestFormError" class="request-form-error hidden" role="alert"></p>
    <label class="request-field">
      <span class="request-field__label">Platform *</span>
      <select id="requestPlatform" aria-required="true">
        <option value="">Select platform</option>
        <option value="amazon">Amazon</option>
        <option value="flipkart">Flipkart</option>
        <option value="myntra">Myntra</option>
        <option value="ajio">Ajio</option>
        <option value="meesho">Meesho</option>
        <option value="nykaa">Nykaa</option>
        <option value="croma">Croma</option>
        <option value="reliancedigital">Reliance Digital</option>
        <option value="snapdeal">Snapdeal</option>
        <option value="firstcry">FirstCry</option>
        <option value="other">Other</option>
      </select>
    </label>
    <label class="request-field request-field--other hidden" id="requestPlatformNameWrap">
      <span class="request-field__label">Platform Name</span>
      <input id="requestPlatformName" type="text" placeholder="Enter platform name" autocomplete="off" />
    </label>
    <label class="request-field">
      <span class="request-field__label">Product Link</span>
      <input id="productLink" type="url" placeholder="Paste product URL (optional if name is provided)" inputmode="url" autocomplete="off" />
    </label>
    <label class="request-field">
      <span class="request-field__label">Product Name</span>
      <input id="requestProductName" type="text" placeholder="Enter product name (optional if link is provided)" autocomplete="off" />
    </label>
    <p class="request-field__hint" style="margin:-4px 0 12px;font-size:12px;color:#64748b;line-height:1.45;">Provide at least a product link <strong>or</strong> product name.</p>
    <label class="request-field">
      <span class="request-field__label">Additional Notes <span class="request-field__opt">(Optional)</span></span>
      <textarea id="requestNotes" rows="3" placeholder="Need Black Color, 128GB Variant, Size XL, Preferred Seller…"></textarea>
    </label>
    <div class="popup-actions">
      <button type="button" class="primary-btn" id="submitRequestBtn">Submit</button>
      <button type="button" class="secondary-btn" id="closeRequestPopupBtn">Close</button>
    </div>
    <small class="muted" style="display:block;margin-top:10px;color:#6b7280;font-weight:400;font-size:13px;line-height:1.45;">
      Request products from any online shopping platform you want on Dealzkart.
      <br>After you submit, it goes to our team for review.
      <br>Once the product is added, you’ll get an instant notification here.
      <br><a href="#" data-page="product-request-history" style="color:#7c3aed;font-weight:600;">View your request history</a>
    </small>
  </div>
</div>

<!-- Small in-site payout / notification bar (website — not FCM) -->
<div id="websiteMiniNotify" class="website-mini-notify-wrap" hidden role="status" aria-live="polite">
  <div class="website-mini-notify-inner">
    <div class="website-mini-notify__media" hidden>
      <img class="website-mini-notify__thumb" alt="" loading="lazy" decoding="async" />
      <span class="website-mini-notify__badge" hidden></span>
    </div>
    <span class="website-mini-notify__icon" aria-hidden="true">💸</span>
    <div class="website-mini-notify__copy">
      <p class="website-mini-notify__title" hidden></p>
      <p class="website-mini-notify__text"></p>
      <button type="button" class="website-mini-notify__cta" hidden></button>
    </div>
    <button type="button" class="website-mini-notify__close" aria-label="Dismiss">&times;</button>
  </div>
</div>

<!-- Full screen center loader (use showAppLoader(true/false)) -->
<div id="appLoader" class="dd-wait-overlay" aria-hidden="true" aria-live="polite">
  <div class="dd-wait-panel">
    <div class="dd-wait-spinner app-spinner" aria-hidden="true"></div>
    <p class="dd-wait-title">Wait a second…</p>
    <p class="dd-wait-sub" id="appLoaderWaitSub">Please hold on</p>
  </div>
</div>

<!-- WhatsApp deals channel — slithering snake (account page when logged in) -->
</div>

<!-- Cuelinks-style Help tab + panel -->
<button type="button" id="ddHelpTab" class="dd-help-tab" aria-label="Open Help" aria-expanded="false" aria-controls="ddHelpPanel">
  <span class="dd-help-tab__icon" aria-hidden="true"><i class="fas fa-headset"></i></span>
  <span class="dd-help-tab__label">Help</span>
</button>
<div id="ddHelpBackdrop" class="dd-help-backdrop" aria-hidden="true"></div>
<aside id="ddHelpPanel" class="dd-help-panel" aria-hidden="true" aria-labelledby="ddHelpPanelTitle" role="dialog">
  <header class="dd-help-panel__head">
    <div>
      <h2 id="ddHelpPanelTitle">Help Center</h2>
      <p>Dealzkart · how it works, policies &amp; contact</p>
    </div>
    <button type="button" id="ddHelpPanelClose" class="dd-help-panel__close" aria-label="Close Help">&times;</button>
  </header>
  <nav class="dd-help-panel__nav" aria-label="Help sections">
    <button type="button" data-help-section="how" class="is-active">How it works</button>
    <button type="button" data-help-section="rewards">Rewards</button>
    <button type="button" data-help-section="faq">FAQ</button>
    <button type="button" data-help-section="legal">Legal</button>
    <button type="button" data-help-section="contact">Contact</button>
  </nav>
  <div class="dd-help-panel__body">

    <section id="ddHelpSection-how" class="dd-help-section">
      <h3>How Dealzkart works</h3>
      <div class="dd-help-card">
        <strong>1. Discover deals</strong>
        Browse home, Today&apos;s Deals, categories, or search. Products come from our live catalog — electronics, fashion, home, mobiles, beauty, and more.
      </div>
      <div class="dd-help-card">
        <strong>2. Shop on partner sites</strong>
        Tap a product and complete checkout on the retailer (Amazon, Flipkart, etc.) through Dealzkart&apos;s tracked link. You pay the same price as on the retailer — we don&apos;t add markup.
      </div>
      <div class="dd-help-card">
        <strong>3. Earn rewards</strong>
        Qualifying orders can unlock cashback, spins, streaks, and wallet credits after verification. Always finish purchase on the partner checkout page.
      </div>
      <div class="dd-help-card">
        <strong>4. Wallet &amp; withdraw</strong>
        Track balance, pending rewards, and payout history in your account. Withdraw to UPI/bank when programme rules and minimums are met.
      </div>
      <p>Dealzkart is a deal-discovery layer — we are not the seller. Payments and delivery are handled by the retailer you choose.</p>
    </section>

    <section id="ddHelpSection-rewards" class="dd-help-section">
      <h3>Rewards &amp; cashback</h3>
      <ul>
        <li><strong>Spins</strong> — unlock from eligible checkout patterns and streak milestones.</li>
        <li><strong>Wallet</strong> — cashback and spin wins credit to your Dealzkart wallet.</li>
        <li><strong>Streaks</strong> — repeat qualifying orders keep your streak active.</li>
        <li><strong>Referrals</strong> — invite friends; earn tokens when they join and shop fairly.</li>
        <li><strong>XP &amp; levels</strong> — daily XP and shopping activity build long-term progress.</li>
      </ul>
      <p>Rewards depend on verified partner orders and fair-use rules. Fake clicks, duplicate accounts, or abuse can pause eligibility.</p>
      <button type="button" class="dd-help-link-btn" data-help-full-page="rewards-guide">Open full rewards guide →</button>
    </section>

    <section id="ddHelpSection-faq" class="dd-help-section">
      <h3>Common questions</h3>
      <div class="dd-help-card">
        <strong>When will I receive rewards?</strong>
        After your order is verified through partner affiliate systems — timing depends on the retailer&apos;s confirmation window.
      </div>
      <div class="dd-help-card">
        <strong>Does Dealzkart increase product price?</strong>
        No. You pay the retailer&apos;s listed price. We may earn a small affiliate commission at no extra cost to you.
      </div>
      <div class="dd-help-card">
        <strong>Is my payment safe?</strong>
        Yes. Dealzkart never processes your card or UPI for product purchase — checkout happens on trusted platforms only.
      </div>
      <div class="dd-help-card">
        <strong>How do I withdraw?</strong>
        Collect eligible wallet balance or tokens, then request payout from your account when thresholds are met.
      </div>
    </section>

    <section id="ddHelpSection-legal" class="dd-help-section">
      <h3>Privacy Policy</h3>
      <ul>
        <li>We collect account info (email, phone when verified), browsing activity on Dealzkart, and reward/wallet records to run the service.</li>
        <li>We use Firebase and partner analytics to secure login, personalise deals, and prevent fraud.</li>
        <li>We do not sell your personal data. We share only what&apos;s needed with retailers/affiliate partners to track qualifying orders.</li>
        <li>You can request account deletion from Account settings. See full policy for retention and your rights.</li>
      </ul>
      <h3 style="margin-top:16px;">Terms &amp; Conditions</h3>
      <ul>
        <li>Dealzkart is a discovery and rewards platform — not a store. Purchases complete on partner websites.</li>
        <li>Accounts must be for genuine personal use. Gaming the rewards system may limit access.</li>
        <li>Reward amounts, spins, and programme rules may change as we improve the product.</li>
        <li>Affiliate links may earn us commission; that helps fund cashback and keep Dealzkart free to browse.</li>
        <li>Product images and prices come from partners and can change without notice.</li>
      </ul>
      <button type="button" class="dd-help-link-btn" data-help-full-page="terms">Read full Terms &amp; Conditions →</button>
    </section>

    <section id="ddHelpSection-contact" class="dd-help-section">
      <h3>Contact us</h3>
      <p>Our team replies to wallet, spin, referral, and account issues. Include your registered email and a short description.</p>
      <div class="dd-help-contact-grid">
        <a class="dd-help-contact-btn dd-help-contact-btn--mail" href="mailto:dronedealz8@gmail.com">
          <span class="dd-help-contact-btn__icon" aria-hidden="true">✉️</span>
          <span>Email<small>dronedealz8@gmail.com</small></span>
        </a>
        <a class="dd-help-contact-btn" href="tel:+919363316461">
          <span class="dd-help-contact-btn__icon" aria-hidden="true">📞</span>
          <span>Mobile<small>+91 9363316461</small></span>
        </a>
        <a class="dd-help-contact-btn dd-help-contact-btn--wa" href="https://wa.me/919363316461" rel="noopener noreferrer" target="_blank">
          <span class="dd-help-contact-btn__icon" aria-hidden="true"><i class="fab fa-whatsapp"></i></span>
          <span>WhatsApp<small>+91 9363316461 · chat with us</small></span>
        </a>
      </div>
      <p style="margin-top:12px;font-size:12px;color:#64748b;">Typical reply within 24 hours on email; WhatsApp for urgent reward queries during business hours.</p>
    </section>

  </div>
</aside>

<div id="waSnake" hidden aria-hidden="true">
  <div class="wa-snake-body" aria-hidden="true"></div>
  <div id="waSnakeSpeech" class="wa-snake-speech" hidden aria-live="polite"></div>
  <a
      href="https://whatsapp.com/channel/0029Vb78ezYAO7RIr4ua5T1Z"
      target="_blank"
      rel="noopener noreferrer"
      class="snake-head"
      aria-label="Join Dealzkart WhatsApp deals channel"
    >
      <span class="snake-head__face" aria-hidden="true">
        <span class="snake-eye snake-eye--l">
          <span class="snake-eye__sclera">
            <span class="snake-eye__iris"><span class="snake-eye__pupil"></span></span>
          </span>
          <span class="snake-eye__lid snake-eye__lid--top" aria-hidden="true"></span>
          <span class="snake-eye__lid snake-eye__lid--bottom" aria-hidden="true"></span>
        </span>
        <span class="snake-eye snake-eye--r">
          <span class="snake-eye__sclera">
            <span class="snake-eye__iris"><span class="snake-eye__pupil"></span></span>
          </span>
          <span class="snake-eye__lid snake-eye__lid--top" aria-hidden="true"></span>
          <span class="snake-eye__lid snake-eye__lid--bottom" aria-hidden="true"></span>
        </span>
      </span>
      <i class="fab fa-whatsapp snake-head__wa" aria-hidden="true"></i>
      <span id="waSnakeMoodEmoji" class="snake-mood-emoji" aria-hidden="true"></span>
    </a>
</div>

  </body>
</html>