"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardTwelve from '@/components/sections/feature/FeatureCardTwelve';
import FooterCard from '@/components/sections/footer/FooterCard';
import HeroOverlay from '@/components/sections/hero/HeroOverlay';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import NavbarLayoutFloatingInline from '@/components/navbar/NavbarLayoutFloatingInline';
import PricingCardTwo from '@/components/sections/pricing/PricingCardTwo';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import TeamCardOne from '@/components/sections/team/TeamCardOne';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import { Award, Facebook, Instagram, Sparkles, Zap } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="text-stagger"
        defaultTextAnimation="entrance-slide"
        borderRadius="pill"
        contentWidth="medium"
        sizing="mediumLargeSizeMediumTitles"
        background="noiseDiagonalGradient"
        cardStyle="solid"
        primaryButtonStyle="double-inset"
        secondaryButtonStyle="solid"
        headingFontWeight="extrabold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingInline
      navItems={[
        {
          name: "Home",
          id: "#home",
        },
        {
          name: "Über Uns",
          id: "#about",
        },
        {
          name: "Leistungen",
          id: "#services",
        },
        {
          name: "Team",
          id: "#team",
        },
        {
          name: "Bewertungen",
          id: "#testimonials",
        },
        {
          name: "FAQ",
          id: "#faq",
        },
        {
          name: "Kontakt",
          id: "#contact",
        },
      ]}
      brandName="PMR Praxis Ruß"
      button={{
        text: "Termin Buchen",
        href: "#contact",
      }}
    />
  </div>

  <div id="home" data-section="home">
      <HeroOverlay
      title="Ihre Gesundheit in den besten Händen"
      description="Physiotherapie und Massage: Individuelle Behandlungen für Ihr Wohlbefinden in der Praxis Ruß."
      buttons={[
        {
          text: "Termin vereinbaren",
          href: "#contact",
        },
        {
          text: "Unsere Leistungen",
          href: "#services",
        },
      ]}
      imageSrc="https://img.b2bpic.net/free-photo/young-woman-relaxing-spa-salon_176420-7577.jpg?id=8224720"
      imageAlt="Calming therapy session in a modern clinic"
      showDimOverlay={true}
      showBlur={true}
      textPosition="bottom"
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/traditional-spanish-christmas-sweets-assortment-festive-table_123827-36835.jpg",
          alt: "Serious african man looking",
        },
        {
          src: "http://img.b2bpic.net/free-photo/aerial-view-luxury-tropical-resort-with-red-roofs-phuket_1308-189606.jpg",
          alt: "Close up portrait of beautiful young brunette woman",
        },
        {
          src: "http://img.b2bpic.net/free-photo/close-up-fern-leaf-with-water-droplets-misty-forest_84443-94733.jpg",
          alt: "Satisfied African American woman in grey formal clothes feels happy",
        },
        {
          src: "http://img.b2bpic.net/free-photo/aerial-view-coastal-houses-green-fields-rosemarkie-village_1308-189462.jpg",
          alt: "Pretty mixed race woman with short hair in studio shoot",
        },
        {
          src: "http://img.b2bpic.net/free-photo/front-view-grey-caps-white-surface_140725-14437.jpg",
          alt: "Beautiful woman at a cafe",
        },
      ]}
      avatarText="Über 1000 zufriedene Patienten sprechen für sich."
    />
  </div>

  <div id="about" data-section="about">
      <MetricSplitMediaAbout
      useInvertedBackground={true}
      title="Ihre Experten für Bewegung & Wohlbefinden"
      description="Bei PMR Praxis Ruß verbinden wir langjährige Erfahrung mit modernsten Behandlungsmethoden. Unser Ziel ist es, Ihnen durch individuelle Physiotherapie und gezielte Massagen zu mehr Lebensqualität und Schmerzfreiheit zu verhelfen. Vertrauen Sie auf unser Fachwissen und unsere persönliche Betreuung."
      metrics={[
        {
          value: "15+",
          title: "Jahre Erfahrung",
        },
        {
          value: "1000+",
          title: "Zufriedene Patienten",
        },
        {
          value: "50+",
          title: "Therapiearten",
        },
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/athlete-physiotherapy-appointment-medium-shot_23-2149866130.jpg"
      imageAlt="Physiotherapist consulting with a patient"
      mediaAnimation="slide-up"
      metricsAnimation="blur-reveal"
    />
  </div>

  <div id="features" data-section="features">
      <FeatureCardTwelve
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          id: "physiotherapy",
          label: "Ganzheitlich",
          title: "Physiotherapie",
          items: [
            "Manuelle Therapie",
            "Krankengymnastik",
            "CMD-Behandlung",
            "PNF",
          ],
        },
        {
          id: "massagetherapy",
          label: "Entspannend",
          title: "Massagetherapie",
          items: [
            "Klassische Massage",
            "Bindegewebsmassage",
            "Sportmassage",
            "Faszienbehandlung",
          ],
        },
        {
          id: "lymphatic",
          label: "Entlastend",
          title: "Manuelle Lymphdrainage",
          items: [
            "Ödembehandlung",
            "Kompressionsbandagierung",
            "Narbenbehandlung",
            "Post-operative Pflege",
          ],
        },
      ]}
      title="Unsere Schwerpunkte"
      description="Wir bieten ein breites Spektrum an Behandlungen, die auf Ihre individuellen Bedürfnisse zugeschnitten sind. Jede Therapie beginnt mit einer gründlichen Diagnose und einem persönlichen Gespräch."
    />
  </div>

  <div id="services" data-section="services">
      <ProductCardFour
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={true}
      carouselMode="buttons"
      products={[
        {
          id: "leistung-1",
          name: "Allgemeine Physiotherapie",
          price: "Individuell",
          variant: "Für Bewegung & Schmerzfreiheit",
          imageSrc: "http://img.b2bpic.net/free-photo/patient-doing-physical-rehabilitation-helped-by-therapists_23-2149227810.jpg",
          imageAlt: "Physiotherapist assisting a patient with leg exercises",
        },
        {
          id: "leistung-2",
          name: "Klassische Massagen",
          price: "Ab 30€",
          variant: "Für Entspannung & Regeneration",
          imageSrc: "http://img.b2bpic.net/free-photo/female-patient-undergoing-physical-therapy_23-2148836486.jpg",
          imageAlt: "Hands performing a back massage",
        },
        {
          id: "leistung-3",
          name: "Manuelle Lymphdrainage",
          price: "Individuell",
          variant: "Bei Schwellungen & Ödemen",
          imageSrc: "http://img.b2bpic.net/free-photo/massage-woman-spa-salon_1385-264.jpg",
          imageAlt: "Therapist performing lymphatic drainage on a leg",
        },
        {
          id: "leistung-4",
          name: "Sportphysiotherapie",
          price: "Individuell",
          variant: "Für Athleten & Aktive",
          imageSrc: "http://img.b2bpic.net/free-photo/trainer-helping-man-lifting-dumbbell-gym_1262-16636.jpg",
          imageAlt: "Physiotherapist treating an athlete's knee",
        },
        {
          id: "leistung-5",
          name: "Präventionsprogramme",
          price: "Auf Anfrage",
          variant: "Für langfristige Gesundheit",
          imageSrc: "http://img.b2bpic.net/free-photo/man-office-stretching-work-day_23-2150468567.jpg",
          imageAlt: "Person doing stretches as a preventive measure",
        },
        {
          id: "leistung-6",
          name: "Hausbesuche",
          price: "Zzgl. Anfahrt",
          variant: "Komfortabel bei Ihnen Zuhause",
          imageSrc: "http://img.b2bpic.net/free-photo/senior-man-nursing-home-with-doing-physical-therapy-with-help-from-nurse-using-dumbbells_482257-45265.jpg",
          imageAlt: "Therapist visiting a patient at home",
        },
      ]}
      title="Unsere Leistungen im Überblick"
      description="Entdecken Sie unsere vielfältigen Therapie- und Massageangebote für Ihre individuelle Genesung und Entspannung. Wir finden die passende Behandlung für Sie."
    />
  </div>

  <div id="pricing" data-section="pricing">
      <PricingCardTwo
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      plans={[
        {
          id: "plan-basic",
          badge: "Standard",
          badgeIcon: Sparkles,
          price: "Ab 90€",
          subtitle: "Erstbehandlung & Kurztherapie",
          buttons: [
            {
              text: "Details",
              href: "#contact",
            },
          ],
          features: [
            "30 Min. Behandlung",
            "Diagnose & Anamnese",
            "Individueller Therapieplan",
          ],
        },
        {
          id: "plan-premium",
          badge: "Empfohlen",
          badgeIcon: Award,
          price: "Ab 180€",
          subtitle: "Umfassende Therapie & Regeneration",
          buttons: [
            {
              text: "Buchen",
              href: "#contact",
            },
          ],
          features: [
            "60 Min. Behandlung",
            "Manuelle Techniken",
            "Übungsanleitung für Zuhause",
            "Folgetermine priorisiert",
          ],
        },
        {
          id: "plan-intensive",
          badge: "Intensiv",
          badgeIcon: Zap,
          price: "Auf Anfrage",
          subtitle: "Individueller Langzeitplan",
          buttons: [
            {
              text: "Anfragen",
              href: "#contact",
            },
          ],
          features: [
            "90 Min. Behandlung",
            "Spezialtherapien",
            "Präventionsberatung",
            "Flexible Terminplanung",
          ],
        },
      ]}
      title="Unsere Therapiepakete"
      description="Wählen Sie das passende Paket für Ihre Gesundheit und Ihr Wohlbefinden. Gerne beraten wir Sie persönlich."
    />
  </div>

  <div id="team" data-section="team">
      <TeamCardOne
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="four-items-2x2-equal-grid"
      useInvertedBackground={true}
      members={[
        {
          id: "member-1",
          name: "Herr Ruß",
          role: "Inhaber & Physiotherapeut",
          imageSrc: "http://img.b2bpic.net/free-photo/smiley-senior-man-working-his-laptop_23-2148404379.jpg",
          imageAlt: "Portrait of Herr Ruß, Inhaber & Physiotherapeut",
        },
        {
          id: "member-2",
          name: "Frau Müller",
          role: "Physiotherapeutin",
          imageSrc: "http://img.b2bpic.net/free-photo/doctor-helping-patient-rehabilitation_23-2150321564.jpg",
          imageAlt: "Portrait of Frau Müller, Physiotherapeutin",
        },
        {
          id: "member-3",
          name: "Herr Schmidt",
          role: "Masseur & Sporttherapeut",
          imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-man-gym_23-2150007196.jpg",
          imageAlt: "Portrait of Herr Schmidt, Masseur & Sporttherapeut",
        },
        {
          id: "member-4",
          name: "Frau Meier",
          role: "Rezeption & Assistenz",
          imageSrc: "http://img.b2bpic.net/free-photo/cheerful-lightskinned-adult-brunette-lady-glasses-shirt-looks-camera-while-standing-office-cubicle-confidence-your-work-concept_197531-31288.jpg",
          imageAlt: "Portrait of Frau Meier, Rezeption & Assistenz",
        },
      ]}
      title="Unser engagiertes Team"
      description="Lernen Sie die qualifizierten Therapeuten kennen, die sich mit Leidenschaft um Ihre Gesundheit kümmern. Bei uns sind Sie in besten Händen."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFifteen
      useInvertedBackground={false}
      testimonial="Die Behandlungen bei PMR Praxis Ruß haben meine Erwartungen übertroffen. Meine Schmerzen sind deutlich weniger geworden, und ich fühle mich wieder viel fitter. Das Team ist äußerst kompetent und freundlich. Absolut empfehlenswert!"
      rating={5}
      author="Anna K."
      avatars={[
        {
          src: "http://img.b2bpic.net/free-photo/close-up-portrait-smiling-african-man-looking_171337-9852.jpg",
          alt: "Anna K. Testimonial Avatar",
        },
        {
          src: "http://img.b2bpic.net/free-photo/portrait-young-adult-woman-works-her-tablet-sits-with-notebook-kitchen-floor-home-studie_1258-183235.jpg",
          alt: "Max P. Testimonial Avatar",
        },
        {
          src: "http://img.b2bpic.net/free-photo/front-view-smiley-nurse_23-2148501062.jpg",
          alt: "Sabine L. Testimonial Avatar",
        },
        {
          src: "http://img.b2bpic.net/free-photo/successful-expert_1098-14503.jpg",
          alt: "Tom H. Testimonial Avatar",
        },
        {
          src: "http://img.b2bpic.net/free-photo/smiling-brunette-woman-standing-outside_23-2147654969.jpg",
          alt: "Petra G. Testimonial Avatar",
        },
      ]}
      ratingAnimation="blur-reveal"
      avatarsAnimation="slide-up"
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqBase
      textboxLayout="default"
      useInvertedBackground={true}
      faqs={[
        {
          id: "faq-1",
          title: "Wie vereinbare ich einen Termin?",
          content: "Sie können einen Termin telefonisch unter [Telefonnummer] oder direkt über unser Kontaktformular auf dieser Seite vereinbaren. Wir melden uns schnellstmöglich bei Ihnen.",
        },
        {
          id: "faq-2",
          title: "Werden die Kosten von meiner Krankenkasse übernommen?",
          content: "Ja, Physiotherapie und Krankengymnastik werden in der Regel von gesetzlichen und privaten Krankenkassen übernommen, sofern eine ärztliche Verordnung vorliegt. Bei Massagen kann es Unterschiede geben. Bitte klären Sie dies vorab mit Ihrer Krankenkasse.",
        },
        {
          id: "faq-3",
          title: "Was muss ich zum ersten Termin mitbringen?",
          content: "Bitte bringen Sie Ihre ärztliche Verordnung (falls vorhanden), Ihre Versichertenkarte, bequeme Kleidung und eventuell vorhandene relevante medizinische Unterlagen (z.B. Röntgenbilder, Befunde) mit.",
        },
        {
          id: "faq-4",
          title: "Wie lange dauert eine Behandlungseinheit?",
          content: "Eine reguläre Behandlungseinheit dauert in der Regel 30 bis 60 Minuten, je nach Verordnung und individuellem Therapieplan. Dies wird beim ersten Termin besprochen.",
        },
        {
          id: "faq-5",
          title: "Kann ich Termine verschieben oder absagen?",
          content: "Termine können bis zu 24 Stunden vorher kostenfrei verschoben oder abgesagt werden. Bei kurzfristigeren Absagen oder Nichterscheinen behalten wir uns vor, die Kosten der Behandlung in Rechnung zu stellen.",
        },
      ]}
      title="Häufig gestellte Fragen"
      description="Hier finden Sie Antworten auf die gängigsten Fragen rund um unsere Behandlungen, Termine und Kosten. Sollten Sie weitere Fragen haben, kontaktieren Sie uns gerne direkt."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactCenter
      useInvertedBackground={false}
      background={{
        variant: "radial-gradient",
      }}
      tag="Kontakt"
      title="Kontaktieren Sie uns für Ihren Termin"
      description="Wir freuen uns darauf, Sie in unserer Praxis begrüßen zu dürfen. Vereinbaren Sie noch heute einen Termin für Ihre individuelle Behandlung und erleben Sie den Unterschied."
      inputPlaceholder="Ihre E-Mail-Adresse"
      buttonText="Termin anfragen"
      termsText="Mit dem Absenden erklären Sie sich mit unserer Datenschutzerklärung einverstanden."
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterCard
      logoText="PMR Praxis Ruß"
      copyrightText="© 2024 PMR Praxis Ruß. Alle Rechte vorbehalten."
      socialLinks={[
        {
          icon: Facebook,
          href: "#",
          ariaLabel: "Facebook link",
        },
        {
          icon: Instagram,
          href: "#",
          ariaLabel: "Instagram link",
        },
      ]}
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
