"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import FaqDouble from '@/components/sections/faq/FaqDouble';
import FooterBase from '@/components/sections/footer/FooterBase';

export default function FaqPage() {
  return (
    <ThemeProvider>
      <ReactLenis root>
        <NavbarStyleApple
          navItems={[
            { name: "Home", id: "/" },
            { name: "About", id: "/about" },
            { name: "Pricing", id: "/pricing" },
            { name: "FAQ", id: "/faq" },
            { name: "Contact", id: "/contact" },
          ]}
          brandName="SMILETABS"
        />
        <FaqDouble
          title="Frequently Asked Questions"
          description="Have questions? We've got answers."
          textboxLayout="default"
          faqsAnimation="slide-up"
          faqs={[
            { id: "1", title: "How do I use these tabs?", content: "Simply chew and brush as usual!" },
            { id: "2", title: "Are they safe?", content: "Yes, they are dentist-formulated and natural." },
          ]}
        />
        <FooterBase
          columns={[
            { title: "Shop", items: [{ label: "All Products", href: "/shop" }] },
            { title: "Support", items: [{ label: "FAQ", href: "/faq" }, { label: "Contact", href: "/contact" }] },
          ]}
          logoText="SMILETABS"
        />
      </ReactLenis>
    </ThemeProvider>
  );
}