"use client";
import NavbarStyleMinimal from '@/components/navbar/NavbarStyleMinimal';
import FeatureCardTwentyThree from '@/components/sections/feature/FeatureCardTwentyThree';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";

export default function ServicesPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="directional-hover"
      defaultTextAnimation="background-highlight"
      borderRadius="pill"
      contentWidth="small"
      sizing="largeSizeMediumTitles"
      background="aurora"
      cardStyle="gradient-radial"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleMinimal
          brandName="QWER"
          button={{
            text: "Get Started",
            href: "https://qwer.invest/contact"
          }}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTwentyThree
          title="Comprehensive Investment Services"
          description="Our full suite of investment solutions designed to meet your financial objectives at every stage of wealth building."
          features={[
            {
              id: "1",
              title: "Portfolio Management & Asset Allocation",
              tags: ["Core Service", "Personalized"],
              imageSrc: "https://img.b2bpic.net/free-photo/stock-market-economy-investment-financial-concept_53876-123930.jpg",
              imageAlt: "Portfolio management visualization"
            },
            {
              id: "2",
              title: "Wealth Advisory & Financial Planning",
              tags: ["Strategic", "Comprehensive"],
              imageSrc: "https://img.b2bpic.net/free-photo/capital-tablet-exchange-screen-skyscraper_1150-1201.jpg",
              imageAlt: "Wealth advisory consultation"
            },
            {
              id: "3",
              title: "Risk Analysis & Strategy Optimization",
              tags: ["Data-Driven", "Advanced"],
              imageSrc: "https://img.b2bpic.net/free-photo/close-up-human-hand-business-meeting_329181-13371.jpg",
              imageAlt: "Risk analysis and strategy"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardSeven
          title="QWER by the Numbers"
          description="Proven track record of delivering consistent value to our clients."
          metrics={[
            {
              id: "1",
              value: "$8.3B+",
              title: "Assets Under Management",
              items: ["Growth across 15+ years", "Diversified portfolios", "Global markets"]
            },
            {
              id: "2",
              value: "2,400+",
              title: "Active Client Partnerships",
              items: ["98% retention rate", "Multi-generational families", "Institutional accounts"]
            },
            {
              id: "3",
              value: "12.8%",
              title: "Average Annual Return",
              items: ["Risk-adjusted performance", "Outperformance consistency", "Beat market benchmarks"]
            },
            {
              id: "4",
              value: "50+",
              title: "Expert Team Members",
              items: ["CFA charter holders", "Decades of experience", "Dedicated specialists"]
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
        />
      </div>

      <div id="products" data-section="products">
        <ProductCardOne
          title="Investment Products"
          description="Explore our curated selection of premium investment vehicles designed for optimal returns."
          products={[
            {
              id: "1",
              name: "QWER Premium Growth Fund",
              price: "$50,000 minimum",
              imageSrc: "https://img.b2bpic.net/free-photo/analyzing-data-close-up-young-businessman-who-holds-glasses-looks-gff-while-working-creative-office_146671-15029.jpg",
              imageAlt: "Premium Growth Fund"
            },
            {
              id: "2",
              name: "Strategic Growth Strategy",
              price: "$100,000 minimum",
              imageSrc: "https://img.b2bpic.net/free-photo/graph-growth-development-improvement-profit-success-concept_53876-133598.jpg",
              imageAlt: "Strategic Growth Strategy"
            },
            {
              id: "3",
              name: "Conservative Bond Portfolio",
              price: "$25,000 minimum",
              imageSrc: "https://img.b2bpic.net/free-photo/invest-investment-financial-income-profit-costs-concept_53876-134068.jpg",
              imageAlt: "Conservative Bond Portfolio"
            }
          ]}
          animationType="slide-up"
          gridVariant="three-columns-all-equal-width"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <FooterBaseReveal
        columns={[
          {
            title: "Services",
            items: [
              { label: "Portfolio Management", href: "/services" },
              { label: "Wealth Advisory", href: "/services" },
              { label: "Investment Products", href: "/products" },
              { label: "Risk Analysis", href: "/services" }
            ]
          },
          {
            title: "Company",
            items: [
              { label: "About QWER", href: "/about" },
              { label: "Our Team", href: "/team" },
              { label: "Careers", href: "/careers" },
              { label: "Contact", href: "/contact" }
            ]
          },
          {
            title: "Legal",
            items: [
              { label: "Privacy Policy", href: "#privacy" },
              { label: "Terms of Service", href: "#terms" },
              { label: "Compliance", href: "/compliance" },
              { label: "Disclosures", href: "/disclosures" }
            ]
          }
        ]}
        copyrightText="© 2024 QWER Investment Partners. All rights reserved."
      />
    </ThemeProvider>
  );
}