"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
import HeroSplitDualMedia from "@/components/sections/hero/HeroSplitDualMedia";
import FeatureCardSixteen from "@/components/sections/feature/FeatureCardSixteen";
import ProductCardFour from "@/components/sections/product/ProductCardFour";
import PricingCardEight from "@/components/sections/pricing/PricingCardEight";
import TestimonialCardThirteen from "@/components/sections/testimonial/TestimonialCardThirteen";
import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
import FaqBase from "@/components/sections/faq/FaqBase";
import ContactText from "@/components/sections/contact/ContactText";
import FooterCard from "@/components/sections/footer/FooterCard";
import { Sparkles, CheckCircle, Award, Zap, Star, HelpCircle, Twitter, Linkedin, Facebook, Instagram } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="reveal-blur"
      borderRadius="pill"
      contentWidth="compact"
      sizing="mediumLargeSizeLargeTitles"
      background="circleGradient"
      cardStyle="soft-shadow"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="glass"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingInline
          brandName="CourseHub"
          navItems={[
            { name: "होम", id: "hero" },
            { name: "कोर्सेज", id: "products" },
            { name: "प्राइसिंग", id: "pricing" },
            { name: "सवाल-जवाब", id: "faq" },
          ]}
          button={{
            text: "शुरुआत करें",            href: "#contact"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplitDualMedia
          title="अपने कौशल को अगले स्तर तक ले जाएं"
          description="हम आपको विश्वमानक कोर्सेज प्रदान करते हैं जो आपके कैरियर को नई ऊंचाइयों तक ले जाएंगे। लाखों विद्यार्थियों ने हमारे साथ सीखा है।"
          tag="ऑनलाइन शिक्षा प्लेटफॉर्म"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          mediaItems={[
            {
              imageSrc: "http://img.b2bpic.net/free-photo/rear-view-young-college-student-paying-attention-listening-her-online-teacher-laptop-home_662251-2487.jpg",              imageAlt: "ऑनलाइन कोर्स सीखने वाले विद्यार्थी"
            },
            {
              imageSrc: "http://img.b2bpic.net/free-photo/teleworker-using-headphones-home-watch-instructional-course-videos_482257-118863.jpg",              imageAlt: "डिजिटल शिक्षा प्रशिक्षण"
            },
          ]}
          mediaAnimation="slide-up"
          rating={5}
          ratingText="10,000+ संतुष्ट विद्यार्थी"
          buttons={[
            { text: "अभी एनरोल करें", href: "#pricing" },
            { text: "विशेषताएं देखें", href: "#features" },
          ]}
          buttonAnimation="slide-up"
          background={{ variant: "plain" }}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardSixteen
          negativeCard={{
            items: [
              "समय की बर्बादी",              "सीमित संसाधन",              "कोई समर्थन नहीं",              "अपूर्ण पाठ्यक्रम"
            ],
          }}
          positiveCard={{
            items: [
              "तेज सीखने की गति",              "विस्तृत शिक्षण सामग्री",              "24/7 समर्थन टीम",              "प्रमाणपत्र प्राप्त करें"
            ],
          }}
          animationType="slide-up"
          title="पारंपरिक शिक्षा vs. आधुनिक कोर्सेज"
          description="हमारे कोर्सेज आपको सर्वोत्तम संसाधन और समर्थन प्रदान करते हैं।"
          textboxLayout="default"
          useInvertedBackground={false}
          tag="क्यों हमें चुनें"
          tagIcon={CheckCircle}
          tagAnimation="slide-up"
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardFour
          title="लोकप्रिय कोर्सेज"
          description="हमारे सबसे लोकप्रिय कोर्सेज जो हजारों विद्यार्थियों को प्रशिक्षित कर चुके हैं।"
          tag="शीर्ष रेटेड"
          tagIcon={Award}
          tagAnimation="slide-up"
          products={[
            {
              id: "1",              name: "वेब डेवलपमेंट मास्टरक्लास",              price: "₹4,999",              variant: "HTML, CSS, JavaScript",              imageSrc: "http://img.b2bpic.net/free-photo/working-code_1098-19858.jpg",              imageAlt: "वेब डेवलपमेंट कोर्स"
            },
            {
              id: "2",              name: "डेटा साइंस फंडामेंटल्स",              price: "₹5,999",              variant: "Python, Machine Learning",              imageSrc: "http://img.b2bpic.net/free-photo/remote-worker-home-watching-business-conference-pc-monitor_482257-125192.jpg",              imageAlt: "डेटा साइंस कोर्स"
            },
            {
              id: "3",              name: "डिजिटल मार्केटिंग प्रोफेशनल",              price: "₹3,999",              variant: "SEO, Content, Social Media",              imageSrc: "http://img.b2bpic.net/free-photo/businessman-holding-digital-tablet-with-digital-marketing-graph_9975-22063.jpg",              imageAlt: "डिजिटल मार्केटिंग कोर्स"
            },
            {
              id: "4",              name: "यूआई/यूएक्स डिजाइन कोर्स",              price: "₹4,499",              variant: "Figma, Design Systems",              imageSrc: "http://img.b2bpic.net/free-vector/task-management-application_23-2148625868.jpg",              imageAlt: "यूआई/यूएक्स डिजाइन कोर्स"
            },
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          buttons={[{ text: "सभी कोर्सेज देखें", href: "#" }]}
          buttonAnimation="slide-up"
        />
      </div>

      <div id="pricing" data-section="pricing">
        <PricingCardEight
          title="सही प्लान चुनें"
          description="आपकी जरूरत के अनुसार सर्वोत्तम प्रशिक्षण पैकेज।"
          tag="प्राइसिंग"
          tagIcon={Zap}
          tagAnimation="slide-up"
          plans={[
            {
              id: "basic",              badge: "शुरुआती के लिए",              badgeIcon: Sparkles,
              price: "₹999",              subtitle: "एक कोर्स तक पहुंच",              buttons: [{ text: "शुरुआत करें", href: "#" }],
              features: [
                "1 कोर्स तक पहुंच",                "लाइफटाइम सपोर्ट",                "डाउनलोडेबल संसाधन",                "कम्युनिटी फोरम"
              ],
            },
            {
              id: "pro",              badge: "सर्वाधिक लोकप्रिय",              badgeIcon: Sparkles,
              price: "₹4,999",              subtitle: " 10 कोर्सेज तक पहुंच",              buttons: [{ text: "अभी खरीदें", href: "#" }],
              features: [
                "10 कोर्सेज तक पहुंच",                "24/7 प्राथमिकता सहायता",                "प्रमाणपत्र",                "मेंटरशिप कार्यक्रम",                "एक्सक्लूसिव वेबिनार"
              ],
            },
            {
              id: "enterprise",              badge: "संस्थान के लिए",              badgeIcon: Sparkles,
              price: "₹9,999",              subtitle: "असीमित पहुंच",              buttons: [{ text: "संपर्क करें", href: "#" }],
              features: [
                "सभी कोर्सेज की पहुंच",                "डेडिकेटेड खाता प्रबंधक",                "कस्टम कोर्स विकास",                "एंटरप्राइज एसएसओ",                "उन्नत विश्लेषिकी",                "व्यक्तिगत प्रशिक्षण सत्र"
              ],
            },
          ]}
          carouselMode="buttons"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardThirteen
          title="हमारे विद्यार्थियों की सफलता"
          description="हजारों विद्यार्थियों ने हमारे कोर्सेज से अपना कैरियर बदला है।"
          tag="प्रशंसापत्र"
          tagIcon={Star}
          tagAnimation="slide-up"
          testimonials={[
            {
              id: "1",              name: "राज कुमार",              handle: "@rajkumar",              testimonial: "इस कोर्स ने मेरा जीवन बदल दिया। मैंने 6 महीने में एक अच्छी नौकरी पा ली।",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/pensive-person-alone-corridor-serious_1262-1042.jpg",              imageAlt: "portrait man professional avatar"
            },
            {
              id: "2",              name: "प्रिया शर्मा",              handle: "@priyasharma",              testimonial: "शिक्षकों की गुणवत्ता और पाठ्यक्रम की संरचना बहुत अच्छी है।",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/real-professional-smiling-businesswoman-looking-confident-determined-face-expression-standing-suit-white-background_1258-123234.jpg",              imageAlt: "woman professional portrait face"
            },
            {
              id: "3",              name: "अमित सिंह",              handle: "@amitsingh",              testimonial: "मेरे लिए यह कोर्स सबसे मूल्यवान निवेश साबित हुआ।",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/pensive-person-alone-corridor-serious_1262-1042.jpg",              imageAlt: "man portrait professional avatar"
            },
            {
              id: "4",              name: "निशा वर्मा",              handle: "@nishaverm",              testimonial: "शानदार सामग्री और अद्भुत समुदाय सहायता। सबको सुझाऊंगी।",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/real-professional-smiling-businesswoman-looking-confident-determined-face-expression-standing-suit-white-background_1258-123234.jpg",              imageAlt: "woman face professional portrait"
            },
            {
              id: "5",              name: "विजय पटेल",              handle: "@vijaypatel",              testimonial: "व्यावहारिक ज्ञान और कौशल विकास पर ध्यान केंद्रित। बहुत प्रभावी।",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/confident-european-businessman-smiling-closeup-portrait-jobs-career-campaign_53876-128975.jpg",              imageAlt: "man professional avatar portrait"
            },
            {
              id: "6",              name: "सीता चौधरी",              handle: "@sitachoudh",              testimonial: "यह कोर्स मेरी कैरियर यात्रा को पूरी तरह बदल गया है।",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/positive-confident-businesswoman-wearing-formal-suit-standing-with-arms-folded_74855-10328.jpg",              imageAlt: "woman professional face avatar"
            },
          ]}
          showRating={true}
          carouselMode="buttons"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
        />
      </div>

      <div id="social-proof" data-section="social-proof">
        <SocialProofOne
          title="शीर्ष कंपनियों द्वारा विश्वस्त"
          description="दुनिया भर की प्रमुख कंपनियों के कर्मचारी हमारे कोर्सेज से सीखते हैं।"
          tag="भागीदार"
          tagIcon={Zap}
          tagAnimation="slide-up"
          names={[
            "Google",            "Microsoft",            "Amazon",            "Meta",            "Apple",            "Netflix",            "Uber",            "Airbnb"
          ]}
          textboxLayout="default"
          useInvertedBackground={false}
          speed={40}
          showCard={true}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqBase
          title="सबसे अधिक पूछे जाने वाले प्रश्न"
          description="हमारे कोर्सेज के बारे में आपके सभी प्रश्नों का उत्तर।"
          tag="सहायता"
          tagIcon={HelpCircle}
          tagAnimation="slide-up"
          faqs={[
            {
              id: "1",              title: "मैं कोर्स के लिए कैसे नामांकन कर सकता हूं?",              content: "नामांकन बहुत सरल है। बस अपना पसंदीदा कोर्स चुनें, 'एनरोल करें' पर क्लिक करें, अपना विवरण भरें और भुगतान करें। तुरंत आपको पाठ्यक्रम सामग्री तक पहुंच मिल जाएगी।"
            },
            {
              id: "2",              title: "क्या मैं कोर्स को अपनी गति से सीख सकता हूं?",              content: "हां, पूरी तरह से! सभी कोर्सेज सेल्फ-पेस्ड हैं। आप कभी भी, कहीं भी सीख सकते हैं। कोई समय सीमा नहीं है।"
            },
            {
              id: "3",              title: "क्या मुझे प्रमाणपत्र मिलेगा?",              content: "हां, कोर्स पूरा करने के बाद आपको एक स्वीकृत प्रमाणपत्र मिलेगा जो आप अपने रिज्यूमे में शामिल कर सकते हैं।"
            },
            {
              id: "4",              title: "अगर मुझे कोर्स पसंद नहीं आया तो?",              content: "हम 30 दिन की मनी-बैक गारंटी प्रदान करते हैं। यदि आप संतुष्ट नहीं हैं, तो पूरी राशि वापस कर दी जाएगी।"
            },
            {
              id: "5",              title: "क्या कोई समर्थन उपलब्ध है?",              content: "हां, हमारी समर्पित समर्थन टीम 24/7 उपलब्ध है। आप ईमेल, चैट या फोन के माध्यम से हमसे संपर्क कर सकते हैं।"
            },
            {
              id: "6",              title: "क्या नए कोर्सेज नियमित रूप से जोड़े जाते हैं?",              content: "हां, हम नियमित रूप से नए और अपडेट किए गए कोर्सेज जोड़ते हैं। प्रो सदस्य को सभी नए कोर्सेज तक स्वचालित पहुंच मिलती है।"
            },
          ]}
          faqsAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="smooth"
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactText
          text="आपका भविष्य अब शुरू होता है। आज ही हमारे साथ जुड़ें और अपने सपनों को हकीकत में बदलें।"
          animationType="reveal-blur"
          buttons={[
            { text: "अभी शुरुआत करें", href: "#pricing" },
            { text: "अधिक जानकारी", href: "#" },
          ]}
          background={{ variant: "plain" }}
          useInvertedBackground={false}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterCard
          logoText="CourseHub"
          copyrightText="© 2025 | CourseHub. सर्वाधिकार सुरक्षित।"
          socialLinks={[
            {
              icon: Twitter,
              href: "https://twitter.com/coursehub",              ariaLabel: "Twitter"
            },
            {
              icon: Linkedin,
              href: "https://linkedin.com/company/coursehub",              ariaLabel: "LinkedIn"
            },
            {
              icon: Facebook,
              href: "https://facebook.com/coursehub",              ariaLabel: "Facebook"
            },
            {
              icon: Instagram,
              href: "https://instagram.com/coursehub",              ariaLabel: "Instagram"
            },
          ]}
        />
      </div>
    </ThemeProvider>
  );
}
