"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
import FeatureCardTwentyOne from "@/components/sections/feature/FeatureCardTwentyOne";
import PricingCardFive from "@/components/sections/pricing/PricingCardFive";
import ContactText from "@/components/sections/contact/ContactText";
import FooterCard from "@/components/sections/footer/FooterCard";
import Link from "next/link";
import { CheckCircle, DollarSign, Award, Linkedin, Twitter, Facebook } from "lucide-react";

export default function ServicesPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="shift-hover"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="compact"
      sizing="large"
      background="floatingGradient"
      cardStyle="glass-depth"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="EduPath"
          navItems={[
            { name: "Home", id: "home" },
            { name: "Services", id: "services" },
            { name: "Pricing", id: "pricing" },
            { name: "About", id: "about" },
            { name: "Contact", id: "contact" },
          ]}
        />
      </div>

      <div id="services-features" data-section="services-features">
        <FeatureCardTwentyOne
          title="Comprehensive Service Offerings"
          description="We provide end-to-end educational guidance and career counseling services tailored to your institution's unique needs and student population."
          tag="Complete Solutions"
          tagIcon={CheckCircle}
          tagAnimation="slide-up"
          buttons={[
            {
              text: "Schedule Consultation",
              href: "/contact",
            },
          ]}
          buttonAnimation="slide-up"
          accordionItems={[
            {
              id: "psychometric",
              title: "Psychometric Career Assessments",
              content: "Our comprehensive personality, aptitude, and career interest assessments are scientifically validated and internationally recognized. Each student receives a detailed personalized report highlighting their strengths, learning styles, career preferences, and potential career pathways. Ideal for grades 10-12 and first-year college students.",
            },
            {
              id: "university-counseling",
              title: "University Application Counseling",
              content: "Navigate the complex world of university admissions with our expert counselors. We provide guidance on profile development, essay writing, interview preparation, and selection of institutions that align with your goals. Our services cover domestic and international applications.",
            },
            {
              id: "workshops",
              title: "Interactive Workshops & Seminars",
              content: "Engage your student body with dynamic, interactive workshops on essential topics: entrance exam preparation, study techniques, scholarship opportunities, life skills, and digital literacy. Delivered by experienced educators and industry professionals with customizable content for your institution.",
            },
            {
              id: "career-planning",
              title: "Career Planning & Higher Studies Guidance",
              content: "Help students make informed decisions about their educational and career futures. We provide comprehensive information about undergraduate programs, postgraduate specializations, professional certifications, and emerging career trends to align academic choices with market demands.",
            },
          ]}
          imageSrc="http://img.b2bpic.net/free-photo/expecting-couple-home-counselling-meeting-couple-visiting-psychologist-relationship-counseling_1157-47244.jpg"
          imageAlt="educational counselor providing comprehensive guidance"
          mediaAnimation="slide-up"
          useInvertedBackground={false}
          mediaPosition="right"
        />
      </div>

      <div id="services-pricing" data-section="services-pricing">
        <PricingCardFive
          title="Service Plans for Every Institution"
          description="Transparent, flexible pricing designed to fit institutions of all sizes. Each plan includes comprehensive support and access to our full range of services."
          tag="Customizable Pricing"
          tagIcon={DollarSign}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
          animationType="slide-up"
          plans={[
            {
              id: "basic",
              tag: "School Package",
              price: "$5,000",
              period: "per semester",
              description: "Perfect for single schools with 200-400 students",
              button: {
                text: "Learn More",
                href: "/contact",
              },
              featuresTitle: "Included",
              features: [
                "Psychometric assessments for 200 students",
                "2 group workshops per month",
                "Basic career counseling sessions",
                "Detailed assessment reports",
                "Email support",
              ],
            },
            {
              id: "professional",
              tag: "College Package",
              tagIcon: Award,
              price: "$12,000",
              period: "per semester",
              description: "Ideal for colleges with multiple programs",
              button: {
                text: "Learn More",
                href: "/contact",
              },
              featuresTitle: "Everything in Basic, plus",
              features: [
                "Psychometric assessments for 500 students",
                "4 specialized workshops per month",
                "Priority one-on-one counseling",
                "University application strategy sessions",
                "Dedicated account manager",
                "Monthly performance dashboards",
              ],
            },
            {
              id: "enterprise",
              tag: "University Package",
              price: "Custom",
              period: "tailored solutions",
              description: "Comprehensive program for large institutions",
              button: {
                text: "Contact Sales",
                href: "/contact",
              },
              featuresTitle: "Everything in College, plus",
              features: [
                "Unlimited psychometric assessments",
                "Weekly specialized workshops",
                "Full-scale one-on-one counseling program",
                "International university partnerships",
                "Custom curriculum development",
                "Advanced analytics and reporting platform",
              ],
            },
          ]}
        />
      </div>

      <div id="services-contact" data-section="services-contact">
        <ContactText
          text="Ready to Partner with EduPath?"
          animationType="entrance-slide"
          buttons={[
            {
              text: "Get Started Today",
              href: "/contact",
            },
            {
              text: "Request Demo",
              href: "/contact",
            },
          ]}
          background={{
            variant: "sparkles-gradient",
          }}
          useInvertedBackground={false}
        />
      </div>

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