"use client";

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroSplitDoubleCarousel from '@/components/sections/hero/HeroSplitDoubleCarousel';
import InlineImageSplitTextAbout from '@/components/sections/about/InlineImageSplitTextAbout';
import FeatureCardTwentyNine from '@/components/sections/feature/featureCardTwentyNine/FeatureCardTwentyNine';
import ProductCardFour from '@/components/sections/product/ProductCardFour';
import TestimonialCardTwelve from '@/components/sections/testimonial/TestimonialCardTwelve';
import FaqBase from '@/components/sections/faq/FaqBase';
import ContactSplitForm from '@/components/sections/contact/ContactSplitForm';
import FooterMedia from '@/components/sections/footer/FooterMedia';

export default function LandingPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="shift-hover"
      defaultTextAnimation="entrance-slide"
      borderRadius="rounded"
      contentWidth="compact"
      sizing="medium"
      background="none"
      cardStyle="outline"
      primaryButtonStyle="diagonal-gradient"
      secondaryButtonStyle="solid"
      headingFontWeight="semibold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="中華そば 須紗"
          navItems={[
            { name: "ホーム", id: "#hero" },
            { name: "こだわり", id: "#about" },
            { name: "特徴", id: "#features" },
            { name: "メニュー", id: "#menu" },
            { name: "クチコミ", id: "#testimonials" },
            { name: "FAQ", id: "#faq" },
            { name: "お問い合わせ", id: "#contact" }
          ]}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroSplitDoubleCarousel
          title="心温まる一杯、至福の中華そば 須紗"
          description="厳選素材から生まれる、優しく奥深い味わいのラーメン。心ゆくまでお楽しみください。"
          background={{ variant: "radial-gradient" }}
          leftCarouselItems={[
            { imageSrc: "http://img.b2bpic.net/free-photo/black-bowl-filled-with-noodle-soup-corn-grey-cloth-with-garlic-mushrooms_23-2148320824.jpg", imageAlt: "Delicious ramen bowl" },
            { imageSrc: "http://img.b2bpic.net/free-photo/bangkok-thailand-november-11-2024-traditional-thai-spirit-house_482257-125366.jpg", imageAlt: "Ramen shop interior" },
            { imageSrc: "http://img.b2bpic.net/free-photo/spinach-eggs-ramen-soup-with-soy-sauce_23-2148486537.jpg", imageAlt: "Close up ramen" },
            { imageSrc: "http://img.b2bpic.net/free-photo/chinese-tea-ceremony-park-tea-drinking-open-air_613910-7299.jpg", imageAlt: "Japanese sake and drink" },
            { imageSrc: "http://img.b2bpic.net/free-photo/people-eating-delicious-salmon-bowl_52683-116801.jpg", imageAlt: "Happy customer eating ramen" },
            { imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-learning-make-sushi_23-2151202900.jpg", imageAlt: "Chef preparing ramen" }
          ]}
          rightCarouselItems={[
            { imageSrc: "http://img.b2bpic.net/free-photo/close-up-delicious-food-restaurant_23-2149269146.jpg", imageAlt: "Tonkotsu ramen" },
            { imageSrc: "http://img.b2bpic.net/free-vector/chinese-new-year-banners_23-2147730113.jpg", imageAlt: "Ramen shop exterior" },
            { imageSrc: "http://img.b2bpic.net/free-photo/bearded-man-wearing-knitted-warm-sweater-hat-having-lunch_273609-7265.jpg", imageAlt: "Eating ramen with chopsticks" },
            { imageSrc: "http://img.b2bpic.net/free-photo/vertical-shot-chinese-dumplings-plate_181624-1103.jpg", imageAlt: "Gyoza dumplings" },
            { imageSrc: "http://img.b2bpic.net/free-photo/close-up-man-feeding-woman_23-2149008756.jpg", imageAlt: "Chef serving ramen" },
            { imageSrc: "http://img.b2bpic.net/free-photo/woman-making-pasta-plate-with-kitchen-tools-black-background-side-view_176474-3752.jpg", imageAlt: "Fresh ramen ingredients" }
          ]}
          tag="伝統と革新の味"
          buttons={[
            { text: "メニューを見る", href: "#menu" }
          ]}
          buttonAnimation="slide-up"
          carouselPosition="right"
        />
      </div>

      <div id="about" data-section="about">
        <InlineImageSplitTextAbout
          title="須紗のこだわり"
          description="一杯の中華そばに込める、私たちの情熱と厳選された素材。薄味ながらも奥深いコクを生み出す秘伝のスープ、喉ごしの良いストレート麺、そしてとろけるチャーシューやシャキシャキの紫玉ねぎが織りなすハーモニー。お客様の記憶に残る一杯を追求し続けています。"
          imageSrc="http://img.b2bpic.net/free-photo/portrait-modern-man-performing-housework-gentle-dreamy-atmosphere_23-2151469402.jpg"
          imageAlt="ramen shop owner smiling"
          useInvertedBackground={true}
          buttons={[
            { text: "私たちの物語", href: "#" }
          ]}
        />
      </div>

      <div id="features" data-section="features">
        <FeatureCardTwentyNine
          title="須紗の五つの特徴"
          description="中華そば 須紗が誇る、至高の一杯を構成するこだわりをご紹介。"
          features={[
            { title: "優しく奥深い秘伝のスープ", description: "長い時間をかけて丁寧に煮込んだ、薄味ながらも奥深いコクが特徴のスープは、最後の一滴まで飲み干したくなる優しい味わいです。", imageSrc: "http://img.b2bpic.net/free-photo/top-view-chinese-hot-pot_23-2149529782.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/top-view-chinese-hot-pot_23-2149529782.jpg", buttonText: "詳細を見る" },
            { title: "喉ごし抜群のストレート麺", description: "スープによく絡み、心地よい食感が楽しめる特製のストレート麺。つるりとした喉ごしが、中華そばの美味しさを一層引き立てます。", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-uncooked-assortment-noodles-with-blank-frame_23-2148377398.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/flat-lay-uncooked-assortment-noodles-with-blank-frame_23-2148377398.jpg", buttonText: "詳細を見る" },
            { title: "とろける二種のチャーシュー", description: "肩ロースと角煮の二種類のチャーシュー。特に角煮は口の中でとろけるほどの柔らかさで、贅沢な味わいをお楽しみいただけます。", imageSrc: "http://img.b2bpic.net/free-photo/spinach-eggs-ramen-soup-cloth_23-2148486541.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/spinach-eggs-ramen-soup-cloth_23-2148486541.jpg", buttonText: "詳細を見る" },
            { title: "シャキシャキ紫玉ねぎのアクセント", description: "彩り豊かでシャキシャキとした食感が良いアクセントとなる紫玉ねぎ。中華そばの風味を一層豊かにします。", imageSrc: "http://img.b2bpic.net/free-photo/spinach-eggs-ramen-soup-copy-space_23-2148486540.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/spinach-eggs-ramen-soup-copy-space_23-2148486540.jpg", buttonText: "詳細を見る" },
            { title: "心温まるおもてなし", description: "お客様が心地よく過ごせるよう、笑顔と真心を込めたおもてなしを心がけております。お客様の笑顔が私たちの喜びです。", imageSrc: "http://img.b2bpic.net/free-photo/happy-young-delivery-woman-red-uniform-cap-wearing-glasses-holding-stack-food-packages-smiling-confident-showing-ok-sign-standing-green-wall_141793-64053.jpg", titleImageSrc: "http://img.b2bpic.net/free-photo/happy-young-delivery-woman-red-uniform-cap-wearing-glasses-holding-stack-food-packages-smiling-confident-showing-ok-sign-standing-green-wall_141793-64053.jpg", buttonText: "詳細を見る" }
          ]}
          carouselMode="buttons"
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="menu" data-section="menu">
        <ProductCardFour
          title="自慢の中華そばメニュー"
          description="須紗が心を込めて作り上げた、珠玉のラーメンをご賞味ください。"
          products={[
            { id: "p1", name: "特製中華そば", price: "￥1,200", variant: "醤油・塩", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-delicious-ramen-bowl_23-2148678746.jpg", imageAlt: "Special Ramen" },
            { id: "p2", name: "中華そば", price: "￥900", variant: "醤油・塩", imageSrc: "http://img.b2bpic.net/free-photo/side-view-hand-holding-chopsticks_23-2149706712.jpg", imageAlt: "Classic Ramen" },
            { id: "p3", name: "塩中華そば", price: "￥950", variant: "塩", imageSrc: "http://img.b2bpic.net/free-photo/japanese-ramen-bowl-with-shrimp-egg-vegetables_84443-85799.jpg", imageAlt: "Salt Ramen" },
            { id: "p4", name: "味玉中華そば", price: "￥1,050", variant: "醤油・塩", imageSrc: "http://img.b2bpic.net/free-photo/assortment-noodles-table_23-2148803807.jpg", imageAlt: "Ramen with seasoned egg" },
            { id: "p5", name: "チャーシュー麺", price: "￥1,300", variant: "醤油・塩", imageSrc: "http://img.b2bpic.net/free-photo/various-vietnamese-food-with-noodles-ham_23-2148381195.jpg", imageAlt: "Ramen with extra chashu" },
            { id: "p6", name: "角煮中華そば", price: "￥1,350", variant: "醤油・塩", imageSrc: "http://img.b2bpic.net/free-photo/flat-lay-ramen-soup-bowl_23-2148368675.jpg", imageAlt: "Ramen with braised pork" }
          ]}
          carouselMode="buttons"
          gridVariant="three-columns-all-equal-width"
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardTwelve
          cardTitle="お客様の声"
          cardTag="感動の声が続々"
          testimonials={[
            { id: "1", name: "田中 恵子", imageSrc: "http://img.b2bpic.net/free-photo/indoor-portrait-o-pretty-blonde-woman-drinking-tasty-cappuccino-restaurant-enjoy-her-breakfast-elegant-outfit-natural-make-up_291049-2723.jpg", imageAlt: "Keiko Tanaka" },
            { id: "2", name: "佐藤 健太", imageSrc: "http://img.b2bpic.net/free-photo/side-view-smiley-friends-with-delicious-food_23-2149706753.jpg", imageAlt: "Kenta Sato" },
            { id: "3", name: "鈴木 美咲", imageSrc: "http://img.b2bpic.net/free-photo/friends-enjoying-wine-restaurant_23-2152024844.jpg", imageAlt: "Misaki Suzuki" },
            { id: "4", name: "高橋 陽子", imageSrc: "http://img.b2bpic.net/free-photo/senior-people-having-fun-party_23-2149189965.jpg", imageAlt: "Yoko Takahashi" },
            { id: "5", name: "小林 悠斗", imageSrc: "http://img.b2bpic.net/free-photo/high-angle-woman-eating-with-chopsticks_23-2149706739.jpg", imageAlt: "Yuto Kobayashi" },
            { id: "6", name: "渡辺 剛", imageSrc: "http://img.b2bpic.net/free-photo/bearded-man-wearing-knitted-warm-sweater-hat-having-lunch_273609-6903.jpg", imageAlt: "Tsuyoshi Watanabe" }
          ]}
          cardAnimation="slide-up"
          useInvertedBackground={false}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqBase
          title="よくあるご質問"
          description="お客様からよく寄せられる質問にお答えします。"
          faqs={[
            { id: "faq1", title: "営業時間を教えてください。", content: "営業時間は午前11時から午後3時まで、そして午後5時から午後9時までとなっております。定休日は毎週木曜日です。" },
            { id: "faq2", title: "予約は可能ですか？", content: "当店は予約を受け付けておりません。ご来店いただいたお客様から順番にご案内しております。" },
            { id: "faq3", title: "テイクアウトはできますか？", content: "申し訳ございませんが、ラーメンのテイクアウトは行っておりません。店内でのご飲食をお楽しみください。" },
            { id: "faq4", title: "駐車場はありますか？", content: "はい、店舗横に専用駐車場を10台分ご用意しております。" },
            { id: "faq5", title: "支払い方法は何がありますか？", content: "現金のみの対応となっております。ご了承ください。" }
          ]}
          faqsAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={true}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactSplitForm
          title="お問い合わせ"
          description="ご予約やご質問など、お気軽にお問い合わせください。内容を確認後、担当者よりご連絡させていただきます。"
          inputs={[
            { name: "name", type: "text", placeholder: "お名前", required: true },
            { name: "email", type: "email", placeholder: "メールアドレス", required: true }
          ]}
          textarea={{ name: "message", placeholder: "お問い合わせ内容", rows: 5, required: true }}
          useInvertedBackground={false}
          imageSrc="http://img.b2bpic.net/free-photo/view-delicious-food-reunion-dinner-anime-style_23-2151022537.jpg"
          imageAlt="Ramen shop interior"
          mediaPosition="right"
          mediaAnimation="opacity"
          buttonText="送信"
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterMedia
          imageSrc="http://img.b2bpic.net/free-photo/young-woman-new-york-city-daytime_23-2149488519.jpg"
          imageAlt="Ramen shop exterior at night"
          logoText="中華そば 須紗"
          columns={[
            { title: "メニュー", items: [{ label: "特製中華そば", href: "#menu" }, { label: "中華そば", href: "#menu" }, { label: "塩中華そば", href: "#menu" }] },
            { title: "店舗情報", items: [{ label: "アクセス", href: "#contact" }, { label: "営業時間", href: "#faq" }, { label: "お問い合わせ", href: "#contact" }] },
            { title: "その他", items: [{ label: "プライバシーポリシー", href: "#" }, { label: "利用規約", href: "#" }] }
          ]}
          copyrightText="© 2024 中華そば 須紗 All rights reserved."
        />
      </div>
    </ThemeProvider>
  );
}
