"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroShowcaseSplitOverlay from '@/components/sections/hero/HeroShowcaseSplitOverlay';
import SplitAbout from '@/components/sections/about/SplitAbout';
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import TeamCardOne from '@/components/sections/team/TeamCardOne';
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import ContactFaq from '@/components/sections/contact/ContactFaq';
import FooterCard from '@/components/sections/footer/FooterCard';
import { BookOpen, Lightbulb, GraduationCap, Award, TrendingUp, Users, CheckCircle, Calendar, Star, HelpCircle, Phone, Facebook, Twitter, Instagram, Linkedin } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="shift-hover"
      defaultTextAnimation="entrance-slide"
      borderRadius="soft"
      contentWidth="medium"
      sizing="mediumSizeExtraSmallSpacing"
      background="floatingGradient"
      cardStyle="gradient-radial"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="outline"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          navItems={[
            { name: "Home", id: "hero" },
            { name: "About", id: "about" },
            { name: "Courses", id: "feature" },
            { name: "Team", id: "team" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Enroll Now",
            href: "contact"
          }}
          brandName="Green Card"
          logoAlt="Green Card English School"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroShowcaseSplitOverlay
          title="Master English with Green Card"
          description="Expert-led English language courses for all levels. From beginner to advanced proficiency, achieve your language goals with proven teaching methods."
          tags={["All Levels", "Expert Instructors", "Certified Programs", "Online & In-Person"]}
          buttons={[{ text: "Start Learning", href: "contact" },
            { text: "View Courses", href: "feature" }]}
          showcaseImageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484273512-laxrceeq.jpg"
          showcaseImageAlt="Students learning English in classroom"
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484274567-uf9rm5rd.jpg"
          imageAlt="Green Card English School classroom"
          showDimOverlay={false}
        />
      </div>

      <div id="about" data-section="about">
        <SplitAbout
          tag="Our Story"
          tagIcon={BookOpen}
          title="Transforming Lives Through English Excellence"
          description="Leading English Language School serving 5000+ students since 2010 with expert instructors and proven teaching methods."
          textboxLayout="default"
          useInvertedBackground="noInvert"
          bulletPoints={[
            {
              title: "Expert Instructors",
              description: "CELTA and TEFL certified teachers with international experience and proven track records.",
              icon: Lightbulb
            },
            {
              title: "Comprehensive Programs",
              description: "From A1 beginner to C2 advanced levels with specialized exam preparation courses.",
              icon: GraduationCap
            },
            {
              title: "Flexible Learning",
              description: "Choose between online classes, in-person sessions, or a hybrid approach that fits your schedule.",
              icon: CheckCircle
            }
          ]}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484274567-uf9rm5rd.jpg"
          imageAlt="Green Card English School"
          imagePosition="right"
        />
      </div>

      <div id="feature" data-section="feature">
        <FeatureCardNine
          title="Comprehensive Course Levels"
          description="Structured progression from A1 beginner to C2 mastery with interactive lessons"
          tag="Our Curriculum"
          tagIcon={GraduationCap}
          features={[
            {
              id: 1,
              title: "Beginner to Intermediate",
              description: "Build foundational English skills with conversational practice and grammar essentials for everyday communication.",
              phoneOne: {
                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484275497-tgqo47rb.jpg"
              },
              phoneTwo: {
                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484276715-ko0kx5uk.jpg"
              }
            },
            {
              id: 2,
              title: "Advanced Professional English",
              description: "Master business communication, technical writing, and advanced conversation for professional success.",
              phoneOne: {
                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484276715-ko0kx5uk.jpg"
              },
              phoneTwo: {
                imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484275497-tgqo47rb.jpg"
              }
            }
          ]}
          showStepNumbers={true}
          buttons={[{ text: "Browse All Courses", href: "contact" }]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="socialProof" data-section="socialProof">
        <SocialProofOne
          logos={[
            "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140106374-le5uxrj5.jpg",
            "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140107205-4bafhl5z.jpg",
            "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140109000-ndb7534s.jpg",
            "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140110880-q16dspxs.jpg",
            "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140108208-9jx2n5py.jpg",
            "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140111672-sfjpgvql.jpg",
            "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766140105432-6wcp77a1.jpg"
          ]}
          title="Trusted by Global Partners"
          description="Recognized and certified by world-leading educational institutions and assessment bodies"
          tag="Certifications"
          tagIcon={Award}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          showCard={true}
          speed={40}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardOne
          title="Our Impact by Numbers"
          description="Proven results and student success across 15 years of English language education"
          tag="Statistics"
          tagIcon={TrendingUp}
          metrics={[
            {
              id: "1",
              value: "5000",
              title: "Students",
              description: "Successful Learners Graduated",
              icon: Users
            },
            {
              id: "2",
              value: "95",
              title: "Success Rate",
              description: "Students Reach Target Level",
              icon: CheckCircle
            },
            {
              id: "3",
              value: "45",
              title: "Expert Instructors",
              description: "Professional Certified Teachers",
              icon: Award
            },
            {
              id: "4",
              value: "15",
              title: "Years",
              description: "Delivering Excellence in Education",
              icon: Calendar
            }
          ]}
          gridVariant="four-items-2x2-equal-grid"
          animationType="slide-up"
          containerStyle="default"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="team" data-section="team">
        <TeamCardOne
          title="Meet Our Expert Instructors"
          description="Dedicated educators with international qualifications and years of teaching experience"
          tag="Leadership"
          tagIcon={Users}
          members={[
            {
              id: "1",
              name: "Sarah Mitchell",
              role: "Head of Curriculum",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484279424-p999gqcu.jpg",
              imageAlt: "Sarah Mitchell"
            },
            {
              id: "2",
              name: "Maria Garcia",
              role: "Pronunciation Specialist",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484280475-f1uh14s0.jpg",
              imageAlt: "Maria Garcia"
            },
            {
              id: "3",
              name: "James Wilson",
              role: "Business English Coach",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484282785-0l4997z2.jpg",
              imageAlt: "James Wilson"
            },
            {
              id: "4",
              name: "Elena Rodriguez",
              role: "Exam Preparation Lead",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484283760-3el3enh8.jpg",
              imageAlt: "Elena Rodriguez"
            }
          ]}
          gridVariant="four-items-2x2-equal-grid"
          animationType="slide-up"
          containerStyle="default"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonial" data-section="testimonial">
        <FeatureCardEight
          features={[
            {
              id: 1,
              title: "Foundation Building",
              description: "Master the essentials of English grammar, vocabulary, and basic communication skills needed for everyday situations.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484275497-tgqo47rb.jpg",
              imageAlt: "Foundation Building course"
            },
            {
              id: 2,
              title: "Intermediate Progress",
              description: "Build confidence in conversations and develop skills for work and social interactions with intermediate-level competency.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484276715-ko0kx5uk.jpg",
              imageAlt: "Intermediate Progress course"
            },
            {
              id: 3,
              title: "Advanced Mastery",
              description: "Achieve fluency and professional proficiency with advanced grammar, nuanced vocabulary, and sophisticated communication abilities.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484274567-uf9rm5rd.jpg",
              imageAlt: "Advanced Mastery course"
            },
            {
              id: 4,
              title: "Exam Excellence",
              description: "Prepare for IELTS, TOEFL, and Cambridge exams with targeted strategies, practice tests, and expert guidance from certified examiners.",
              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/gallery/uploaded-1766484273512-laxrceeq.jpg",
              imageAlt: "Exam Excellence course"
            }
          ]}
          title="Student Success Stories"
          description="Hear from our graduates who have transformed their English skills"
          tag="Testimonials"
          tagIcon={Star}
          buttons={[{ text: "Enroll Today", href: "contact" }]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqDouble
          title="Frequently Asked Questions"
          description="Get answers to common questions about our courses, enrollment, and learning experience"
          tag="Support"
          tagIcon={HelpCircle}
          faqs={[
            {
              id: "1",
              title: "What are the course levels available?",
              content: "We offer courses from A1 (Beginner) to C2 (Mastery) following the CEFR framework. Each level includes 60-80 hours of instruction with grammar, vocabulary, listening, speaking, reading, and writing components."
            },
            {
              id: "2",
              title: "How long does each course take?",
              content: "Each course level typically takes 8-12 weeks depending on your learning pace and commitment. We offer flexible scheduling with options for intensive (3-4 hours/week) or extended (6-8 weeks) programs."
            },
            {
              id: "3",
              title: "Do you offer exam preparation?",
              content: "Yes, we specialize in IELTS, TOEFL, Cambridge, and TOEIC exam preparation. Our exam specialists provide targeted training with mock tests and personalized feedback to help you achieve your target score."
            },
            {
              id: "4",
              title: "Are classes online or in-person?",
              content: "We offer both options! Choose from live in-person classes at our campus or online classes via video conference. Many students mix both formats based on their schedule."
            },
            {
              id: "5",
              title: "What is your refund policy?",
              content: "We offer a 14-day money-back guarantee if you're not satisfied with the course. Refunds are processed within 7 business days of request."
            },
            {
              id: "6",
              title: "Do you provide certificates?",
              content: "Yes, upon course completion, students receive a Green Card certificate of proficiency. For exam preparation, you receive official exam certificates recognized internationally."
            }
          ]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
          animationType="smooth"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactFaq
          ctaTitle="Ready to Start Your English Journey?"
          ctaDescription="Book a free consultation with one of our advisors to find the perfect course for your goals."
          ctaButton={{
            text: "Book Free Consultation",
            href: "#enrollment"
          }}
          ctaIcon={Phone}
          faqs={[
            {
              id: "1",
              title: "How do I enroll?",
              content: "Simply click the enrollment button above or email us at enroll@greencard.edu. Our team will assess your level and recommend the best course for you."
            },
            {
              id: "2",
              title: "What if I'm a complete beginner?",
              content: "No problem! Our A1 Beginner course is designed for complete beginners. We start from the very basics with pronunciation, simple grammar, and essential vocabulary."
            },
            {
              id: "3",
              title: "Can I get a refund?",
              content: "We offer a 14-day money-back guarantee for all courses. If you're not satisfied, contact us for a full refund within the guarantee period."
            },
            {
              id: "4",
              title: "What payment methods do you accept?",
              content: "We accept credit cards, bank transfers, and online payment platforms. Payment plans are also available for extended courses."
            }
          ]}
          useInvertedBackground="noInvert"
          animationType="slide-up"
          accordionAnimationType="smooth"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterCard
          logoText="Green Card"
          copyrightText="© 2025 Green Card English School. All rights reserved."
          socialLinks={[
            { icon: Facebook, href: "https://facebook.com/greencard", ariaLabel: "Facebook" },
            { icon: Twitter, href: "https://twitter.com/greencard", ariaLabel: "Twitter" },
            { icon: Instagram, href: "https://instagram.com/greencard", ariaLabel: "Instagram" },
            { icon: Linkedin, href: "https://linkedin.com/company/greencard", ariaLabel: "LinkedIn" }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}
