"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import HeroBillboardRotatedCarousel from '@/components/sections/hero/HeroBillboardRotatedCarousel';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import SplitAbout from '@/components/sections/about/SplitAbout';
import TeamCardEleven from '@/components/sections/team/TeamCardEleven';
import TestimonialCardTwo from '@/components/sections/testimonial/TestimonialCardTwo';

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="text-shift"
        defaultTextAnimation="background-highlight"
        borderRadius="pill"
        contentWidth="smallMedium"
        sizing="medium"
        background="noise"
        cardStyle="solid"
        primaryButtonStyle="radial-glow"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="extrabold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingOverlay
      navItems={[
        {
          name: "Home",
          id: "/",
        },
        {
          name: "About Us",
          id: "#about",
        },
        {
          name: "Services",
          id: "#services",
        },
        {
          name: "Our Team",
          id: "#team",
        },
        {
          name: "Products",
          id: "#products",
        },
        {
          name: "Testimonials",
          id: "#testimonials",
        },
        {
          name: "FAQ",
          id: "#faq",
        },
        {
          name: "Contact",
          id: "#contact",
        },
      ]}
      brandName="Zhong Yi Idea TCM Clinic"
      button={{
        text: "Book Now",
        href: "#contact",
      }}
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboardRotatedCarousel
      background={{
        variant: "rotated-rays-static",
      }}
      title="Your Health, Naturally Restored"
      description="Experience traditional Chinese medicine in Edmonton. From acupuncture to herbal therapy, we restore balance and wellness the natural way. Bilingual care, online booking, and evidence-based treatment."
      buttons={[
        {
          text: "Book Your Appointment Now",
          href: "#contact",
        },
      ]}
      carouselItems={[
        {
          id: "1",
          imageSrc: "http://img.b2bpic.net/free-photo/serene-minimalist-spa-interior-meditation-space_23-2151935113.jpg?_wi=1",
          imageAlt: "Acupuncture treatment in a serene clinic",
        },
        {
          id: "2",
          imageSrc: "http://img.b2bpic.net/free-photo/traditional-chinese-medicine-ancient-medical-book-bamboo_1387-274.jpg",
          imageAlt: "Assortment of traditional Chinese herbal remedies",
        },
        {
          id: "3",
          imageSrc: "http://img.b2bpic.net/free-photo/side-view-young-people-church-praying_23-2150870058.jpg",
          imageAlt: "Acupuncturist consulting with a patient",
        },
        {
          id: "4",
          imageSrc: "http://img.b2bpic.net/free-photo/woman-sitting-lotus-position-morning-fresh-air_1153-4924.jpg",
          imageAlt: "Person meditating in a natural, serene environment",
        },
        {
          id: "5",
          imageSrc: "http://img.b2bpic.net/free-photo/anime-style-character-meditating-contemplating-mindfulness_23-2151476673.jpg",
          imageAlt: "Chinese calligraphy with wellness symbols",
        },
        {
          id: "6",
          imageSrc: "http://img.b2bpic.net/free-photo/overhead-view-woman-s-hand-holding-herbal-tea-cup-dried-lemon-textured-backdrop_23-2148124009.jpg",
          imageAlt: "Hands holding a cup of herbal tea",
        },
      ]}
      autoPlay={true}
      autoPlayInterval={4000}
    />
  </div>

  <div id="about" data-section="about">
      <SplitAbout
      textboxLayout="default"
      useInvertedBackground={true}
      imagePosition="right"
      title="Dedicated to Your Holistic Wellness"
      description="Zhong Yi Idea TCM Clinic blends ancient wisdom with modern practice to provide comprehensive, personalized care. Our experienced practitioners offer evidence-based treatments focusing on your unique health journey. We are committed to fostering a supportive, culturally understanding environment for all our patients in Edmonton."
      bulletPoints={[
        {
          title: "Experienced Practitioners",
          description: "Our team holds extensive certifications and deep knowledge in various TCM modalities.",
        },
        {
          title: "Personalized Treatment Plans",
          description: "We tailor every therapy to your specific health needs and wellness goals.",
        },
        {
          title: "Bilingual & Culturally Sensitive",
          description: "Offering care in English and Mandarin, ensuring comfort and clear communication for everyone.",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/man-preparing-matcha-tea-front-view_23-2150163521.jpg"
      imageAlt="Interior of a modern Traditional Chinese Medicine clinic"
      mediaAnimation="slide-up"
    />
  </div>

  <div id="services" data-section="services">
      <FeatureCardEight
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          title: "Acupuncture",
          description: "Fine needles stimulate specific points to relieve pain, reduce stress, and improve energy flow.",
          imageSrc: "http://img.b2bpic.net/free-photo/massage-therapist-pours-oil-massage-relaxing-body-massage-using-oils_169016-13488.jpg",
          imageAlt: "Acupuncture needles on a patient's back",
        },
        {
          title: "Herbal Medicine",
          description: "Customized natural remedies to address internal imbalances and support overall health.",
          imageSrc: "http://img.b2bpic.net/free-photo/composition-assortment-nuts_23-2147690276.jpg",
          imageAlt: "TCM practitioner discussing herbal medicine with a patient",
        },
        {
          title: "Cupping Therapy",
          description: "A traditional method using suction cups to alleviate muscle tension, promote circulation, and reduce inflammation.",
          imageSrc: "http://img.b2bpic.net/free-photo/client-suction-cu-session_23-2148824039.jpg",
          imageAlt: "Cupping therapy on a patient's back",
        },
      ]}
      title="Our Specialized Traditional Chinese Medicine Services"
      description="Discover a range of treatments designed to promote healing, alleviate pain, and restore your body's natural equilibrium. We offer personalized care for diverse health needs, blending ancient practices with modern understanding."
    />
  </div>

  <div id="team" data-section="team">
      <TeamCardEleven
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      groups={[
        {
          id: "practitioners",
          groupTitle: "Certified TCM Practitioners",
          members: [
            {
              id: "member-1",
              title: "Dr. Li Mei",
              subtitle: "Lead Acupuncturist & Herbalist",
              detail: "Dr. Li Mei brings over 15 years of experience in both acupuncture and traditional Chinese herbal medicine, specializing in chronic pain management and fertility support.",
              imageSrc: "http://img.b2bpic.net/free-photo/woman-writing-with-ink-japanese-paper_23-2149048355.jpg",
              imageAlt: "Portrait of Dr. Li Mei",
            },
            {
              id: "member-2",
              title: "Dr. Chen Wei",
              subtitle: "TCM Physician & Cupping Specialist",
              detail: "Dr. Chen Wei is passionate about holistic healing, focusing on digestive health and stress-related conditions through integrated TCM therapies.",
              imageSrc: "http://img.b2bpic.net/free-photo/cropped-shot-dark-skinned-smiling-young-woman-with-afro-hairstyle-dressed-casual-summer-clothing_273609-3169.jpg",
              imageAlt: "Portrait of Dr. Chen Wei",
            },
            {
              id: "member-3",
              title: "Ms. Anya Sharma",
              subtitle: "Patient Care Coordinator",
              detail: "Anya ensures a smooth and welcoming experience for all our patients, assisting with appointments, insurance inquiries, and general support.",
              imageSrc: "http://img.b2bpic.net/free-photo/close-up-women-architects-looking-laptop-blueprints-plans-table-colleagues-using-computer-layout-print-paper-design-urban-construction-building-model_482257-38872.jpg",
              imageAlt: "Portrait of Ms. Anya Sharma",
            },
          ],
          imageSrc: "http://img.b2bpic.net/free-photo/serene-minimalist-spa-interior-meditation-space_23-2151935113.jpg?_wi=2",
          imageAlt: "experienced female acupuncturist smiling",
        },
      ]}
      title="Meet Our Compassionate Practitioners"
      description="Our team of certified TCM professionals is dedicated to providing high-quality, bilingual care. With extensive experience and a deep understanding of traditional practices, we are here to guide you on your path to wellness and health."
    />
  </div>

  <div id="products" data-section="products">
      <ProductCardThree
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="uniform-all-items-equal"
      useInvertedBackground={false}
      carouselMode="buttons"
      products={[
        {
          id: "p1",
          name: "Immune Boost Herbal Tea",
          price: "$18.00",
          imageSrc: "http://img.b2bpic.net/free-photo/freshly-fruit-juice-wooden-background_169016-3592.jpg",
          imageAlt: "Box of Immune Boost Herbal Tea",
        },
        {
          id: "p2",
          name: "Acupressure Massage Tool",
          price: "$25.00",
          imageSrc: "http://img.b2bpic.net/free-photo/woman-following-online-fitness-instructor_23-2149236496.jpg",
          imageAlt: "Wooden acupressure massage tool",
        },
        {
          id: "p3",
          name: "Relaxing Lavender Essential Oil",
          price: "$15.00",
          imageSrc: "http://img.b2bpic.net/free-photo/top-view-bowl-with-small-stones-oils_23-2148268449.jpg",
          imageAlt: "Bottle of lavender essential oil",
        },
        {
          id: "p4",
          name: "Premium Ginseng Extract",
          price: "$45.00",
          imageSrc: "http://img.b2bpic.net/free-photo/traditional-chinese-medicine-ancient-medical-book-white-desk_1387-256.jpg",
          imageAlt: "Container of Ginseng Extract",
        },
        {
          id: "p5",
          name: "Ceramic Aroma Diffuser",
          price: "$30.00",
          imageSrc: "http://img.b2bpic.net/free-photo/modern-aroma-oil-diffuser-wood-surface-with-knitted-element-water-oils-jars_169016-10341.jpg",
          imageAlt: "Ceramic essential oil diffuser",
        },
        {
          id: "p6",
          name: "Meditation Zafu Cushion",
          price: "$40.00",
          imageSrc: "http://img.b2bpic.net/free-photo/illuminated-candles-dried-citrus-slices-la-stone-honey-essential-oil-bottles-pot-plant-desk-against-wall_23-2148087717.jpg",
          imageAlt: "Round meditation cushion",
        },
      ]}
      title="Wellness Products for Your Home"
      description="Enhance your daily routine and support your health journey with our curated selection of traditional Chinese herbal remedies, premium teas, and wellness accessories. Hand-picked for quality and efficacy."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardTwo
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={true}
      carouselMode="buttons"
      testimonials={[
        {
          id: "t1",
          name: "Sarah J.",
          role: "Marketing Professional",
          testimonial: "Zhong Yi Idea TCM Clinic has been a game-changer for my chronic migraines. Dr. Li Mei's acupuncture and herbal remedies provided relief when nothing else worked. Highly recommend!",
          imageSrc: "http://img.b2bpic.net/free-photo/portrait-middle-aged-businesswoman_23-2148204386.jpg",
          imageAlt: "Sarah Johnson",
        },
        {
          id: "t2",
          name: "Michael C.",
          role: "Retired Teacher",
          testimonial: "The compassionate care I received here for my back pain was exceptional. Dr. Chen Wei is incredibly knowledgeable, and the clinic feels like a peaceful sanctuary.",
          imageSrc: "http://img.b2bpic.net/free-photo/young-adult-working-social-integration-workspace_23-2149341144.jpg",
          imageAlt: "Michael Chen",
        },
        {
          id: "t3",
          name: "Emily R.",
          role: "University Student",
          testimonial: "As a Mandarin speaker, finding bilingual care was crucial. The team at Zhong Yi Idea is truly understanding and their treatments helped me manage my stress during exams.",
          imageSrc: "http://img.b2bpic.net/free-photo/portrait-asian-young-woman-student-doing-homework-working-park-sitting-beside-tree-with-laptop_1258-198797.jpg",
          imageAlt: "Emily Rodriguez",
        },
        {
          id: "t4",
          name: "David K.",
          role: "Software Engineer",
          testimonial: "I was skeptical about TCM, but their evidence-based approach and the results I saw for my sleep issues completely changed my mind. A truly holistic and effective clinic.",
          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-man-correcting-grammar-mistakes_23-2150171372.jpg",
          imageAlt: "David Kim",
        },
        {
          id: "t5",
          name: "Jessica L.",
          role: "Yoga Instructor",
          testimonial: "Their herbal medicine expertise is fantastic. My energy levels have improved significantly, and I feel more balanced overall. A wonderful addition to Edmonton's wellness community.",
          imageSrc: "http://img.b2bpic.net/free-photo/doctor-checking-patient_23-2148497180.jpg",
          imageAlt: "Jessica Lee",
        },
      ]}
      title="Hear From Our Valued Patients"
      description="Real stories of healing and transformation from individuals who have experienced the profound benefits of our personalized Traditional Chinese Medicine care. Their wellness journeys inspire us every day."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqDouble
      textboxLayout="default"
      useInvertedBackground={false}
      faqs={[
        {
          id: "q1",
          title: "What is Traditional Chinese Medicine (TCM)?",
          content: "TCM is a holistic system of ancient medicine that includes acupuncture, herbal medicine, cupping, and dietary therapy, focusing on balancing the body's energy (Qi) to prevent and treat illness.",
        },
        {
          id: "q2",
          title: "Do you offer online appointment booking?",
          content: "Yes, we offer convenient online appointment booking through our website. You can select your preferred practitioner, service, and time slot directly from our 'Book Now' page.",
        },
        {
          id: "q3",
          title: "Are your services covered by insurance?",
          content: "Many extended health benefit plans cover acupuncture and other TCM services. We recommend checking with your insurance provider directly regarding your specific coverage details.",
        },
        {
          id: "q4",
          title: "Is acupuncture painful?",
          content: "Acupuncture needles are very fine, and most patients report feeling minimal to no pain. You might experience a slight dull ache, tingling, or warmth, which are signs of energy (Qi) activation.",
        },
        {
          id: "q5",
          title: "Do you provide bilingual services?",
          content: "Yes, our clinic proudly offers bilingual services in both English and Mandarin to ensure clear communication and comfort for our diverse patient community.",
        },
      ]}
      title="Frequently Asked Questions"
      description="Find answers to common questions about Traditional Chinese Medicine, our clinic services, appointment booking, payment options, and insurance coverage. We aim for complete transparency."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplitForm
      useInvertedBackground={true}
      title="Book Your Personalized Consultation"
      description="Ready to start your wellness journey? Contact Zhong Yi Idea TCM Clinic today to schedule an appointment, inquire about our services, or learn more about our retail products. Our team is here to assist you."
      inputs={[
        {
          name: "name",
          type: "text",
          placeholder: "Your Name",
          required: true,
        },
        {
          name: "email",
          type: "email",
          placeholder: "Your Email",
          required: true,
        },
        {
          name: "phone",
          type: "tel",
          placeholder: "Your Phone Number (Optional)",
        },
      ]}
      textarea={{
        name: "message",
        placeholder: "Tell us how we can help you...",
        rows: 4,
        required: true,
      }}
      imageSrc="http://img.b2bpic.net/free-photo/couple-standing-near-pillar-stretching-her-leg-while-doing-exercise_23-2148038191.jpg"
      imageAlt="Exterior view of Zhong Yi Idea TCM Clinic"
      mediaAnimation="slide-up"
      mediaPosition="right"
      buttonText="Send Message"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBaseReveal
      logoText="Zhong Yi Idea TCM Clinic"
      columns={[
        {
          title: "Services",
          items: [
            {
              label: "Acupuncture",
              href: "#services",
            },
            {
              label: "Herbal Medicine",
              href: "#services",
            },
            {
              label: "Cupping Therapy",
              href: "#services",
            },
            {
              label: "TCM Diagnostics",
              href: "#",
            },
          ],
        },
        {
          title: "Clinic",
          items: [
            {
              label: "About Us",
              href: "#about",
            },
            {
              label: "Our Team",
              href: "#team",
            },
            {
              label: "Book Online",
              href: "#contact",
            },
            {
              label: "Contact Us",
              href: "#contact",
            },
          ],
        },
        {
          title: "Resources",
          items: [
            {
              label: "Patient FAQs",
              href: "#faq",
            },
            {
              label: "Wellness Blog",
              href: "#",
            },
            {
              label: "TCM Products",
              href: "#products",
            },
            {
              label: "Privacy Policy",
              href: "#",
            },
          ],
        },
      ]}
      copyrightText="© 2023 Zhong Yi Idea TCM Clinic. All rights reserved."
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
