"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FaqSplitText from '@/components/sections/faq/FaqSplitText';
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import HeroSplitTestimonial from '@/components/sections/hero/HeroSplitTestimonial';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import { CalendarCheck, Gauge, Lightbulb, Scale, ShieldCheck, TrendingUp, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="hover-bubble"
        defaultTextAnimation="entrance-slide"
        borderRadius="rounded"
        contentWidth="mediumSmall"
        sizing="mediumLargeSizeLargeTitles"
        background="noise"
        cardStyle="outline"
        primaryButtonStyle="double-inset"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="normal"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarStyleApple
      navItems={[
        {
          name: "Home",          id: "#hero"},
        {
          name: "Features",          id: "#features"},
        {
          name: "Lessons",          id: "#lessons"},
        {
          name: "FAQ",          id: "#faq"},
        {
          name: "Testimonials",          id: "#testimonials"},
        {
          name: "Contact",          id: "#contact"},
      ]}
      brandName="The Past as a Fuel"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroSplitTestimonial
      useInvertedBackground={false}
      background={{
        variant: "plain"}}
      videoSrc="https://assets.mixkit.co/videos/preview/mixkit-young-woman-working-with-a-laptop-4485-large.mp4"
      videoAriaLabel="Background video of a woman working"
      title="Transform Regret into Refined Fuel"
      description="A private, disciplined digital journal for logging mistakes, analyzing causes, formulating action plans, and extracting invaluable life lessons for continuous personal growth."
      testimonials={[
        {
          name: "User X",          handle: "@future-self",          testimonial: "This journal completely changed how I view my mistakes. They're no longer burdens, but blueprints for building a stronger me.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-serious-businesswoman-sitting-couch_1098-3140.jpg"},
        {
          name: "User Y",          handle: "@growth-mindset",          testimonial: "The analytical framework helps me confront my slip-ups without self-judgment. Pure data for profound self-improvement.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/close-up-male-executive_1098-2482.jpg"},
        {
          name: "User Z",          handle: "@disciplined-soul",          testimonial: "The 'Fire Extinguisher' protocols are game-changers. I've built real resilience and stopped patterns that plagued me for years.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/view-bust-figure-from-ancient-greece_23-2151616916.jpg"},
        {
          name: "User A",          handle: "@muhasabah-master",          testimonial: "It's more than a journal; it's a personal operating system for continuous improvement, rooted in powerful self-reflection.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/cropped-view-smiling-middle-aged-business-man_1262-4966.jpg"},
        {
          name: "User B",          handle: "@insight-seeker",          testimonial: "Every entry transforms regret into clarity. I've never had such a clear view of my triggers and the lessons waiting to be learned.",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/young-successful-businessman-praying-with-crossed-fingers-black-background_176420-55695.jpg"},
      ]}
      buttons={[
        {
          text: "New Fuel Entry",          href: "#hero"},
        {
          text: "View Features",          href: "#features"},
      ]}
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/digital-art-light-lamp-design_23-2151124895.jpg",          alt: "User avatar 1"},
        {
          src: "http://img.b2bpic.net/free-photo/view-3d-man-working-justice-law-field_23-2151228049.jpg",          alt: "User avatar 2"},
        {
          src: "http://img.b2bpic.net/free-photo/joyful-woman-black-jacket-liking-lip-posing-isolated-background-charming-lady-dark-suit-smiling-white-backdrop_197531-18516.jpg",          alt: "User avatar 3"},
        {
          src: "http://img.b2bpic.net/free-photo/front-view-man-with-suit-posing-black-white_23-2149411399.jpg",          alt: "User avatar 4"},
        {
          src: "http://img.b2bpic.net/free-photo/front-view-smiley-man-black-white_23-2149675531.jpg",          alt: "User avatar 5"},
      ]}
      avatarText="Join over 5,000 disciplined individuals"
      imageSrc="http://img.b2bpic.net/free-photo/people-meeting-seminar-office-concept_53876-41666.jpg"
      imageAlt="Abstract software dashboard for personal growth journal"
      mediaAnimation="slide-up"
      marqueeItems={[
        {
          type: "text-icon",          text: "Self-Accountability",          icon: ShieldCheck,
        },
        {
          type: "text-icon",          text: "Refined Insights",          icon: Lightbulb,
        },
        {
          type: "text-icon",          text: "Continuous Growth",          icon: TrendingUp,
        },
        {
          type: "text-icon",          text: "Proactive Protocols",          icon: Zap,
        },
        {
          type: "text-icon",          text: "Stoic Discipline",          icon: Scale,
        },
      ]}
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardSixteen
      animationType="depth-3d"
      textboxLayout="default"
      useInvertedBackground={false}
      negativeCard={{
        items: [
          "The Incident: Describe exactly what went wrong, without sugarcoating or emotional baggage. Just the facts.",          "The Spark: Diagnose the root cause—triggers, emotional states, environmental factors. Uncover 'why' it happened.",          "The Fire Extinguisher: Develop immediate, actionable protocols. If X occurs, then I will immediately execute Y.",          "The Refined Fuel: Extract the ultimate lesson or philosophical wisdom gained. Convert regret into powerful insight."],
      }}
      positiveCard={{
        items: [
          "Confrontation: Objectively log your raw slip-up.",          "Diagnosis: Isolate the precise trigger and context.",          "Intervention: Code your override protocol for future encounters.",          "Refinement: Extract universal wisdom, changing entry status to 'Refined Fuel' and updating your growth metrics."],
      }}
      title="The 4-Step Fuel Conversion Engine"
      description="Our structured framework helps you dismantle past errors, understand their origins, and forge actionable wisdom for a stronger future. Turn every slip-up into a stepping stone."
    />
  </div>

  <div id="lessons" data-section="lessons">
      <ProductCardFour
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="four-items-2x2-equal-grid"
      useInvertedBackground={false}
      products={[
        {
          id: "p1",          name: "Discipline",          price: "Focused Action",          variant: "#discipline",          imageSrc: "http://img.b2bpic.net/free-photo/architectural-blueprints_1359-471.jpg",          imageAlt: "Abstract logic visualization for discipline"},
        {
          id: "p2",          name: "Spiritual Growth",          price: "Inner Peace",          variant: "#spiritual",          imageSrc: "http://img.b2bpic.net/free-photo/orange-background-with-golden-lights-abstract_23-2148231757.jpg",          imageAlt: "Abstract root cause analysis for spiritual growth"},
        {
          id: "p3",          name: "Health & Well-being",          price: "Vitality",          variant: "#health",          imageSrc: "http://img.b2bpic.net/free-photo/blockchain-technology-cartoon-illustration_23-2151572166.jpg",          imageAlt: "Abstract if-then protocol for health"},
        {
          id: "p4",          name: "Productivity",          price: "Efficient Flow",          variant: "#productivity",          imageSrc: "http://img.b2bpic.net/free-photo/oman-eye-bondage-lying-floor_23-2147695046.jpg",          imageAlt: "Abstract lesson extraction for productivity"},
        {
          id: "p5",          name: "Emotional Regulation",          price: "Composure",          variant: "#emotional",          imageSrc: "http://img.b2bpic.net/free-photo/still-life-with-craft-beer-concept_23-2148111312.jpg",          imageAlt: "Abstract tagging system for emotional regulation"},
        {
          id: "p6",          name: "Knowledge & Learning",          price: "Understanding",          variant: "#knowledge",          imageSrc: "http://img.b2bpic.net/free-photo/red-haired-portrait_1385-594.jpg",          imageAlt: "Abstract search and filter for knowledge"},
      ]}
      title="Categorize Your Growth"
      description="Tag entries to pinpoint areas of discipline, spiritual growth, health, and productivity, creating a holistic view of your development patterns."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqSplitText
      useInvertedBackground={false}
      faqs={[
        {
          id: "faq1",          title: "How does 'The Past as a Fuel' ensure my privacy?",          content: "Your data is stored locally on your device (browser storage or local SQLite), ensuring your mistakes and growth journey remain completely private and between you and Allah."},
        {
          id: "faq2",          title: "What is Muhasabah?",          content: "Muhasabah is an Islamic concept of self-accounting, where one reflects on their actions, seeks improvement, and takes responsibility for their deeds. This journal is a digital tool for this profound practice."},
        {
          id: "faq3",          title: "Can I edit past entries?",          content: "Yes, you can edit entries to refine your analysis, update your Fire Extinguisher protocols, or deepen your Refined Fuel lessons as you gain new insights."},
        {
          id: "faq4",          title: "How long does it take to make an entry?",          content: "The structured 4-step process is designed for efficiency. Initial logging can be quick, with deeper analysis taking as little as 5-10 minutes, making it highly disciplined."},
      ]}
      sideTitle="Common Inquiries on Growth"
      sideDescription="Have questions about 'The Past as a Fuel' or the Muhasabah process? Find answers to frequently asked questions here."
      faqsAnimation="blur-reveal"
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardSixteen
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "t1",          name: "Khalid Al-Fariq",          role: "Software Architect",          company: "Tech Innovations",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/smart-pensive-redhead-hipster-with-full-beard-glasses-dressed-casual-clothes-poses-with-hand-chin-studio-isolated-dark-background_613910-4094.jpg"},
        {
          id: "t2",          name: "Aisha Rahman",          role: "Author & Educator",          company: "Mindful Living",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/side-view-young-woman-shooting-with-projector_23-2149424927.jpg"},
        {
          id: "t3",          name: "Omar Hassan",          role: "Entrepreneur",          company: "Impact Ventures",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/serious-afroamerican-businessman-front-view_23-2148508922.jpg"},
        {
          id: "t4",          name: "Fatima Zahra",          role: "Data Scientist",          company: "Quantum Analytics",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/brunette-guy-shirt-looks-camera-thoughtfully-against-isolated-wall_197531-23276.jpg"},
        {
          id: "t5",          name: "Yusuf Khan",          role: "Management Consultant",          company: "Strategic Insights",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/smiling-senior-engineer-solar-panels-plant-reading-documentation_482257-120499.jpg"},
        {
          id: "t6",          name: "Leila Said",          role: "Psychologist",          company: "Inner Compass",          rating: 5,
          imageSrc: "http://img.b2bpic.net/free-photo/fantasy-scene-depicting-sun-god-s_23-2151339298.jpg"},
      ]}
      kpiItems={[
        {
          value: "95%",          label: "Users report clarity"},
        {
          value: "4.9/5",          label: "Average discipline rating"},
        {
          value: "70%+",          label: "Mistakes converted to fuel"},
      ]}
      title="Insights from the Journey"
      description="Hear how others (or your future self) have embraced self-accountability and transformed their past into a powerful engine for continuous, disciplined change."
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCenter
      useInvertedBackground={false}
      background={{
        variant: "animated-grid"}}
      tag="Connect"
      title="Share Your Thoughts"
      description="Your insights help us refine 'The Past as a Fuel.' Reach out with feedback, support requests, or share your Muhasabah journey."
      inputPlaceholder="Enter your email for updates"
      buttonText="Stay Informed"
      termsText="By clicking Stay Informed you're confirming that you agree with our Terms and Conditions."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterLogoEmphasis
      columns={[
        {
          items: [
            {
              label: "Home",              href: "#hero"},
            {
              label: "Features",              href: "#features"},
            {
              label: "Lessons",              href: "#lessons"},
            {
              label: "FAQ",              href: "#faq"},
            {
              label: "Testimonials",              href: "#testimonials"},
          ],
        },
        {
          items: [
            {
              label: "Privacy Policy",              href: "#"},
            {
              label: "Terms of Service",              href: "#"},
            {
              label: "Support",              href: "#contact"},
          ],
        },
      ]}
      logoText="The Past as a Fuel"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
