"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleMinimal from '@/components/navbar/NavbarStyleMinimal';
import MediaAbout from '@/components/sections/about/MediaAbout';
import FeatureCardNine from '@/components/sections/feature/FeatureCardNine';
import FooterCard from '@/components/sections/footer/FooterCard';
import { Briefcase, Zap, Linkedin, Twitter, Mail } from 'lucide-react';

export default function AboutPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-magnetic"
      defaultTextAnimation="background-highlight"
      borderRadius="sharp"
      contentWidth="smallMedium"
      sizing="mediumLargeSizeLargeTitles"
      background="aurora"
      cardStyle="glass-depth"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="glass"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleMinimal
          brandName="MyToYou"
          button={{
            text: "Get Started",
            href: "/contact"
          }}
        />
      </div>

      <div id="about" data-section="about">
        <MediaAbout
          title="About MyToYou Investment Agency"
          description="With over 15 years of experience in wealth management, MyToYou specializes in creating customized investment strategies that align with your financial objectives. Our team of certified financial advisors is committed to transparency, ethical practices, and long-term client success."
          tag="Our Story"
          tagIcon={Briefcase}
          buttons={[
            {
              text: "Explore Our Approach",
              href: "/services"
            }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/business-meeting-office_1268-21517.jpg"
          imageAlt="MyToYou investment advisory team in professional meeting"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardNine
          title="Why Choose MyToYou"
          description="Our investment features are designed to help you achieve financial independence through strategic wealth management."
          tag="Investment Solutions"
          tagIcon={Zap}
          features={[
            {
              id: 1,
              title: "Portfolio Diversification",
              description: "Spread your investments across multiple asset classes to minimize risk and maximize growth potential. Our smart allocation algorithms adjust your portfolio based on market conditions.",
              phoneOne: {
                imageSrc: "https://img.b2bpic.net/free-photo/business-concept-with-copy-space-office-desk-table-with-pen-focus-analysis-chart-computer-notebook-cup-coffee-desk-vintage-tone-retro-filter-selective-focus_1418-679.jpg"
              },
              phoneTwo: {
                imageSrc: "https://img.b2bpic.net/free-photo/business-concept-with-copy-space-office-desk-table-with-pen-focus-analysis-chart-computer-notebook-cup-coffee-desk-vintage-tone-retro-filter-selective-focus_1418-679.jpg"
              }
            },
            {
              id: 2,
              title: "Risk Management",
              description: "Advanced risk assessment tools identify potential market volatility early. We implement protective strategies to preserve capital during downturns.",
              phoneOne: {
                imageSrc: "https://img.b2bpic.net/free-photo/top-view-office-desk-with-growth-chart-calculator_23-2148780608.jpg"
              },
              phoneTwo: {
                imageSrc: "https://img.b2bpic.net/free-photo/top-view-office-desk-with-growth-chart-calculator_23-2148780608.jpg"
              }
            },
            {
              id: 3,
              title: "Consistent Returns",
              description: "Our proven track record demonstrates consistent annual returns averaging 12-15%. Performance reports updated quarterly for full transparency.",
              phoneOne: {
                imageSrc: "https://img.b2bpic.net/free-photo/top-view-office-desk-with-growth-chart-coffee-with-glasses_23-2148780611.jpg"
              },
              phoneTwo: {
                imageSrc: "https://img.b2bpic.net/free-photo/top-view-office-desk-with-growth-chart-coffee-with-glasses_23-2148780611.jpg"
              }
            }
          ]}
          showStepNumbers={true}
          textboxLayout="default"
          useInvertedBackground="invertDefault"
        />
      </div>

      <FooterCard
        logoText="MyToYou"
        copyrightText="© 2025 MyToYou Investment Agency. All rights reserved."
        socialLinks={[
          {
            icon: Linkedin,
            href: "https://linkedin.com/company/mytoYou",
            ariaLabel: "LinkedIn"
          },
          {
            icon: Twitter,
            href: "https://twitter.com/mytoYouInvest",
            ariaLabel: "Twitter"
          },
          {
            icon: Mail,
            href: "mailto:info@mytoYou.com",
            ariaLabel: "Email"
          }
        ]}
      />
    </ThemeProvider>
  );
}