"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import MetricCardSeven from '@/components/sections/metrics/MetricCardSeven';
import FooterBaseReveal from '@/components/sections/footer/FooterBaseReveal';
import { TrendingUp, Star } from "lucide-react";
import Link from "next/link";

export default function AboutPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="background-highlight"
      borderRadius="soft"
      contentWidth="compact"
      sizing="largeSizeMediumTitles"
      background="circleGradient"
      cardStyle="subtle-shadow"
      primaryButtonStyle="flat"
      secondaryButtonStyle="layered"
      headingFontWeight="extrabold"
    >
      <div id="nav" data-section="nav">
        <NavbarLayoutFloatingOverlay
          brandName="Serenity Hotels"
          navItems={[
            { name: "Home", id: "/" },
            { name: "About", id: "/about" },
            { name: "Contact", id: "/contact" }
          ]}
          button={{
            text: "Book Now",            href: "https://booking.serenityhotels.com"
          }}
        />
        <div style={{ display: "none" }}>
          <Link href="/">Home</Link>
          <Link href="/about">About</Link>
          <Link href="/contact">Contact</Link>
        </div>
      </div>

      <div id="about" data-section="about">
        <TextSplitAbout
          title="About Serenity Hotels"
          description={[
            "For over 25 years, Serenity Hotels has been synonymous with exceptional hospitality and world-class service. Our commitment to excellence has earned us recognition as one of the finest luxury hotel chains globally.",            "Every detail is carefully curated to ensure your stay is nothing short of extraordinary. From our attentive staff to our pristine accommodations, we strive to exceed your expectations and create lasting memories.",            "Our hotels are designed to be sanctuaries of comfort, combining timeless elegance with modern conveniences. Whether you're traveling for business or leisure, we're dedicated to providing an unforgettable experience."
          ]}
          useInvertedBackground="noInvert"
          showBorder={true}
          buttons={[
            {
              text: "Learn More",              href: "/"
            }
          ]}
        />
      </div>

      <div id="metrics-heritage" data-section="metrics-heritage">
        <MetricCardSeven
          title="Our Legacy"
          description="The numbers behind our prestigious reputation and unwavering commitment to hospitality excellence."
          tag="Heritage"
          tagIcon={Star}
          textboxLayout="default"
          useInvertedBackground="invertDefault"
          animationType="slide-up"
          metrics={[
            {
              id: "1",              value: "1998",              title: "Founded with Vision",              items: [
                "Started as a boutique hotel",                "Family-owned hospitality dream",                "Focus on personal service"
              ]
            },
            {
              id: "2",              value: "2M+",              title: "Guests Welcomed",              items: [
                "From 195 countries",                "Creating memories since day one",                "Building lifelong relationships"
              ]
            },
            {
              id: "3",              value: "150+",              title: "Awards Received",              items: [
                "International hospitality recognition",                "Sustainability leadership",                "Service excellence honors"
              ]
            }
          ]}
        />
      </div>

      <div id="values" data-section="values">
        <TextSplitAbout
          title="Our Values"
          description={[
            "Excellence is not just a goal—it's our standard. We believe that luxury is defined by the thoughtful details, genuine care, and personalized experiences that make each guest feel truly valued.",            "Sustainability guides our operations. We're committed to preserving the beautiful destinations where we operate while creating positive impacts for local communities and the environment."
          ]}
          useInvertedBackground="noInvert"
          showBorder={false}
        />
      </div>

      <FooterBaseReveal
        copyrightText="© 2025 Serenity Hotels. All rights reserved. | Luxury Hospitality"
        columns={[
          {
            title: "About",            items: [
              { label: "Our Story", href: "/about" },
              { label: "Careers", href: "https://careers.serenityhotels.com" },
              { label: "Sustainability", href: "https://sustainability.serenityhotels.com" },
              { label: "Press", href: "https://press.serenityhotels.com" }
            ]
          },
          {
            title: "Services",            items: [
              { label: "Rooms & Suites", href: "/" },
              { label: "Amenities", href: "/" },
              { label: "Events & Weddings", href: "https://events.serenityhotels.com" },
              { label: "Loyalty Program", href: "https://loyalty.serenityhotels.com" }
            ]
          },
          {
            title: "Contact",            items: [
              { label: "Book Now", href: "https://booking.serenityhotels.com" },
              { label: "Contact Us", href: "/contact" },
              { label: "Gift Certificates", href: "https://gifts.serenityhotels.com" },
              { label: "Feedback", href: "https://feedback.serenityhotels.com" }
            ]
          }
        ]}
      />
    </ThemeProvider>
  );
}