"use client";

import ReactLenis from "lenis/react";
import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
import NavbarLayoutFloatingOverlay from "@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay";
import HeroSplitDoubleCarousel from "@/components/sections/hero/HeroSplitDoubleCarousel";
import FeatureBento from "@/components/sections/feature/FeatureBento";
import FeatureCardTwentySix from "@/components/sections/feature/FeatureCardTwentySix";
import FeatureCardSixteen from "@/components/sections/feature/FeatureCardSixteen";
import MetricCardOne from "@/components/sections/metrics/MetricCardOne";
import TeamCardFive from "@/components/sections/team/TeamCardFive";
import FaqBase from "@/components/sections/faq/FaqBase";
import ContactCTA from "@/components/sections/contact/ContactCTA";
import FooterBase from "@/components/sections/footer/FooterBase";
import TestimonialCardFifteen from "@/components/sections/testimonial/TestimonialCardFifteen";
import { Sparkles, Search, ArrowUpRight, Monitor, Shield, Zap, Puzzle, TrendingUp, Lock, Phone, MessageCircle, BookOpen, Tv, Camera, Music, Settings, Award, Users, Utensils, Sprout, ConciergeBell, Home, Smile, Heart, CupSoda, Wine, ChefHat, CalendarCheck } from "lucide-react";

export default function WebAgency2Page() {
  return (
    <ThemeProvider
      defaultButtonVariant="text-stagger"
      defaultTextAnimation="entrance-slide"
      borderRadius="pill"
      contentWidth="medium"
      sizing="medium"
      background="none"
      cardStyle="glass-elevated"
      primaryButtonStyle="metallic"
      secondaryButtonStyle="glass"
      headingFontWeight="medium"
    >
      <ReactLenis root>
        <NavbarLayoutFloatingOverlay
          brandName="Dar Mrad"
          navItems={[
            { name: "Menu", id: "menu" },
            { name: "About", id: "about" },
            { name: "Gallery", id: "gallery" },
            { name: "Reservations", id: "contact" },
          ]}
          button={{ text: "Book a Table", href: "#contact" }}
        />
        <HeroSplitDoubleCarousel
          title="Experience the Authentic Taste of Dar Mrad"
          description="Savor exquisite Moroccan cuisine crafted with passion and served in an elegant ambiance. Your culinary journey begins here."
          tag="Culinary Excellence"
          tagIcon={Sparkles}
          tagAnimation="slide-up"
          background={{ variant: "canvas-reveal" }}
          buttons={[
            { text: "View Menu", href: "#menu" },
            { text: "Book a Table", href: "#contact" },
          ]}
          buttonAnimation="slide-up"
          carouselPosition="right"
          leftCarouselItems={[
            { imageSrc: "http://img.b2bpic.net/free-photo/world-cuisine-with-delicious-food_23-2151890022.jpg", imageAlt: "Moroccan Tagine" },
            { imageSrc: "http://img.b2bpic.net/free-photo/lamps-arab-restaurant_23-2147794380.jpg", imageAlt: "Elegant Moroccan restaurant interior" },
            { imageSrc: "http://img.b2bpic.net/free-photo/person-eating-seaweed-snacks_23-2150520007.jpg", imageAlt: "Moroccan chef cooking" },
            { imageSrc: "http://img.b2bpic.net/free-photo/top-view-little-spoons-with-spices-arrangement_23-2149439568.jpg", imageAlt: "Moroccan spices and ingredients" },
            { imageSrc: "http://img.b2bpic.net/free-photo/ramadan-concept-with-glasses_23-2147791754.jpg", imageAlt: "Beautifully set dining table" }
          ]}
          rightCarouselItems={[
            { imageSrc: "http://img.b2bpic.net/free-photo/top-view-delicious-plov-with-different-raisins-dark-space_140725-97889.jpg", imageAlt: "Moroccan Couscous" },
            { imageSrc: "http://img.b2bpic.net/free-photo/decor-room-modern-couch-sofa_1203-4828.jpg", imageAlt: "Sophisticated dining area" },
            { imageSrc: "http://img.b2bpic.net/free-photo/assortment-dry-tea-golden-vintage-mini-plates-tea-types_114579-7926.jpg", imageAlt: "Exotic Moroccan drink" },
            { imageSrc: "http://img.b2bpic.net/free-photo/front-view-yummy-little-pie-with-coconut-candies-dark-grey-background-cake-tea-biscuit-cookie-sweet-candy_140725-110338.jpg", imageAlt: "Moroccan pastries" }
          ]}
          carouselItemClassName="!aspect-[4/5]"
        />
        <FeatureBento
          title="The Dar Mrad Experience"
          description="A journey through authentic flavors, exquisite ambiance, and unparalleled hospitality."
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="slide-up"
          buttons={[{ text: "Discover More", href: "#about" }]}
          buttonAnimation="slide-up"
          features={[
            {
              title: "Authentic Moroccan Flavors",              description: "Our dishes are a tribute to traditional Moroccan recipes, prepared with fresh, locally sourced ingredients.",              bentoComponent: "marquee",              centerIcon: Utensils,
              variant: "text",              texts: ["Tagine", "Couscous", "Pastilla", "Harira", "Zaalouk", "Mint Tea", "Spices", "Saffron"]
            },
            {
              title: "Elegant Ambiance",              description: "Dine in a setting that blends traditional Moroccan aesthetics with modern sophistication, perfect for any occasion.",              bentoComponent: "media-stack",              items: [
                { imageSrc: "http://img.b2bpic.net/free-photo/ramadan-celebration-with-delicious-food_23-2151404422.jpg", imageAlt: "Moroccan restaurant interior detail" },
                { imageSrc: "http://img.b2bpic.net/free-photo/interior-decoration-inspired-by-mexican-folklore_23-2150711321.jpg", imageAlt: "Wide shot of dining room" },
                { imageSrc: "http://img.b2bpic.net/free-photo/top-view-dining-tables-without-food_23-2150157811.jpg", imageAlt: "Meticulously arranged table" }
              ]
            },
            {
              title: "Artisan Craftsmanship",              description: "Every dish is a masterpiece, meticulously prepared and beautifully presented by our skilled culinary team.",              bentoComponent: "media-stack",              items: [
                { imageSrc: "http://img.b2bpic.net/free-photo/hand-plate-with-fish-cooked-fish-juicy-fish-plate-delicacy-seafood-lovers_639032-339.jpg", imageAlt: "Chef meticulously plating a dish" },
                { imageSrc: "http://img.b2bpic.net/free-photo/pot-spices-near-food_23-2147930294.jpg", imageAlt: "Chef actively cooking" },
                { imageSrc: "http://img.b2bpic.net/free-photo/top-view-mushroom-cream-soup-bowl_140725-12414.jpg", imageAlt: "Artistic close-up of a Moroccan dish" }
              ]
            }
          ]}
        />
        <FeatureCardTwentySix
          title="Menu Highlights"
          description="A glimpse into the exquisite dishes that define the Dar Mrad culinary experience."
          textboxLayout="default"
          useInvertedBackground={false}
          buttons={[{ text: "View Full Menu", href: "#menu" }]}
          buttonAnimation="slide-up"
          cardClassName="!h-auto aspect-video"
          features={[
            {
              title: "Classic Lamb Tagine",              description: "Slow-cooked lamb with apricots, prunes, and almonds, fragrant with spices.",              imageSrc: "http://img.b2bpic.net/free-photo/top-close-up-view-pilaf-pilaf-tomatoes-black-peppers-lemon-pepper-garlic_140725-78465.jpg",              imageAlt: "Classic Lamb Tagine",              buttonIcon: ArrowUpRight,
              buttonHref: "#"
            },
            {
              title: "Royal Couscous",              description: "Steamed semolina served with a medley of seven vegetables and tender meats.",              imageSrc: "http://img.b2bpic.net/free-photo/meat-with-rice-dry-fruits-prunes-chestnuts-spices-oil-top-view_141793-1813.jpg",              imageAlt: "Royal Couscous",              buttonIcon: ArrowUpRight,
              buttonHref: "#"
            },
            {
              title: "Chicken Pastilla",              description: "A savory-sweet pastry filled with shredded chicken, almonds, and spices.",              imageSrc: "http://img.b2bpic.net/free-photo/eastern-sweets-with-dates-fruit-plate-table_23-2148080059.jpg",              imageAlt: "Chicken Pastilla",              buttonIcon: ArrowUpRight,
              buttonHref: "#"
            },
            {
              title: "Seafood Charmoula",              description: "Grilled fresh seafood marinated in traditional Moroccan charmoula sauce.",              imageSrc: "http://img.b2bpic.net/free-photo/bowl-baked-beans-coaster-blue-table_114579-89920.jpg",              imageAlt: "Seafood Charmoula",              buttonIcon: ArrowUpRight,
              buttonHref: "#"
            },
            {
              title: "Assorted Moroccan Pastries",              description: "A delightful selection of traditional sweets, perfect with mint tea.",              imageSrc: "http://img.b2bpic.net/free-photo/plate-cookies-different-dry-flowers-fruits-marble-ground_140725-52775.jpg",              imageAlt: "Assorted Moroccan Pastries",              buttonIcon: ArrowUpRight,
              buttonHref: "#"
            }
          ]}
        />
        <FeatureBento
          title="Our Commitment to Excellence"
          description="Ensuring every visit to Dar Mrad is an unforgettable experience."
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="slide-up"
          features={[
            {
              title: "Fresh, Local Ingredients",              description: "We source the finest seasonal produce and ingredients from trusted local suppliers.",              bentoComponent: "reveal-icon",              icon: Sprout
            },
            {
              title: "Impeccable Service",              description: "Our dedicated team provides warm, attentive service, ensuring your comfort and satisfaction.",              bentoComponent: "reveal-icon",              icon: ConciergeBell
            },
            {
              title: "Culinary Mastery",              description: "Our chefs blend time-honored techniques with creative flair, perfecting every plate.",              bentoComponent: "timeline",              heading: "Culinary Process",              subheading: "From prep to plate",              items: [
                { label: "Sourcing Ingredients", detail: "Daily" },
                { label: "Expert Preparation", detail: "With care" },
                { label: "Artful Presentation", detail: "Every dish" }
              ],
              completedLabel: "Ready"
            },
            {
              title: "Welcoming Atmosphere",              description: "A warm, inviting space where every guest feels at home, whether for an intimate dinner or a celebration.",              bentoComponent: "orbiting-icons",              centerIcon: Home,
              items: [
                { icon: Smile },
                { icon: Sparkles },
                { icon: Heart },
                { icon: CupSoda }
              ]
            },
            {
              title: "Crafted Beverages",              description: "A curated selection of Moroccan teas, fresh juices, and fine wines to complement your meal.",              bentoComponent: "reveal-icon",              icon: Wine
            }
          ]}
        />
        <TestimonialCardFifteen
          testimonial="Dining at Dar Mrad was an unforgettable experience. The tagine was incredible, and the service was exceptional. A true gem!"
          rating={5}
          author="— Aicha Benali, Esteemed Guest"
          avatars={[
            { src: "http://img.b2bpic.net/free-photo/portrait-waitress-standing-counter_1170-668.jpg", alt: "Esteemed Guest" }
          ]}
          ratingAnimation="slide-up"
          avatarsAnimation="slide-up"
          useInvertedBackground={false}
        />
        <MetricCardOne
          title="Our Legacy of Hospitality"
          description="Years of dedication to delivering an unparalleled dining experience."
          textboxLayout="default"
          useInvertedBackground={false}
          gridVariant="uniform-all-items-equal"
          animationType="slide-up"
          metrics={[
            { id: "guests", value: "100K+", title: "Happy Guests", description: "Served and delighted since our opening", icon: Users },
            { id: "dishes", value: "50+", title: "Signature Dishes", description: "Crafted with authentic Moroccan recipes", icon: ChefHat },
            { id: "years", value: "15+", title: "Years", description: "Of culinary excellence and cherished memories", icon: CalendarCheck }
          ]}
        />
        <FeatureCardSixteen
          title="Why Choose Dar Mrad?"
          description="Experience the difference between a truly authentic restaurant and an ordinary meal."
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="slide-up"
          negativeCard={{
            items: [
              "Generic menus lacking flavor",              "Inattentive service and long waits",              "Loud, uninviting atmosphere",              "Mass-produced, uninspired dishes",              "No connection to local culture"
            ]
          }}
          positiveCard={{
            items: [
              "Authentic, flavorful Moroccan cuisine",              "Warm, attentive, and personalized service",              "Elegant and tranquil ambiance",              "Artisanally crafted, fresh dishes",              "Rich cultural dining experience"
            ]
          }}
        />
        <TeamCardFive
          title="Meet Our Dedicated Team"
          description="The passionate individuals who make every visit to Dar Mrad special."
          textboxLayout="default"
          useInvertedBackground={false}
          animationType="slide-up"
          mediaClassName="object-[65%_center]"
          team={[
            { id: "1", name: "Chef Karim", role: "Head Chef", imageSrc: "http://img.b2bpic.net/free-photo/crazy-chef-worried-expression_1194-1332.jpg", imageAlt: "Chef Karim" },
            { id: "2", name: "Amira El Fassi", role: "Maître d'hôtel", imageSrc: "http://img.b2bpic.net/free-photo/we-serve-finest-desserts_637285-8893.jpg", imageAlt: "Amira El Fassi" },
            { id: "3", name: "Omar Benali", role: "Head Server", imageSrc: "http://img.b2bpic.net/free-photo/waitress-serving-cup-coffee-customers_1170-653.jpg", imageAlt: "Omar Benali" }
          ]}
        />
        <FaqBase
          title="Frequently Asked Questions"
          description="Everything you need to know about dining at Dar Mrad."
          textboxLayout="default"
          useInvertedBackground={false}
          faqsAnimation="slide-up"
          faqs={[
            { id: "1", title: "What kind of cuisine do you serve?", content: "Dar Mrad specializes in authentic Moroccan cuisine, featuring traditional dishes like tagines, couscous, and pastillas, prepared with fresh, locally sourced ingredients." },
            { id: "2", title: "Do you accommodate dietary restrictions?", content: "Yes, we strive to accommodate all dietary needs. Please inform your server about any allergies or restrictions, and our chefs will do their best to provide suitable options." },
            { id: "3", title: "How can I make a reservation?", content: "Reservations can be made easily through our website's 'Reservations' section, by calling us directly, or by using our online booking platform." },
            { id: "4", title: "Do you offer private dining options?", content: "Yes, Dar Mrad has private dining areas perfect for special occasions, corporate events, or intimate gatherings. Please contact us for more details and availability." },
            { id: "5", title: "What are your opening hours?", content: "We are open for dinner from 6:00 PM to 11:00 PM, Tuesday through Sunday. Please check our website or call us for the most up-to-date hours, especially on holidays." }
          ]}
        />
        <ContactCTA
          tag="Reservations"
          title="Ready for an Unforgettable Dining Experience?"
          description="Book your table at Dar Mrad and embark on a culinary journey through the heart of Morocco."
          background={{ variant: "radial-gradient" }}
          buttons={[
            { text: "Book Now", href: "#contact" },
            { text: "View Menu", href: "#menu" }
          ]}
          buttonAnimation="slide-up"
          useInvertedBackground={false}
        />
        <FooterBase
          logoText="Dar Mrad"
          copyrightText="© 2026 | Dar Mrad"
          columns={[
            {
              title: "Company",              items: [
                { label: "About Us", href: "#about" },
                { label: "Our Menu", href: "#menu" },                { label: "Gallery", href: "#gallery" },
                { label: "Contact", href: "#contact" }
              ]
            },
            {
              title: "Dining Experience",              items: [
                { label: "Dinner Service", href: "#" },
                { label: "Private Events", href: "#" },
                { label: "Gift Vouchers", href: "#" }
              ]
            },
            {
              title: "Connect",              items: [
                { label: "Instagram", href: "#" },
                { label: "Facebook", href: "#" },
                { label: "TripAdvisor", href: "#" }
              ]
            }
          ]}
        />
      </ReactLenis>
    </ThemeProvider>
  );
}
