"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import ReactLenis from "lenis/react";
import NavbarStyleApple from '@/components/navbar/NavbarStyleApple/NavbarStyleApple';
import FooterLogoEmphasis from '@/components/sections/footer/FooterLogoEmphasis';
import LegalSection from '@/components/legal/LegalSection';

export default function SizeGuidePage() {
  return (
    <ThemeProvider
        defaultButtonVariant="elastic-effect"
        defaultTextAnimation="reveal-blur"
        borderRadius="pill"
        contentWidth="mediumLarge"
        sizing="largeSizeMediumTitles"
        background="grid"
        cardStyle="soft-shadow"
        primaryButtonStyle="flat"
        secondaryButtonStyle="solid"
        headingFontWeight="medium"
    >
      <ReactLenis root>
        <div id="nav" data-section="nav">
          <NavbarStyleApple
            navItems={[
              {
                name: "Home",                id: "#hero"},
              {
                name: "About",                id: "#about"},
              {
                name: "Features",                id: "#features"},
              {
                name: "Tickets",                id: "#pricing"},
              {
                name: "Testimonials",                id: "#testimonials"},
              {
                name: "FAQ",                id: "#faq"},
              {
                name: "Size Guide",                id: "/size-guide"},
              {
                name: "Fit Guide",                id: "/fit-guide"},
              {
                name: "Blog",                id: "/blog"},
              {
                name: "Support",                id: "/support"},
              {
                name: "Contact",                id: "#contact"},
            ]}
            brandName="Khurasan Party"
          />
        </div>

        <div id="size-guide" data-section="size-guide">
          <LegalSection
            layout="page"
            title="Bra Size Guide"
            subtitle="Find your perfect fit with our comprehensive measurement instructions."
            sections={[
              {
                heading: "How to Measure Your Band Size",                content: [
                  {
                    type: "paragraph",                    text: "Wrap a measuring tape snugly around your rib cage, directly under your bust. Make sure the tape is parallel to the floor. Round to the nearest whole number. This is your band size."},
                ],
              },
              {
                heading: "How to Measure Your Bust Size",                content: [
                  {
                    type: "paragraph",                    text: "While wearing a non-padded bra, measure around the fullest part of your bust. Keep the tape level and not too tight. Round to the nearest whole number. This is your bust measurement."},
                ],
              },
              {
                heading: "Understanding Bra Cup Sizes",                content: [
                  {
                    type: "paragraph",                    text: "Subtract your band size from your bust measurement. Each inch of difference corresponds to a cup size: 1 inch = A, 2 inches = B, 3 inches = C, and so on."},
                  {
                    type: "list",                    items: [
                      "1 inch difference = A Cup",                      "2 inch difference = B Cup",                      "3 inch difference = C Cup",                      "4 inch difference = D Cup",                      "5 inch difference = DD/E Cup"],
                  },
                ],
              },
              {
                heading: "Common Sizing Issues",                content: [
                  {
                    type: "list",                    items: [
                      "Band riding up: Your band is too loose, try a smaller band size.",                      "Cups gaping: Your cup size is too large, try a smaller cup.",                      "Overflowing cups: Your cup size is too small, try a larger cup.",                      "Straps digging in: Your band is not providing enough support; most support should come from the band, not the straps."],
                  },
                ],
              },
            ]}
          />
        </div>

        <div id="footer" data-section="footer">
          <FooterLogoEmphasis
            columns={[
              {
                items: [
                  {
                    label: "About Us",                    href: "#about"},
                  {
                    label: "Features",                    href: "#features"},
                  {
                    label: "Tickets",                    href: "#pricing"},
                ],
              },
              {
                items: [
                  {
                    label: "Testimonials",                    href: "#testimonials"},
                  {
                    label: "Partners",                    href: "#social-proof"},
                  {
                    label: "FAQ",                    href: "#faq"},
                ],
              },
              {
                items: [
                  {
                    label: "Size Guide",                    href: "/size-guide"},
                  {
                    label: "Fit Guide",                    href: "/fit-guide"},
                  {
                    label: "Blog",                    href: "/blog"},
                ],
              },
              {
                items: [
                  {
                    label: "Support",                    href: "/support"},
                  {
                    label: "Contact",                    href: "#contact"},
                  {
                    label: "Privacy Policy",                    href: "#"},
                  {
                    label: "Terms of Service",                    href: "#"},
                ],
              },
            ]}
            logoText="Khurasan Party"
          />
        </div>
      </ReactLenis>
    </ThemeProvider>
  );
}
