"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import FooterBaseCard from '@/components/sections/footer/FooterBaseCard';

export default function FeaturesPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="reveal-blur"
      borderRadius="soft"
      contentWidth="compact"
      sizing="mediumLargeSizeMediumTitles"
      background="floatingGradient"
      cardStyle="inset"
      primaryButtonStyle="shadow"
      secondaryButtonStyle="glass"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered 
          brandName="InProduce"
          navItems={[
            { name: "Home", id: "/" },
            { name: "About", id: "/about" },
            { name: "Features", id: "/features" },
            { name: "Pricing", id: "/pricing" },
            { name: "Contact", id: "/contact" }
          ]}
          button={{ text: "Get Started", href: "/contact" }}
        />
      </div>

      <div id="platform-features" data-section="platform-features">
        <FeatureCardTwentyOne
          title="Advanced Investment Platform"
          description="Our comprehensive platform combines cutting-edge technology with deep market expertise to deliver superior investment outcomes in London's produce markets."
          tag="Technology & Innovation"
          imageSrc="https://img.b2bpic.net/free-photo/zero-waste-bag-food_23-2149015849.jpg"
          imageAlt="Fresh produce marketplace technology"
          mediaPosition="right"
          useInvertedBackground="noInvert"
          accordionItems={[
            {
              id: "1",
              title: "AI-Powered Market Analysis",
              content: "Advanced algorithms analyze supply chain data, weather patterns, and market trends to identify optimal investment opportunities with 95% accuracy in trend prediction."
            },
            {
              id: "2",
              title: "Risk Management Systems",
              content: "Sophisticated portfolio optimization tools automatically balance risk across different produce categories, seasonal cycles, and supplier networks to maximize returns while minimizing volatility."
            },
            {
              id: "3",
              title: "Real-Time Performance Tracking",
              content: "Monitor your investments 24/7 with live dashboard showing asset performance, market movements, and projected returns with granular detail down to individual produce categories."
            }
          ]}
          buttons={[
            { text: "Start Investing", href: "/pricing" }
          ]}
        />
      </div>

      <div id="platform-performance" data-section="platform-performance">
        <MetricCardEleven
          title="Platform Performance Metrics"
          description="Our technology-driven approach consistently delivers superior results compared to traditional agricultural investment methods."
          tag="Performance Data"
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          animationType="slide-up"
          metrics={[
            {
              id: "1",
              value: "99.9%",
              title: "Platform Uptime",
              description: "Reliable access to your investments and market data",
              imageSrc: "https://img.b2bpic.net/free-photo/busineswoman-holding-digital-tablet-with-data_1098-1906.jpg"
            },
            {
              id: "2",
              value: "2.8x",
              title: "Market Outperformance",
              description: "Average returns vs traditional agricultural investments",
              imageSrc: "https://img.b2bpic.net/free-photo/busineswoman-holding-digital-tablet-with-data_1098-1906.jpg"
            }
          ]}
        />
      </div>

      <div id="investment-approach" data-section="investment-approach">
        <FeatureCardTwentyOne
          title="Professional Investment Management"
          description="Our experienced team combines decades of agricultural expertise with modern financial engineering to optimize every aspect of your produce investment portfolio."
          tag="Expert Management"
          imageSrc="https://img.b2bpic.net/free-photo/close-up-employees-looking-business-document_1098-1850.jpg"
          imageAlt="Professional investment team collaboration"
          mediaPosition="left"
          useInvertedBackground="noInvert"
          accordionItems={[
            {
              id: "1",
              title: "Due Diligence Process",
              content: "Rigorous 47-point evaluation system covering supplier credentials, supply chain stability, quality standards, and market positioning before any investment recommendation."
            },
            {
              id: "2",
              title: "Active Portfolio Management",
              content: "Continuous monitoring and rebalancing of your portfolio based on seasonal cycles, market conditions, and emerging opportunities to optimize returns throughout the year."
            },
            {
              id: "3",
              title: "Regulatory Compliance",
              content: "Full FCA compliance with comprehensive audit trails, regulatory reporting, and investor protection measures ensuring your investments meet all legal requirements."
            }
          ]}
          buttons={[
            { text: "Learn About Our Process", href: "/about" }
          ]}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseCard
          logoText="InProduce"
          copyrightText="© 2025 InProduce Investment Platform. All rights reserved."
          columns={[
            {
              title: "Platform",
              items: [
                { label: "Dashboard", href: "/dashboard" },
                { label: "Opportunities", href: "/opportunities" },
                { label: "Pricing", href: "/pricing" },
                { label: "Performance", href: "/performance" }
              ]
            },
            {
              title: "Company",
              items: [
                { label: "About Us", href: "/about" },
                { label: "Team", href: "/team" },
                { label: "Blog", href: "/blog" },
                { label: "Careers", href: "/careers" }
              ]
            },
            {
              title: "Investors",
              items: [
                { label: "Get Started", href: "/start" },
                { label: "Resources", href: "/resources" },
                { label: "FAQ", href: "/faq" },
                { label: "Contact", href: "/contact" }
              ]
            },
            {
              title: "Legal",
              items: [
                { label: "Privacy Policy", href: "/privacy" },
                { label: "Terms & Conditions", href: "/terms" },
                { label: "Cookie Policy", href: "/cookies" },
                { label: "Regulatory Info", href: "/regulatory" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}