Update src/app/page.tsx

Merge version_7 into main

src/app/page.tsx

@@ -10,7 +10,7 @@ import FaqSplitText from "@/components/sections/faq/FaqSplitText";
 import ContactSplit from "@/components/sections/contact/ContactSplit";
 import FooterLogoReveal from "@/components/sections/footer/FooterLogoReveal";
 import ProductCatalog from "@/components/ecommerce/productCatalog/ProductCatalog";
-import { CheckCircle, Eye, Filter, Phone, Search, Star, MapPin } from "lucide-react";
+import { CheckCircle, Eye, Filter, Phone, Search, Star, MapPin, Building2, Hotel, ZoomIn, ZoomOut, Search as SearchIcon } from "lucide-react";
 
 export default function LandingPage() {
   return (
@@ -68,17 +68,35 @@ export default function LandingPage() {
         <ProductCatalog
           layout="section"
           products={[]}
-          searchPlaceholder="Meklēt viesnīcas pēc atrašanās vietas..."
+          searchPlaceholder="Meklēt pilsētu..."
           filters={[
             { label: "Budžets", options: ["Zems", "Vidējs", "Augsts"], selected: "Vidējs", onChange: () => {} }
           ]}
-          toolbarClassName="cursor-pointer hover:opacity-80 transition-opacity"
-          className="group"
-          searchClassName="[&>button]:cursor-pointer"
-          onSearchChange={() => {
-            window.location.href = "/interactive-map";
-          }}
         />
+        <div className="flex justify-center p-8 border-t border-b bg-muted/20">
+            <div className="w-full max-w-4xl h-[500px] bg-slate-200 rounded-xl flex flex-col p-6 shadow-inner relative overflow-hidden">
+                <div className="flex items-center justify-between mb-4 bg-white p-3 rounded-lg shadow-sm border border-black/10">
+                  <div className="flex items-center gap-2">
+                    <SearchIcon className="w-5 h-5 text-muted-foreground" />
+                    <input type="text" placeholder="Meklēt atrašanās vietu..." className="outline-none" />
+                  </div>
+                  <div className="flex gap-2">
+                    <button className="p-2 hover:bg-slate-100 rounded"><ZoomIn className="w-5 h-5" /></button>
+                    <button className="p-2 hover:bg-slate-100 rounded"><ZoomOut className="w-5 h-5" /></button>
+                  </div>
+                </div>
+                <div className="flex-grow flex items-center justify-center bg-slate-300 rounded-lg relative">
+                    <div className="absolute top-1/3 left-1/4 flex flex-col items-center">
+                        <div className="bg-red-500 text-white p-2 rounded-full cursor-pointer animate-bounce border-2 border-white shadow-lg">📍</div>
+                        <div className="bg-white p-2 rounded shadow-md mt-1 font-bold text-sm text-center">Grand City<br/><span className="font-normal">€120/naktī</span></div>
+                    </div>
+                    <div className="absolute bottom-1/4 right-1/3 flex flex-col items-center">
+                        <div className="bg-blue-500 text-white p-2 rounded-full cursor-pointer border-2 border-white shadow-lg">📍</div>
+                        <div className="bg-white p-2 rounded shadow-md mt-1 font-bold text-sm text-center">Sunset View<br/><span className="font-normal">€85/naktī</span></div>
+                    </div>
+                </div>
+            </div>
+        </div>
       </div>
 
       <div id="destinations" data-section="destinations">
@@ -182,4 +200,4 @@ export default function LandingPage() {
       </div>
     </ThemeProvider>
   );
-}
+}