"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from "@/components/navbar/NavbarStyleCentered/NavbarStyleCentered";
import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
import Link from "next/link";

export default function AdminPage() {
  const navItems = [
    { name: "Home", id: "home" },
    { name: "Menu", id: "menu" },
    { name: "Custom Orders", id: "custom-orders" },
    { name: "About", id: "about" },
    { name: "Contact", id: "contact" },
  ];

  const footerColumns = [
    {
      title: "Shop",
      items: [
        { label: "All Products", href: "/" },
        { label: "Custom Cakes", href: "/" },
        { label: "Gift Boxes", href: "/" },
        { label: "Seasonal Items", href: "/" },
        { label: "Track Order", href: "/" },
      ],
    },
    {
      title: "Company",
      items: [
        { label: "About Us", href: "/" },
        { label: "Our Story", href: "/" },
        { label: "Careers", href: "/" },
        { label: "Blog", href: "/" },
        { label: "Press", href: "/" },
      ],
    },
    {
      title: "Support",
      items: [
        { label: "Contact Us", href: "/" },
        { label: "FAQs", href: "/" },
        { label: "Shipping Info", href: "/" },
        { label: "Returns", href: "/" },
        { label: "Live Chat", href: "/" },
      ],
    },
    {
      title: "Legal",
      items: [
        { label: "Privacy Policy", href: "/" },
        { label: "Terms of Service", href: "/" },
        { label: "Cookie Policy", href: "/" },
        { label: "Accessibility", href: "/" },
        { label: "Contact Support", href: "/" },
      ],
    },
  ];

  return (
    <ThemeProvider
      defaultButtonVariant="bounce-effect"
      defaultTextAnimation="background-highlight"
      borderRadius="pill"
      contentWidth="small"
      sizing="medium"
      background="noiseDiagonalGradient"
      cardStyle="glass-elevated"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="layered"
      headingFontWeight="light"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="N&H BAKERY"
          navItems={navItems}
          button={{
            text: "Order Now",
            href: "/",
          }}
        />
      </div>

      <div id="admin-dashboard" data-section="admin-dashboard" className="mx-auto px-4 md:px-6 py-16 md:py-24">
        <div className="max-w-4xl mx-auto text-center">
          <h1 className="text-4xl md:text-5xl font-light mb-6">Admin Dashboard</h1>
          <p className="text-lg text-gray-600 mb-12">
            Welcome to the N&H BAKERY Admin Dashboard. This page is reserved for administrative access only.
          </p>
          
          <div className="grid grid-cols-1 md:grid-cols-2 gap-6 mb-12">
            <div className="p-8 bg-white rounded-2xl border border-gray-200">
              <h2 className="text-xl font-semibold mb-4">Orders Management</h2>
              <p className="text-gray-600 mb-6">Manage customer orders, track shipments, and handle fulfillment.</p>
              <button className="px-6 py-2 bg-orange-500 text-white rounded-full font-medium hover:bg-orange-600 transition">
                View Orders
              </button>
            </div>

            <div className="p-8 bg-white rounded-2xl border border-gray-200">
              <h2 className="text-xl font-semibold mb-4">Product Inventory</h2>
              <p className="text-gray-600 mb-6">Update product listings, prices, availability, and stock levels.</p>
              <button className="px-6 py-2 bg-orange-500 text-white rounded-full font-medium hover:bg-orange-600 transition">
                Manage Products
              </button>
            </div>

            <div className="p-8 bg-white rounded-2xl border border-gray-200">
              <h2 className="text-xl font-semibold mb-4">Customer Management</h2>
              <p className="text-gray-600 mb-6">View customer profiles, order history, and communication preferences.</p>
              <button className="px-6 py-2 bg-orange-500 text-white rounded-full font-medium hover:bg-orange-600 transition">
                Manage Customers
              </button>
            </div>

            <div className="p-8 bg-white rounded-2xl border border-gray-200">
              <h2 className="text-xl font-semibold mb-4">Analytics & Reports</h2>
              <p className="text-gray-600 mb-6">View sales reports, customer insights, and business metrics.</p>
              <button className="px-6 py-2 bg-orange-500 text-white rounded-full font-medium hover:bg-orange-600 transition">
                View Analytics
              </button>
            </div>
          </div>

          <div className="p-8 bg-orange-50 rounded-2xl border border-orange-200 text-center">
            <h3 className="text-2xl font-semibold mb-3">Need Help?</h3>
            <p className="text-gray-700 mb-6">
              For complete admin documentation and support, contact your system administrator.
            </p>
            <Link href="/" className="inline-block px-6 py-2 bg-orange-500 text-white rounded-full font-medium hover:bg-orange-600 transition">
              Back to Home
            </Link>
          </div>
        </div>
      </div>

      <div id="footer" data-section="footer">
        <FooterBaseReveal
          columns={footerColumns}
          copyrightText="© 2024 N&H BAKERY. All rights reserved. Freshly baked goodness since 2020."
        />
      </div>
    </ThemeProvider>
  );
}