Update src/app/page.tsx

Merge version_2 into main

src/app/page.tsx

@@ -12,25 +12,15 @@ import BlogCardOne from "@/components/sections/blog/BlogCardOne";
 import MetricCardTwo from "@/components/sections/metrics/MetricCardTwo";
 import ContactSplitForm from "@/components/sections/contact/ContactSplitForm";
 import FooterBaseReveal from "@/components/sections/footer/FooterBaseReveal";
-import { Sparkles, Zap, Shield, TrendingUp, Phone, MapPin } from "lucide-react";
-
-const navItems = [
-  { name: "Home", id: "/" },
-  { name: "About", id: "story" },
-  { name: "Services", id: "experience" },
-  { name: "Contact", id: "visit" },
-];
+import { Star, Zap, Shield, TrendingUp, Users, Globe, CheckCircle, Sparkles } from "lucide-react";
 
 export default function Home() {
-  const handleCallClick = () => {
-    window.location.href = "tel:+36302345678";
-  };
-
-  const handleDirectionsClick = () => {
-    window.open(
-      "https://maps.google.com/?q=Vito's+Napoletana+Pizzeria+Szekesfehervár",      "_blank"
-    );
-  };
+  const navItems = [
+    { name: "Home", id: "/" },
+    { name: "About", id: "story" },
+    { name: "Experience", id: "experience" },
+    { name: "Contact", id: "cta" },
+  ];
 
   return (
     <ThemeProvider
@@ -45,91 +35,32 @@ export default function Home() {
       secondaryButtonStyle="glass"
       headingFontWeight="normal"
     >
-      {/* Sticky Top Navigation */}
-      <div className="fixed top-0 left-0 right-0 z-40 bg-background/80 backdrop-blur-md border-b border-border/10">
-        <div className="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-3 flex items-center justify-between">
-          <div className="text-sm font-semibold">Vito's Napoletana Pizzéria</div>
-          <div className="flex gap-2 sm:gap-4">
-            <button
-              onClick={handleCallClick}
-              className="flex items-center gap-1 sm:gap-2 px-3 sm:px-4 py-2 rounded-lg bg-primary-cta/10 hover:bg-primary-cta/20 text-primary-cta transition-colors text-sm"
-              aria-label="Call restaurant"
-            >
-              <Phone size={16} />
-              <span className="hidden sm:inline">Call</span>
-            </button>
-            <button
-              onClick={handleDirectionsClick}
-              className="flex items-center gap-1 sm:gap-2 px-3 sm:px-4 py-2 rounded-lg bg-secondary-cta/10 hover:bg-secondary-cta/20 text-secondary-cta transition-colors text-sm"
-              aria-label="Get directions"
-            >
-              <MapPin size={16} />
-              <span className="hidden sm:inline">Directions</span>
-            </button>
-          </div>
-        </div>
-      </div>
-
-      {/* Floating Action Buttons */}
-      <div className="fixed bottom-6 right-6 z-30 flex flex-col gap-3 sm:bottom-8 sm:right-8">
-        <button
-          onClick={handleCallClick}
-          className="w-14 h-14 sm:w-16 sm:h-16 rounded-full bg-primary-cta text-white shadow-lg hover:shadow-xl hover:scale-110 transition-all flex items-center justify-center"
-          aria-label="Call restaurant"
-        >
-          <Phone size={24} />
-        </button>
-        <button
-          onClick={handleDirectionsClick}
-          className="w-14 h-14 sm:w-16 sm:h-16 rounded-full bg-accent text-white shadow-lg hover:shadow-xl hover:scale-110 transition-all flex items-center justify-center"
-          aria-label="Get directions"
-        >
-          <MapPin size={24} />
-        </button>
-      </div>
-
-      {/* Google Rating Widget */}
-      <div className="fixed bottom-6 left-6 z-30 bg-white rounded-lg shadow-lg p-3 sm:p-4 max-w-xs sm:max-w-sm hidden sm:block">
-        <div className="flex items-center gap-2">
-          <div className="flex gap-1">
-            {[...Array(5)].map((_, i) => (
-              <span key={i} className="text-yellow-400 text-lg">★</span>
-            ))}
-          </div>
-          <span className="text-sm font-semibold text-gray-900">4.8</span>
-        </div>
-        <p className="text-xs text-gray-600 mt-1">Based on 247 reviews</p>
-        <p className="text-xs font-medium text-gray-800 mt-2">Vito's Napoletana Pizzéria</p>
-      </div>
-
-      {/* Main Navigation */}
-      <div id="nav" data-section="nav" className="pt-16 sm:pt-20">
+      <div id="nav" data-section="nav">
         <NavbarStyleFullscreen
           navItems={navItems}
-          brandName="Webild"
-          bottomLeftText="Global Community"
-          bottomRightText="hello@example.com"
+          logoText="Pizzeria"
         />
       </div>
 
       <div id="hero" data-section="hero">
         <HeroBillboardRotatedCarousel
-          title="Transform Your Workflow"
-          description="Experience the power of seamless collaboration and productivity tools designed for modern teams"
-          background={{ variant: "plain" }}
-          tag="New Release"
-          tagIcon={Sparkles}
+          title="Authentic Italian Pizza Experience"
+          description="Savor the taste of Italy with our handcrafted pizzas made from the finest ingredients"
+          background={{ variant: "circleGradient" }}
+          tag="Premium Quality"
+          tagAnimation="slide-up"
+          buttonAnimation="slide-up"
           buttons={[
-            { text: "Get Started" },
-            { text: "Learn More" },
+            { text: "Order Now", href: "pizzas" },
+            { text: "Menu", href: "experience" }
           ]}
           carouselItems={[
-            { id: "1", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Product 1" },
-            { id: "2", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Product 2" },
-            { id: "3", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Product 3" },
-            { id: "4", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Product 4" },
-            { id: "5", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Product 5" },
-            { id: "6", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Product 6" },
+            { id: "1", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Margherita Pizza" },
+            { id: "2", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Pepperoni Pizza" },
+            { id: "3", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Vegetarian Pizza" },
+            { id: "4", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Quattro Formaggi" },
+            { id: "5", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Prosciutto Pizza" },
+            { id: "6", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Truffle Pizza" }
           ]}
           autoPlay={true}
           autoPlayInterval={4000}
@@ -138,69 +69,67 @@ export default function Home() {
 
       <div id="social-proof" data-section="social-proof">
         <SocialProofOne
-          title="Trusted by Industry Leaders"
-          description="Join thousands of companies using our platform"
+          names={["Milano Pizzeria", "Naples Kitchen", "Roma Ristorante", "Venice Dining", "Florence Eats"]}
+          title="Trusted by Premium Restaurants"
+          description="Join the finest establishments serving authentic Italian cuisine"
           textboxLayout="default"
           useInvertedBackground={false}
-          names={["Acme Corp", "TechFlow", "Innovate Inc", "CloudSync"]}
-          speed={40}
-          showCard={true}
         />
       </div>
 
       <div id="experience" data-section="experience">
         <FeatureBorderGlow
-          features={[
-            { icon: Zap, title: "Lightning Fast", description: "Optimized for performance with minimal overhead and blazing fast load times" },
-            { icon: Shield, title: "Secure by Default", description: "Built with security best practices and enterprise-grade encryption" },
-            { icon: TrendingUp, title: "Scale Effortlessly", description: "Grow your business without worrying about infrastructure" },
-          ]}
-          title="Powerful Features with Border Glow"
-          description="Hover over each card to reveal the glowing border effect"
+          title="The Pizza Experience"
+          description="Discover what makes our pizzas extraordinary"
           textboxLayout="default"
-          animationType="slide-up"
           useInvertedBackground={false}
+          animationType="slide-up"
+          features={[
+            { icon: Star, title: "Premium Ingredients", description: "Imported directly from Italy for authentic flavor" },
+            { icon: Zap, title: "Wood-Fired Oven", description: "Traditional ovens heated to 900 degrees" },
+            { icon: Shield, title: "Quality Assured", description: "Every pizza meets our strict quality standards" },
+            { icon: TrendingUp, title: "Award Winning", description: "Recognized by international pizza competitions" }
+          ]}
         />
       </div>
 
       <div id="pizzas" data-section="pizzas">
         <ProductCardOne
-          products={[
-            { id: "1", name: "Premium Pizza", price: "$15", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Premium Pizza" },
-            { id: "2", name: "Deluxe Pizza", price: "$18", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Deluxe Pizza" },
-            { id: "3", name: "Classic Pizza", price: "$12", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Classic Pizza" },
-          ]}
-          title="Featured Products"
-          description="Discover our latest collection of premium products"
+          title="Our Signature Pizzas"
+          description="Hand-tossed pizzas with the finest toppings"
           textboxLayout="default"
-          animationType="slide-up"
-          gridVariant="uniform-all-items-equal"
           useInvertedBackground={false}
+          gridVariant="three-columns-all-equal-width"
+          animationType="slide-up"
+          products={[
+            { id: "1", name: "Margherita", price: "$14.99", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Margherita Pizza" },
+            { id: "2", name: "Pepperoni", price: "$15.99", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Pepperoni Pizza" },
+            { id: "3", name: "Quattro Formaggi", price: "$16.99", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Quattro Formaggi Pizza" }
+          ]}
         />
       </div>
 
       <div id="story" data-section="story">
         <InlineImageSplitTextAbout
           heading={[
-            { type: "text", content: "Building the future with" },
-            { type: "text", content: "innovative solutions" },
+            { type: "text", content: "Our Story: A Family Tradition Since 1995" },
+            { type: "image", src: "/placeholders/placeholder1.webp", alt: "Family pizzeria" }
           ]}
           useInvertedBackground={false}
           buttons={[
-            { text: "Get Started", href: "/" },
-            { text: "Learn More", href: "/" },
+            { text: "Learn More", href: "experience" }
           ]}
+          buttonAnimation="slide-up"
         />
       </div>
 
       <div id="community" data-section="community">
         <TestimonialCardFifteen
-          testimonial="This product has completely transformed how we work. The results speak for themselves."
+          testimonial="The best pizza I've ever had. Authentic Italian flavors combined with exceptional service. Highly recommend!"
           rating={5}
-          author="James Carter, Journalist"
+          author="Marco Rossi"
           avatars={[
-            { src: "/placeholders/placeholder1.webp", alt: "User 1" },
-            { src: "/placeholders/placeholder1.webp", alt: "User 2" },
+            { src: "/placeholders/placeholder1.webp", alt: "Marco" }
           ]}
           ratingAnimation="slide-up"
           avatarsAnimation="slide-up"
@@ -211,76 +140,57 @@ export default function Home() {
       <div id="atmosphere" data-section="atmosphere">
         <BlogCardOne
           blogs={[
-            {
-              id: "1",              category: "Design",              title: "UX review presentations",              excerpt: "How to create compelling presentations that wow your audience",              imageSrc: "/placeholders/placeholder1.webp",              authorName: "Olivia Rhye",              authorAvatar: "/placeholders/placeholder1.webp",              date: "20 Jan 2025"
-            },
-            {
-              id: "2",              category: "Development",              title: "Building scalable systems",              excerpt: "Best practices for architecting modern applications",              imageSrc: "/placeholders/placeholder1.webp",              authorName: "Alex Chen",              authorAvatar: "/placeholders/placeholder1.webp",              date: "18 Jan 2025"
-            },
+            { id: "1", category: "Food Culture", title: "The Art of Pizza Making", excerpt: "Learn the techniques that make Italian pizza special", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Pizza making", authorName: "Chef Antonio", authorAvatar: "/placeholders/placeholder1.webp", date: "Jan 15, 2025" },
+            { id: "2", category: "Dining Experience", title: "Pizza Pairing with Wine", excerpt: "Discover perfect wine pairings for every pizza", imageSrc: "/placeholders/placeholder1.webp", imageAlt: "Wine pairing", authorName: "Sommelier Luigi", authorAvatar: "/placeholders/placeholder1.webp", date: "Jan 10, 2025" }
           ]}
-          title="Latest Articles"
-          description="Stay updated with our latest insights"
+          title="Pizza Stories"
+          description="Explore the culture and traditions of Italian pizza"
           textboxLayout="default"
           useInvertedBackground={false}
           animationType="slide-up"
-          carouselMode="buttons"
         />
       </div>
 
       <div id="reviews" data-section="reviews">
         <MetricCardTwo
-          metrics={[
-            { id: "1", value: "98%", description: "Customer Satisfaction Rate" },
-            { id: "2", value: "50K+", description: "Active Users Worldwide" },
-          ]}
-          title="Key Metrics"
-          description="See how we're making a difference"
-          gridVariant="uniform-all-items-equal"
+          title="By The Numbers"
+          description="Our commitment to excellence"
           textboxLayout="default"
-          animationType="slide-up"
           useInvertedBackground={false}
+          gridVariant="uniform-all-items-equal"
+          animationType="slide-up"
+          metrics={[
+            { id: "1", value: "10K+", description: "Happy customers served annually" },
+            { id: "2", value: "30+", description: "Years of pizza-making excellence" }
+          ]}
         />
       </div>
 
-      {/* Final CTA Section */}
-      <div id="cta" data-section="cta" className="py-16 sm:py-20 lg:py-24 px-4 sm:px-6 lg:px-8 text-center">
-        <div className="max-w-3xl mx-auto">
-          <h2 className="text-3xl sm:text-4xl lg:text-5xl font-bold mb-4 sm:mb-6">Ready to Get Started?</h2>
-          <p className="text-base sm:text-lg text-foreground/70 mb-8 sm:mb-10">Join thousands of satisfied customers experiencing the difference. Contact us today or visit our restaurant for authentic Neapolitan pizza.</p>
-          <div className="flex flex-col sm:flex-row gap-4 justify-center">
-            <button
-              onClick={handleCallClick}
-              className="w-full sm:w-auto px-6 sm:px-8 py-3 sm:py-4 bg-primary-cta text-white rounded-lg hover:opacity-90 transition-opacity font-semibold text-sm sm:text-base"
-            >
-              Call Now
-            </button>
-            <button
-              onClick={handleDirectionsClick}
-              className="w-full sm:w-auto px-6 sm:px-8 py-3 sm:py-4 bg-secondary-cta/20 text-secondary-cta rounded-lg hover:bg-secondary-cta/30 transition-colors font-semibold text-sm sm:text-base border border-secondary-cta/30"
-            >
-              Get Directions
-            </button>
-          </div>
-        </div>
+      <div id="cta" data-section="cta">
+        <ContactSplitForm
+          title="Get Special Offers"
+          description="Subscribe to our newsletter for exclusive deals and new pizza launches"
+          inputs={[
+            { name: "email", type: "email", placeholder: "Your email", required: true },
+            { name: "name", type: "text", placeholder: "Your name", required: true }
+          ]}
+          useInvertedBackground={false}
+          mediaAnimation="slide-up"
+          buttonText="Subscribe"
+        />
       </div>
 
       <div id="visit" data-section="visit">
         <ContactSplitForm
-          title="Get in touch"
-          description="We'd love to hear from you. Send us a message and we'll respond as soon as possible."
+          title="Visit Us"
+          description="Find our location and reserve a table for your next pizza night"
           inputs={[
-            { name: "name", type: "text", placeholder: "Your Name", required: true },
-            { name: "email", type: "email", placeholder: "Your Email", required: true },
+            { name: "date", type: "date", placeholder: "Date", required: true },
+            { name: "time", type: "time", placeholder: "Time", required: true }
           ]}
-          textarea={{
-            name: "message",            placeholder: "Your message",            rows: 5,
-            required: true,
-          }}
           useInvertedBackground={false}
-          imageSrc="/placeholders/placeholder1.webp"
           mediaAnimation="slide-up"
-          mediaPosition="right"
-          onSubmit={(data) => console.log("Form submitted:", data)}
+          buttonText="Reserve Table"
         />
       </div>
 
@@ -288,27 +198,23 @@ export default function Home() {
         <FooterBaseReveal
           columns={[
             {
-              title: "Product",              items: [
-                { label: "Features", href: "experience" },
-                { label: "Pricing", href: "hero" },
-              ],
+              title: "Quick Links",              items: [
+                { label: "Home", href: "/" },
+                { label: "Menu", href: "#experience" },
+                { label: "About", href: "#story" }
+              ]
             },
             {
-              title: "Company",              items: [
-                { label: "About", href: "story" },
-                { label: "Blog", href: "atmosphere" },
-              ],
-            },
-            {
-              title: "Legal",              items: [
-                { label: "Privacy", href: "/" },
-                { label: "Terms", href: "/" },
-              ],
-            },
+              title: "Contact",              items: [
+                { label: "Email", href: "mailto:info@pizzeria.com" },
+                { label: "Phone", href: "tel:+1234567890" },
+                { label: "Address", href: "#" }
+              ]
+            }
           ]}
-          copyrightText="© 2025 | Webild"
+          copyrightText="© 2025 Pizzeria. All rights reserved."
         />
       </div>
     </ThemeProvider>
   );
-}
+}

src/components/floating/FloatingContactButtons.tsx

@@ -1,127 +0,0 @@
-"use client";
-
-import React, { useState, useEffect } from 'react';
-import { LucideIcon } from 'lucide-react';
-
-interface FloatingContactButtonsProps {
-  phoneNumber: string;
-  mapsUrl: string;
-  phoneIcon?: LucideIcon;
-  mapsIcon?: LucideIcon;
-  onPhoneClick?: () => void;
-  onMapsClick?: () => void;
-  className?: string;
-  containerClassName?: string;
-  buttonClassName?: string;
-  phoneButtonClassName?: string;
-  mapsButtonClassName?: string;
-  tooltipClassName?: string;
-}
-
-export default function FloatingContactButtons({
-  phoneNumber,
-  mapsUrl,
-  phoneIcon: PhoneIcon,
-  mapsIcon: MapsIcon,
-  onPhoneClick,
-  onMapsClick,
-  className = '',
-  containerClassName = '',
-  buttonClassName = '',
-  phoneButtonClassName = '',
-  mapsButtonClassName = '',
-  tooltipClassName = ''
-}: FloatingContactButtonsProps) {
-  const [isVisible, setIsVisible] = useState(false);
-  const [showPhoneTooltip, setShowPhoneTooltip] = useState(false);
-  const [showMapsTooltip, setShowMapsTooltip] = useState(false);
-
-  useEffect(() => {
-    // Show floating buttons after a short delay for better UX
-    const timer = setTimeout(() => setIsVisible(true), 500);
-    return () => clearTimeout(timer);
-  }, []);
-
-  const handlePhoneClick = () => {
-    onPhoneClick?.();
-    window.location.href = `tel:${phoneNumber}`;
-  };
-
-  const handleMapsClick = () => {
-    onMapsClick?.();
-    window.open(mapsUrl, '_blank');
-  };
-
-  return (
-    <div
-      className={`fixed bottom-6 right-6 z-40 flex flex-col gap-3 md:bottom-8 md:right-8 transition-opacity duration-500 ${
-        isVisible ? 'opacity-100' : 'opacity-0 pointer-events-none'
-      } ${className}`}
-      aria-label="Floating contact buttons"
-    >
-      {/* Maps Button */}
-      <div className="relative">
-        <button
-          onClick={handleMapsClick}
-          className={`
-            w-14 h-14 md:w-16 md:h-16 rounded-full shadow-lg hover:shadow-xl
-            bg-primary-cta hover:bg-primary-cta/90 text-white
-            flex items-center justify-center transition-all duration-300
-            hover:scale-110 active:scale-95
-            ${mapsButtonClassName}
-            ${buttonClassName}
-          `}
-          aria-label="Open location in Google Maps"
-          title="Get Directions"
-          onMouseEnter={() => setShowMapsTooltip(true)}
-          onMouseLeave={() => setShowMapsTooltip(false)}
-        >
-          {MapsIcon ? (
-            <MapsIcon className="w-6 h-6 md:w-7 md:h-7" strokeWidth={1.5} />
-          ) : (
-            <svg className="w-6 h-6 md:w-7 md:h-7" fill="currentColor" viewBox="0 0 24 24">
-              <path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8zm3.5-9c.83 0 1.5-.67 1.5-1.5S16.33 8 15.5 8 14 8.67 14 9.5s.67 1.5 1.5 1.5z" />
-            </svg>
-          )}
-        </button>
-        {showMapsTooltip && (
-          <div className={`absolute right-16 top-1/2 -translate-y-1/2 bg-foreground text-background px-3 py-2 rounded-lg text-xs font-medium whitespace-nowrap pointer-events-none ${tooltipClassName}`}>
-            Get Directions
-          </div>
-        )}
-      </div>
-
-      {/* Phone Button */}
-      <div className="relative">
-        <button
-          onClick={handlePhoneClick}
-          className={`
-            w-14 h-14 md:w-16 md:h-16 rounded-full shadow-lg hover:shadow-xl
-            bg-secondary-cta hover:bg-secondary-cta/90 text-white
-            flex items-center justify-center transition-all duration-300
-            hover:scale-110 active:scale-95
-            ${phoneButtonClassName}
-            ${buttonClassName}
-          `}
-          aria-label="Call restaurant"
-          title="Call Us"
-          onMouseEnter={() => setShowPhoneTooltip(true)}
-          onMouseLeave={() => setShowPhoneTooltip(false)}
-        >
-          {PhoneIcon ? (
-            <PhoneIcon className="w-6 h-6 md:w-7 md:h-7" strokeWidth={1.5} />
-          ) : (
-            <svg className="w-6 h-6 md:w-7 md:h-7" fill="currentColor" viewBox="0 0 24 24">
-              <path d="M17.92 7.02C17.45 6.18 16.7 5.51 15.77 5.36c-1.36-.2-2.77.12-3.29 1.32l-.5 1.13c-.41.98-.3 2.04.35 2.77l1.96 2.16c-.38.86-.87 1.66-1.46 2.38l-2.38-2.38c-.7.13-1.74.7-2.45 1.36l-4.88 4.88C.5 17.66 0 19.52 0 21.5V24h2.5c1.98 0 3.84-.5 5.5-1.38l4.88-4.88c.67-.71 1.23-1.75 1.36-2.45l-2.38-2.38c.72-.59 1.52-1.08 2.38-1.46l2.16 1.96c.73.65 1.79.76 2.77.35l1.13-.5c1.2-.52 1.52-1.93 1.32-3.29-.15-.93-.82-1.68-1.66-2.15zM6.55 18.08c-1.19.84-2.58 1.32-4.05 1.32H2V21.5c0 1.47.48 2.86 1.32 4.05l4.88-4.88c-.26-.31-.48-.65-.65-1.01l-1.55-1.58z" />
-            </svg>
-          )}
-        </button>
-        {showPhoneTooltip && (
-          <div className={`absolute right-16 top-1/2 -translate-y-1/2 bg-foreground text-background px-3 py-2 rounded-lg text-xs font-medium whitespace-nowrap pointer-events-none ${tooltipClassName}`}>
-            Call Us
-          </div>
-        )}
-      </div>
-    </div>
-  );
-}

src/components/widgets/GoogleRatingWidget.tsx

@@ -1,105 +0,0 @@
-"use client";
-
-import React from 'react';
-import { Star } from 'lucide-react';
-
-interface GoogleRatingWidgetProps {
-  rating: number; // 0-5
-  reviewCount: number;
-  businessName: string;
-  className?: string;
-  containerClassName?: string;
-  ratingContainerClassName?: string;
-  starsClassName?: string;
-  textClassName?: string;
-  reviewCountClassName?: string;
-}
-
-export default function GoogleRatingWidget({
-  rating,
-  reviewCount,
-  businessName,
-  className = '',
-  containerClassName = '',
-  ratingContainerClassName = '',
-  starsClassName = '',
-  textClassName = '',
-  reviewCountClassName = ''
-}: GoogleRatingWidgetProps) {
-  const fullStars = Math.floor(rating);
-  const hasHalfStar = rating % 1 >= 0.5;
-
-  const renderStars = () => {
-    const stars = [];
-    for (let i = 0; i < 5; i++) {
-      if (i < fullStars) {
-        stars.push(
-          <Star
-            key={`star-${i}`}
-            className={`w-4 h-4 md:w-5 md:h-5 fill-yellow-400 text-yellow-400 ${starsClassName}`}
-          />
-        );
-      } else if (i === fullStars && hasHalfStar) {
-        stars.push(
-          <div key={`star-${i}`} className="relative">
-            <Star className={`w-4 h-4 md:w-5 md:h-5 text-gray-300 ${starsClassName}`} />
-            <div className="absolute top-0 left-0 overflow-hidden" style={{ width: '50%' }}>
-              <Star className={`w-4 h-4 md:w-5 md:h-5 fill-yellow-400 text-yellow-400 ${starsClassName}`} />
-            </div>
-          </div>
-        );
-      } else {
-        stars.push(
-          <Star
-            key={`star-${i}`}
-            className={`w-4 h-4 md:w-5 md:h-5 text-gray-300 ${starsClassName}`}
-          />
-        );
-      }
-    }
-    return stars;
-  };
-
-  return (
-    <div
-      className={`w-full flex justify-center py-8 md:py-12 px-4 ${className}`}
-      aria-label={`Google rating: ${rating} out of 5 stars with ${reviewCount} reviews`}
-    >
-      <div
-        className={`flex flex-col items-center gap-3 md:gap-4 p-4 md:p-6 rounded-lg border border-gray-200 dark:border-gray-700 bg-white dark:bg-gray-900/50 ${containerClassName}`}
-      >
-        <div className={`flex items-center gap-3 md:gap-4 ${ratingContainerClassName}`}>
-          {/* Google Icon */}
-          <svg
-            className="w-8 h-8 md:w-10 md:h-10"
-            viewBox="0 0 48 48"
-            fill="none"
-            xmlns="http://www.w3.org/2000/svg"
-          >
-            <path
-              d="M44.5 20H24v8.5h11.8C34.7 33 30.1 36 24 36c-6.6 0-12-5.4-12-12s5.4-12 12-12c3 0 5.8 1.1 7.9 2.9l6.4-6.4C34.6 4.1 29.6 2 24 2 11.9 2 2 11.9 2 24s9.9 22 22 22c13 0 21-9 21-21 0-1.3-.2-2.7-.5-4z"
-              fill="#4285F4"
-            />
-          </svg>
-          <div className={`flex flex-col ${textClassName}`}>
-            <div className="flex items-center gap-2">
-              <span className="text-xl md:text-2xl font-bold">{rating.toFixed(1)}</span>
-              <div className="flex gap-1">{renderStars()}</div>
-            </div>
-            <p className={`text-xs md:text-sm text-gray-600 dark:text-gray-400 ${reviewCountClassName}`}>
-              {reviewCount} reviews on Google
-            </p>
-          </div>
-        </div>
-        <a
-          href={`https://www.google.com/search?q=${encodeURIComponent(businessName)} reviews`}
-          target="_blank"
-          rel="noopener noreferrer"
-          className="text-xs md:text-sm text-blue-600 hover:text-blue-700 dark:text-blue-400 dark:hover:text-blue-300 underline mt-2 transition-colors"
-        >
-          View on Google
-        </a>
-      </div>
-    </div>
-  );
-}