"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroLogoBillboardSplit from '@/components/sections/hero/HeroLogoBillboardSplit';
import MetricCardOne from '@/components/sections/metrics/MetricCardOne';
import FeatureCardTwentySix from '@/components/sections/feature/FeatureCardTwentySix';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import ContactCTA from '@/components/sections/contact/ContactCTA';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import FooterLogoReveal from '@/components/sections/footer/FooterLogoReveal';
import { AlertCircle, Award, CheckCircle, Hammer, Heart, MessageSquare, Phone, Shield, Sparkles, Star, Zap } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="reveal-blur"
      borderRadius="soft"
      contentWidth="compact"
      sizing="mediumLargeSizeLargeTitles"
      background="noiseDiagonalGradient"
      cardStyle="gradient-bordered"
      primaryButtonStyle="radial-glow"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="Pro Exteriors LLC"
          navItems={[
            { name: "Home", id: "home" },
            { name: "Services", id: "services" },
            { name: "Why Us", id: "why-us" },
            { name: "Reviews", id: "reviews" },
            { name: "Contact", id: "contact" }
          ]}
          button={{
            text: "Get Free Estimate",            href: "#estimate"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroLogoBillboardSplit
          logoText="Pro Exteriors LLC"
          description="Fast & Reliable Roofing Services Near You. Free Estimates • Emergency Repairs • Trusted Local Experts"
          background={{ variant: "radial-gradient" }}
          buttons={[
            { text: "Get Free Estimate", href: "#estimate" },
            { text: "Call Now: (555) 123-4567", href: "tel:+15551234567" }
          ]}
          buttonAnimation="slide-up"
          layoutOrder="default"
          imageSrc="http://img.b2bpic.net/free-photo/full-shot-roofers-working-together-with-helmets_23-2149343707.jpg"
          imageAlt="Professional roofing team working on residential roof"
          mediaAnimation="blur-reveal"
          frameStyle="card"
        />
      </div>

      <div id="trust" data-section="trust">
        <MetricCardOne
          title="Trusted by Homeowners Across the Region"
          description="Pro Exteriors LLC is fully licensed, insured, and rated 5-stars by hundreds of satisfied customers. We've been serving homeowners for over 15 years with emergency response and quality workmanship."
          tag="Trust & Credentials"
          tagIcon={Shield}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          metrics={[
            {
              id: "licensed",              value: "Licensed",              title: "& Insured",              description: "Fully certified professionals",              icon: CheckCircle
            },
            {
              id: "five-star",              value: "5-Star",              title: "Rated",              description: "Local homeowner reviews",              icon: Star
            },
            {
              id: "years",              value: "15+",              title: "Years",              description: "Experience serving homeowners",              icon: Award
            },
            {
              id: "emergency",              value: "24/7",              title: "Emergency",              description: "Response available",              icon: Zap
            }
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          buttonAnimation="opacity"
        />
      </div>

      <div id="services" data-section="services">
        <FeatureCardTwentySix
          title="Roofing Services We Offer"
          description="From emergency repairs to complete roof replacements, Pro Exteriors handles all your roofing needs with expertise and care. Every project includes a free inspection and transparent estimate."
          tag="Complete Roofing Solutions"
          tagIcon={Hammer}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          features={[
            {
              title: "Roof Repair",              description: "Fast fixes for leaks, damaged shingles, and wear. Same-day service available for emergency repairs.",              imageSrc: "http://img.b2bpic.net/free-photo/male-mechanic-grabbing-some-tools-from-toolb_181624-36737.jpg",              imageAlt: "Professional roof repair service",              buttonIcon: Phone,
              buttonHref: "tel:+15551234567"
            },
            {
              title: "Roof Replacement",              description: "Complete roof installations with premium materials. Warranty on workmanship and materials included.",              imageSrc: "http://img.b2bpic.net/free-photo/man-with-helmet-sitting-roof-full-shot_23-2149343712.jpg",              imageAlt: "Professional roof replacement project",              buttonIcon: Phone,
              buttonHref: "tel:+15551234567"
            },
            {
              title: "Storm Damage Repair",              description: "Emergency response for hail, wind, and weather damage. We work with your insurance company.",              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-roofer-working-with-protection-helmet_23-2149343637.jpg",              imageAlt: "Storm damage roof repair service",              buttonIcon: Phone,
              buttonHref: "tel:+15551234567"
            },
            {
              title: "Free Roof Inspections",              description: "Professional assessment of your roof condition. Early detection prevents costly damage later.",              imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-men-working-together_23-2149343659.jpg",              imageAlt: "Professional roof inspection assessment",              buttonIcon: Phone,
              buttonHref: "tel:+15551234567"
            }
          ]}
        />
      </div>

      <div id="why-us" data-section="why-us">
        <MetricSplitMediaAbout
          title="Why Choose Pro Exteriors LLC"
          description="We stand out from the competition with fast response times, transparent pricing, experienced professionals, and a commitment to quality. When you call Pro Exteriors, you're getting a team that cares about your home as much as you do."
          tag="Our Commitment"
          tagIcon={Heart}
          tagAnimation="slide-up"
          useInvertedBackground={false}
          imageSrc="http://img.b2bpic.net/free-photo/front-view-happy-old-man-with-white-helmet_23-2148269398.jpg"
          imageAlt="Pro Exteriors LLC leadership team"
          mediaAnimation="blur-reveal"
          metricsAnimation="slide-up"
          metrics={[
            { value: "Same-Day", title: "Service Available" },
            { value: "Transparent", title: "Pricing Always" },
            { value: "Experienced", title: "Professional Team" },
            { value: "Quality", title: "Guaranteed Work" }
          ]}
        />
      </div>

      <div id="estimate" data-section="estimate">
        <ContactCTA
          tag="Get Your Free Estimate"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          title="Schedule Your Free Roofing Estimate Today"
          description="Limited availability this week. Same-day inspections available for qualified homeowners. Fill out the form below or call now for immediate assistance."
          buttons={[
            { text: "Call Now: (555) 123-4567", href: "tel:+15551234567" },
            { text: "Request Free Estimate", href: "#" }
          ]}
          buttonAnimation="slide-up"
          background={{ variant: "downward-rays-animated" }}
          useInvertedBackground={false}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardOne
          title="What Homeowners Say About Pro Exteriors"
          description="Real reviews from real customers. See why homeowners in our service area trust us with their roofing needs."
          tag="Customer Testimonials"
          tagIcon={MessageSquare}
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
          gridVariant="four-items-2x2-equal-grid"
          animationType="slide-up"
          testimonials={[
            {
              id: "1",              name: "Sarah Johnson",              role: "Homeowner",              company: "Windbrook Neighborhood",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/beautiful-young-african-american-woman-smiling-cheerful-friendly-face-laughing-confident_839833-29956.jpg"
            },
            {
              id: "2",              name: "Michael Chen",              role: "Property Owner",              company: "Downtown Area",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/portrait-beautiful-blond-girl-knitted-sweater-confidently-looking-away-escalator-modern-shopping-mall_574295-2257.jpg"
            },
            {
              id: "3",              name: "Emily Rodriguez",              role: "Homeowner",              company: "Lakeside Community",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/joyful-handsome-blonde-man-keeps-fists-isolated-pink-wall_141793-66316.jpg"
            },
            {
              id: "4",              name: "David Kim",              role: "Property Manager",              company: "Estate Properties",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/my-big-dream-is-working-big-company_329181-11421.jpg"
            }
          ]}
        />
      </div>

      <div id="final-cta" data-section="final-cta">
        <ContactCTA
          tag="Final Call to Action"
          tagIcon={AlertCircle}
          tagAnimation="slide-up"
          title="Don't Wait – Get Your Free Roofing Estimate Now"
          description="Protect your home with professional roofing services. Available for same-day inspections and emergency repairs. Call or click below to schedule your free estimate today."
          buttons={[
            { text: "Call Now: (555) 123-4567", href: "tel:+15551234567" },
            { text: "Get Free Estimate Online", href: "#estimate-form" }
          ]}
          buttonAnimation="slide-up"
          background={{ variant: "gradient-bars" }}
          useInvertedBackground={false}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoReveal
          logoText="Pro Exteriors LLC"
          leftLink={{ text: "Privacy Policy", href: "#" }}
          rightLink={{ text: "Contact Us", href: "tel:+15551234567" }}
        />
      </div>
    </ThemeProvider>
  );
}
