"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroSplitKpi from '@/components/sections/hero/HeroSplitKpi';
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
import ProductCardOne from '@/components/sections/product/ProductCardOne';
import PricingCardOne from '@/components/sections/pricing/PricingCardOne';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import TeamCardOne from '@/components/sections/team/TeamCardOne';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import SocialProofOne from '@/components/sections/socialProof/SocialProofOne';
import ContactSplit from '@/components/sections/contact/ContactSplit';
import FooterBase from '@/components/sections/footer/FooterBase';
import { Activity, Apple, Brain, Dumbbell, Heart, Target, Zap, Users, Star, TrendingDown, TrendingUp, Mail } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="elastic-effect"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="smallMedium"
      sizing="mediumSizeLargeTitles"
      background="blurBottom"
      cardStyle="gradient-bordered"
      primaryButtonStyle="flat"
      secondaryButtonStyle="glass"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          navItems={[
            { name: "Dashboard", id: "dashboard" },
            { name: "Treino", id: "training" },
            { name: "Nutrição", id: "nutrition" },
            { name: "Comunidade", id: "community" },
            { name: "Perfil", id: "profile" }
          ]}
          button={{ text: "Começar Agora", href: "contact" }}
          brandName="FitFlow Pro"
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplitKpi
          title="Seu Corpo, Seu Histórico, Sua Vitória"
          description="Aplicativo premium de fitness com rastreamento biométrico inteligente, treinos personalizados por IA e cardio com GPS. Transforme seu corpo enquanto acompanha cada segundo da jornada."
          tag="Fitness Ultra-Premium"
          tagIcon={Zap}
          background={{ variant: "glowing-orb" }}
          kpis={[
            { value: "150K+", label: "Usuários Ativos" },
            { value: "2M+", label: "Treinos Concluídos" },
            { value: "4.9★", label: "Avaliação" }
          ]}
          enableKpiAnimation={true}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/ultra-modern-fitness-app-dashboard-with--1773256981295-f56c580b.png?_wi=1"
          imageAlt="Dashboard de fitness premium"
          imagePosition="right"
          mediaAnimation="slide-up"
          buttons={[
            { text: "Começar Teste Grátis", href: "contact" },
            { text: "Ver Demo", href: "#features" }
          ]}
          avatars={[
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/professional-athlete-portrait-male-fitne-1773256979726-5009f852.png", alt: "Usuário" },
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/fit-female-athlete-portrait-determined-e-1773256980310-c05dce2f.png", alt: "Usuário" },
            { src: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/athletic-male-trainer-portrait-confident-1773256979906-c5e05a88.png", alt: "Usuário" }
          ]}
          avatarText="Join 150K+ athletes"
        />
      </div>

      <div id="onboarding" data-section="onboarding">
        <FeatureCardTwentyFive
          title="Onboarding Biométrico Dinâmico"
          description="Sistema inteligente que adapta-se ao seu corpo. Defina seu objetivo, e o app calcula automaticamente sua timeline de sucesso com precisão científica."
          tag="Inteligência Adaptativa"
          tagIcon={Brain}
          features={[
            {
              title: "Perfil Biométrico",              description: "Coloque seus dados (gênero, altura, peso, idade) e veja o app adaptar todas as demonstrações, avatares e ilustrações anatomicamente.",              icon: Target,
              mediaItems: [
                {
                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/premium-onboarding-screen-for-fitness-ap-1773256981180-774b293c.png",                  imageAlt: "Tela de biometria"
                },
                {
                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/ultra-modern-fitness-app-dashboard-with--1773256981295-f56c580b.png?_wi=2",                  imageAlt: "Dashboard adaptado"
                }
              ]
            },
            {
              title: "Metas Inteligentes",              description: "Escolha: Perder Peso ou Ganhar Massa. O sistema calcula TMB, projeta planilha de metas e mostra exatamente quando você atingirá seu objetivo.",              icon: Zap,
              mediaItems: [
                {
                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/nutrition-dashboard-showing-meal-plans-d-1773256981349-9348b6d9.png",                  imageAlt: "Plano de nutrição"
                },
                {
                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/performance-metrics-showcase-displaying--1773256982260-f9a5cff0.png?_wi=1",                  imageAlt: "Métricas de progresso"
                }
              ]
            }
          ]}
          animationType="blur-reveal"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="cardio" data-section="cardio">
        <FeatureCardTwentyFive
          title="Hub de Cardio com GPS em Tempo Real"
          description="Rastreie suas corridas e caminhadas com precisão de GPS. Monitore pace, distância, calorias queimadas e vença suas metas diárias com anéis de progresso animados."
          tag="Cardio Premium"
          tagIcon={Heart}
          features={[
            {
              title: "Running Tracker Avançado",              description: "GPS ativado em tempo real. Mapeia sua rota, calcula queima de calorias baseado no peso, mostra ritmo ao vivo em painel estilo smartwatch.",              icon: Zap,
              mediaItems: [
                {
                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/gps-running-tracker-interface-with-real--1773256980694-2abe167e.png",                  imageAlt: "Rastreamento GPS"
                },
                {
                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/performance-metrics-showcase-displaying--1773256982260-f9a5cff0.png?_wi=2",                  imageAlt: "Métricas de cardio"
                }
              ]
            },
            {
              title: "Pedômetro & Caminhada",              description: "Contador de passos embutido com rastreamento de distância e calorias. Vença suas metas de 10.000 passos com visual de anéis de progresso motivacional.",              icon: Activity,
              mediaItems: [
                {
                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/ultra-modern-fitness-app-dashboard-with--1773256981295-f56c580b.png?_wi=3",                  imageAlt: "Dashboard de passos"
                },
                {
                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/performance-metrics-showcase-displaying--1773256982260-f9a5cff0.png?_wi=3",                  imageAlt: "Progresso de atividade"
                }
              ]
            }
          ]}
          animationType="depth-3d"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="training" data-section="training">
        <FeatureCardTwentyFive
          title="Core de Treinamento com IA"
          description="Algoritmo adaptativo que recomenda treinos baseado em biometria. Escolha entre Casa (calistenia) ou Ginásio (máquinas/pesos) e isole por grupo muscular com modelo anatômico 3D interativo."
          tag="Recomendação de IA"
          tagIcon={Brain}
          features={[
            {
              title: "Dualidade de Ambientes",              description: "Treinos em Casa (peso corporal, calistenia) ou Ginásio (máquinas, pesos livres). Sistema diferencia automaticamente baseado em sua escolha e disponibilidade de equipamento.",              icon: Dumbbell,
              mediaItems: [
                {
                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/interactive-anatomical-body-model-showin-1773256980448-3cccd7b3.png?_wi=1",                  imageAlt: "Seleção de exercícios"
                },
                {
                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/workout-execution-interface-showing-set--1773256980664-da11c464.png?_wi=1",                  imageAlt: "Execução de treino"
                }
              ]
            },
            {
              title: "Isolamento por Grupo Muscular",              description: "Modelo anatômico 3D/2D interativo. Clique em um músculo (peitoral, glúteo, etc.) e veja lista filtrada de exercícios com foco nesse músculo específico.",              icon: Zap,
              mediaItems: [
                {
                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/interactive-anatomical-body-model-showin-1773256980448-3cccd7b3.png?_wi=2",                  imageAlt: "Anatomia interativa"
                },
                {
                  imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/workout-execution-interface-showing-set--1773256980664-da11c464.png?_wi=2",                  imageAlt: "Exercícios filtrados"
                }
              ]
            }
          ]}
          animationType="scale-rotate"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="workout-mode" data-section="workout-mode">
        <ProductCardOne
          title="Modo 'Em Execução' - Tracking de Série"
          description="Interface imersiva que transforma o treino em experiência interativa com cronômetro de descanso, registro de progresso e gráficos de progressão."
          tag="Focus Mode"
          tagIcon={Target}
          products={[
            {
              id: "1",              name: "Iniciar Série",              price: "Botão Proeminente",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/workout-execution-interface-showing-set--1773256980664-da11c464.png?_wi=3",              imageAlt: "Tela de série"
            },
            {
              id: "2",              name: "Cronômetro de Descanso",              price: "Automático",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/workout-execution-interface-showing-set--1773256980664-da11c464.png?_wi=4",              imageAlt: "Descanso entre séries"
            },
            {
              id: "3",              name: "Registrar Progresso",              price: "Carga + Reps",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/performance-metrics-showcase-displaying--1773256982260-f9a5cff0.png?_wi=4",              imageAlt: "Progresso salvo"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          gridVariant="three-columns-all-equal-width"
        />
      </div>

      <div id="nutrition" data-section="nutrition">
        <PricingCardOne
          title="Nutrição Inteligente & Receituário"
          description="Planos alimentares 100% sincronizados com suas metas de peso. Se quer perder peso, déficit calórico. Se quer ganhar massa, superávit inteligente."
          tag="Sincronizado com Timeline"
          tagIcon={Apple}
          plans={[
            {
              id: "deficit",              badge: "Perda de Peso",              badgeIcon: TrendingDown,
              price: "Déficit Calórico",              subtitle: "Receitas otimizadas para queima de calorias",              features: [
                "Macros calculados automaticamente",                "Prep time entre 15-30 min",                "Proteína alta, carboidrato estratégico",                "Rastreamento integrado",                "Sugestões diárias personalizadas"
              ]
            },
            {
              id: "surplus",              badge: "Ganho de Massa",              badgeIcon: TrendingUp,
              price: "Superávit Estratégico",              subtitle: "Nutrição para crescimento muscular",              features: [
                "Calorias calculadas para ganho",                "Proteína máxima (2g por kg)",                "Carbos pré e pós-treino",                "Tempo de preparo eficiente",                "Sincronizado com treino de força"
              ]
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="metrics" data-section="metrics">
        <MetricCardFourteen
          title="Suas Conquistas Importam. Veja Cada Número."
          tag="Performance Metrics"
          tagAnimation="slide-up"
          metrics={[
            {
              id: "1",              value: "10.000+",              description: "Passos diários rastreados em tempo real com motivação visual de progresso."
            },
            {
              id: "2",              value: "500 kg",              description: "Volume total de peso levantado monitorado com progressão semanal automática."
            },
            {
              id: "3",              value: "150+ km",              description: "Distância corrida mapeada com GPS, ritmo calculado e calorias precisas."
            },
            {
              id: "4",              value: "42 dias",              description: "Sequência de treinos consistentes com badges de dedicação desbloqueados."
            }
          ]}
          metricsAnimation="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <div id="team" data-section="team">
        <TeamCardOne
          title="Comunidade de Atletas Profissionais"
          description="Feed social onde você compartilha rotas de corrida, estatísticas de treino e compete em rankings semanais com outros usuários."
          tag="Gamificação Social"
          tagIcon={Users}
          members={[
            {
              id: "1",              name: "Marcus A.",              role: "Elite Runner",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/professional-athlete-portrait-male-fitne-1773256979726-5009f852.png?_wi=1",              imageAlt: "Marcus A."
            },
            {
              id: "2",              name: "Ana L.",              role: "Strength Coach",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/fit-female-athlete-portrait-determined-e-1773256980310-c05dce2f.png?_wi=1",              imageAlt: "Ana L."
            },
            {
              id: "3",              name: "Rafael S.",              role: "Nutrition Expert",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/athletic-male-trainer-portrait-confident-1773256979906-c5e05a88.png?_wi=1",              imageAlt: "Rafael S."
            },
            {
              id: "4",              name: "Sofia M.",              role: "Fitness Trainer",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/female-fitness-coach-portrait-profession-1773256979710-97e8b5fe.png?_wi=1",              imageAlt: "Sofia M."
            }
          ]}
          animationType="blur-reveal"
          textboxLayout="default"
          useInvertedBackground={false}
          gridVariant="four-items-2x2-equal-grid"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTwelve
          testimonials={[
            {
              id: "1",              name: "Carlos M.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/professional-athlete-portrait-male-fitne-1773256979726-5009f852.png?_wi=2",              imageAlt: "Carlos M."
            },
            {
              id: "2",              name: "Beatriz R.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/fit-female-athlete-portrait-determined-e-1773256980310-c05dce2f.png?_wi=2",              imageAlt: "Beatriz R."
            },
            {
              id: "3",              name: "Diego P.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/athletic-male-trainer-portrait-confident-1773256979906-c5e05a88.png?_wi=2",              imageAlt: "Diego P."
            },
            {
              id: "4",              name: "Juliana T.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/female-fitness-coach-portrait-profession-1773256979710-97e8b5fe.png?_wi=2",              imageAlt: "Juliana T."
            },
            {
              id: "5",              name: "Lucas F.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/young-athlete-male-portrait-energetic-ex-1773256982698-63e4e494.png",              imageAlt: "Lucas F."
            },
            {
              id: "6",              name: "Marina S.",              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/female-athlete-portrait-fit-build-profes-1773256980134-0faaa8fa.png",              imageAlt: "Marina S."
            }
          ]}
          cardTitle="Mais de 150 mil atletas já transformaram seu corpo com FitFlow Pro"
          cardTag="Veja o que eles dizem"
          cardTagIcon={Star}
          cardAnimation="blur-reveal"
          useInvertedBackground={false}
        />
      </div>

      <div id="social-proof" data-section="social-proof">
        <SocialProofOne
          title="Confiado pelos Maiores Aplicativos e Plataformas de Fitness"
          description="FitFlow Pro integra-se perfeitamente com os ecossistemas de saúde mais populares do mundo."
          tag="Parcerias Premium"
          tagIcon={Zap}
          logos={[
            "http://img.b2bpic.net/free-vector/heart-love-logo_126523-2763.jpg",            "http://img.b2bpic.net/free-photo/woman-with-phone-sportswear_1303-8805.jpg",            "http://img.b2bpic.net/free-vector/flat-design-fitness-trackers-heart-rate-menu_23-2148515781.jpg",            "http://img.b2bpic.net/free-photo/close-up-woman-holding-phone_23-2148889655.jpg",            "http://img.b2bpic.net/free-photo/close-up-man-using-phone-while-electric-bike_23-2149098678.jpg",            "http://img.b2bpic.net/free-vector/fitness-trackers-concept_23-2148527033.jpg",            "http://img.b2bpic.net/free-photo/cropped-view-sexy-bodybuilder-showing-thumbs-up_1153-6281.jpg",            "http://img.b2bpic.net/free-photo/phone-muscular-hand-guy-sitting-city-morning-he-holds-bottle-water-headphones_197531-1155.jpg"
          ]}
          names={[
            "Apple Fitness",            "Strava",            "Fitbit",            "Google Fit",            "Peloton",            "MyFitnessPal",            "Garmin",            "Nike Training"
          ]}
          textboxLayout="default"
          useInvertedBackground={false}
          speed={40}
          showCard={true}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplit
          tag="Transforme Sua Vida"
          tagIcon={Mail}
          title="Pronto para Começar?"
          description="Inscreva-se para receber atualizações exclusivas, dicas de treino e um acesso especial ao nosso programa de beta testers premium. Seu email está seguro conosco."
          background={{ variant: "sparkles-gradient" }}
          useInvertedBackground={false}
          imageSrc="https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AoRNSPr0mCBj85JKsHl7qxTHsl/ultra-modern-fitness-app-dashboard-with--1773256981295-f56c580b.png?_wi=1"
          imageAlt="Transforme seu corpo"
          mediaAnimation="slide-up"
          mediaPosition="right"
          inputPlaceholder="seu.email@exemplo.com"
          buttonText="Inscrever-se Agora"
          termsText="Respeitamos sua privacidade. Você pode desinscrever-se a qualquer momento. Sem spam, promessa."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterBase
          columns={[
            {
              title: "Produto",              items: [
                { label: "Dashboard", href: "dashboard" },
                { label: "Treino", href: "training" },
                { label: "Nutrição", href: "nutrition" },
                { label: "Cardio Hub", href: "cardio" }
              ]
            },
            {
              title: "Comunidade",              items: [
                { label: "Comunidade", href: "community" },
                { label: "Perfil", href: "profile" },
                { label: "Rankings", href: "rankings" },
                { label: "Blog", href: "blog" }
              ]
            },
            {
              title: "Empresa",              items: [
                { label: "Sobre", href: "about" },
                { label: "Contato", href: "contact" },
                { label: "Privacidade", href: "privacy" },
                { label: "Termos", href: "terms" }
              ]
            }
          ]}
          logoText="FitFlow Pro"
          copyrightText="© 2025 FitFlow Pro. Todos os direitos reservados."
        />
      </div>
    </ThemeProvider>
  );
}
