"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleMinimal from '@/components/navbar/NavbarStyleMinimal';
import MetricSplitMediaAbout from '@/components/sections/about/MetricSplitMediaAbout';
import TeamCardFive from '@/components/sections/team/TeamCardFive';
import TestimonialCardThirteen from '@/components/sections/testimonial/TestimonialCardThirteen';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import Link from "next/link";

export default function AboutPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="icon-arrow"
      defaultTextAnimation="reveal-blur"
      borderRadius="soft"
      contentWidth="small"
      sizing="largeSizeMediumTitles"
      background="aurora"
      cardStyle="subtle-shadow"
      primaryButtonStyle="inset-glow"
      secondaryButtonStyle="solid"
      headingFontWeight="normal"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleMinimal
          brandName="Luxe Haven"
          button={{
            text: "Book Now",            href: "/contact"
          }}
        />
        <div style={{ position: 'absolute', top: 0, left: 0, padding: '10px', display: 'flex', gap: '15px', zIndex: 1000 }}>
          <Link href="/">Home</Link>
          <Link href="/about">About</Link>
          <Link href="/rooms">Rooms</Link>
          <Link href="/amenities">Amenities</Link>
          <Link href="/contact">Contact</Link>
        </div>
      </div>

      <div id="about" data-section="about">
        <MetricSplitMediaAbout
          tag="Our Story"
          title="Two Decades of Hospitality Excellence"
          description="Founded in 1999, Luxe Haven began as a vision to redefine luxury hospitality. From our humble beginnings with a single boutique property, we have grown into a renowned destination that sets the standard for premium accommodations. Our commitment to excellence, attention to detail, and genuine care for our guests has earned us numerous awards and, more importantly, the loyalty of travelers from around the world."
          metrics={[
            {
              value: "25+",              title: "Years of Excellence"
            },
            {
              value: "4.9★",              title: "Guest Rating"
            }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/panoramic-sauna-view-organic-wooden-columns-resort-style-wellness_169016-68883.jpg"
          imageAlt="Luxurious hotel lobby with modern design"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="team" data-section="team">
        <TeamCardFive
          title="Meet Our Leadership Team"
          description="The passionate professionals who bring our vision to life every day"
          team={[
            {
              id: "1",              name: "Victoria Chen",              role: "General Manager",              imageSrc: "https://img.b2bpic.net/free-photo/medium-shot-woman-working-luxury-restaurant_23-2150598405.jpg"
            },
            {
              id: "2",              name: "Marco Rossi",              role: "Executive Chef",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-successful-female-cafe-owner-smiling_1262-5377.jpg"
            },
            {
              id: "3",              name: "Elena Rodriguez",              role: "Concierge Manager",              imageSrc: "https://img.b2bpic.net/free-photo/wedding-planner_1098-18025.jpg"
            },
            {
              id: "4",              name: "James Morrison",              role: "Director of Housekeeping",              imageSrc: "https://img.b2bpic.net/free-photo/portrait-beautiful-young-woman-with-folded-arms_23-2147876782.jpg"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardThirteen
          title="What Our Guests Say About Our Team"
          description="Hear about the exceptional service that defines the Luxe Haven experience"
          testimonials={[
            {
              id: "1",              name: "Sarah Johnson",              handle: "@sarah_travels",              testimonial: "The staff at Luxe Haven went above and beyond. Victoria personally ensured our anniversary celebration was perfect. Truly exceptional service!",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/smiling-businessman-holding-boarding-pass-checking-his-mobile-phone_107420-95787.jpg"
            },
            {
              id: "2",              name: "Michael Chen",              handle: "@biz_traveler_mc",              testimonial: "Chef Marco's culinary creations were extraordinary. The tasting menu was a journey of flavors I'll never forget.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/business-people-standing-with-luggage-bag-airport_107420-95865.jpg"
            },
            {
              id: "3",              name: "Emma Watson",              handle: "@emmadventures",              testimonial: "Elena arranged the most incredible city tour and dinner reservations. Her local knowledge and attention to detail were amazing.",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/businessman-standing-with-luggage-waiting-area-airport_107420-95857.jpg"
            }
          ]}
          showRating={true}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground="noInvert"
        />
      </div>

      <FooterLogoEmphasis
        logoText="Luxe Haven"
        columns={[
          {
            items: [
              { label: "About", href: "/about" },
              { label: "Rooms", href: "/rooms" },
              { label: "Amenities", href: "/amenities" }
            ]
          },
          {
            items: [
              { label: "Team", href: "/team" },
              { label: "Guest Reviews", href: "/testimonials" },
              { label: "FAQ", href: "/faq" }
            ]
          },
          {
            items: [
              { label: "Contact Us", href: "/contact" },
              { label: "Privacy Policy", href: "#" },
              { label: "Terms & Conditions", href: "#" }
            ]
          }
        ]}
      />
    </ThemeProvider>
  );
}