"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import MediaAbout from '@/components/sections/about/MediaAbout';
import TestimonialCardFifteen from '@/components/sections/testimonial/TestimonialCardFifteen';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';

export default function AboutPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="small"
      sizing="largeSmallSizeLargeTitles"
      background="floatingGradient"
      cardStyle="gradient-mesh"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="layered"
      headingFontWeight="medium"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleApple
          brandName="Luxury Hotel"
          navItems={[
            { name: "Rooms", id: "/rooms" },
            { name: "Amenities", id: "/amenities" },
            { name: "About", id: "/about" },
            { name: "Contact", id: "/contact" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <MediaAbout
          title="Welcome to Your Sanctuary"
          description="Nestled in breathtaking surroundings, our hotel offers an unparalleled retreat for discerning travelers. With over 20 years of hospitality excellence, we pride ourselves on creating unforgettable memories through impeccable service and world-class facilities."
          tag="Award-Winning Hospitality"
          imageSrc="https://img.b2bpic.net/free-photo/side-view-woman-looking-out-window_23-2149622868.jpg"
          imageAlt="Elegant hotel lobby"
          useInvertedBackground="noInvert"
          buttons={[
            { text: "Learn Our Story", href: "/contact" }
          ]}
        />
      </div>

      <div id="heritage" data-section="heritage">
        <MediaAbout
          title="Two Decades of Excellence"
          description="Since our founding, we have been dedicated to redefining luxury hospitality. Our commitment to exceptional service, sustainable practices, and creating meaningful connections with our guests has earned us numerous international awards and recognition as a leader in luxury travel."
          tag="Our Heritage"
          imageSrc="https://img.b2bpic.net/free-photo/gourmet-meal-served-with-wine_23-2148516896.jpg"
          imageAlt="Fine dining experience"
          useInvertedBackground="invertDefault"
          buttons={[
            { text: "View Awards", href: "https://example.com/awards" }
          ]}
        />
      </div>

      <div id="guest-testimonial" data-section="guest-testimonial">
        <TestimonialCardFifteen
          testimonial="This hotel represents the pinnacle of luxury hospitality. Every detail, from the exquisite design to the personalized service, creates an experience that goes far beyond expectations. It's not just a stay—it's a journey of discovery and indulgence."
          rating={5}
          author="James Wellington, Luxury Travel Critic"
          avatars={[
            { src: "https://img.b2bpic.net/free-photo/close-up-portrait-young-handsome-successful-man_1163-5475.jpg", alt: "James Wellington" },
            { src: "https://img.b2bpic.net/free-photo/happy-businessman-smiling-camera_1163-4660.jpg", alt: "Michael Johnson" },
            { src: "https://img.b2bpic.net/free-photo/smiling-homosexual-man-official-suit-looking-camera-close-up-shot-happy-gay-getting-dressed-wedding-ceremony-standing-hotel-room-with-his-partner-background-love-emotion-concept_74855-22675.jpg", alt: "Emily Chen" },
            { src: "https://img.b2bpic.net/free-photo/portrait-smiley-business-woman_23-2148603029.jpg", alt: "David Williams" },
            { src: "https://img.b2bpic.net/free-photo/young-businesswoman-portrait-office_1262-1506.jpg", alt: "Jessica Brown" },
            { src: "https://img.b2bpic.net/free-photo/pensive-person-alone-corridor-serious_1262-1042.jpg", alt: "Anna Martinez" }
          ]}
          useInvertedBackground="noInvert"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterLogoEmphasis
          logoText="Luxury Hotel"
          columns={[
            {
              items: [
                { label: "Rooms", href: "/rooms" },
                { label: "Amenities", href: "/amenities" },
                { label: "About", href: "/about" }
              ]
            },
            {
              items: [
                { label: "Contact", href: "/contact" },
                { label: "Careers", href: "https://example.com/careers" },
                { label: "Press", href: "https://example.com/press" }
              ]
            },
            {
              items: [
                { label: "Privacy Policy", href: "https://example.com/privacy" },
                { label: "Terms of Service", href: "https://example.com/terms" },
                { label: "Cookie Settings", href: "https://example.com/cookies" }
              ]
            },
            {
              items: [
                { label: "Facebook", href: "https://facebook.com" },
                { label: "Instagram", href: "https://instagram.com" },
                { label: "Twitter", href: "https://twitter.com" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}