"use client";

import Link from "next/link";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from "@/components/navbar/NavbarStyleApple/NavbarStyleApple";
import FeatureHoverPattern from "@/components/sections/feature/featureHoverPattern/FeatureHoverPattern";
import PricingCardEight from "@/components/sections/pricing/PricingCardEight";
import FooterMedia from "@/components/sections/footer/FooterMedia";
import { CheckCircle, Sparkles, Phone, Activity, Smile, TrendingUp, Clock, Award } from "lucide-react";

export default function ServicesPage() {
  const navItems = [
    { name: "Home", id: "home" },
    { name: "Sobre", id: "about" },
    { name: "Serviços", id: "services" },
    { name: "Pacotes", id: "pricing" },
    { name: "Contato", id: "contact" },
  ];

  const footerColumns = [
    {
      title: "Instituto",
      items: [
        { label: "Sobre o ITI", href: "/" },
        { label: "Serviços", href: "/servicos" },
        { label: "Pacotes", href: "/servicos" },
        { label: "Contato", href: "/contato" },
      ],
    },
    {
      title: "Informações",
      items: [
        { label: "Horário de Atendimento: Seg-Sex 8h-18h", href: "#" },
        { label: "WhatsApp: (11) 9XXXX-XXXX", href: "https://wa.me/551199999999" },
        { label: "Telefone: (11) 3XXX-XXXX", href: "tel:+551133333333" },
        { label: "Email: contato@iti.com.br", href: "mailto:contato@iti.com.br" },
      ],
    },
    {
      title: "Legal",
      items: [
        { label: "Política de Privacidade", href: "#" },
        { label: "Termos de Serviço", href: "#" },
        { label: "Cookies", href: "#" },
        { label: "Conformidade LGPD", href: "#" },
      ],
    },
    {
      title: "Redes Sociais",
      items: [
        { label: "Instagram", href: "https://instagram.com" },
        { label: "Facebook", href: "https://facebook.com" },
        { label: "LinkedIn", href: "https://linkedin.com" },
        { label: "YouTube", href: "https://youtube.com" },
      ],
    },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="text-stagger"
      defaultTextAnimation="background-highlight"
      borderRadius="rounded"
      contentWidth="medium"
      sizing="largeSmallSizeLargeTitles"
      background="none"
      cardStyle="gradient-radial"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="glass"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="ITI - Instituto de Terapia Infusional"
          navItems={navItems.map((item) => ({
            name: item.name,
            id: item.id,
          }))}
        />
      </div>

      <div id="services" data-section="services">
        <div className="mx-auto px-4 md:px-6">
          <FeatureHoverPattern
            title="Vantagens dos Dispositivos Infusionais"
            description="Tecnologia inovadora que oferece segurança, eficácia e conforto ao paciente em cada tratamento."
            tag="Benefícios Clínicos"
            tagIcon={CheckCircle}
            tagAnimation="slide-up"
            buttons={[
              {
                text: "Agendar Avaliação",
                href: "/contato",
              },
            ]}
            buttonAnimation="slide-up"
            features={[
              {
                icon: Activity,
                title: "Segurança Máxima",
                description:
                  "Sistemas de infusão com controle automático de fluxo, reduzindo riscos de complicações e garantindo precisão na administração de medicamentos.",
                button: {
                  text: "Saiba Mais",
                },
              },
              {
                icon: Smile,
                title: "Conforto do Paciente",
                description:
                  "Acesso vascular seguro e discreto com mínimo incômodo, permitindo maior liberdade de movimento durante o tratamento.",
                button: {
                  text: "Saiba Mais",
                },
              },
              {
                icon: TrendingUp,
                title: "Menor Risco de Complicações",
                description:
                  "Redução significativa de flebite, extravasamento e infecções associadas ao acesso vascular.",
                button: {
                  text: "Saiba Mais",
                },
              },
              {
                icon: Clock,
                title: "Eficiência Clínica",
                description:
                  "Infusões precisas e controladas, reduzindo tempo de tratamento e possibilitando melhor monitoramento do paciente.",
                button: {
                  text: "Saiba Mais",
                },
              },
              {
                icon: Award,
                title: "Qualidade Certificada",
                description:
                  "Equipamentos e materiais certificados internacionalmente, seguindo os mais rigorosos padrões de qualidade e segurança.",
                button: {
                  text: "Saiba Mais",
                },
              },
            ]}
            animationType="blur-reveal"
            textboxLayout="default"
            useInvertedBackground={false}
            ariaLabel="Features section - Infusional devices benefits"
          />
        </div>
      </div>

      <div id="pricing" data-section="pricing">
        <div className="mx-auto px-4 md:px-6">
          <PricingCardEight
            title="Pacotes e Planos de Terapia"
            description="Escolha o plano ideal para suas necessidades de saúde. Todos incluem atendimento humanizado, monitoramento clínico e suporte especializado."
            tag="Investimento em Saúde"
            tagIcon={Phone}
            tagAnimation="slide-up"
            buttons={[
              {
                text: "Consultar Disponibilidade",
                href: "/contato",
              },
            ]}
            buttonAnimation="slide-up"
            plans={[
              {
                id: "consulta",
                badge: "Inicial",
                badgeIcon: Sparkles,
                price: "Sob Consulta",
                subtitle: "Avaliação clínica completa",
                features: [
                  "Consulta com especialista",
                  "Avaliação de elegibilidade para terapia",
                  "Plano de tratamento personalizado",
                  "Orientações iniciais",
                ],
                buttons: [
                  {
                    text: "Agendar Consulta",
                    href: "/contato",
                  },
                ],
              },
              {
                id: "basico",
                badge: "Essencial",
                badgeIcon: Sparkles,
                price: "A partir de R$ 800",
                subtitle: "Terapia infusional padrão",
                features: [
                  "Sessão de infusão completa",
                  "Monitoramento durante o procedimento",
                  "Material médico de qualidade",
                  "Acompanhamento pós-tratamento",
                  "Acesso a suporte telefônico",
                ],
                buttons: [
                  {
                    text: "Contratar",
                    href: "/contato",
                  },
                ],
              },
              {
                id: "premium",
                badge: "Premium",
                badgeIcon: Sparkles,
                price: "A partir de R$ 1.500",
                subtitle: "Terapia avançada com suporte total",
                features: [
                  "Sessões de infusão customizadas",
                  "Monitoramento contínuo",
                  "Equipe dedicada",
                  "Programa de bem-estar",
                  "Suporte prioritário 24/7",
                  "Avaliações periódicas incluídas",
                ],
                buttons: [
                  {
                    text: "Contratar",
                    href: "/contato",
                  },
                ],
              },
              {
                id: "corporativo",
                badge: "Corporativo",
                badgeIcon: Sparkles,
                price: "Sob Orçamento",
                subtitle: "Programa para empresas",
                features: [
                  "Múltiplos colaboradores",
                  "Atendimento na empresa ou centro",
                  "Planos customizados",
                  "Relatórios de saúde",
                  "Gestor de contas dedicado",
                ],
                buttons: [
                  {
                    text: "Solicitar Orçamento",
                    href: "/contato",
                  },
                ],
              },
            ]}
            animationType="slide-up"
            textboxLayout="default"
            useInvertedBackground={false}
            ariaLabel="Pricing section - Service packages"
          />
        </div>
      </div>

      <div id="footer" data-section="footer">
        <FooterMedia
          imageSrc="http://img.b2bpic.net/free-vector/blue-medical-background-with-text-space_1017-19374.jpg"
          imageAlt="Background footer ITI"
          columns={footerColumns}
          logoText="ITI - Instituto de Terapia Infusional"
          copyrightText="© 2025 ITI - Instituto de Terapia Infusional. Todos os direitos reservados."
          ariaLabel="Site footer"
        />
      </div>
    </ThemeProvider>
  );
}