"use client";

import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
import SplitAbout from '@/components/sections/about/SplitAbout';
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';
import PricingCardNine from '@/components/sections/pricing/PricingCardNine';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import { XCircle, Hand, Settings, Smile, Briefcase, Dumbbell, UsersRound, Stethoscope, MoonStar, Star, Zap, Target, CheckCircle } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-shift"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="compact"
      sizing="largeSmallSizeMediumTitles"
      background="fluid"
      cardStyle="layered-gradient"
      primaryButtonStyle="primary-glow"
      secondaryButtonStyle="glass"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="ShoulderEase"
          navItems={[
            { name: "Home", id: "#hero" },
            { name: "Features", id: "#features" },
            { name: "How It Works", id: "#how-it-works" },
            { name: "Reviews", id: "#reviews" },
            { name: "Order Now", id: "#offer" }
          ]}
          button={{
            text: "Order Now & Get 40% Off →",            href: "#offer"
          }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplitDoubleCarousel
          title="Say Goodbye to Shoulder Pain — In Just 15 Minutes"
          description="The Electric Heated Shoulder Brace that combines deep heat therapy + vibration massage to melt away pain — at home, at work, or on the go."
          background={{
            variant: "radial-gradient"
          }}
          leftCarouselItems={[
            { imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3Ex6gZI1pt4fowRRZpS4X4MizOR/uploaded-1781161691603-zauwac8p.jpg", imageAlt: "Man wearing electric heated shoulder brace for pain relief" },
            { imageSrc: "http://img.b2bpic.net/free-photo/young-sporty-man-wearing-sportswear-headband-with-heaphones-smartphone-armband-touching-it-with-serious-face_141793-37610.jpg", imageAlt: "man using heated shoulder brace at home" },
            { imageSrc: "http://img.b2bpic.net/free-photo/urban-sports-concept-with-young-woman_23-2147988228.jpg", imageAlt: "athletic man with shoulder brace after workout" },
            { imageSrc: "http://img.b2bpic.net/free-photo/hologram-feminine-silhouette-man-hand_23-2148755140.jpg", imageAlt: "close-up heated shoulder brace on person" },
            { imageSrc: "http://img.b2bpic.net/free-photo/young-lady-doing-exercises-simulator-phisiotherapy-room_1157-38394.jpg", imageAlt: "person with shoulder brace on couch relaxing" },
            { imageSrc: "http://img.b2bpic.net/free-photo/young-fitness-woman-sportswear-with-headband-looking-unwell-touching-her-neck-having-pain-standing-pink-wall_141793-50037.jpg", imageAlt: "woman smiling while using shoulder massager" }
          ]}
          rightCarouselItems={[
            { imageSrc: "http://img.b2bpic.net/free-photo/physiotherapist-examines-female-patient-shoulder-checks-joint-pain-shoulder-assessment_169016-70971.jpg", imageAlt: "man relaxing with heated shoulder massager" },
            { imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-using-massage-gun-indoors_23-2149421055.jpg", imageAlt: "woman working on laptop using shoulder brace" },
            { imageSrc: "http://img.b2bpic.net/free-photo/person-using-massage-gun_23-2149398575.jpg", imageAlt: "close up of shoulder brace material and texture" },
            { imageSrc: "http://img.b2bpic.net/free-photo/handsome-men-sports-clothes-sitting-near-simulators_1157-26902.jpg", imageAlt: "man doing light exercise wearing shoulder brace" },
            { imageSrc: "http://img.b2bpic.net/free-photo/woman-relaxing-spa_23-2148000496.jpg", imageAlt: "woman sleeping peacefully with shoulder brace" },
            { imageSrc: "http://img.b2bpic.net/free-photo/female-patient-undergoing-therapy-with-physiotherapist_23-2148836504.jpg", imageAlt: "family member helping apply shoulder brace" }
          ]}
          tag="🔥 3-Level Heat Control | ⚡ Rechargeable Battery | 🏋️ Fits Left & Right Shoulder | ✅ 30-Day Money Back Guarantee"
          tagAnimation="slide-up"
          buttons={[
            { text: "Order Now & Get 40% Off →", href: "#offer" }
          ]}
          buttonAnimation="slide-up"
          carouselPosition="right"
        />
      </div>

      <div id="problem" data-section="problem">
        <SplitAbout
          title="Sound Familiar?"
          description="You don't need another painkiller. You need real heat — delivered exactly where it hurts."
          bulletPoints={[
            { title: "Shoulder pain that won't go away no matter what you try", description: "Persistent shoulder pain can be debilitating.", icon: XCircle },
            { title: "Physiotherapy sessions costing thousands of rupees every month", description: "Expensive physiotherapy sessions may not be sustainable.", icon: XCircle },
            { title: "Pain killers that only mask the problem temporarily", description: "Painkillers offer only temporary relief.", icon: XCircle },
            { title: "Cold nights where your shoulder aches you out of sleep", description: "Night pain disrupts sleep and recovery.", icon: XCircle },
            { title: "Can't lift your arm properly at work or at the gym", description: "Limited arm mobility affects daily activities.", icon: XCircle }
          ]}
          imageSrc="http://img.b2bpic.net/free-photo/handsome-business-man-wearing-suit-touching-shoulder-feeling-pain-standing-white-background_141793-54195.jpg"
          imageAlt="Person with hand on aching shoulder and painful expression"
          mediaAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
        />
      </div>

      <div id="product-intro" data-section="product-intro">
        <SplitAbout
          title="Meet the Smart Shoulder Brace That Works While You Rest"
          description="Designed with infrared heating technology and multi-point vibration, this shoulder wrap delivers clinic-level relief without the clinic price. Just strap it on and let it work."
          bulletPoints={[
            { title: "Infrared Heat Therapy", description: "Penetrates deep into muscles and joints for effective relief.", icon: Zap },
            { title: "Multi-Point Vibration Massage", description: "Stimulates blood flow and reduces stiffness.", icon: Target }
          ]}
          imageSrc="http://img.b2bpic.net/free-photo/women-wear-wristbands-exercise-stand-against-wall_1150-16545.jpg"
          imageAlt="Close-up of electric shoulder brace showing technological details"
          mediaAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTen
          title="Everything Your Shoulder Needs. Nothing It Doesn't."
          features={[
            {
              title: "3-Level Infrared Heat",              description: "Penetrates deep into joints & muscles for real relief.",              media: { imageSrc: "http://img.b2bpic.net/free-photo/3d-anatomy-concept-xray-man_183364-118325.jpg", imageAlt: "Graphic showing infrared heat penetrating muscle tissue" },
              reverse: false,
              items: [
                { text: "3-Level Infrared Heat: Penetrates deep into joints & muscles for real relief", icon: CheckCircle }
              ]
            },
            {
              title: "Vibration Massage Modes",              description: "Stimulates blood flow and reduces stiffness fast.",              media: { imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-portrait-digital-art_23-2151197901.jpg", imageAlt: "Graphic showing vibration waves stimulating blood flow" },
              reverse: true,
              items: [
                { text: "Vibration Massage Modes: Stimulates blood flow, reduces stiffness fast", icon: CheckCircle }
              ]
            },
            {
              title: "LED Digital Display",              description: "See your settings clearly — no guesswork.",              media: { imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-using-massage-gun-man_23-2149421018.jpg", imageAlt: "Close-up of the LED digital display on the shoulder brace" },
              reverse: false,
              items: [
                { text: "LED Digital Display: See your settings clearly — no guesswork", icon: CheckCircle }
              ]
            },
            {
              title: "Rechargeable Battery",              description: "Wireless freedom — use it anywhere.",              media: { imageSrc: "http://img.b2bpic.net/free-photo/3d-paper-craft-art-charging-battery_53876-88546.jpg", imageAlt: "Icon of a rechargeable battery and charging cable" },
              reverse: true,
              items: [
                { text: "Rechargeable Battery: Wireless freedom — use it anywhere", icon: CheckCircle }
              ]
            },
            {
              title: "Adjustable Strap",              description: "Fits all shoulder sizes, left or right.",              media: { imageSrc: "http://img.b2bpic.net/free-photo/boxer-training-with-resistance-belts_1098-14153.jpg", imageAlt: "Image of the adjustable strap mechanism for the shoulder brace" },
              reverse: false,
              items: [
                { text: "Adjustable Strap: Fits all shoulder sizes, left or right", icon: CheckCircle }
              ]
            },
            {
              title: "Breathable Mesh Fabric",              description: "Comfortable for extended wear.",              media: { imageSrc: "http://img.b2bpic.net/free-photo/close-up-ventilation-system_23-2149388960.jpg", imageAlt: "Close-up of the breathable mesh fabric texture" },
              reverse: true,
              items: [
                { text: "Breathable Mesh Fabric: Comfortable for extended wear", icon: CheckCircle }
              ]
            },
            {
              title: "Auto Shut-Off Timer",              description: "Safe 15–30 min sessions, no overheating.",              media: { imageSrc: "http://img.b2bpic.net/free-photo/woman-holding-clipboard-office-lobby_482257-121035.jpg", imageAlt: "Icon of a timer with auto shut-off function" },
              reverse: false,
              items: [
                { text: "Auto Shut-Off Timer: Safe 15–30 min sessions, no overheating", icon: CheckCircle }
              ]
            }
          ]}
          textboxLayout="default"
          animationType="slide-up"
          useInvertedBackground={true}
        />
      </div>

      <div id="how-it-works" data-section="how-it-works">
        <SplitAbout
          title="Relief in 3 Simple Steps"
          description=""
          bulletPoints={[
            { title: "Strap It On", description: "Adjustable belt fits any shoulder perfectly", icon: Hand },
            { title: "Select Your Mode", description: "Choose heat level & vibration intensity on the LED panel", icon: Settings },
            { title: "Relax & Recover", description: "Feel the heat penetrate deep within minutes", icon: Smile }
          ]}
          imageSrc="http://img.b2bpic.net/free-photo/top-view-hands-holding-massage-gun_23-2149421007.jpg"
          imageAlt="Person demonstrating putting on the electric shoulder brace"
          mediaAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="who-its-for" data-section="who-its-for">
        <SplitAbout
          title="Perfect For..."
          description=""
          bulletPoints={[
            { title: "Office workers with frozen shoulder from sitting all day", description: "Relieve stiffness and discomfort from prolonged desk work.", icon: Briefcase },
            { title: "Gym-goers with post-workout soreness", description: "Accelerate muscle recovery after intense training.", icon: Dumbbell },
            { title: "Older adults with arthritis or joint stiffness", description: "Ease chronic pain and improve joint flexibility.", icon: UsersRound },
            { title: "Anyone recovering from a shoulder injury", description: "Support healing and reduce pain during recovery.", icon: Stethoscope },
            { title: "People woken up by shoulder pain at night", description: "Enjoy uninterrupted sleep with soothing heat therapy.", icon: MoonStar }
          ]}
          imageSrc="http://img.b2bpic.net/free-photo/retro-loving-couple-dancing-near-disco-ball_171337-10521.jpg"
          imageAlt="Diverse people benefiting from the electric shoulder brace"
          mediaAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
        />
      </div>

      <div id="reviews" data-section="reviews">
        <TestimonialCardTwo
          title="Join 12,000+ Customers Living Pain-Free"
          description="Hear what our satisfied customers have to say about their journey to a pain-free life."
          testimonials={[
            { id: "1", name: "Ali Raza", role: "Lahore — Verified Buyer", testimonial: "\"Mera shoulder 2 saal se dukh raha tha — is ne 1 hafte mein farq diya! My shoulder had been hurting for 2 years. This made a difference in just 1 week!\"", imageSrc: "http://img.b2bpic.net/free-photo/pleased-male-customer-guarantee-quality-show-okay-sign-stock-photo_176420-18709.jpg", icon: Star },
            { id: "2", name: "Sana M.", role: "Karachi — Verified Buyer", testimonial: "\"Best purchase I've made this year. The heat goes DEEP. I use it every night before bed.\"", imageSrc: "http://img.b2bpic.net/free-photo/positive-excited-young-woman-showing-thumbs-up-having-fun-stock-photo_1262-14331.jpg", icon: Star },
            { id: "3", name: "Usman K.", role: "Islamabad — Verified Buyer", testimonial: "\"Bought it for my father who has arthritis. He now asks for it every single day. Highly recommend!\"", imageSrc: "http://img.b2bpic.net/free-photo/portrait-confident-man-home-office-stock-photo_329181-20664.jpg", icon: Star },
            { id: "4", name: "Fatima N.", role: "Faisalabad — Verified Buyer", testimonial: "\"Physiotherapy chodh di — yeh brace ghar pe hi kaam kar deta hai. Stopped going to physio — this brace does the job at home.\"", imageSrc: "http://img.b2bpic.net/free-photo/young-caucasian-ill-girl-wearing-scarf-keeping-hands-near-mouth-calling-out-loud-someone-with-closed-eyes-isolated-purple-wall-with-copy-space_141793-79573.jpg", icon: Star },
            { id: "5", name: "Hassan B.", role: "Rawalpindi — Verified Buyer", testimonial: "\"The LED display is very easy to use. My gym trainer also asked me where I got this from!\"", imageSrc: "http://img.b2bpic.net/free-photo/close-up-satisfied-bearded-guy-white-shirt-showing-thumbs-up-approval-like-agree-positive-answer-stock-photo_1258-26715.jpg", icon: Star }
          ]}
          carouselMode="buttons"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="offer" data-section="offer">
        <PricingCardNine
          title="Today Only — 40% Off + Free Delivery"
          description="Original Price: ₹5,999 \n Sale Price: ₹3,599 \n\n 🔥 Limited Time Offer! 🔥\n\n🚚 Free delivery nationwide \n🔄 30-day easy return \n🔒 Cash on Delivery available \n\n⚠️ Sirf 23 pieces baqi hain — abhi order karein! (Only 23 pieces left — order now!)"
          plans={[
            {
              id: "sale-offer",              title: "Electric Heated Shoulder Brace Massager",              price: "₹3,599",              period: "Limited Stock",              features: ["Original Price: ₹5,999", "Free Delivery Nationwide", "30-Day Easy Return", "Cash on Delivery Available"],
              button: { text: "Order Karo — COD Available →", href: "#" },
              imageSrc: "http://img.b2bpic.net/free-photo/side-view-man-using-massage-gun-woman_23-2149421004.jpg",              imageAlt: "Electric shoulder brace on a special offer"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqDouble
          title="Frequently Asked Questions"
          description=""
          faqs={[
            { id: "faq-1", title: "Kya yeh both shoulders pe use ho sakta hai?", content: "Haan! Adjustable strap left aur right dono shoulders pe fit hota hai." },
            { id: "faq-2", title: "Is it safe to use daily?", content: "Yes. Auto shut-off timer ensures safe 15–30 min sessions daily." },
            { id: "faq-3", title: "Battery kitni der chalti hai?", content: "Fully charged battery 2–3 sessions tak chalti hai." },
            { id: "faq-4", title: "Kya COD available hai?", content: "Bilkul! Cash on Delivery poore Pakistan mein available hai." }
          ]}
          faqsAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterSimple
          columns={[
            { title: "Product", items: [{ label: "Features", href: "#features" }, { label: "How It Works", href: "#how-it-works" }] },
            { title: "Support", items: [{ label: "FAQ", href: "#faq" }, { label: "Contact Us", href: "#" }] },
            { title: "Legal", items: [{ label: "Privacy Policy", href: "#" }, { label: "Terms of Service", href: "#" }] }
          ]}
          bottomLeftText="© 2023 ShoulderEase. All rights reserved."
          bottomRightText="Made with ❤️ for pain relief."
        />
      </div>
    </ThemeProvider>
  );
}