"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleMinimal from '@/components/navbar/NavbarStyleMinimal';
import HeroLogo from '@/components/sections/hero/HeroLogo';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
import FooterCard from '@/components/sections/footer/FooterCard';
import { Zap, CheckCircle, Twitter, Linkedin, Facebook, Instagram } from 'lucide-react';

export default function CoursesPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="reveal-blur"
      borderRadius="sharp"
      contentWidth="compact"
      sizing="largeSmall"
      background="floatingGradient"
      cardStyle="inset"
      primaryButtonStyle="flat"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleMinimal
          brandName="GiGant Academy"
          button={{
            text: "Start Learning",
            href: "/courses"
          }}
        />
      </div>

      <div id="courses-hero" data-section="courses-hero">
        <HeroLogo
          logoText="Investment Courses"
          description="Choose from our comprehensive collection of investment courses designed for every skill level."
          buttons={[
            { text: "Back to Home", href: "/" },
            { text: "View Pricing", href: "/pricing" }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/young-girl-listening-educational-documentary-laptop-takes-notes_482257-126301.jpg"
          imageAlt="Investment courses catalog"
          showDimOverlay={true}
          logoLineHeight={1.15}
        />
      </div>

      <div id="courses-grid" data-section="courses-grid">
        <ProductCardFour
          title="Our Course Catalog"
          description="Explore our diverse range of investment education programs tailored to your learning goals."
          tag="Featured"
          tagIcon={Zap}
          textboxLayout="default"
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          useInvertedBackground="invertDefault"
          products={[
            {
              id: "1",
              name: "Beginner Investment Fundamentals",
              price: "$199",
              variant: "8 weeks · Self-paced",
              imageSrc: "https://img.b2bpic.net/free-photo/young-girl-listening-educational-documentary-laptop-takes-notes_482257-126301.jpg",
              imageAlt: "Fundamentals course"
            },
            {
              id: "2",
              name: "Stock Market Mastery",
              price: "$299",
              variant: "12 weeks · Live sessions",
              imageSrc: "https://img.b2bpic.net/free-photo/young-girl-listening-educational-documentary-laptop-takes-notes_482257-126301.jpg",
              imageAlt: "Stock market course"
            },
            {
              id: "3",
              name: "Real Estate Investment Blueprint",
              price: "$399",
              variant: "10 weeks · Expert mentorship",
              imageSrc: "https://img.b2bpic.net/free-photo/young-girl-listening-educational-documentary-laptop-takes-notes_482257-126301.jpg",
              imageAlt: "Real estate course"
            },
            {
              id: "4",
              name: "Options Trading Strategies",
              price: "$349",
              variant: "12 weeks · Live trading sessions",
              imageSrc: "https://img.b2bpic.net/free-photo/young-girl-listening-educational-documentary-laptop-takes-notes_482257-126301.jpg",
              imageAlt: "Options trading course"
            }
          ]}
        />
      </div>

      <div id="courses-features" data-section="courses-features">
        <FeatureCardTwentyOne
          tag="Course Benefits"
          tagIcon={CheckCircle}
          title="What You'll Get"
          description="Every course includes comprehensive materials, expert instruction, and community support."
          accordionItems={[
            {
              id: "1",
              title: "Video Lessons & Materials",
              content: "High-quality video lectures covering every topic in depth. Access unlimited course materials, downloadable resources, and supplementary reading lists."
            },
            {
              id: "2",
              title: "Certification",
              content: "Earn recognized certificates upon course completion. Showcase your investment expertise to employers and clients with our verified credentials."
            },
            {
              id: "3",
              title: "Lifetime Access",
              content: "Never lose access to your courses. Get lifetime updates, new content additions, and exclusive bonuses included with your purchase."
            }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/woman-sitting-library-with-her-laptop_273609-12725.jpg"
          imageAlt="Course materials and mentorship"
          useInvertedBackground="noInvert"
          mediaPosition="left"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterCard
          logoText="GiGant Academy"
          copyrightText="© 2025 GiGant Academy. All rights reserved. | Empowering Investors Worldwide"
          socialLinks={[
            { icon: Twitter, href: "https://twitter.com/gigantacademy", ariaLabel: "Twitter" },
            { icon: Linkedin, href: "https://linkedin.com/company/gigant-academy", ariaLabel: "LinkedIn" },
            { icon: Facebook, href: "https://facebook.com/gigantacademy", ariaLabel: "Facebook" },
            { icon: Instagram, href: "https://instagram.com/gigantacademy", ariaLabel: "Instagram" }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}