"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import FeatureCardSixteen from '@/components/sections/feature/FeatureCardSixteen';
import ProductCardTwo from '@/components/sections/product/ProductCardTwo';
import MetricCardThree from '@/components/sections/metrics/MetricCardThree';
import TeamCardFive from '@/components/sections/team/TeamCardFive';
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FooterBase from '@/components/sections/footer/FooterBase';
import { Zap, CheckCircle, Beaker, TrendingUp, Clock, Award, Users, Mail } from 'lucide-react';

export default function NeuroLinkPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="reveal-blur"
      borderRadius="sharp"
      contentWidth="compact"
      sizing="mediumLarge"
      background="none"
      cardStyle="gradient-mesh"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="layered"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="Neurolink"
          navItems={[
            { name: "About", id: "about" },
            { name: "Features", id: "features" },
            { name: "How It Works", id: "howitworks" },
            { name: "Team", id: "team" },
            { name: "Contact", id: "contact" }
          ]}
          button={{ text: "Explore", href: "hero" }}
        />
      </div>
      
      <div id="hero" data-section="hero">
        <HeroBillboard
          title="Neurolink: Bridging Mind and Machine"
          description="Explore the cutting-edge science project advancing brain-computer interfaces through innovative neural signal processing and real-time data interpretation."
          tag="Innovation in Neuroscience"
          tagIcon={Zap}
          imageSrc="https://img.b2bpic.net/free-vector/technology-background_23-2148116476.jpg"
          imageAlt="Advanced brain neural network visualization"
          buttons={[
            { text: "Learn More", href: "about" },
            { text: "View Research", href: "howitworks" }
          ]}
        />
      </div>
      
      <div id="about" data-section="about">
        <InlineImageSplitTextAbout
          heading={[
            { type: "text", content: "Understanding" },
            { type: "image", src: "https://img.b2bpic.net/free-vector/low-poly-brain-design-with-connecting-dots_1048-5757.jpg", alt: "Neurolink concept visualization" },
            { type: "text", content: "Neurolink Technology" }
          ]}
          useInvertedBackground="invertDefault"
          buttons={[
            { text: "Explore Science", href: "features" }
          ]}
        />
      </div>
      
      <div id="features" data-section="features">
        <FeatureCardSixteen
          title="What Sets Neurolink Apart"
          description="Our approach combines cutting-edge signal processing with neural science to create unprecedented brain-computer interaction capabilities."
          tag="Key Advantages"
          tagIcon={CheckCircle}
          negativeCard={{
            items: [
              "Traditional interfaces lack precision",              "Limited signal interpretation",              "High latency in response",              "Inconsistent data accuracy"
            ]
          }}
          positiveCard={{
            items: [
              "Real-time neural signal processing",              "Advanced machine learning algorithms",              "Sub-millisecond response time",              "99.2% signal accuracy"
            ]
          }}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>
      
      <div id="howitworks" data-section="howitworks">
        <ProductCardTwo
          title="How Neurolink Works"
          description="A three-stage process converting neural signals into actionable digital commands with unprecedented accuracy and speed."
          tag="Research Process"
          tagIcon={Beaker}
          products={[
            {
              id: "1",              brand: "Stage 1",              name: "Signal Acquisition",              price: "Bioelectrical Mapping",              rating: 5,
              reviewCount: "Advanced",              imageSrc: "https://img.b2bpic.net/free-vector/low-poly-brain-design-with-connecting-dots_1048-6319.jpg",              imageAlt: "Neural signal acquisition visualization"
            },
            {
              id: "2",              brand: "Stage 2",              name: "Signal Processing",              price: "Neural Decoding",              rating: 5,
              reviewCount: "Real-time",              imageSrc: "https://img.b2bpic.net/free-vector/low-poly-brain-design-with-connecting-dots_1048-5757.jpg",              imageAlt: "Signal processing and neural decoding"
            },
            {
              id: "3",              brand: "Stage 3",              name: "Command Translation",              price: "Output Generation",              rating: 5,
              reviewCount: "Seamless",              imageSrc: "https://img.b2bpic.net/free-vector/technology-background_23-2148116476.jpg",              imageAlt: "Command translation to digital interface"
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="invertDefault"
          gridVariant="three-columns-all-equal-width"
        />
      </div>
      
      <div id="metrics" data-section="metrics">
        <MetricCardThree
          title="Research Impact"
          description="Measurable achievements demonstrating the power and potential of Neurolink technology."
          tag="Performance Metrics"
          tagIcon={TrendingUp}
          metrics={[
            {
              id: "1",              icon: Zap,
              title: "Signal Accuracy",              value: "99.2%"
            },
            {
              id: "2",              icon: Clock,
              title: "Response Time",              value: "<5ms"
            },
            {
              id: "3",              icon: Award,
              title: "Success Rate",              value: "98.7%"
            },
            {
              id: "4",              icon: Users,
              title: "Test Subjects",              value: "150+"
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
        />
      </div>
      
      <div id="team" data-section="team">
        <TeamCardFive
          title="Our Research Team"
          description="Dedicated neuroscientists and engineers driving innovation in brain-computer interface technology."
          tag="Experts"
          tagIcon={Users}
          team={[
            {
              id: "1",              name: "Dr. Sarah Chen",              role: "Principal Investigator",              imageSrc: "https://img.b2bpic.net/free-photo/front-view-doctor-wearing-lab-coat_23-2149551157.jpg",              imageAlt: "Dr. Sarah Chen"
            },
            {
              id: "2",              name: "Prof. James Mitchell",              role: "Neuroscience Lead",              imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-smiley-scientist_23-2148969947.jpg",              imageAlt: "Prof. James Mitchell"
            },
            {
              id: "3",              name: "Dr. Elena Rodriguez",              role: "Signal Processing Engineer",              imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-doctor-wearing-goggles_23-2148816203.jpg",              imageAlt: "Dr. Elena Rodriguez"
            },
            {
              id: "4",              name: "Michael Zhang",              role: "ML Systems Architect",              imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-doctor-wearing-lab-coat_23-2149551158.jpg",              imageAlt: "Michael Zhang"
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="invertDefault"
        />
      </div>
      
      <div id="contact" data-section="contact">
        <ContactFaq
          ctaTitle="Get Involved"
          ctaDescription="Join us in advancing neurotechnology. Contact our team to learn about research opportunities, collaboration, or project details."
          ctaIcon={Mail}
          ctaButton={{ text: "Send Message", href: "mailto:research@neurolink.project" }}
          faqs={[
            {
              id: "1",              title: "What is the primary goal of Neurolink?",              content: "Neurolink aims to develop non-invasive brain-computer interfaces that can accurately interpret neural signals in real-time, enabling new forms of human-computer interaction and therapeutic applications."
            },
            {
              id: "2",              title: "How does the signal processing work?",              content: "Our system uses advanced machine learning algorithms to decode bioelectrical signals from the brain, filtering noise and identifying patterns that correspond to specific intentions or commands."
            },
            {
              id: "3",              title: "Is Neurolink safe?",              content: "Yes, our non-invasive approach uses only external sensors and has undergone rigorous safety testing with all participants. No surgical intervention is required."
            },
            {
              id: "4",              title: "What are potential applications?",              content: "Applications include assistive technology for paralysis patients, cognitive enhancement research, neurofeedback therapy, and novel communication interfaces."
            },
            {
              id: "5",              title: "How can I participate in research?",              content: "We welcome qualified participants. Contact our team through the form to discuss eligibility requirements and available study protocols."
            }
          ]}
          useInvertedBackground="noInvert"
          animationType="slide-up"
          accordionAnimationType="smooth"
        />
      </div>
      
      <div id="footer" data-section="footer">
        <FooterBase
          logoText="Neurolink"
          copyrightText="© 2025 Neurolink Science Project. All rights reserved."
          columns={[
            {
              title: "Project",              items: [
                { label: "About", href: "about" },
                { label: "Research", href: "howitworks" },
                { label: "Team", href: "team" }
              ]
            },
            {
              title: "Resources",              items: [
                { label: "Publications", href: "https://scholar.google.com" },
                { label: "Documentation", href: "https://github.com" },
                { label: "FAQ", href: "contact" }
              ]
            },
            {
              title: "Connect",              items: [
                { label: "Contact", href: "contact" },
                { label: "Social", href: "https://twitter.com" },
                { label: "Newsletter", href: "mailto:subscribe@neurolink.project" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}