"use client"

import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarStyleCentered from '@/components/navbar/NavbarStyleCentered/NavbarStyleCentered';
import HeroBillboardCarousel from '@/components/sections/hero/HeroBillboardCarousel';
import TextAbout from '@/components/sections/about/TextAbout';
import FeatureCardTwentyFive from '@/components/sections/feature/FeatureCardTwentyFive';
import MetricCardEleven from '@/components/sections/metrics/MetricCardEleven';
import TestimonialCardSixteen from '@/components/sections/testimonial/TestimonialCardSixteen';
import BlogCardThree from '@/components/sections/blog/BlogCardThree';
import FaqSplitMedia from '@/components/sections/faq/FaqSplitMedia';
import ContactCenter from '@/components/sections/contact/ContactCenter';
import FooterMedia from '@/components/sections/footer/FooterMedia';
import { Award, Info, Castle, Shield, Building2, MapPin, Mail } from "lucide-react";

export default function TallinnOldTownPage() {
  return (
    <ThemeProvider
      defaultButtonVariant="hover-bubble"
      defaultTextAnimation="entrance-slide"
      borderRadius="soft"
      contentWidth="mediumLarge"
      sizing="medium"
      background="circleGradient"
      cardStyle="elevated"
      primaryButtonStyle="gradient"
      secondaryButtonStyle="layered"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
        <NavbarStyleCentered
          brandName="Tallinn Old Town"
          navItems={[
            { name: "Home", id: "/" },
            { name: "About", id: "about" },
            { name: "Attractions", id: "attractions" },
            { name: "History", id: "history" },
            { name: "Events", id: "events" },
            { name: "Plan Your Visit", id: "faq" },
            { name: "Products", id: "/products" }
          ]}
          button={{ text: "Get Started", href: "contact" }}
        />
      </div>

      <div id="hero" data-section="hero">
        <HeroBillboardCarousel
          title="Discover Medieval Tallinn Old Town"
          description="Step into one of Europe's best-preserved medieval city centers. Experience centuries of history, culture, and charm in every cobblestone street."
          tag="UNESCO World Heritage"
          tagIcon={Award}
          background={{ variant: "sparkles-gradient" }}
          mediaItems={[
            {
              imageSrc: "https://img.b2bpic.net/free-photo/aerial-shot-old-town-tallinn-with-orange-roofs-churches-spires-narrow-streets_181624-50054.jpg",              imageAlt: "Tallinn Old Town panoramic view"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-photo/amazing-aerial-skyline-tallinn-town-hall-square-with-old-market-square-estonia_181624-38881.jpg",              imageAlt: "Alexander Nevsky Cathedral"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-photo/vertical-shot-beautiful-historical-buildings-kirchberg-der-jagst-district-germany_181624-7833.jpg",              imageAlt: "Town Hall Square"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-photo/beautiful-historical-castle-dark-cloudy-sky_181624-8799.jpg",              imageAlt: "Medieval city walls"
            },
            {
              imageSrc: "https://img.b2bpic.net/free-photo/landscape-centre-southeastern-transylvania-with-local-church-multiple-pubs_1268-20194.jpg",              imageAlt: "Kiek in de Kok tower"
            }
          ]}
          buttons={[
            { text: "Plan Your Visit", href: "faq" },
            { text: "Learn History", href: "history" }
          ]}
        />
      </div>

      <div id="about" data-section="about">
        <TextAbout
          tag="About Tallinn Old Town"
          tagIcon={Info}
          title="A Living Monument to Medieval Life. Tallinn Old Town is one of the most complete medieval city centers in Northern Europe, dating back over 800 years. Its winding cobblestone streets, fortified walls, and soaring church spires transport visitors to a different era while remaining vibrant and alive."
          useInvertedBackground={false}
          buttons={[
            { text: "Explore Further", href: "attractions" }
          ]}
        />
      </div>

      <div id="attractions" data-section="attractions">
        <FeatureCardTwentyFive
          title="Key Attractions"
          description="Discover the iconic landmarks that define Tallinn Old Town's timeless character"
          tag="Explore"
          features={[
            {
              title: "Toompea Castle",              description: "The seat of Estonian parliament and a symbol of power for over 700 years. This hilltop fortress offers panoramic views of the Old Town.",              icon: Castle,
              mediaItems: [
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/clean-city-streets-prague_23-2149417737.jpg",                  imageAlt: "Toompea Castle exterior"
                },
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/panoramic-aerial-image-lisbon-town-with-red-shingles-covered-roofs_181624-10881.jpg",                  imageAlt: "Toompea Castle view"
                }
              ]
            },
            {
              title: "Medieval City Walls",              description: "Walk along 2.5 kilometers of remarkably preserved medieval fortifications. Twenty-six towers once guarded the city, many still standing today.",              icon: Shield,
              mediaItems: [
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/prague_1204-280.jpg",                  imageAlt: "Medieval city walls"
                },
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/beautiful-historical-castle-dark-cloudy-sky_181624-8799.jpg",                  imageAlt: "City walls detail"
                }
              ]
            },
            {
              title: "Alexander Nevsky Cathedral",              description: "A stunning Russian Orthodox cathedral dominating the Old Town skyline. Built in 1894, its golden domes are visible from across the city.",              icon: Building2,
              mediaItems: [
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/view-black-church-brasov-romania_1268-20065.jpg",                  imageAlt: "Alexander Nevsky Cathedral"
                },
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/amazing-aerial-skyline-tallinn-town-hall-square-with-old-market-square-estonia_181624-38881.jpg",                  imageAlt: "Cathedral detail"
                }
              ]
            },
            {
              title: "Town Hall Square",              description: "The heart of medieval Tallinn. This historic marketplace has hosted merchants, celebrations, and pivotal moments in Estonian history for centuries.",              icon: MapPin,
              mediaItems: [
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/low-angle-shot-historic-akershus-fortress-beautiful-cloudy-sky-oslo-norway_181624-8413.jpg",                  imageAlt: "Town Hall Square"
                },
                {
                  imageSrc: "https://img.b2bpic.net/free-photo/vertical-shot-beautiful-historical-buildings-kirchberg-der-jagst-district-germany_181624-7833.jpg",                  imageAlt: "Town Hall architecture"
                }
              ]
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="history" data-section="history">
        <MetricCardEleven
          title="Historical Highlights"
          description="Key moments that shaped Tallinn's remarkable heritage"
          tag="Timeline"
          metrics={[
            {
              id: "1",              value: "1219",              title: "Founded",              description: "Danish crusaders establish Tallinn as a strategic Baltic fortress",              imageSrc: "https://img.b2bpic.net/free-photo/aerial-shot-old-town-tallinn-with-orange-roofs-churches-spires-narrow-streets_181624-50054.jpg",              imageAlt: "Medieval foundation"
            },
            {
              id: "2",              value: "800+",              title: "Years of History",              description: "Continuous settlement and cultural development across centuries",              imageSrc: "https://img.b2bpic.net/free-photo/aerial-view-beautiful-riga-city-latvia-with-amazing-view_181624-38953.jpg",              imageAlt: "Historic preservation"
            }
          ]}
          animationType="scale-rotate"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="testimonials" data-section="testimonials">
        <TestimonialCardSixteen
          title="Visitor Stories"
          description="Hear from travelers who've experienced the magic of Tallinn Old Town"
          tag="Testimonials"
          testimonials={[
            {
              id: "1",              name: "Sarah Anderson",              role: "Travel Writer",              company: "World Explorer Magazine",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/young-hispanic-tourist-woman-smiling-happy-drinking-coffee-city_839833-25789.jpg",              imageAlt: "Sarah Anderson"
            },
            {
              id: "2",              name: "Marco Rossi",              role: "Photographer",              company: "European Heritage Photos",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/young-blonde-woman-smiling-confident-standing-street_839833-7910.jpg",              imageAlt: "Marco Rossi"
            },
            {
              id: "3",              name: "Lisa Mueller",              role: "History Professor",              company: "Cultural Heritage Institute",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/young-beautiful-blonde-woman-vacation-wearing-summer-hat-smiling-happy-standing-with-smile-face-having-conversation-talking-smartphone-street-city_839833-7897.jpg",              imageAlt: "Lisa Mueller"
            },
            {
              id: "4",              name: "James Wilson",              role: "Adventure Blogger",              company: "Wanderlust Chronicles",              rating: 5,
              imageSrc: "https://img.b2bpic.net/free-photo/happy-caucasian-woman-dress-with-view-barcelona-background-spain_1268-18003.jpg",              imageAlt: "James Wilson"
            }
          ]}
          kpiItems={[
            { value: "2M+", label: "Annual Visitors" },
            { value: "1000+", label: "Historic Buildings" },
            { value: "98%", label: "Visitor Satisfaction" }
          ]}
          animationType="blur-reveal"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="events" data-section="events">
        <BlogCardThree
          title="Cultural Events & Experiences"
          description="Year-round celebrations and traditions that bring Old Town to life"
          tag="Events"
          blogs={[
            {
              id: "1",              category: "Medieval Life",              title: "Medieval Days Festival",              excerpt: "Experience authentic medieval market atmosphere with craftspeople, performances, and period costumes.",              imageSrc: "https://img.b2bpic.net/free-photo/antique-bible-wooden-table-reading-christian-text-generated-by-ai_188544-16942.jpg",              imageAlt: "Medieval Days Festival",              authorName: "Elena Virtanen",              authorAvatar: "https://img.b2bpic.net/free-photo/young-hispanic-tourist-woman-smiling-happy-drinking-coffee-city_839833-25789.jpg",              date: "June 15, 2024"
            },
            {
              id: "2",              category: "Travel Guide",              title: "Best Time to Visit Tallinn",              excerpt: "Plan your perfect trip with our seasonal guide to weather, events, and local highlights.",              imageSrc: "https://img.b2bpic.net/free-photo/top-view-hand-holding-notebook_23-2149617649.jpg",              imageAlt: "Travel tips",              authorName: "Mikael Saar",              authorAvatar: "https://img.b2bpic.net/free-photo/young-blonde-woman-smiling-confident-standing-street_839833-7910.jpg",              date: "May 20, 2024"
            },
            {
              id: "3",              category: "Culture",              title: "Estonian Traditions & Customs",              excerpt: "Discover the unique cultural heritage and local traditions that define Tallinn's spirit.",              imageSrc: "https://img.b2bpic.net/free-photo/young-girl-goes-out-house-traditional-ukrainian-dress_8353-9546.jpg",              imageAlt: "Local culture",              authorName: "Katrin Tamm",              authorAvatar: "https://img.b2bpic.net/free-photo/young-beautiful-blonde-woman-vacation-wearing-summer-hat-smiling-happy-standing-with-smile-face-having-conversation-talking-smartphone-street-city_839833-7897.jpg",              date: "April 10, 2024"
            }
          ]}
          animationType="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="faq" data-section="faq">
        <FaqSplitMedia
          title="Plan Your Visit"
          description="Everything you need to know about visiting Tallinn Old Town"
          tag="FAQ"
          faqs={[
            {
              id: "1",              title: "When is the best time to visit?",              content: "Summer (June-August) offers warm weather and long days, perfect for exploring. Spring and fall provide mild weather with fewer crowds. Winter brings magical holiday markets and a fairytale atmosphere with snow-covered cobblestones."
            },
            {
              id: "2",              title: "How long should I spend in Old Town?",              content: "A full day allows you to explore major attractions, wander through charming streets, and enjoy local cafes. Two days is ideal for a deeper cultural experience, visiting museums, and attending evening events."
            },
            {
              id: "3",              title: "Is Old Town wheelchair accessible?",              content: "The cobblestone streets present challenges for wheelchairs, but main attractions have accessible entrances. Town Hall Square and lower sections are more accessible. Check specific venues for accessibility details."
            },
            {
              id: "4",              title: "What are the must-see attractions?",              content: "Don't miss Toompea Castle, Alexander Nevsky Cathedral, Town Hall Square, the medieval city walls, and Kiek in de Kok tower. Wander through Juhkentali Street and explore local artisan shops and galleries."
            },
            {
              id: "5",              title: "Where should I eat?",              content: "Old Town offers excellent restaurants ranging from traditional Estonian cuisine to international dining. Visit local cafes for fresh pastries, explore street food vendors, and try traditional dishes like black bread soup and smoked fish."
            }
          ]}
          imageSrc="https://img.b2bpic.net/free-photo/aerial-summer-view-central-part-beautiful-ancient-ukrainian-city-chernivtsi-with-its-streets-old-residential-buildings-town-hall-churches-etc-beautiful-town_231208-6.jpg"
          imageAlt="Tallinn Old Town streets"
          mediaAnimation="opacity"
          mediaPosition="left"
          faqsAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
        />
      </div>

      <div id="contact" data-section="contact">
        <ContactCenter
          tag="Newsletter"
          title="Stay Connected with Tallinn Old Town"
          description="Subscribe to our newsletter for travel tips, cultural insights, event updates, and exclusive recommendations for exploring one of Europe's most enchanting medieval cities."
          tagIcon={Mail}
          background={{ variant: "rotated-rays-animated" }}
          useInvertedBackground={false}
          inputPlaceholder="Enter your email"
          buttonText="Subscribe"
          termsText="By subscribing, you agree to receive updates about Tallinn Old Town events and attractions. Unsubscribe anytime."
        />
      </div>

      <div id="footer" data-section="footer">
        <FooterMedia
          imageSrc="https://img.b2bpic.net/free-photo/aerial-view-historical-center-lviv-ukraine_231208-68.jpg"
          imageAlt="Tallinn Old Town sunset"
          logoText="Tallinn Old Town"
          copyrightText="© 2025 Tallinn Old Town | Preserving Medieval Heritage"
          columns={[
            {
              title: "Explore",              items: [
                { label: "Attractions", href: "attractions" },
                { label: "History", href: "history" },
                { label: "Events", href: "events" },
                { label: "Plan Visit", href: "faq" }
              ]
            },
            {
              title: "Information",              items: [
                { label: "About", href: "about" },
                { label: "Cultural Guide", href: "events" },
                { label: "Travel Tips", href: "events" },
                { label: "Testimonials", href: "testimonials" }
              ]
            },
            {
              title: "Connect",              items: [
                { label: "Contact Us", href: "contact" },
                { label: "Newsletter", href: "contact" },
                { label: "Visit Website", href: "https://www.visittallinn.ee" },
                { label: "Social Media", href: "https://www.instagram.com/visittallinn" }
              ]
            }
          ]}
        />
      </div>
    </ThemeProvider>
  );
}