"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroBillboard from '@/components/sections/hero/HeroBillboard';
import TextSplitAbout from '@/components/sections/about/TextSplitAbout';
import FeatureCardEight from '@/components/sections/feature/FeatureCardEight';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import MetricCardFourteen from '@/components/sections/metrics/MetricCardFourteen';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterSimple from '@/components/sections/footer/FooterSimple';
import { ChefHat, Sparkles, Utensils } from 'lucide-react';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="shift-hover"
      defaultTextAnimation="reveal-blur"
      borderRadius="pill"
      contentWidth="compact"
      sizing="largeSizeMediumTitles"
      background="circleGradient"
      cardStyle="gradient-bordered"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="radial-glow"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="The Pony"
          navItems={[
            { name: "About", id: "about" },
            { name: "Menu", id: "features" },
            { name: "Specials", id: "specials" },
            { name: "Happy Hour", id: "happy-hour" },
            { name: "Contact", id: "contact" },
          ]}
          button={{ text: "Reserve", href: "contact" }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboard
          title="Welcome to The Pony Grill and Bar"
          description="Classic American comfort food, craft beer, and a lively local atmosphere. Where great food, cold drinks, and good company come together in downtown Sheridan."
          background={{ variant: "circleGradient" }}
          tag="Since Sheridan"
          tagIcon={Utensils}
          tagAnimation="reveal-blur"
          buttons={[
            { text: "View Menu", href: "features" },
            { text: "Call Ahead", href: "contact" },
          ]}
          buttonAnimation="reveal-blur"
          imageSrc="http://img.b2bpic.net/free-photo/grilling-process-preparing-meat-cutlets-burgers-cheeseburger-cutlet_1321-4392.jpg"
          imageAlt="The Pony Grill and Bar signature grilled food"
          mediaAnimation="reveal-blur"
          ariaLabel="The Pony Grill and Bar hero section"
        />
      </div>

      <div id="about" data-section="about">
        <TextSplitAbout
          title="A Sheridan Favorite"
          description={[
            "The Pony Grill and Bar has been a gathering place for locals and visitors alike, offering authentic American comfort food prepared fresh on our grill. Located at 3 South Gould in downtown Sheridan, we pride ourselves on creating a relaxed, welcoming atmosphere where everyone feels at home.",            "From classic burgers and steaks to our rotating weekly specials, every dish is made with care. Our selection of 14 beers on tap—featuring microbrews and imports—ensures there's something for every palate. We welcome walk-ins and call-ahead for groups of 10 or more.",            "Whether you're stopping by for lunch, dinner, or happy hour, The Pony is your spot for great food, cold drinks, and authentic Sheridan hospitality."]}
          buttons={[{ text: "Make a Reservation", href: "contact" }]}
          buttonAnimation="reveal-blur"
          useInvertedBackground={false}
          showBorder={true}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardEight
          title="Our Menu"
          description="Discover what makes The Pony special—fresh, flavorful American grill favorites."
          tag="What We Offer"
          tagIcon={ChefHat}
          tagAnimation="reveal-blur"
          textboxLayout="default"
          useInvertedBackground={false}
          features={[
            {
              id: 1,
              title: "Burgers & Sandwiches",              description: "Signature burgers made fresh daily, complemented by classic sandwiches and hand-cut fries.",              imageSrc: "http://img.b2bpic.net/free-photo/meat-burger-bread-bun-cut-into-two-pieces_114579-3302.jpg",              imageAlt: "Gourmet burgers and sandwiches"},
            {
              id: 2,
              title: "Steaks & Grill Items",              description: "Premium cuts grilled to perfection, served with your choice of sides and fresh vegetables.",              imageSrc: "http://img.b2bpic.net/free-photo/well-done-steak-with-homemade-fried-potatoes-sauces_140725-2239.jpg",              imageAlt: "Perfectly grilled steaks"},
            {
              id: 3,
              title: "Soups, Salads & Sides",              description: "Hearty soups, fresh salads, and satisfying sides to complement any entrée.",              imageSrc: "http://img.b2bpic.net/free-photo/side-view-vegan-salad-with-fresh-ingredients-plate-black-cutting-board_179666-47259.jpg",              imageAlt: "Fresh salads and sides"},
            {
              id: 4,
              title: "Craft Beer Selection",              description: "14 beers on tap plus microbrews and imports. Find your favorite or ask our staff for recommendations.",              imageSrc: "http://img.b2bpic.net/free-photo/close-up-bartender-pouring-beer_171337-13762.jpg",              imageAlt: "Selection of craft beers on tap"},
          ]}
        />
      </div>

      <div id="specials" data-section="specials">
        <ProductCardFour
          title="Weekly Specials"
          description="Check back regularly for rotating dishes that showcase our chef's creativity and seasonal flavors."
          tag="Rotating Menu"
          tagIcon={Sparkles}
          tagAnimation="reveal-blur"
          textboxLayout="default"
          useInvertedBackground={false}
          products={[
            {
              id: "1",              name: "Western Flank Steak Salad",              price: "Market Price",              variant: "Fresh seasonal greens",              imageSrc: "http://img.b2bpic.net/free-photo/grilled-chicken-leg-served-apricot-with-white-thai-rice_140725-1555.jpg?_wi=1",              imageAlt: "Western Flank Steak Salad"},
            {
              id: "2",              name: "Guinness Steak Tips",              price: "Market Price",              variant: "Tender, slow-braised",              imageSrc: "http://img.b2bpic.net/free-photo/grilled-chicken-leg-served-apricot-with-white-thai-rice_140725-1555.jpg?_wi=2",              imageAlt: "Guinness Steak Tips"},
            {
              id: "3",              name: "Garlic Pepper Shrimp Alfredo",              price: "Market Price",              variant: "Creamy perfection",              imageSrc: "http://img.b2bpic.net/free-photo/grilled-chicken-leg-served-apricot-with-white-thai-rice_140725-1555.jpg?_wi=3",              imageAlt: "Garlic Pepper Shrimp Alfredo"},
          ]}
          gridVariant="uniform-all-items-equal"
          animationType="reveal-blur"
        />
      </div>

      <div id="happy-hour" data-section="happy-hour">
        <MetricCardFourteen
          title="Join us for happy hour Monday through Thursday, 7–9 PM. Enjoy wings and draft beer specials while unwinding with friends and colleagues."
          tag="Happy Hour"
          tagAnimation="reveal-blur"
          metrics={[
            {
              id: "1",              value: "7–9 PM",              description: "Monday through Thursday. Perfect time to grab wings and discounted draft beer."},
            {
              id: "2",              value: "Wings & Beer",              description: "Our signature happy hour special. Great appetizers paired with cold, refreshing drafts."},
            {
              id: "3",              value: "Local Spot",              description: "Relax, connect, and enjoy The Pony with friends, coworkers, and neighbors."},
          ]}
          metricsAnimation="reveal-blur"
          useInvertedBackground={false}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="Get in Touch"
          description="Call ahead for large groups, make a reservation, or reach out with questions. We're always happy to hear from you. Located at 3 South Gould, Sheridan, WY 82801."
          inputs={[
            { name: "name", type: "text", placeholder: "Your Name", required: true },
            { name: "phone", type: "tel", placeholder: "Phone Number", required: true },
            { name: "email", type: "email", placeholder: "Email Address", required: false },
          ]}
          textarea={{
            name: "message",            placeholder: "Tell us about your party size or any special requests...",            rows: 4,
            required: false,
          }}
          useInvertedBackground={false}
          imageSrc="http://img.b2bpic.net/free-photo/vertical-shot-table-with-elegant-setting-restaurant-evening_181624-24647.jpg"
          imageAlt="The Pony Grill and Bar interior"
          mediaAnimation="reveal-blur"
          mediaPosition="right"
          buttonText="Send Message"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterSimple
          columns={[
            {
              title: "Hours",              items: [
                { label: "Mon–Thu: 11 AM – 9 PM", href: "#" },
                { label: "Fri: 11 AM – 10 PM", href: "#" },
                { label: "Sat: 11 AM – 10 PM", href: "#" },
                { label: "Sun: Closed", href: "#" },
              ],
            },
            {
              title: "Contact",              items: [
                { label: "Phone: 307-674-7000", href: "tel:307-674-7000" },
                { label: "Email: kari.ponybar@gmail.com", href: "mailto:kari.ponybar@gmail.com" },
                { label: "3 South Gould, Sheridan, WY 82801", href: "#" },
              ],
            },
            {
              title: "Connect",              items: [
                { label: "Facebook", href: "https://facebook.com" },
                { label: "Leave a Review", href: "https://tripadvisor.com" },
                { label: "Email List", href: "#" },
              ],
            },
            {
              title: "Legal",              items: [
                { label: "Privacy Policy", href: "#" },
                { label: "Terms of Service", href: "#" },
              ],
            },
          ]}
          bottomLeftText="© 2025 The Pony Grill and Bar. All rights reserved. | 3 South Gould, Sheridan, WY 82801"
          bottomRightText="Website design by 3 Willow Design, LLC"
        />
      </div>
    </ThemeProvider>
  );
}