"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import FooterCard from '@/components/sections/footer/FooterCard';
import { TrendingUp, Users, Target, Linkedin, Twitter, Mail } from 'lucide-react';

export default function ServicesPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="reveal-blur"
      borderRadius="sharp"
      contentWidth="mediumSmall"
      sizing="mediumSizeLargeTitles"
      background="aurora"
      cardStyle="gradient-bordered"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="glass"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered 
          brandName="Show Your Idea"
          navItems={[
            { name: "Home", id: "/" },
            { name: "About", id: "/about" },
            { name: "Services", id: "/services" },
            { name: "Portfolio", id: "/portfolio" },
            { name: "Contact", id: "/contact" }
          ]}
          button={{ text: "Pitch Your Idea", href: "/contact" }}
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardSix 
          title="Our Investment Services"
          description="We provide comprehensive support at every stage of your entrepreneurial journey"
          tag="What We Offer"
          features={[
            {
              id: 1,
              title: "Seed Funding & Early Stage Investment",
              description: "Access capital ranging from $250K to $2M for promising early-stage startups with innovative business models and strong founding teams.",
              imageSrc: "https://img.b2bpic.net/free-photo/shiny-bulb-businessman-s-hand_1232-148.jpg"
            },
            {
              id: 2,
              title: "Strategic Business Mentorship",
              description: "Work with industry veterans and experienced entrepreneurs who provide hands-on guidance across product development, market strategy, and scaling.",
              imageSrc: "https://img.b2bpic.net/free-photo/mid-adult-ceo-giving-presentation-his-team-office-asks-one-his-colleagues-opinion_637285-985.jpg"
            },
            {
              id: 3,
              title: "Network & Partnership Access",
              description: "Connect with our extensive network of investors, customers, partners, and key opinion leaders to accelerate your growth trajectory.",
              imageSrc: "https://img.b2bpic.net/free-photo/business-team-collaborating-corporate-culture-initiatives-development_482257-90929.jpg"
            }
          ]}
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="service-metrics" data-section="service-metrics">
        <MetricCardOne 
          title="Why Choose Our Services"
          description="The numbers that demonstrate our commitment to startup success"
          tag="Service Excellence"
          metrics={[
            {
              id: "1",
              value: "90%",
              title: "Success Rate",
              description: "Of startups we mentor reach next funding round",
              icon: TrendingUp
            },
            {
              id: "2",
              value: "500+",
              title: "Network Partners",
              description: "Industry connections across all major sectors",
              icon: Users
            },
            {
              id: "3",
              value: "6M",
              title: "Average Funding",
              description: "Median investment size in our portfolio",
              icon: Target
            }
          ]}
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterCard 
          logoText="Show Your Idea"
          copyrightText="© 2025 Show Your Idea | Transforming Ideas Into Impact"
          socialLinks={[
            { icon: Linkedin, href: "https://linkedin.com/company/show-your-idea", ariaLabel: "LinkedIn" },
            { icon: Twitter, href: "https://twitter.com/showyouridea", ariaLabel: "Twitter" },
            { icon: Mail, href: "mailto:info@showyouridea.com", ariaLabel: "Email" }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}