"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FaqBase from '@/components/sections/faq/FaqBase';
import FeatureCardTen from '@/components/sections/feature/FeatureCardTen';
import FooterBase from '@/components/sections/footer/FooterBase';
import HeroBillboardScroll from '@/components/sections/hero/HeroBillboardScroll';
import MediaAbout from '@/components/sections/about/MediaAbout';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import ProductCardThree from '@/components/sections/product/ProductCardThree';
import TestimonialCardFive from '@/components/sections/testimonial/TestimonialCardFive';
import { CheckCircle } from "lucide-react";

export default function LandingPage() {
  return (
    <ThemeProvider
        defaultButtonVariant="expand-hover"
        defaultTextAnimation="reveal-blur"
        borderRadius="pill"
        contentWidth="compact"
        sizing="mediumLarge"
        background="aurora"
        cardStyle="soft-shadow"
        primaryButtonStyle="diagonal-gradient"
        secondaryButtonStyle="radial-glow"
        headingFontWeight="bold"
    >
      <ReactLenis root>
  <div id="nav" data-section="nav">
      <NavbarLayoutFloatingOverlay
      navItems={[
        {
          name: "Hem",          id: "#hero"},
        {
          name: "Om Oss",          id: "#about"},
        {
          name: "Tjänster",          id: "#services"},
        {
          name: "Portfolio",          id: "#projects"},
        {
          name: "Kontakt",          id: "#contact"},
      ]}
      brandName="Skiljebo Bygg"
    />
  </div>

  <div id="hero" data-section="hero">
      <HeroBillboardScroll
      background={{
        variant: "plain"}}
      title="Kvalitativa byggtjänster i Västerås"
      description="Vi förverkligar dina byggdrömmar med noggrannhet, erfarenhet och passion för hantverket. Skiljebo Bygg levererar lösningar för både privatpersoner och företag."
      buttons={[
        {
          text: "Boka konsultation",          href: "#contact"},
      ]}
      imageSrc="http://img.b2bpic.net/free-photo/new-contemporary-buildings-site_23-2147694752.jpg?_wi=1"
      imageAlt="Skiljebo Bygg professionellt hantverk"
    />
  </div>

  <div id="about" data-section="about">
      <MediaAbout
      useInvertedBackground={false}
      title="Erfarenhet och hantverk"
      description="Skiljebo Bygg har lång erfarenhet av allt från mindre renoveringar till större nybyggnadsprojekt. Vi lägger stor vikt vid dialog och att hålla tidsplaner så att du som kund alltid känner dig trygg genom hela processen."
      imageSrc="http://img.b2bpic.net/free-photo/hardhat_93675-132309.jpg?_wi=1"
      imageAlt="Om Skiljebo Bygg"
    />
  </div>

  <div id="services" data-section="services">
      <FeatureCardTen
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      features={[
        {
          title: "Nybyggnation",          description: "Från grund till nyckelfärdigt hus med fokus på hållbarhet.",          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/new-contemporary-buildings-site_23-2147694752.jpg?_wi=2",            imageAlt: "new home construction framework"},
          items: [
            {
              icon: CheckCircle,
              text: "Projektledning"},
            {
              icon: CheckCircle,
              text: "Kvalitetsgaranti"},
          ],
          reverse: false,
        },
        {
          title: "Renovering",          description: "Vi uppgraderar ditt hem med moderna materialval.",          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/hardhat_93675-132309.jpg?_wi=2",            imageAlt: "new home construction framework"},
          items: [
            {
              icon: CheckCircle,
              text: "Kök & Bad"},
            {
              icon: CheckCircle,
              text: "Totalrenovering"},
          ],
          reverse: true,
        },
        {
          title: "Snickeri & Underhåll",          description: "Små och stora projekt för husets fasad och interiör.",          media: {
            imageSrc: "http://img.b2bpic.net/free-photo/strong-young-sports-woman-standing-outdoors_171337-13220.jpg?_wi=1",            imageAlt: "new home construction framework"},
          items: [
            {
              icon: CheckCircle,
              text: "Fasadbyte"},
            {
              icon: CheckCircle,
              text: "Fönsterbyte"},
          ],
          reverse: false,
        },
      ]}
      title="Våra tjänster"
      description="Vi erbjuder ett komplett utbud av bygg- och renoveringstjänster med högsta fokus på kvalitet."
    />
  </div>

  <div id="projects" data-section="projects">
      <ProductCardThree
      animationType="slide-up"
      textboxLayout="default"
      gridVariant="three-columns-all-equal-width"
      useInvertedBackground={false}
      products={[
        {
          id: "p1",          name: "Villa Renovering",          price: "Se referens",          imageSrc: "http://img.b2bpic.net/free-photo/strong-young-sports-woman-standing-outdoors_171337-13220.jpg?_wi=2"},
        {
          id: "p2",          name: "Nytt Takprojekt",          price: "Se referens",          imageSrc: "http://img.b2bpic.net/free-photo/high-angle-house-project-table_23-2148346293.jpg"},
        {
          id: "p3",          name: "Terrassbygge",          price: "Se referens",          imageSrc: "http://img.b2bpic.net/free-photo/photorealistic-timber-house-interior-with-wooden-decor-furnishings_23-2151263617.jpg"},
        {
          id: "p4",          name: "Kök & Interiör",          price: "Se referens",          imageSrc: "http://img.b2bpic.net/free-photo/scene-construction-site-with-equipment_23-2151317260.jpg"},
        {
          id: "p5",          name: "Fasad & Fönster",          price: "Se referens",          imageSrc: "http://img.b2bpic.net/free-photo/woman-enjoying-her-exterior-hobbies_23-2149367017.jpg"},
        {
          id: "p6",          name: "Tillbyggnad",          price: "Se referens",          imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-working-with-roller_52683-100074.jpg"},
      ]}
      title="Utvalda projekt"
      description="Se ett axplock av vad vi har utfört i Västerås-området."
    />
  </div>

  <div id="testimonials" data-section="testimonials">
      <TestimonialCardFive
      textboxLayout="default"
      useInvertedBackground={false}
      testimonials={[
        {
          id: "1",          name: "Erik Johansson",          date: "2024-02-12",          title: "Villaägare",          quote: "Skiljebo Bygg levererade över förväntan. Punktliga och mycket kunniga.",          tag: "Renovering",          avatarSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-home-with-heater_23-2149339547.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/close-up-smiley-woman-posing-outside_23-2148618889.jpg"},
        {
          id: "2",          name: "Maria Lind",          date: "2024-01-15",          title: "Fastighetsägare",          quote: "Tydlig kommunikation och proffsigt bemötande från start till mål.",          tag: "Totalrenovering",          avatarSrc: "http://img.b2bpic.net/free-photo/builder-showing-blueprint-colleague_23-2147711060.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/young-cute-couple-repairs-room_1157-25122.jpg"},
        {
          id: "3",          name: "Anders Nilsson",          date: "2023-11-20",          title: "Husbyggare",          quote: "Mycket nöjda med vår nybyggnation. Håller hög kvalitet i varje detalj.",          tag: "Nybyggnation",          avatarSrc: "http://img.b2bpic.net/free-photo/cheerful-man-with-blue-house-hands_23-2147694208.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-woman-with-equipment_23-2149366625.jpg"},
        {
          id: "4",          name: "Sara Berg",          date: "2023-09-05",          title: "Villaägare",          quote: "Rekommenderar varmt. Snabba, effektiva och noggranna hantverkare.",          tag: "Fasad",          avatarSrc: "http://img.b2bpic.net/free-photo/vertical-shot-young-musician-woman-learns-how-play-ukulele-sits-sofa-with-crossed-legs_1258-204931.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/front-view-woman-celebrating-birthday-together_23-2150598991.jpg"},
        {
          id: "5",          name: "Johan Olofsson",          date: "2023-07-30",          title: "Fastighetsägare",          quote: "Stort tack för hjälpen med vår utbyggnad. Resultatet är fantastiskt.",          tag: "Tillbyggnad",          avatarSrc: "http://img.b2bpic.net/free-photo/medium-shot-smiley-man-showing-approval_23-2148269355.jpg",          imageSrc: "http://img.b2bpic.net/free-photo/family-moving-new-home_23-2149162246.jpg"},
      ]}
      title="Kundreferenser"
      description="Vad våra kunder säger om oss."
    />
  </div>

  <div id="faq" data-section="faq">
      <FaqBase
      textboxLayout="default"
      useInvertedBackground={false}
      faqs={[
        {
          id: "f1",          title: "Kan jag använda ROT-avdrag?",          content: "Ja, vi hjälper till med ROT-avdrag för våra privatkunder."},
        {
          id: "f2",          title: "Hur lång tid tar en renovering?",          content: "Det varierar beroende på projektets omfattning, men vi ger en realistisk tidsplan."},
        {
          id: "f3",          title: "Är ni försäkrade?",          content: "Självklart, vi har fullständiga försäkringar och certifieringar."},
      ]}
      title="Vanliga frågor"
      description="Här hittar du svar på de vanligaste funderingarna kring våra tjänster."
      faqsAnimation="slide-up"
    />
  </div>

  <div id="metrics" data-section="metrics">
      <MetricCardSeven
      animationType="slide-up"
      textboxLayout="default"
      useInvertedBackground={false}
      metrics={[
        {
          id: "m1",          value: "15+",          title: "År i branschen",          items: [
            "Erfarenhet",            "Trygghet"],
        },
        {
          id: "m2",          value: "200+",          title: "Slutförda projekt",          items: [
            "Varierad erfarenhet",            "Nöjda kunder"],
        },
        {
          id: "m3",          value: "98%",          title: "Nöjda kunder",          items: [
            "Hög kvalitet",            "Service"],
        },
      ]}
      title="Kvalitet i siffror"
      description="Vi är stolta över vårt arbete i Västerås."
    />
  </div>

  <div id="contact" data-section="contact">
      <ContactSplitForm
      useInvertedBackground={false}
      title="Kontakta oss"
      description="Hör av dig för en kostnadsfri konsultation eller offert. Vi ser fram emot att höra om ditt nästa byggprojekt."
      inputs={[
        {
          name: "name",          type: "text",          placeholder: "Ditt namn",          required: true,
        },
        {
          name: "email",          type: "email",          placeholder: "Din e-postadress",          required: true,
        },
      ]}
      textarea={{
        name: "message",        placeholder: "Beskriv ditt projekt...",        rows: 4,
      }}
      imageSrc="http://img.b2bpic.net/free-photo/low-angle-business-meeting_23-2148480350.jpg"
    />
  </div>

  <div id="footer" data-section="footer">
      <FooterBase
      columns={[
        {
          title: "Sidor",          items: [
            {
              label: "Hem",              href: "#hero"},
            {
              label: "Om Oss",              href: "#about"},
            {
              label: "Kontakt",              href: "#contact"},
          ],
        },
        {
          title: "Tjänster",          items: [
            {
              label: "Nybyggnation",              href: "#services"},
            {
              label: "Renovering",              href: "#services"},
          ],
        },
        {
          title: "Företagsinfo",          items: [
            {
              label: "Integritetspolicy",              href: "#"},
            {
              label: "Villkor",              href: "#"},
          ],
        },
      ]}
      logoText="Skiljebo Bygg"
    />
  </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
