"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
import MediaAbout from '@/components/sections/about/MediaAbout';
import FeatureCardNineteen from '@/components/sections/feature/FeatureCardNineteen';
import MetricCardTwo from '@/components/sections/metrics/MetricCardTwo';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import FaqBase from '@/components/sections/faq/FaqBase';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterCard from '@/components/sections/footer/FooterCard';
import { Sparkles, Target, Zap, TrendingUp, HelpCircle, Twitter, Linkedin, Github } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="reveal-blur"
      borderRadius="soft"
      contentWidth="compact"
      sizing="mediumSizeLargeTitles"
      background="aurora"
      cardStyle="solid"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="layered"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          navItems={[
            { name: "Product", id: "features" },
            { name: "About", id: "about" },
            { name: "Why Us", id: "metrics" },
            { name: "Insights", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Explore the Possibility",            href: "contact"
          }}
          brandName="AIThink"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardCarousel
          title="AI That Works the Way You Think"
          description="Powerful artificial intelligence without the complexity. Seamlessly integrated into your workflow."
          tag="Innovation"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          background={{ variant: "aurora" }}
          buttons={[
            { text: "Explore the Possibility", href: "contact" },
            { text: "View Demo", href: "features" }
          ]}
          buttonAnimation="blur-reveal"
          mediaItems={[
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ6MmTTHIi4T60IT7MpVsD4EXo/a-modern-ai-dashboard-with-clean-minimal-1772533062792-97277564.png",              imageAlt: "AI dashboard interface"
            },
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ6MmTTHIi4T60IT7MpVsD4EXo/machine-learning-visualization-with-neur-1772533062237-d1655f29.png",              imageAlt: "Machine learning visualization"
            },
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ6MmTTHIi4T60IT7MpVsD4EXo/enterprise-analytics-platform-interface--1772533064412-38de5cf6.png",              imageAlt: "Analytics platform"
            },
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ6MmTTHIi4T60IT7MpVsD4EXo/ai-workflow-integration-diagram-showing--1772533062688-a0641b7a.png",              imageAlt: "AI integration workflow"
            },
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ6MmTTHIi4T60IT7MpVsD4EXo/real-time-data-processing-visualization--1772533062482-eb809e14.png",              imageAlt: "Real-time data processing"
            },
            {
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ6MmTTHIi4T60IT7MpVsD4EXo/ai-assistant-interface-showing-conversat-1772533062670-1afda77f.png",              imageAlt: "AI assistant interface"
            }
          ]}
          ariaLabel="Hero section showcasing AI product"
        />
      </div>

      <div id="about" data-section="about">
        <MediaAbout
          title="Simplicity Meets Intelligence"
          description="Our AI platform distills complex machine learning into intuitive, human-centered tools. We believe artificial intelligence should enhance human creativity, not replace it. By eliminating unnecessary complexity, we enable teams to focus on what matters most: delivering value."
          tag="Our Vision"
          tagIcon={Target}
          tagAnimation="slide-up"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ6MmTTHIi4T60IT7MpVsD4EXo/a-diverse-team-of-professionals-collabor-1772533062894-b91e7c5d.png"
          imageAlt="Team collaborating with AI tools"
          useInvertedBackground={false}
          buttons={[
            { text: "Learn More", href: "#features" }
          ]}
          buttonAnimation="blur-reveal"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardNineteen
          title="How It Works"
          description="A streamlined approach to artificial intelligence that respects your workflow"
          tag="Process"
          tagIcon={Zap}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          features={[
            {
              id: 1,
              tag: "Connect",              title: "Seamless Integration",              subtitle: "Connect in minutes, not months",              description: "Our platform integrates directly with your existing tools and workflows. No complex setup required. Start leveraging AI capabilities immediately with simple API connections and pre-built integrations.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ6MmTTHIi4T60IT7MpVsD4EXo/seamless-integration-diagram-showing-mul-1772533062323-42128302.png",              imageAlt: "Integration workflow diagram"
            },
            {
              id: 2,
              tag: "Understand",              title: "Transparent Intelligence",              subtitle: "Always know why your AI decided",              description: "Every decision your AI makes is explainable. Our interpretability features ensure you understand the reasoning behind each prediction, maintaining trust and control over your operations.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ6MmTTHIi4T60IT7MpVsD4EXo/ai-decision-transparency-interface-showi-1772533063782-c6c874bb.png",              imageAlt: "AI decision transparency interface"
            },
            {
              id: 3,
              tag: "Scale",              title: "Enterprise Ready",              subtitle: "From prototype to production effortlessly",              description: "Built for enterprises that need reliability. Our infrastructure handles millions of predictions per second with guaranteed uptime, security, and compliance across all major standards.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ6MmTTHIi4T60IT7MpVsD4EXo/enterprise-infrastructure-visualization--1772533062823-7e7295d3.png",              imageAlt: "Scalable infrastructure"
            },
            {
              id: 4,
              tag: "Optimize",              title: "Continuous Improvement",              subtitle: "Your AI gets smarter with every use",              description: "Machine learning models that adapt to your data. Automated retraining pipelines ensure your AI remains accurate and relevant as your business evolves and new patterns emerge.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ6MmTTHIi4T60IT7MpVsD4EXo/model-optimization-dashboard-showing-per-1772533063742-f33df017.png",              imageAlt: "Model optimization dashboard"
            }
          ]}
          buttons={[
            { text: "View Documentation", href: "#" }
          ]}
          buttonAnimation="blur-reveal"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardTwo
          title="Trusted by Leaders"
          description="Our platform powers intelligent decision-making across industries"
          tag="Impact"
          tagIcon={TrendingUp}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          metrics={[
            { id: "1", value: "99.9%", description: "Platform Uptime" },
            { id: "2", value: "10M+", description: "Predictions Daily" },
            { id: "3", value: "500+", description: "Enterprise Clients" },
            { id: "4", value: "45ms", description: "Average Latency" }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardFifteen
          testimonial="This AI platform completely transformed how we approach data-driven decisions. The simplicity of the interface combined with the power of the underlying technology is exactly what we needed. Our team adopted it within weeks."
          rating={5}
          author="Sarah Chen, VP of Technology at CloudNine"
          avatars={[
            {
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ6MmTTHIi4T60IT7MpVsD4EXo/professional-headshot-of-a-confident-fem-1772533062095-1a9a53d6.png",              alt: "Sarah Chen"
            },
            {
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ6MmTTHIi4T60IT7MpVsD4EXo/professional-headshot-of-a-male-technolo-1772533061861-ab57b5d6.png",              alt: "Team member 2"
            },
            {
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ6MmTTHIi4T60IT7MpVsD4EXo/professional-headshot-of-a-confident-fem-1772533062193-423ef1a2.png",              alt: "Team member 3"
            },
            {
              src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ6MmTTHIi4T60IT7MpVsD4EXo/professional-headshot-of-a-male-business-1772533061777-d2f2d638.png",              alt: "Team member 4"
            }
          ]}
          ratingAnimation="slide-up"
          avatarsAnimation="slide-up"
          useInvertedBackground={true}
        />
      </div>

      <div id="social-proof" data-section="social-proof">
        <SocialProofOne
          title="Trusted by Industry Leaders"
          description="Join forward-thinking organizations leveraging AI to transform their operations"
          tag="Partners"
          tagIcon={TrendingUp}
          textboxLayout="default"
          useInvertedBackground={false}
          names={["TechCorp", "InnovateLab", "DataStream", "CloudScale", "FutureAI", "SmartOps", "VisionTech", "NexusData"]}
          speed={40}
          showCard={true}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqBase
          title="Common Questions"
          description="Everything you need to know about our AI platform"
          tag="Help"
          tagIcon={HelpCircle}
          textboxLayout="default"
          useInvertedBackground={true}
          faqsAnimation="slide-up"
          faqs={[
            {
              id: "1",              title: "How does your AI maintain data privacy?",              content: "We implement end-to-end encryption and comply with GDPR, CCPA, and other global data protection standards. Your data never leaves your infrastructure unless you explicitly choose to use our cloud services. We conduct regular security audits and maintain SOC 2 Type II certification."
            },
            {
              id: "2",              title: "What technical expertise do I need to implement this?",              content: "Our platform is designed for non-technical users. No machine learning expertise required. We provide comprehensive documentation, video tutorials, and dedicated support to help your team get started. Most customers are operational within 2-4 weeks."
            },
            {
              id: "3",              title: "Can I integrate this with our existing systems?",              content: "Yes. We offer REST APIs, webhooks, and pre-built connectors for popular platforms like Salesforce, HubSpot, and Slack. Our integration team can help with custom connections to legacy systems as needed."
            },
            {
              id: "4",              title: "How do you handle model drift and accuracy over time?",              content: "Our platform includes automated monitoring and retraining pipelines. We continuously track model performance metrics and automatically retrain when accuracy drops below your specified threshold. You're always using an optimized model."
            },
            {
              id: "5",              title: "What's your pricing model?",              content: "We offer flexible pricing based on your usage needs. Options include per-prediction pricing, monthly subscriptions, and custom enterprise agreements. No long-term contracts required. Get a custom quote based on your specific requirements."
            },
            {
              id: "6",              title: "Do you offer training for my team?",              content: "Absolutely. We provide onboarding sessions, certification programs, and ongoing training. Our customer success team works closely with you to ensure your team is fully confident using the platform."
            }
          ]}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Explore the Possibility"
          description="Ready to transform your business with intelligent AI? Let's start a conversation. Our team will show you how AIThink can drive real results for your organization."
          inputs={[
            { name: "name", type: "text", placeholder: "Your name", required: true },
            { name: "email", type: "email", placeholder: "your@email.com", required: true },
            { name: "company", type: "text", placeholder: "Your company", required: false }
          ]}
          textarea={{
            name: "message",            placeholder: "Tell us about your AI needs and goals",            rows: 5,
            required: true
          }}
          useInvertedBackground={false}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AQ6MmTTHIi4T60IT7MpVsD4EXo/professional-customer-success-team-in-a--1772533062847-db235f6d.png"
          imageAlt="Professional team collaboration"
          mediaAnimation="blur-reveal"
          mediaPosition="right"
          buttonText="Send Message"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterCard
          logoText="AIThink"
          copyrightText="© 2025 AIThink. All rights reserved."
          socialLinks={[
            { icon: Twitter, href: "https://twitter.com", ariaLabel: "Twitter" },
            { icon: Linkedin, href: "https://linkedin.com", ariaLabel: "LinkedIn" },
            { icon: Github, href: "https://github.com", ariaLabel: "GitHub" }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}
