"use client"

import { Clapperboard, Film, Sparkles, Camera, Image, Star, TrendingUp } from "lucide-react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleFullscreen from '@/components/navbar/NavbarStyleFullscreen/NavbarStyleFullscreen';
import HeroSplitDualMedia from '@/components/sections/hero/HeroSplitDualMedia';
import TestimonialAboutCard from '@/components/sections/about/TestimonialAboutCard';
import FeatureCardTwentyOne from '@/components/sections/feature/FeatureCardTwentyOne';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import TestimonialCardOne from '@/components/sections/testimonial/TestimonialCardOne';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterBase from '@/components/sections/footer/FooterBase';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="shift-hover"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="mediumLarge"
      sizing="large"
      background="circleGradient"
      cardStyle="solid"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="solid"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleFullscreen
          brandName="Revv Productions"
          navItems={[
            { name: "Home", id: "home" },
            { name: "About", id: "about" },
            { name: "Services", id: "services" },
            { name: "Testimonials", id: "testimonials" },
            { name: "Contact", id: "contact" }
          ]}
          bottomLeftText="Los Angeles, CA"
          bottomRightText="hello@revvproductions.com"
        />
      </div>
      
      <div id="hero" data-section="hero">
        <HeroSplitDualMedia
          title="Cinematic Excellence for Luxury Real Estate"
          description="Revv Productions specializes in stunning video content that showcases high-end properties in their best light. From aerial drone work to 4K interior cinematography, we capture the essence of luxury homes."
          tag="Premium Video Production"
          tagIcon={Clapperboard}
          background={{ variant: "plain" }}
          buttons={[
            { text: "View Our Portfolio", href: "#portfolio" },
            { text: "Get a Quote", href: "#contact" }
          ]}
          mediaItems={[
            {
              imageSrc: "http://img.b2bpic.net/free-photo/swimming-pool-beach-luxury-hotel-type-entertainment-complex-amara-dolce-vita-luxury-hotel-resort-tekirova-kemer-turkey_146671-18719.jpg",              imageAlt: "Luxury modern home exterior"
            },
            {
              imageSrc: "http://img.b2bpic.net/free-photo/full-shot-young-woman-stairs_23-2149204468.jpg",              imageAlt: "Luxury modern home interior"
            }
          ]}
          rating={5}
          ratingText="Trusted by Top Real Estate Agents"
        />
      </div>
      
      <div id="about" data-section="about">
        <TestimonialAboutCard
          tag="About Revv"
          tagIcon={Film}
          title="We Transform Properties into Visual Stories"
          description="Our team of award-winning cinematographers and editors brings 15+ years of experience in luxury real estate videography."
          subdescription="Serving exclusive properties across Los Angeles, Beverly Hills, and Malibu"
          icon={Sparkles}
          imageSrc="http://img.b2bpic.net/free-photo/man-filming-with-professional-camera-new-movie_23-2149066393.jpg"
          imageAlt="Revv Productions team at work"
          useInvertedBackground="invertDefault"
        />
      </div>
      
      <div id="services" data-section="services">
        <FeatureCardTwentyOne
          title="Our Premium Services"
          description="We offer a comprehensive suite of video production services tailored to showcase luxury properties."
          tag="Services"
          tagIcon={Camera}
          imageSrc="http://img.b2bpic.net/premium-photo/woman-photographer-taking-picture-modern-house-with-dslr-camera-tripod_788670-6569.jpg?id=378007444"
          imageAlt="Production services in action"
          accordionItems={[
            {
              id: "1",              title: "Drone Aerial Cinematography",              content: "Stunning 4K aerial footage capturing property exteriors, landscapes, and surrounding neighborhoods from unique perspectives."
            },
            {
              id: "2",              title: "Interior 4K Videography",              content: "Professional interior walks showcasing architectural details, luxury finishes, and room layouts with cinematic lighting."
            },
            {
              id: "3",              title: "Virtual Tours & 3D Walkthroughs",              content: "Interactive virtual property tours allowing potential buyers to explore homes remotely with seamless navigation."
            },
            {
              id: "4",              title: "Luxury Property Reels",              content: "Short-form, social media-optimized content designed to showcase highlights and attract qualified buyers."
            }
          ]}
          mediaPosition="left"
          buttons={[{ text: "Explore Packages", href: "#pricing" }]}
          useInvertedBackground="noInvert"
        />
      </div>
      
      <div id="portfolio" data-section="portfolio">
        <ProductCardFour
          title="Featured Projects"
          description="Explore our latest luxury real estate cinematography projects"
          tag="Portfolio"
          tagIcon={Image}
          textboxLayout="default"
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          useInvertedBackground="invertDefault"
          products={[
            {
              id: "1",              name: "Bel Air Mansion - 15,000 SQ FT",              price: "$2.8M",              variant: "Aerial + Interior + Virtual Tour",              imageSrc: "http://img.b2bpic.net/free-photo/full-shot-woman-vacation_23-2149204469.jpg",              imageAlt: "Luxury mansion project"
            },
            {
              id: "2",              name: "Santa Monica Penthouse",              price: "$4.2M",              variant: "4K Cinematography + Drone",              imageSrc: "http://img.b2bpic.net/free-photo/beach-chair-resort_1150-17976.jpg",              imageAlt: "Modern penthouse project"
            },
            {
              id: "3",              name: "Malibu Waterfront Estate",              price: "$6.5M",              variant: "Premium Full-Service Production",              imageSrc: "http://img.b2bpic.net/free-photo/luxury-travel-full-shot-woman_23-2149204471.jpg",              imageAlt: "Luxury beachfront property"
            }
          ]}
        />
      </div>
      
      <div id="testimonials" data-section="testimonials">
        <TestimonialCardOne
          title="What Our Clients Say"
          description="Real feedback from luxury real estate professionals who trust Revv Productions"
          tag="Testimonials"
          tagIcon={Star}
          gridVariant="uniform-all-items-equal"
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="noInvert"
          testimonials={[
            {
              id: "1",              name: "Michael Sterling",              role: "Luxury Realtor",              company: "Sterling Properties",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/confident-european-businessman-smiling-closeup-portrait-jobs-career-campaign_53876-128975.jpg",              imageAlt: "Michael Sterling"
            },
            {
              id: "2",              name: "Jennifer Chen",              role: "Real Estate Broker",              company: "Westside Elite",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1563.jpg",              imageAlt: "Jennifer Chen"
            },
            {
              id: "3",              name: "David Rodriguez",              role: "Property Developer",              company: "Rodriguez Development",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/young-businessman-happy-expression_1194-1576.jpg",              imageAlt: "David Rodriguez"
            },
            {
              id: "4",              name: "Victoria Thompson",              role: "Listing Agent",              company: "Thompson Luxury Homes",              rating: 5,
              imageSrc: "http://img.b2bpic.net/free-photo/smiling-businessman-standing-airport_107420-85035.jpg",              imageAlt: "Victoria Thompson"
            }
          ]}
        />
      </div>
      
      <div id="metrics" data-section="metrics">
        <MetricCardSeven
          title="Revv Productions by the Numbers"
          description="Track record of excellence in luxury real estate video production"
          tag="Our Impact"
          tagIcon={TrendingUp}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground="invertDefault"
          metrics={[
            {
              id: "1",              value: "500+",              title: "Luxury Properties Filmed",              items: [
                "Average property value: $2.5M+",                "99% client satisfaction rate",                "Multiple award-winning projects"
              ]
            },
            {
              id: "2",              value: "15+",              title: "Years Industry Experience",              items: [
                "Award-winning cinematography team",                "State-of-the-art equipment",                "Continuous innovation in techniques"
              ]
            },
            {
              id: "3",              value: "48 hrs",              title: "Average Turnaround Time",              items: [
                "Express delivery available",                "Professional color grading",                "Full editing and post-production"
              ]
            }
          ]}
        />
      </div>
      
      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Get Your Property Filmed"
          description="Let's discuss how Revv Productions can showcase your luxury property to potential buyers. Reach out for a free consultation and project estimate."
          inputs={[
            {
              name: "name",              type: "text",              placeholder: "Your Name",              required: true
            },
            {
              name: "email",              type: "email",              placeholder: "your@email.com",              required: true
            },
            {
              name: "phone",              type: "tel",              placeholder: "(555) 123-4567",              required: true
            },
            {
              name: "property",              type: "text",              placeholder: "Property Address or Location",              required: true
            }
          ]}
          textarea={{
            name: "message",            placeholder: "Tell us about your property and video production needs...",            rows: 5,
            required: true
          }}
          useInvertedBackground="noInvert"
          imageSrc="http://img.b2bpic.net/free-photo/man-filming-with-professional-camera_23-2149066342.jpg"
          imageAlt="Professional video production setup"
          mediaPosition="right"
          buttonText="Request Consultation"
        />
      </div>
      
      <div id="footer" data-section="footer">
        <FooterBase
          logoText="Revv Productions"
          copyrightText="© 2025 Revv Productions. All rights reserved."
          columns={[
            {
              title: "Services",              items: [
                { label: "Aerial Cinematography", href: "#services" },
                { label: "Interior Videography", href: "#services" },
                { label: "Virtual Tours", href: "#services" },
                { label: "Social Media Reels", href: "#services" }
              ]
            },
            {
              title: "Company",              items: [
                { label: "About Us", href: "#about" },
                { label: "Portfolio", href: "#portfolio" },
                { label: "Testimonials", href: "#testimonials" },
                { label: "Contact", href: "#contact" }
              ]
            },
            {
              title: "Connect",              items: [
                { label: "hello@revvproductions.com", href: "mailto:hello@revvproductions.com" },
                { label: "(310) 555-REVV", href: "tel:+13105557388" },
                { label: "Instagram", href: "https://instagram.com" },
                { label: "Vimeo Portfolio", href: "https://vimeo.com" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}