function Footer({ brandName, description, socialLinks, quickLinks, supportLinks, contactDetails, paymentIcons, year }) { return /*#__PURE__*/ React.createElement("footer", { className: "bg-[#1B4B43] text-white py-16 mt-20 w-full", __source: { fileName: "", lineNumber: 12, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-4", __source: { fileName: "", lineNumber: 13, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 sm:grid-cols-2 md:grid-cols-4 gap-8", __source: { fileName: "", lineNumber: 14, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 15, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "flex items-center space-x-2 mb-6", __source: { fileName: "", lineNumber: 16, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-paw text-3xl", __source: { fileName: "", lineNumber: 17, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-2xl font-bold", __source: { fileName: "", lineNumber: 18, columnNumber: 15 }, __self: this }, brandName)), /*#__PURE__*/ React.createElement("p", { className: "text-gray-300 mb-4", __source: { fileName: "", lineNumber: 20, columnNumber: 13 }, __self: this }, description), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-4", __source: { fileName: "", lineNumber: 21, columnNumber: 13 }, __self: this }, socialLinks.map(({ href, icon, label }, index)=>/*#__PURE__*/ React.createElement("a", { key: index, href: href, className: "text-white hover:text-gray-300 transition-colors", "aria-label": label, __source: { fileName: "", lineNumber: 23, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: icon + " text-xl", __source: { fileName: "", lineNumber: 29, columnNumber: 19 }, __self: this }))))), /*#__PURE__*/ React.createElement("div", { className: "mt-8 sm:mt-0", __source: { fileName: "", lineNumber: 35, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h4", { className: "text-lg font-medium mb-4", __source: { fileName: "", lineNumber: 36, columnNumber: 13 }, __self: this }, "Quick Links"), /*#__PURE__*/ React.createElement("ul", { className: "space-y-2", __source: { fileName: "", lineNumber: 37, columnNumber: 13 }, __self: this }, quickLinks.map(({ href, text, target, rel }, index)=>/*#__PURE__*/ React.createElement("li", { key: index, __source: { fileName: "", lineNumber: 39, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: href, className: "text-gray-300 hover:text-white transition-colors", target: target, rel: rel, __source: { fileName: "", lineNumber: 40, columnNumber: 19 }, __self: this }, text))))), /*#__PURE__*/ React.createElement("div", { className: "mt-8 md:mt-0", __source: { fileName: "", lineNumber: 53, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h4", { className: "text-lg font-medium mb-4", __source: { fileName: "", lineNumber: 54, columnNumber: 13 }, __self: this }, "Support"), /*#__PURE__*/ React.createElement("ul", { className: "space-y-2", __source: { fileName: "", lineNumber: 55, columnNumber: 13 }, __self: this }, supportLinks.map(({ href, text, target, rel }, index)=>/*#__PURE__*/ React.createElement("li", { key: index, __source: { fileName: "", lineNumber: 57, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: href, className: "text-gray-300 hover:text-white transition-colors", target: target, rel: rel, __source: { fileName: "", lineNumber: 58, columnNumber: 19 }, __self: this }, text))))), /*#__PURE__*/ React.createElement("div", { className: "mt-8 md:mt-0", __source: { fileName: "", lineNumber: 71, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h4", { className: "text-lg font-medium mb-4", __source: { fileName: "", lineNumber: 72, columnNumber: 13 }, __self: this }, "Contact"), /*#__PURE__*/ React.createElement("ul", { className: "space-y-2", __source: { fileName: "", lineNumber: 73, columnNumber: 13 }, __self: this }, contactDetails.map(({ icon, text }, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "flex items-center space-x-2", __source: { fileName: "", lineNumber: 75, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `${icon} text-gray-300`, __source: { fileName: "", lineNumber: 76, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-gray-300", __source: { fileName: "", lineNumber: 77, columnNumber: 19 }, __self: this }, text)))))), /*#__PURE__*/ React.createElement("div", { className: "border-t border-gray-700 mt-12 pt-8 flex flex-col md:flex-row justify-between items-center", __source: { fileName: "", lineNumber: 84, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-gray-300 text-sm mb-4 md:mb-0", __source: { fileName: "", lineNumber: 85, columnNumber: 11 }, __self: this }, "© ", year, " ", brandName, ". All rights reserved."), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap justify-center md:justify-end items-center gap-4", __source: { fileName: "", lineNumber: 88, columnNumber: 11 }, __self: this }, paymentIcons.map((icon, index)=>/*#__PURE__*/ React.createElement("i", { key: index, className: `${icon} text-3xl text-gray-300 hover:text-white transition-colors`, __source: { fileName: "", lineNumber: 90, columnNumber: 15 }, __self: this })))))); } function FooterStory() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 104, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(Footer, { brandName: "Sniffbnb", description: "Making pet care easy and stress-free for everyone.", socialLinks: [ { href: "#", icon: "fab fa-facebook", label: "Facebook" }, { href: "#", icon: "fab fa-twitter", label: "Twitter" }, { href: "#", icon: "fab fa-instagram", label: "Instagram" } ], quickLinks: [ { href: "/sniffbnb-search", text: "Find a Sitter" }, { href: "https://services.sniffbnb.com/", text: "Become a Service Provider", target: "_blank", rel: "noopener noreferrer" } ], supportLinks: [ { href: "#", text: "Safety" }, { href: "#", text: "Terms of Service" }, { href: "#", text: "Privacy Policy" }, { href: "/cancellation-refund-policy", text: "Cancellation & Refund Policy", target: "_blank", rel: "noopener noreferrer" } ], contactDetails: [ { icon: "fas fa-envelope", text: "support@sniffbnb.com" }, { icon: "fas fa-phone", text: "+91 - 9653539979" }, { icon: "fas fa-map-marker-alt", text: "Gurugram, Haryana" } ], paymentIcons: [ "fab fa-cc-visa", "fab fa-cc-mastercard", "fab fa-cc-amex" ], year: 2025, __source: { fileName: "", lineNumber: 105, columnNumber: 7 }, __self: this })); } function Header1({ user, currentAnimal = 0 }) { const [showSignupModal, setShowSignupModal] = useState(false); const [isMenuOpen, setIsMenuOpen] = useState(false); const [showLoginModal, setShowLoginModal] = useState(false); const [showProfileDropdown, setShowProfileDropdown] = useState(false); const [personalInfo, setPersonalInfo] = useState(null); const dropdownRef = useRef(null); useEffect(()=>{ async function fetchUserData() { if (user?.id) { try { const response = await fetch("/api/db/customerprofile", { method: "POST", body: JSON.stringify({ query: "SELECT * FROM customer_profile WHERE user_id = ?", values: [ user.id ] }) }); const data = await response.json(); if (data && data[0]) { setPersonalInfo(data[0]); } } catch (err) { console.error("Failed to fetch user data:", err); } } } fetchUserData(); }, [ user ]); useEffect(()=>{ function handleClickOutside(event) { if (dropdownRef.current && !dropdownRef.current.contains(event.target)) { setShowProfileDropdown(false); } } document.addEventListener("mousedown", handleClickOutside); return ()=>document.removeEventListener("mousedown", handleClickOutside); }, []); const getDisplayName = ()=>{ if (personalInfo?.first_name && personalInfo?.last_name) { return `${personalInfo.first_name} ${personalInfo.last_name}`; } return user?.name || "Guest"; }; const getInitials = ()=>{ if (personalInfo?.first_name && personalInfo?.last_name) { return `${personalInfo.first_name[0]}${personalInfo.last_name[0]}`; } if (user?.name) { const nameParts = user.name.split(" "); if (nameParts.length > 1) { return `${nameParts[0][0]}${nameParts[nameParts.length - 1][0]}`; } return user.name[0]; } return "G"; }; const menuItems = { main: [ { href: "/", label: "Home", icon: "home" }, { href: "/sniffbnb-search", label: "Find a Service Provider", icon: "search" } ], account: [ { href: "/petparentpage", label: "My Bookings", icon: "calendar-check" }, { href: "/editprofile", label: "Edit Profile", icon: "user-edit" } ], other: [ { href: "https://adopt.sniffbnb.com", label: "Adopt a Pet", icon: "paw", external: true }, { href: "https://services.sniffbnb.com/", label: "Become a Service Provider", icon: "briefcase", external: true }, { href: "/account/logout", label: "Logout", icon: "sign-out-alt" } ] }; const publicMenuItems = [ { href: "/sniffbnb-search", label: "Find a Service Provider", icon: "search" }, { href: "https://services.sniffbnb.com/", label: "Become a Service Provider", icon: "briefcase", external: true } ]; const handleLoginClick = ()=>{ setIsMenuOpen(false); setShowLoginModal(true); }; const handleCloseLoginModal = ()=>{ setShowLoginModal(false); }; const handleSignupClick = ()=>{ setIsMenuOpen(false); setShowSignupModal(true); }; const handleCloseSignupModal = ()=>{ setShowSignupModal(false); }; const renderLoginModal = ()=>/*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-[100] p-4", __source: { fileName: "", lineNumber: 126, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-xl w-full max-w-[400px] max-h-[90vh] overflow-y-auto modal-content", __source: { fileName: "", lineNumber: 127, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4 border-b border-gray-100 flex justify-between items-center", __source: { fileName: "", lineNumber: 128, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-medium text-[#1B4B43]", __source: { fileName: "", lineNumber: 129, columnNumber: 11 }, __self: this }, "Login As"), /*#__PURE__*/ React.createElement("button", { onClick: handleCloseLoginModal, className: "text-gray-400 hover:text-gray-600 transition-colors", __source: { fileName: "", lineNumber: 130, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times text-xl", __source: { fileName: "", lineNumber: 134, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "p-6 space-y-4", __source: { fileName: "", lineNumber: 137, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/account/signin?callbackUrl=/", className: "block w-full bg-[#1B4B43] text-white py-3 rounded-lg text-center hover:bg-[#143832] transition-colors", __source: { fileName: "", lineNumber: 138, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-user mr-2", __source: { fileName: "", lineNumber: 142, columnNumber: 13 }, __self: this }), "Login as Customer"), /*#__PURE__*/ React.createElement("a", { href: "https://services.sniffbnb.com/account/signin?callbackUrl=/", target: "_blank", rel: "noopener noreferrer", className: "block w-full border-2 border-[#1B4B43] text-[#1B4B43] py-3 rounded-lg text-center hover:bg-[#1B4B43] hover:text-white transition-colors", __source: { fileName: "", lineNumber: 145, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-briefcase mr-2", __source: { fileName: "", lineNumber: 151, columnNumber: 13 }, __self: this }), "Login as Service Provider")))); const renderSignupModal = ()=>/*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-[100] p-4", __source: { fileName: "", lineNumber: 160, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-xl w-full max-w-[400px] max-h-[90vh] overflow-y-auto modal-content", __source: { fileName: "", lineNumber: 161, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4 border-b border-gray-100 flex justify-between items-center", __source: { fileName: "", lineNumber: 162, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-medium text-[#1B4B43]", __source: { fileName: "", lineNumber: 163, columnNumber: 11 }, __self: this }, "Sign Up As"), /*#__PURE__*/ React.createElement("button", { onClick: handleCloseSignupModal, className: "text-gray-400 hover:text-gray-600 transition-colors", __source: { fileName: "", lineNumber: 164, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times text-xl", __source: { fileName: "", lineNumber: 168, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "p-6 space-y-4", __source: { fileName: "", lineNumber: 171, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/account/signup?callbackUrl=/editprofile", className: "block w-full bg-[#1B4B43] text-white py-3 rounded-lg text-center hover:bg-[#143832] transition-colors", __source: { fileName: "", lineNumber: 172, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-user mr-2", __source: { fileName: "", lineNumber: 176, columnNumber: 13 }, __self: this }), "Sign up as Customer"), /*#__PURE__*/ React.createElement("a", { href: "https://services.sniffbnb.com/", target: "_blank", rel: "noopener noreferrer", className: "block w-full border-2 border-[#1B4B43] text-[#1B4B43] py-3 rounded-lg text-center hover:bg-[#1B4B43] hover:text-white transition-colors", __source: { fileName: "", lineNumber: 179, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-briefcase mr-2", __source: { fileName: "", lineNumber: 185, columnNumber: 13 }, __self: this }), "Sign up as Service Provider")))); const renderMobileMenu = ()=>/*#__PURE__*/ React.createElement("div", { className: `md:hidden fixed inset-0 z-[200] ${isMenuOpen ? "pointer-events-auto" : "pointer-events-none"}`, __source: { fileName: "", lineNumber: 194, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `absolute inset-0 bg-black/50 backdrop-blur-sm transition-opacity duration-300 ${isMenuOpen ? "opacity-100" : "opacity-0"}`, onClick: ()=>setIsMenuOpen(false), __source: { fileName: "", lineNumber: 197, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: `absolute inset-y-0 right-0 w-[280px] bg-white shadow-2xl transform transition-transform duration-300 ease-out ${isMenuOpen ? "translate-x-0" : "translate-x-full"}`, __source: { fileName: "", lineNumber: 204, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "sticky top-0 bg-white/95 backdrop-blur-sm border-b border-gray-100 px-4 py-3 flex items-center justify-between", __source: { fileName: "", lineNumber: 209, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "flex items-center space-x-2", __source: { fileName: "", lineNumber: 210, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-8 h-8 rounded-lg bg-[#1B4B43]/10 flex items-center justify-center", __source: { fileName: "", lineNumber: 211, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-paw text-[#1B4B43]", __source: { fileName: "", lineNumber: 212, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "font-medium text-[#1B4B43]", __source: { fileName: "", lineNumber: 214, columnNumber: 13 }, __self: this }, "Menu")), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsMenuOpen(false), className: "w-10 h-10 flex items-center justify-center rounded-lg hover:bg-gray-50 active:bg-gray-100", __source: { fileName: "", lineNumber: 216, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times text-gray-600", __source: { fileName: "", lineNumber: 220, columnNumber: 13 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "overflow-y-auto h-full pb-20", __source: { fileName: "", lineNumber: 224, columnNumber: 9 }, __self: this }, user ? /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { className: "p-4 border-b", __source: { fileName: "", lineNumber: 227, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-3", __source: { fileName: "", lineNumber: 228, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-12 h-12 rounded-lg bg-[#1B4B43] text-white flex items-center justify-center font-medium", __source: { fileName: "", lineNumber: 229, columnNumber: 19 }, __self: this }, getInitials()), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 232, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-medium", __source: { fileName: "", lineNumber: 233, columnNumber: 21 }, __self: this }, getDisplayName()), /*#__PURE__*/ React.createElement("div", { className: "text-sm text-gray-500", __source: { fileName: "", lineNumber: 234, columnNumber: 21 }, __self: this }, user.email)))), Object.entries(menuItems).map(([section, items], index)=>/*#__PURE__*/ React.createElement("div", { key: section, className: index > 0 ? "border-t border-gray-100" : "", __source: { fileName: "", lineNumber: 239, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-2", __source: { fileName: "", lineNumber: 243, columnNumber: 19 }, __self: this }, items.map((item)=>/*#__PURE__*/ React.createElement("a", { key: item.href, href: item.href, target: item.external ? "_blank" : undefined, rel: item.external ? "noopener noreferrer" : undefined, className: "flex items-center space-x-3 p-2 rounded-lg hover:bg-gray-50 active:bg-gray-100 ripple", __source: { fileName: "", lineNumber: 245, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-10 h-10 rounded-lg bg-[#1B4B43]/10 flex items-center justify-center", __source: { fileName: "", lineNumber: 252, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas fa-${item.icon} text-[#1B4B43]`, __source: { fileName: "", lineNumber: 253, columnNumber: 27 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 257, columnNumber: 25 }, __self: this }, item.label))))))) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { className: "p-2", __source: { fileName: "", lineNumber: 266, columnNumber: 15 }, __self: this }, publicMenuItems.map((item)=>/*#__PURE__*/ React.createElement("a", { key: item.href, href: item.href, target: item.external ? "_blank" : undefined, rel: item.external ? "noopener noreferrer" : undefined, className: "flex items-center space-x-3 p-2 rounded-lg hover:bg-gray-50 active:bg-gray-100 ripple", __source: { fileName: "", lineNumber: 268, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-10 h-10 rounded-lg bg-[#1B4B43]/10 flex items-center justify-center", __source: { fileName: "", lineNumber: 275, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas fa-${item.icon} text-[#1B4B43]`, __source: { fileName: "", lineNumber: 276, columnNumber: 23 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 278, columnNumber: 21 }, __self: this }, item.label)))), /*#__PURE__*/ React.createElement("div", { className: "p-4 border-t", __source: { fileName: "", lineNumber: 282, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-2", __source: { fileName: "", lineNumber: 283, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: handleLoginClick, className: "w-full flex items-center justify-center space-x-2 p-3 rounded-lg hover:bg-gray-50 active:bg-gray-100 ripple", __source: { fileName: "", lineNumber: 284, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-sign-in-alt text-[#1B4B43]", __source: { fileName: "", lineNumber: 288, columnNumber: 21 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 289, columnNumber: 21 }, __self: this }, "Log in")), /*#__PURE__*/ React.createElement("button", { onClick: handleSignupClick, className: "w-full flex items-center justify-center space-x-2 bg-[#1B4B43] text-white p-3 rounded-lg hover:bg-[#143832] active:bg-[#0D2B26] ripple", __source: { fileName: "", lineNumber: 291, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-user-plus", __source: { fileName: "", lineNumber: 295, columnNumber: 21 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 296, columnNumber: 21 }, __self: this }, "Sign up")))))))); return /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 308, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("nav", { className: "relative z-50 bg-white border-b border-gray-200/50 sticky top-0", __source: { fileName: "", lineNumber: 309, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "max-w-7xl mx-auto py-3", __source: { fileName: "", lineNumber: 310, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between px-4", __source: { fileName: "", lineNumber: 311, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/", className: "flex items-center group", __source: { fileName: "", lineNumber: 312, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center relative w-10 h-10 mr-2", __source: { fileName: "", lineNumber: 313, columnNumber: 15 }, __self: this }, [ "dog", "cat", "dove", "rabbit" ].map((animal, index)=>/*#__PURE__*/ React.createElement("i", { key: animal, className: `fas fa-${animal} text-[#1B4B43] text-3xl absolute left-0 transform transition-all duration-700 ease-in-out ${currentAnimal === index ? "opacity-100 scale-100" : "opacity-0 scale-95"} group-hover:text-[#143832]`, __source: { fileName: "", lineNumber: 315, columnNumber: 19 }, __self: this }))), /*#__PURE__*/ React.createElement("span", { className: "text-[#1B4B43] text-2xl font-bold tracking-tight group-hover:text-[#143832] transition-colors", __source: { fileName: "", lineNumber: 323, columnNumber: 15 }, __self: this }, "Sniffbnb")), /*#__PURE__*/ React.createElement("div", { className: "hidden md:flex items-center space-x-6", __source: { fileName: "", lineNumber: 327, columnNumber: 13 }, __self: this }, !user && /*#__PURE__*/ React.createElement(React.Fragment, null, publicMenuItems.map((item)=>/*#__PURE__*/ React.createElement("a", { key: item.href, href: item.href, target: item.external ? "_blank" : undefined, rel: item.external ? "noopener noreferrer" : undefined, className: "text-gray-600 hover:text-[#1B4B43] transition-all duration-300 hover:scale-105 transform text-sm font-medium", __source: { fileName: "", lineNumber: 331, columnNumber: 21 }, __self: this }, item.label)), /*#__PURE__*/ React.createElement("button", { onClick: handleLoginClick, className: "text-[#1B4B43] hover:text-[#143832] transition-all duration-300 hover:scale-105 transform font-medium text-sm px-4 py-2 rounded-lg hover:bg-[#1B4B43]/5", __source: { fileName: "", lineNumber: 341, columnNumber: 19 }, __self: this }, "Log in"), /*#__PURE__*/ React.createElement("button", { onClick: handleSignupClick, className: "bg-[#1B4B43] hover:bg-[#143832] text-white px-6 py-2 rounded-lg transition-all duration-300 hover:shadow-md hover:shadow-[#1B4B43]/10 hover:scale-105 transform font-medium text-sm", __source: { fileName: "", lineNumber: 347, columnNumber: 19 }, __self: this }, "Sign up")), user && /*#__PURE__*/ React.createElement("div", { className: "relative", ref: dropdownRef, __source: { fileName: "", lineNumber: 356, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowProfileDropdown(!showProfileDropdown), className: "flex items-center space-x-3 focus:outline-none group bg-white/50 hover:bg-white rounded-xl px-3 py-2 transition-all duration-300", __source: { fileName: "", lineNumber: 357, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-9 h-9 rounded-lg bg-gradient-to-br from-[#1B4B43] to-[#143832] text-white flex items-center justify-center text-sm shadow-sm group-hover:shadow-md transition-all duration-300", __source: { fileName: "", lineNumber: 361, columnNumber: 21 }, __self: this }, getInitials().toUpperCase()), /*#__PURE__*/ React.createElement("div", { className: "text-left", __source: { fileName: "", lineNumber: 364, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-sm font-medium text-gray-900 group-hover:text-[#1B4B43] transition-colors duration-300", __source: { fileName: "", lineNumber: 365, columnNumber: 23 }, __self: this }, getDisplayName()), /*#__PURE__*/ React.createElement("p", { className: "text-xs text-gray-500 transition-colors duration-300", __source: { fileName: "", lineNumber: 368, columnNumber: 23 }, __self: this }, user.email)), /*#__PURE__*/ React.createElement("i", { className: `fas fa-chevron-down transform transition-all duration-300 ${showProfileDropdown ? "rotate-180" : ""} text-gray-400 group-hover:text-[#1B4B43]`, __source: { fileName: "", lineNumber: 372, columnNumber: 21 }, __self: this })), showProfileDropdown && /*#__PURE__*/ React.createElement("div", { className: "absolute right-0 mt-2 w-72 bg-white/95 rounded-xl shadow-lg py-2 border border-gray-100/80 transform transition-all duration-300 animate-dropdown backdrop-blur-sm", __source: { fileName: "", lineNumber: 379, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "px-3 py-2 border-b border-gray-100/80", __source: { fileName: "", lineNumber: 380, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-3", __source: { fileName: "", lineNumber: 381, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-12 h-12 rounded-lg bg-gradient-to-br from-[#1B4B43]/10 to-[#143832]/10 flex items-center justify-center", __source: { fileName: "", lineNumber: 382, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-user text-[#1B4B43] text-lg", __source: { fileName: "", lineNumber: 383, columnNumber: 29 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 385, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-sm font-medium text-gray-900", __source: { fileName: "", lineNumber: 386, columnNumber: 29 }, __self: this }, getDisplayName()), /*#__PURE__*/ React.createElement("p", { className: "text-xs text-gray-500", __source: { fileName: "", lineNumber: 389, columnNumber: 29 }, __self: this }, user.email)))), Object.entries(menuItems).map(([section, items], sectionIndex)=>/*#__PURE__*/ React.createElement("div", { key: section, __source: { fileName: "", lineNumber: 397, columnNumber: 27 }, __self: this }, sectionIndex > 0 && /*#__PURE__*/ React.createElement("div", { className: "border-t border-gray-100/80 my-1", __source: { fileName: "", lineNumber: 399, columnNumber: 31 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "px-1.5 py-1", __source: { fileName: "", lineNumber: 401, columnNumber: 29 }, __self: this }, items.map((item)=>/*#__PURE__*/ React.createElement("a", { key: item.href, href: item.href, target: item.external ? "_blank" : undefined, rel: item.external ? "noopener noreferrer" : undefined, className: "flex items-center space-x-3 px-2.5 py-2 rounded-lg text-gray-700 hover:bg-[#1B4B43]/5 hover:text-[#1B4B43] transition-all duration-300 group", __source: { fileName: "", lineNumber: 403, columnNumber: 33 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-9 h-9 rounded-lg bg-gradient-to-br from-[#1B4B43]/10 to-[#143832]/10 flex items-center justify-center group-hover:from-[#1B4B43]/20 group-hover:to-[#143832]/20 transition-colors duration-300", __source: { fileName: "", lineNumber: 414, columnNumber: 35 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas fa-${item.icon} text-[#1B4B43] text-sm`, __source: { fileName: "", lineNumber: 415, columnNumber: 37 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "text-sm font-medium", __source: { fileName: "", lineNumber: 419, columnNumber: 35 }, __self: this }, item.label))))))))), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setIsMenuOpen(!isMenuOpen), className: "md:hidden p-2 rounded-lg hover:bg-[#1B4B43]/5 transition-colors", __source: { fileName: "", lineNumber: 433, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas fa-${isMenuOpen ? "times" : "bars"} text-[#1B4B43] text-lg`, __source: { fileName: "", lineNumber: 437, columnNumber: 15 }, __self: this }))), isMenuOpen && renderMobileMenu())), showLoginModal && renderLoginModal(), showSignupModal && renderSignupModal(), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 449, columnNumber: 7 }, __self: this }, ` @keyframes modalFadeIn { from { opacity: 0; transform: scale(0.95); } to { opacity: 1; transform: scale(1); } } .animate-dropdown { animation: modalFadeIn 0.3s ease-out forwards; } .modal-content { animation: modalFadeIn 0.3s ease-out forwards; } `)); } function Header1Story() { const [currentAnimal, setCurrentAnimal] = useState(0); useEffect(()=>{ const interval = setInterval(()=>{ setCurrentAnimal((prev)=>(prev + 1) % 4); }, 3000); return ()=>clearInterval(interval); }, []); return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gray-50", __source: { fileName: "", lineNumber: 482, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-8", __source: { fileName: "", lineNumber: 483, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-semibold mb-2 px-4", __source: { fileName: "", lineNumber: 484, columnNumber: 9 }, __self: this }, "Header - Anonymous User"), /*#__PURE__*/ React.createElement(Header1, { currentAnimal: currentAnimal, __source: { fileName: "", lineNumber: 487, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 489, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-semibold mb-2 px-4", __source: { fileName: "", lineNumber: 490, columnNumber: 9 }, __self: this }, "Header - Logged In User"), /*#__PURE__*/ React.createElement(Header1, { user: { id: "123", name: "John Doe", email: "john@example.com" }, currentAnimal: currentAnimal, __source: { fileName: "", lineNumber: 493, columnNumber: 9 }, __self: this }))); } function BlogAdoptionCard() { return /*#__PURE__*/ React.createElement("div", { className: "w-full bg-gradient-to-br from-[#7B2CBF] via-[#9D4EDD] to-[#C77DFF] rounded-xl shadow-lg hover:shadow-xl transition-all duration-300 overflow-hidden", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative px-6 py-8 md:py-10", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute top-0 right-0 w-32 h-32 opacity-10", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-paw text-[100px] text-white transform -rotate-12", __source: { fileName: "", lineNumber: 6, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "grid md:grid-cols-12 gap-8 items-center", __source: { fileName: "", lineNumber: 9, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "md:col-span-7 relative z-10", __source: { fileName: "", lineNumber: 10, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-4 mb-6", __source: { fileName: "", lineNumber: 11, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-3 rounded-full shadow-md", __source: { fileName: "", lineNumber: 12, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-bone text-[#7B2CBF] text-2xl", __source: { fileName: "", lineNumber: 13, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("h2", { className: "text-white text-3xl font-bold", __source: { fileName: "", lineNumber: 15, columnNumber: 15 }, __self: this }, "Adopt, Don't Buy a Pet")), /*#__PURE__*/ React.createElement("p", { className: "text-white text-xl font-light mb-8 leading-relaxed", __source: { fileName: "", lineNumber: 20, columnNumber: 13 }, __self: this }, '"Every wagging tail and gentle purr is a reminder that the best things in life come with four paws and a loving heart."'), /*#__PURE__*/ React.createElement("div", { className: "flex gap-6", __source: { fileName: "", lineNumber: 25, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 26, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white/20 backdrop-blur-sm rounded-lg p-3 mb-2", __source: { fileName: "", lineNumber: 27, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-dog text-white text-2xl", __source: { fileName: "", lineNumber: 28, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "text-white text-sm", __source: { fileName: "", lineNumber: 30, columnNumber: 17 }, __self: this }, "Loyal Friend")), /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 32, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white/20 backdrop-blur-sm rounded-lg p-3 mb-2", __source: { fileName: "", lineNumber: 33, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-cat text-white text-2xl", __source: { fileName: "", lineNumber: 34, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "text-white text-sm", __source: { fileName: "", lineNumber: 36, columnNumber: 17 }, __self: this }, "Purr-fect Match")), /*#__PURE__*/ React.createElement("div", { className: "text-center", __source: { fileName: "", lineNumber: 38, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white/20 backdrop-blur-sm rounded-lg p-3 mb-2", __source: { fileName: "", lineNumber: 39, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-home text-white text-2xl", __source: { fileName: "", lineNumber: 40, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "text-white text-sm", __source: { fileName: "", lineNumber: 42, columnNumber: 17 }, __self: this }, "Forever Home")))), /*#__PURE__*/ React.createElement("div", { className: "md:col-span-5", __source: { fileName: "", lineNumber: 47, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white/95 backdrop-blur-sm rounded-xl p-6 shadow-lg", __source: { fileName: "", lineNumber: 48, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center mb-6", __source: { fileName: "", lineNumber: 49, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-paw text-[#7B2CBF] text-3xl mb-3", __source: { fileName: "", lineNumber: 50, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("h3", { className: "text-[#7B2CBF] font-bold text-xl", __source: { fileName: "", lineNumber: 51, columnNumber: 17 }, __self: this }, "Find Your Perfect Companion")), /*#__PURE__*/ React.createElement("a", { href: "https://adopt.sniffbnb.com", target: "_blank", rel: "noopener noreferrer", className: "block w-full bg-gradient-to-r from-[#7B2CBF] to-[#9D4EDD] text-white py-4 px-6 rounded-lg hover:from-[#9D4EDD] hover:to-[#C77DFF] transform hover:scale-105 transition-all duration-300 text-center group", __source: { fileName: "", lineNumber: 56, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "flex items-center justify-center gap-2", __source: { fileName: "", lineNumber: 62, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-paw", __source: { fileName: "", lineNumber: 63, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "font-medium", __source: { fileName: "", lineNumber: 64, columnNumber: 19 }, __self: this }, "Meet Your New Friend"), /*#__PURE__*/ React.createElement("i", { className: "fas fa-arrow-right group-hover:translate-x-1 transition-transform", __source: { fileName: "", lineNumber: 65, columnNumber: 19 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "mt-4 text-center", __source: { fileName: "", lineNumber: 69, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-gray-500 text-sm", __source: { fileName: "", lineNumber: 70, columnNumber: 17 }, __self: this }, "Trusted by animal lovers nationwide"))))))); } function BlogAdoptionCardStory() { return /*#__PURE__*/ React.createElement("div", { className: "p-4 space-y-8", __source: { fileName: "", lineNumber: 84, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 85, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-medium mb-4", __source: { fileName: "", lineNumber: 86, columnNumber: 9 }, __self: this }, "Adoption Card"), /*#__PURE__*/ React.createElement(BlogAdoptionCard, { __source: { fileName: "", lineNumber: 87, columnNumber: 9 }, __self: this }))); } function MainComponent() { const [showLoginModal, setShowLoginModal] = useState(false); const [showSignupModal, setShowSignupModal] = useState(false); const [location, setLocation] = useState(""); const [coordinates, setCoordinates] = useState(null); const [currentAnimal, setCurrentAnimal] = useState(0); const [error, setError] = useState(""); const [predictions, setPredictions] = useState([]); const [showPredictions, setShowPredictions] = useState(false); const [isLoading, setIsLoading] = useState(false); const [isMenuOpen, setIsMenuOpen] = useState(false); const [showLocation, setShowLocation] = useState(false); const [locationInput, setLocationInput] = useState(""); const [pageLoading, setPageLoading] = useState(true); const [isVerifyingEmail, setIsVerifyingEmail] = useState(false); const [scrollPosition, setScrollPosition] = useState(0); const [showMobileNav, setShowMobileNav] = useState(false); const [modalLoading, setModalLoading] = useState(false); const [personalInfo, setPersonalInfo] = useState(null); const [isNavigating, setIsNavigating] = useState(false); const [clickedService, setClickedService] = useState(null); const reviewsRef = useRef(null); const { data: user, loading: userLoading } = useUser(); const params = typeof window !== "undefined" ? new URLSearchParams(window.location.search) : new URLSearchParams(); const services = [ { icon: "house-user", title: "Pet Boarding", tooltip: "Your pet stays at sitter's home 11 AM - 11 AM next day Going on a trip but can't bring your furry friend? No worries! A pet sitter can provide a loving home-away-from-home experience. Your pet will receive personalized care, including regular feeding, playtime, and plenty of cuddles, ensuring they feel happy and comfortable while you're away. They'll enjoy companionship and attention, so you can relax knowing they're in good hands.", subtitle: /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 35, columnNumber: 9 }, __self: this }, "Your pet stays at sitter's home", " ", /*#__PURE__*/ React.createElement("span", { className: "inline-flex items-center bg-[#1B4B43]/10 text-[#1B4B43] px-2 py-0.5 rounded-full text-[10px] md:text-xs", __source: { fileName: "", lineNumber: 37, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-clock mr-1", __source: { fileName: "", lineNumber: 38, columnNumber: 13 }, __self: this }), "11 AM - 11 AM next day")), priceType: "night", overnight: true, image: "https://ucarecdn.com/f31ebbda-ea76-4b0e-8a3e-51bb6fa60f25/-/format/auto/" }, { icon: "home", title: "House Sitting", tooltip: "Sitter stays at your home 11 AM - 11 AM next day Does your pet feel most secure at home? You can trust our police-verified sitters to provide overnight care in your house, giving personalized attention and following their familiar routine, from meal times and playtime to cuddles and comfort. This service is perfect for pets who are happiest in their own surroundings or need a little extra care.", subtitle: /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 53, columnNumber: 9 }, __self: this }, "Sitter stays at your home", " ", /*#__PURE__*/ React.createElement("span", { className: "inline-flex items-center bg-[#1B4B43]/10 text-[#1B4B43] px-2 py-0.5 rounded-full text-[10px] md:text-xs", __source: { fileName: "", lineNumber: 55, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-clock mr-1", __source: { fileName: "", lineNumber: 56, columnNumber: 13 }, __self: this }), "11 AM - 11 AM next day")), priceType: "night", overnight: true, image: "https://ucarecdn.com/9bae494e-a2d3-403c-97bf-642043b125bd/-/format/auto/" }, { icon: "sun", title: "Daycare Services", tooltip: "Your pet stays at sitter's home in day time 8 hours Worried about your pet being home alone all day? Our sitters provide daytime care in their homes, offering personalized playtime, cuddles, and companionship. Your pet will enjoy a stimulating and loving environment while you're away.", subtitle: /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 71, columnNumber: 9 }, __self: this }, "Your pet stays at sitter's home in day time", " ", /*#__PURE__*/ React.createElement("span", { className: "inline-flex items-center bg-[#1B4B43]/10 text-[#1B4B43] px-2 py-0.5 rounded-full text-[10px] md:text-xs", __source: { fileName: "", lineNumber: 73, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-clock mr-1", __source: { fileName: "", lineNumber: 74, columnNumber: 13 }, __self: this }), "8 hours")), priceType: "day", image: "https://ucarecdn.com/ea357be0-9f5d-41eb-bd1d-d4958ecb3179/-/format/auto/" }, { icon: "clock", title: "Drop-In Visits", tooltip: "Regular check-in visits 2-3 visits per day If you don't need full-time pet care, but just want someone to check in on your pet a few times in a day, a sitter can visit your home 2-3 times. They will feed your pet, give them fresh water, take them for a short walk, and spend some time with them so they don't feel lonely. This is great for pets who are mostly independent but still need some care and attention.", subtitle: /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 88, columnNumber: 9 }, __self: this }, "Regular check-in visits", " ", /*#__PURE__*/ React.createElement("span", { className: "inline-flex items-center bg-[#1B4B43]/10 text-[#1B4B43] px-2 py-0.5 rounded-full text-[10px] md:text-xs", __source: { fileName: "", lineNumber: 90, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-clock mr-1", __source: { fileName: "", lineNumber: 91, columnNumber: 13 }, __self: this }), "2-3 visits per day")), priceType: "visit", image: "https://ucarecdn.com/3e394756-b732-42ed-bd50-8de87c877677/-/format/auto/" }, { icon: "walking", title: "Dog Walking", tooltip: "Professional dog walking If you don't have time to walk your dog, a sitter can do it for you. They will take your dog on a 35-40 minute walk, giving them fresh air and exercise they need. This helps keep your dog happy, active, and healthy.", subtitle: "Professional dog walking", priceType: "walk", image: "https://ucarecdn.com/67465be2-8e57-40fd-9209-6afb49c700ed/-/format/auto/" }, { icon: "scissors", title: "Pet Grooming", tooltip: "Professional grooming service Pamper your pet with our professional grooming services! From luxurious baths and stylish haircuts to nail trims and more, we'll have your furry friend looking and feeling fresh, clean, and happy. Healthy skin and a beautiful coat are just the beginning!", subtitle: "Professional grooming service", priceType: "session", image: "https://ucarecdn.com/24e27bba-34d7-4c8b-93e2-803c0225f100/-/format/auto/" } ]; const getCurrentLocation = async ()=>{ if ("geolocation" in navigator) { try { const permissionStatus = await navigator.permissions.query({ name: "geolocation" }); if (permissionStatus.state === "denied") { setError("Location access was denied. Please enable location access in your browser settings to use this feature."); return; } setIsLoading(true); const position = await new Promise((resolve, reject)=>{ navigator.geolocation.getCurrentPosition(resolve, reject, { timeout: 10000, enableHighAccuracy: true }); }); console.log("Got position:", position.coords); const response = await fetch("/api/current-location", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ latitude: position.coords.latitude, longitude: position.coords.longitude }) }); const data = await response.json(); if (data.error) { console.error("Location error:", data.error); setError(data.error); return; } setLocation(data.formattedAddress); setLocationInput(data.formattedAddress); setCoordinates({ lat: position.coords.latitude, lng: position.coords.longitude }); console.log("Location updated:", data.formattedAddress); } catch (error) { console.error("Failed to get location:", error); if (error.code === 1) { setError("Location access was denied. Please enable location access in your browser settings."); } else { setError("Unable to get location. Please try again or enter manually."); } } finally{ setIsLoading(false); } } else { setError("Geolocation is not supported by your browser"); } }; useEffect(()=>{ const locationParam = params.get("location"); const latParam = params.get("lat"); const lngParam = params.get("lng"); if (locationParam && latParam && lngParam) { setLocation(locationParam); setLocationInput(locationInput); setCoordinates({ lat: parseFloat(latParam), lng: parseFloat(lngParam) }); } else if (user?.id && !localStorage.getItem(`location_set_${user.id}`)) { setShowLocation(true); localStorage.setItem(`location_set_${user.id}`, "true"); } else { getCurrentLocation(); } fetch("/api/google-analytics", { method: "POST" }).then((res)=>res.json()).then((data)=>{ if (data.script) { const scriptContainer = document.createElement("div"); scriptContainer.innerHTML = data.script; document.head.appendChild(scriptContainer); } }).catch((err)=>console.error("Failed to load analytics:", err)); }, []); useEffect(()=>{ const initializeChat = async ()=>{ try { await fetch("/api/db/chatstorage", { method: "POST", body: JSON.stringify({ query: `CREATE TABLE IF NOT EXISTS chat_messages ( id INTEGER PRIMARY KEY AUTO_INCREMENT, user_id VARCHAR(255) NOT NULL, sitter_id VARCHAR(255) NOT NULL, message_text TEXT NOT NULL, timestamp DATETIME DEFAULT CURRENT_TIMESTAMP, is_read BOOLEAN DEFAULT FALSE, sender_type ENUM('user', 'sitter') NOT NULL, attachment_url TEXT, booking_id VARCHAR(255), message_type ENUM('text', 'image', 'system') DEFAULT 'text' )` }) }); } catch (error) { console.error("Failed to initialize chat:", error); } finally{ setPageLoading(false); } }; initializeChat(); const generateSitemap = async ()=>{ try { const response = await fetch("/api/generate-sitemap", { method: "POST" }); if (!response.ok) { console.error("Failed to generate sitemap"); } } catch (error) { console.error("Sitemap generation error:", error); } }; generateSitemap(); }, []); useEffect(()=>{ const fetchUserData = async ()=>{ if (user?.id) { try { const response = await fetch("/api/db/customerprofile", { method: "POST", body: JSON.stringify({ query: "SELECT * FROM `customer_profile` WHERE `user_id` = ?", values: [ user.id ] }) }); const data = await response.json(); if (data && data[0]) { setPersonalInfo(data[0]); } } catch (err) { console.error("Failed to fetch user data:", err); } } }; fetchUserData(); }, [ user ]); useEffect(()=>{ const interval = setInterval(()=>{ setCurrentAnimal((prev)=>(prev + 1) % 4); }, 3000); return ()=>clearInterval(interval); }, []); const handleLocationSearch = async (value)=>{ setLocationInput(value); setError(""); if (!value.trim()) { setPredictions([]); setShowPredictions(false); return; } if (value.length < 2) { setPredictions([]); setShowPredictions(false); return; } setIsLoading(true); try { const response = await fetch(`/api/google-place-autocomplete-handler`, { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({ input: value, radius: 500 }) }); if (!response.ok) { throw new Error("Failed to fetch locations"); } const data = await response.json(); if (data.predictions && data.predictions.length > 0) { setPredictions(data.predictions.slice(0, 5)); setShowPredictions(true); } else { setPredictions([]); setShowPredictions(false); } } catch (err) { console.error("Failed to fetch locations:", err); setPredictions([]); setShowPredictions(false); } finally{ setIsLoading(false); } }; const handlePlaceSelect = async (prediction)=>{ if (!prediction || !prediction.description) { return; } setIsLoading(true); try { setLocation(prediction.description); setLocationInput(prediction.description); if (prediction.latitude && prediction.longitude) { setCoordinates({ lat: prediction.latitude, lng: prediction.longitude }); } setShowLocation(false); setPredictions([]); setShowPredictions(false); } catch (err) { console.error("Location selection error:", err); setLocationInput(""); setLocation(""); setCoordinates(null); } finally{ setIsLoading(false); } }; const handleNavigation = (url)=>{ if (isNavigating) return; setIsNavigating(true); setTimeout(()=>{ window.location.href = url; }, 1000); }; const handleSearch = async ()=>{ if (isNavigating) return; if (!location || !coordinates) { setError("Please select a location from the suggestions"); return; } const searchParams = new URLSearchParams(); searchParams.append("location", location); searchParams.append("lat", coordinates.lat); searchParams.append("lng", coordinates.lng); handleNavigation(`/sniffbnb-search?${searchParams.toString()}`); }; const handleEmailVerification = async (email)=>{ try { const response = await fetch(`/integrations/email-check-2/v1/email/verify?email=${encodeURIComponent(email)}`); const data = await response.json(); return data.status === "deliverable"; } catch (error) { console.error("Email verification error:", error); return false; } }; const handleSignup = ()=>{ setShowSignupModal(true); }; const renderServiceTile = (service, size)=>{ const sizeClasses = { large: "col-span-2 row-span-2 aspect-[1.5/1]", medium: "col-span-1 row-span-1 aspect-square", small: "col-span-1 row-span-1 aspect-square" }; const isLoading = clickedService === service.title && isNavigating; return /*#__PURE__*/ React.createElement("a", { href: `/sniffbnb-search?service=${encodeURIComponent(service.title)}`, className: `${sizeClasses[size]} bg-white rounded-xl shadow-md hover:shadow-lg transition-all duration-300 overflow-hidden group relative ${isLoading ? "pointer-events-none service-tile loading" : "service-tile"}`, onClick: (e)=>{ e.preventDefault(); if (!isLoading) { handleServiceSearch(service.title); } }, __source: { fileName: "", lineNumber: 410, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative h-full", __source: { fileName: "", lineNumber: 426, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: service.image, alt: service.title, className: `w-full h-full object-cover transition-opacity duration-300 ${isLoading ? "opacity-40" : ""}`, __source: { fileName: "", lineNumber: 427, columnNumber: 11 }, __self: this }), isLoading && /*#__PURE__*/ React.createElement("div", { className: "absolute inset-0 flex items-center justify-center service-loading-overlay", __source: { fileName: "", lineNumber: 435, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-paw paw-loader", __source: { fileName: "", lineNumber: 436, columnNumber: 15 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "p-3 bg-white", __source: { fileName: "", lineNumber: 440, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-semibold text-[#1B4B43] tracking-wide text-lg flex items-center justify-between", __source: { fileName: "", lineNumber: 441, columnNumber: 11 }, __self: this }, service.title, isLoading && /*#__PURE__*/ React.createElement("span", { className: "text-sm text-[#1B4B43]/70", __source: { fileName: "", lineNumber: 444, columnNumber: 15 }, __self: this }, "Loading...")))); }; const handleServiceSearch = (serviceTitle)=>{ if (isNavigating) return; if (!location || !coordinates) { setError("Please select a location first"); setShowLocation(true); return; } console.log(`Service clicked: ${serviceTitle}`); setClickedService(serviceTitle); const searchParams = new URLSearchParams(); searchParams.append("location", location); searchParams.append("lat", coordinates.lat); searchParams.append("lng", coordinates.lng); searchParams.append("service", serviceTitle); handleNavigation(`/sniffbnb-search?${searchParams.toString()}`); }; const menuItems = { main: [ { icon: "search", label: "Find Services", href: "/sniffbnb-search" }, { icon: "briefcase", label: "Become a Service Provider", href: "https://services.sniffbnb.com/", external: true }, { icon: "question-circle", label: "How it Works", href: "/how-it-works" } ], account: [ { icon: "user", label: "Profile", href: "/profile" }, { icon: "history", label: "Bookings", href: "/bookings" }, { icon: "heart", label: "Favorites", href: "/favorites" }, { icon: "heart", label: "Adopt a Pet", href: "http://adopt.sniffbnb.com/", external: true } ], other: [ { icon: "info-circle", label: "About Us", href: "/about" }, { icon: "phone", label: "Contact", href: "/contact" }, { icon: "shield-alt", label: "Safety", href: "/safety" } ] }; const publicMenuItems = [ { icon: "search", label: "Find Services", href: "/sniffbnb-search" }, { icon: "briefcase", label: "Become a Service Provider", href: "https://services.sniffbnb.com/", external: true }, { icon: "question-circle", label: "How it Works", href: "/how-it-works" }, { icon: "info-circle", label: "About Us", href: "/about" }, { icon: "phone", label: "Contact", href: "/contact" }, { icon: "shield-alt", label: "Safety", href: "/safety" }, { icon: "heart", label: "Adopt a Pet", href: "http://adopt.sniffbnb.com/", external: true } ]; const getInitials = ()=>{ if (!personalInfo?.name) return "?"; return personalInfo.name.split(" ").map((n)=>n[0]).join("").toUpperCase().slice(0, 2); }; const getDisplayName = ()=>{ return personalInfo?.name || user?.email?.split("@")[0] || "User"; }; const renderMobileMenu = ()=>{ return /*#__PURE__*/ React.createElement("div", { className: `fixed inset-0 bg-black/50 backdrop-blur-sm z-[200] transition-opacity duration-300 ${showMobileNav ? "opacity-100" : "opacity-0 pointer-events-none"}`, onClick: ()=>setShowMobileNav(false), __source: { fileName: "", lineNumber: 530, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `fixed top-0 right-0 w-[280px] h-full bg-white shadow-xl transform transition-transform duration-300 ease-out ${showMobileNav ? "translate-x-0" : "translate-x-full"}`, onClick: (e)=>e.stopPropagation(), __source: { fileName: "", lineNumber: 536, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col h-full", __source: { fileName: "", lineNumber: 542, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4 border-b flex items-center justify-between", __source: { fileName: "", lineNumber: 543, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-medium text-lg text-[#1B4B43]", __source: { fileName: "", lineNumber: 544, columnNumber: 15 }, __self: this }, "Menu"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setShowMobileNav(false), className: "w-10 h-10 flex items-center justify-center rounded-full hover:bg-gray-50 active:bg-gray-100", __source: { fileName: "", lineNumber: 545, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times text-gray-600", __source: { fileName: "", lineNumber: 549, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "flex-1 overflow-y-auto", __source: { fileName: "", lineNumber: 553, columnNumber: 13 }, __self: this }, user && /*#__PURE__*/ React.createElement("div", { className: "p-4 border-b", __source: { fileName: "", lineNumber: 555, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-3", __source: { fileName: "", lineNumber: 556, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-12 h-12 rounded-full bg-[#1B4B43] text-white flex items-center justify-center font-medium", __source: { fileName: "", lineNumber: 557, columnNumber: 21 }, __self: this }, getInitials()), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 560, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-medium", __source: { fileName: "", lineNumber: 561, columnNumber: 23 }, __self: this }, getDisplayName()), /*#__PURE__*/ React.createElement("div", { className: "text-sm text-gray-500", __source: { fileName: "", lineNumber: 562, columnNumber: 23 }, __self: this }, user.email)))), /*#__PURE__*/ React.createElement("div", { className: "py-2", __source: { fileName: "", lineNumber: 568, columnNumber: 15 }, __self: this }, (user ? menuItems.main : publicMenuItems).map((item, index)=>/*#__PURE__*/ React.createElement("a", { key: index, href: item.href, target: item.external ? "_blank" : undefined, rel: item.external ? "noopener noreferrer" : undefined, className: `flex items-center space-x-3 px-4 py-3 hover:bg-gray-50 active:bg-gray-100 ripple ${isNavigating ? "pointer-events-none" : ""}`, onClick: (e)=>{ if (!item.external) { e.preventDefault(); handleNavigation(item.href); } }, __source: { fileName: "", lineNumber: 571, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas fa-${item.icon} w-5 text-[#1B4B43]`, __source: { fileName: "", lineNumber: 586, columnNumber: 23 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 589, columnNumber: 23 }, __self: this }, item.label), isNavigating && !item.external && /*#__PURE__*/ React.createElement("div", { className: "loading-spinner ml-2", __source: { fileName: "", lineNumber: 591, columnNumber: 25 }, __self: this })))), user && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("div", { className: "border-t", __source: { fileName: "", lineNumber: 600, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "py-2", __source: { fileName: "", lineNumber: 601, columnNumber: 21 }, __self: this }, menuItems.account.map((item, index)=>/*#__PURE__*/ React.createElement("a", { key: index, href: item.href, target: item.external ? "_blank" : undefined, rel: item.external ? "noopener noreferrer" : undefined, className: `flex items-center space-x-3 px-4 py-3 hover:bg-gray-50 active:bg-gray-100 ripple ${isNavigating ? "pointer-events-none" : ""}`, onClick: (e)=>{ if (!item.external) { e.preventDefault(); handleNavigation(item.href); } }, __source: { fileName: "", lineNumber: 603, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas fa-${item.icon} w-5 text-[#1B4B43]`, __source: { fileName: "", lineNumber: 620, columnNumber: 27 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 623, columnNumber: 27 }, __self: this }, item.label), isNavigating && !item.external && /*#__PURE__*/ React.createElement("div", { className: "loading-spinner ml-2", __source: { fileName: "", lineNumber: 625, columnNumber: 29 }, __self: this }))))), /*#__PURE__*/ React.createElement("div", { className: "border-t", __source: { fileName: "", lineNumber: 632, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "py-2", __source: { fileName: "", lineNumber: 633, columnNumber: 21 }, __self: this }, menuItems.other.map((item, index)=>/*#__PURE__*/ React.createElement("a", { key: index, href: item.href, className: `flex items-center space-x-3 px-4 py-3 hover:bg-gray-50 active:bg-gray-100 ripple ${isNavigating ? "pointer-events-none" : ""}`, onClick: (e)=>{ e.preventDefault(); handleNavigation(item.href); }, __source: { fileName: "", lineNumber: 635, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas fa-${item.icon} w-5 text-[#1B4B43]`, __source: { fileName: "", lineNumber: 646, columnNumber: 27 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 649, columnNumber: 27 }, __self: this }, item.label), isNavigating && /*#__PURE__*/ React.createElement("div", { className: "loading-spinner ml-2", __source: { fileName: "", lineNumber: 651, columnNumber: 29 }, __self: this }))))))), user && /*#__PURE__*/ React.createElement("div", { className: "border-t p-4", __source: { fileName: "", lineNumber: 662, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ setShowMobileNav(false); // Add logout logic here }, className: "w-full flex items-center justify-center space-x-2 bg-gray-100 text-gray-700 rounded-xl p-3 hover:bg-gray-200 active:bg-gray-300 ripple", __source: { fileName: "", lineNumber: 663, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-sign-out-alt", __source: { fileName: "", lineNumber: 670, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 671, columnNumber: 19 }, __self: this }, "Sign Out")))))); }; useEffect(()=>{ const script = document.createElement("script"); script.innerHTML = ` !function(f,b,e,v,n,t,s) {if(f.fbq)return;n=f.fbq=function(){n.callMethod? n.callMethod.apply(n,arguments):n.queue.push(arguments)}; if(!f._fbq)f._fbq=n;n.push=n;n.loaded=!0;n.version='2.0'; n.queue=[];t=b.createElement(e);t.async=!0; t.src=v;s=b.getElementsByTagName(e)[0]; s.parentNode.insertBefore(t,s)}(window, document,'script', 'https://connect.facebook.net/en_US/fbevents.js'); fbq('init', '668604042253171'); fbq('track', 'PageView'); `; document.head.appendChild(script); const noscript = document.createElement("noscript"); const img = document.createElement("img"); img.height = 1; img.width = 1; img.style.display = "none"; img.src = "https://www.facebook.com/tr?id=668604042253171&ev=PageView&noscript=1"; noscript.appendChild(img); document.head.appendChild(noscript); return ()=>{ document.head.removeChild(script); document.head.removeChild(noscript); }; }, []); return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen flex flex-col m-0 p-0", __source: { fileName: "", lineNumber: 714, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 715, columnNumber: 7 }, __self: this }, ` .min-h-screen { margin: 0; padding: 0; } @media (max-width: 768px) { * { margin-top: 0; padding-top: 0; } .mobile-header { position: sticky; top: 0; margin-top: 0; padding-top: 0; z-index: 100; } main { margin-top: 0; padding-top: 0; } } `), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 740, columnNumber: 7 }, __self: this }, ` .material-button { position: relative; overflow: hidden; transform: translate3d(0, 0, 0); transition: background-color 0.3s; } .material-button:active { background-color: rgba(27, 75, 67, 0.1); } @keyframes ripple { to { transform: scale(4); opacity: 0; } } .material-button::after { content: ""; display: block; position: absolute; width: 100%; height: 100%; top: 0; left: 0; pointer-events: none; background-image: radial-gradient(circle, #000 10%, transparent 10.01%); background-repeat: no-repeat; background-position: 50%; transform: scale(10, 10); opacity: 0; transition: transform .5s, opacity 1s; } .material-button:active::after { transform: scale(0, 0); opacity: .2; transition: 0s; } .service-card { transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1), box-shadow 0.2s cubic-bezier(0.4, 0, 0.2, 1); } .service-card:hover { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(27, 75, 67, 0.12); } .interactive-element { transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); } .primary-button { box-shadow: 0 2px 6px rgba(27,75,67,0.15); transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1); } .primary-button:hover { box-shadow: 0 4px 12px rgba(27, 75, 67, 0.2); transform: translateY(-1px); } .loading-indicator { transition: opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1); } .user-menu { border-radius: 12px; box-shadow: 0 4px 20px rgba(0,0,0,0.12); transform-origin: top right; transition: transform 0.2s cubic-bezier(0.4, 0, 0.2, 1), opacity 0.2s cubic-bezier(0.4, 0, 0.2, 1); } /* Mobile materialistic refinements */ @media (max-width: 768px) { /* Material design elevation and shadows */ .material-elevation-1 { box-shadow: 0 1px 3px rgba(0,0,0,0.12), 0 1px 2px rgba(0,0,0,0.24); } .material-elevation-2 { box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23); } .material-elevation-3 { box-shadow: 0 10px 20px rgba(0,0,0,0.19), 0 6px 6px rgba(0,0,0,0.23); } /* Mobile header */ .mobile-header { position: sticky; top: 0; z-index: 100; } /* Mobile bottom navigation */ .mobile-bottom-nav { height: 64px; background-color: rgba(255, 255, 255, 0.98); backdrop-filter: blur(10px); box-shadow: 0 -1px 3px rgba(0,0,0,0.12); border-top-left-radius: 16px; border-top-right-radius: 16px; } .mobile-nav-item { padding: 8px 0; position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center; } .mobile-nav-item.active::after { content: ''; position: absolute; bottom: 0; width: 6px; height: 6px; background-color: #1B4B43; border-radius: 50%; } .mobile-nav-item.active i { color: #1B4B43; } .mobile-nav-item.active span { color: #1B4B43; font-weight: 500; } /* Service cards */ .mobile-service-card { border-radius: 16px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.1); transition: transform 0.2s ease, box-shadow 0.2s ease; } .mobile-service-card:active { transform: scale(0.98); box-shadow: 0 1px 4px rgba(0,0,0,0.1); } /* Location modal */ .mobile-location-modal { border-radius: 24px; overflow: hidden; } .mobile-location-input { border-radius: 12px; padding: 10px 12px; background-color: #f5f5f5; border: none; box-shadow: inset 0 1px 2px rgba(0,0,0,0.05); } .mobile-location-input:focus { background-color: #fff; box-shadow: 0 1px 3px rgba(27,75,67,0.2); } .mobile-prediction-item { padding: 12px; border-bottom: 1px solid #f0f0f0; } .mobile-prediction-item:active { background-color: #f5f5f5; } /* Typography */ .mobile-title { font-size: 18px; font-weight: 500; color: #1B4B43; letter-spacing: -0.01em; } .mobile-subtitle { font-size: 12px; color: #666; } /* Spacing */ .mobile-section { margin-bottom: 24px; padding: 0 16px; } /* Touch targets */ .mobile-touch-target { min-height: 48px; min-width: 48px; display: flex; align-items: center; justify-content: center; } } `), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 940, columnNumber: 7 }, __self: this }, ` @keyframes pulsePaw { 0% { transform: scale(1); opacity: 0.8; } 50% { transform: scale(1.1); opacity: 1; } 100% { transform: scale(1); opacity: 0.8; } } .paw-loader { animation: pulsePaw 1s ease-in-out infinite; color: #1B4B43; font-size: 2.5rem; } .service-loading-overlay { background: rgba(255, 255, 255, 0.9); backdrop-filter: blur(4px); transition: all 0.3s ease-in-out; } .service-tile { transition: all 0.3s ease-in-out; } .service-tile.loading { pointer-events: none; opacity: 0.7; } `), showLocation && /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-black/50 backdrop-blur-sm z-[100] flex items-end md:items-center justify-center", __source: { fileName: "", lineNumber: 978, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-t-2xl md:rounded-2xl w-full max-w-lg md:max-h-[90vh] overflow-hidden", __source: { fileName: "", lineNumber: 979, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "p-4 border-b flex justify-between items-center", __source: { fileName: "", lineNumber: 980, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-medium text-[#1B4B43]", __source: { fileName: "", lineNumber: 981, columnNumber: 15 }, __self: this }, "Select Location"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ console.log("Closing location modal"); setShowLocation(false); setPredictions([]); }, className: "p-2 text-gray-400 hover:text-gray-600", __source: { fileName: "", lineNumber: 984, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-times", __source: { fileName: "", lineNumber: 992, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "p-4", __source: { fileName: "", lineNumber: 996, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 997, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center bg-gray-50 rounded-xl p-3 mb-4", __source: { fileName: "", lineNumber: 998, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-search text-gray-400 mr-2", __source: { fileName: "", lineNumber: 999, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "text", className: "w-full outline-none bg-transparent", placeholder: "Search for your location", value: locationInput, onChange: (e)=>{ setLocationInput(e.target.value); handleLocationSearch(e.target.value); }, __source: { fileName: "", lineNumber: 1000, columnNumber: 19 }, __self: this }), isLoading && /*#__PURE__*/ React.createElement("i", { className: "fas fa-circle-notch fa-spin text-[#1B4B43]", __source: { fileName: "", lineNumber: 1011, columnNumber: 21 }, __self: this })), predictions.length > 0 && /*#__PURE__*/ React.createElement("div", { className: "absolute left-0 right-0 bg-white rounded-xl shadow-lg border mt-1 max-h-60 overflow-auto z-50", __source: { fileName: "", lineNumber: 1016, columnNumber: 19 }, __self: this }, predictions.map((prediction)=>/*#__PURE__*/ React.createElement("button", { key: prediction.place_id, className: "w-full text-left px-4 py-3 hover:bg-gray-50 flex items-start border-b last:border-0", onClick: ()=>handlePlaceSelect(prediction), __source: { fileName: "", lineNumber: 1018, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-map-marker-alt text-[#1B4B43] mt-1 mr-3", __source: { fileName: "", lineNumber: 1023, columnNumber: 25 }, __self: this }), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 1024, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "font-medium", __source: { fileName: "", lineNumber: 1025, columnNumber: 27 }, __self: this }, prediction.structured_formatting?.main_text), /*#__PURE__*/ React.createElement("div", { className: "text-sm text-gray-500", __source: { fileName: "", lineNumber: 1028, columnNumber: 27 }, __self: this }, prediction.structured_formatting?.secondary_text)))))), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-2 text-sm text-gray-500 my-4", __source: { fileName: "", lineNumber: 1038, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "h-px bg-gray-200 flex-1", __source: { fileName: "", lineNumber: 1039, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 1040, columnNumber: 17 }, __self: this }, "or"), /*#__PURE__*/ React.createElement("div", { className: "h-px bg-gray-200 flex-1", __source: { fileName: "", lineNumber: 1041, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: ()=>{ console.log("Getting current location from modal"); getCurrentLocation(); setShowLocation(false); }, className: "w-full flex items-center justify-center space-x-2 bg-[#1B4B43] text-white rounded-xl p-4 hover:bg-[#143832] transition-colors duration-300", __source: { fileName: "", lineNumber: 1044, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-location-arrow", __source: { fileName: "", lineNumber: 1052, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 1053, columnNumber: 17 }, __self: this }, "Use Current Location"))))), /*#__PURE__*/ React.createElement(Header1, { currentAnimal: currentAnimal, user: user, __source: { fileName: "", lineNumber: 1059, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "md:hidden bg-white border-b", __source: { fileName: "", lineNumber: 1061, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { onClick: ()=>{ console.log("Opening location modal from mobile bar"); setShowLocation(true); }, className: "flex items-center gap-3 p-4 active:bg-gray-50", __source: { fileName: "", lineNumber: 1062, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-10 h-10 bg-gray-50 rounded-full flex items-center justify-center", __source: { fileName: "", lineNumber: 1069, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-map-marker-alt text-[#1B4B43]", __source: { fileName: "", lineNumber: 1070, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex-1 min-w-0", __source: { fileName: "", lineNumber: 1073, columnNumber: 11 }, __self: this }, isLoading ? /*#__PURE__*/ React.createElement("div", { className: "animate-pulse space-y-1.5", __source: { fileName: "", lineNumber: 1075, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "h-2 w-20 bg-gray-200 rounded", __source: { fileName: "", lineNumber: 1076, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "h-3 w-32 bg-gray-200 rounded", __source: { fileName: "", lineNumber: 1077, columnNumber: 17 }, __self: this })) : location ? /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("p", { className: "text-xs text-gray-500", __source: { fileName: "", lineNumber: 1081, columnNumber: 17 }, __self: this }, "Your location"), /*#__PURE__*/ React.createElement("p", { className: "text-sm font-medium text-gray-900 truncate", __source: { fileName: "", lineNumber: 1082, columnNumber: 17 }, __self: this }, location)) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("p", { className: "text-xs text-gray-500", __source: { fileName: "", lineNumber: 1088, columnNumber: 17 }, __self: this }, "Location needed"), /*#__PURE__*/ React.createElement("p", { className: "text-sm font-medium text-[#1B4B43]", __source: { fileName: "", lineNumber: 1089, columnNumber: 17 }, __self: this }, "Tap to set your location"))), /*#__PURE__*/ React.createElement("button", { onClick: (e)=>{ e.stopPropagation(); console.log("Getting current location from mobile bar"); getCurrentLocation(); }, className: "w-10 h-10 flex items-center justify-center text-[#1B4B43] active:bg-gray-100 rounded-full", __source: { fileName: "", lineNumber: 1096, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-sync-alt", __source: { fileName: "", lineNumber: 1104, columnNumber: 13 }, __self: this })))), pageLoading || userLoading ? /*#__PURE__*/ React.createElement("div", { className: "fixed inset-0 bg-white flex items-center justify-center", __source: { fileName: "", lineNumber: 1109, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center", __source: { fileName: "", lineNumber: 1110, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-4xl font-bold text-[#1B4B43] loading-text mb-4 hidden md:block", __source: { fileName: "", lineNumber: 1111, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "letter", __source: { fileName: "", lineNumber: 1112, columnNumber: 15 }, __self: this }, "S"), /*#__PURE__*/ React.createElement("span", { className: "letter", __source: { fileName: "", lineNumber: 1113, columnNumber: 15 }, __self: this }, "n"), /*#__PURE__*/ React.createElement("span", { className: "letter", __source: { fileName: "", lineNumber: 1114, columnNumber: 15 }, __self: this }, "i"), /*#__PURE__*/ React.createElement("span", { className: "letter", __source: { fileName: "", lineNumber: 1115, columnNumber: 15 }, __self: this }, "f"), /*#__PURE__*/ React.createElement("span", { className: "letter", __source: { fileName: "", lineNumber: 1116, columnNumber: 15 }, __self: this }, "b"), /*#__PURE__*/ React.createElement("span", { className: "letter", __source: { fileName: "", lineNumber: 1117, columnNumber: 15 }, __self: this }, "n"), /*#__PURE__*/ React.createElement("span", { className: "letter", __source: { fileName: "", lineNumber: 1118, columnNumber: 15 }, __self: this }, "b")), /*#__PURE__*/ React.createElement("div", { className: "flex space-x-2", __source: { fileName: "", lineNumber: 1120, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-3 h-3 bg-[#1B4B43] rounded-full animate-bounce", __source: { fileName: "", lineNumber: 1121, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "w-3 h-3 bg-[#1B4B43] rounded-full animate-bounce", style: { animationDelay: "0.2s" }, __source: { fileName: "", lineNumber: 1122, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "w-3 h-3 bg-[#1B4B43] rounded-full animate-bounce", style: { animationDelay: "0.4s" }, __source: { fileName: "", lineNumber: 1126, columnNumber: 15 }, __self: this })))) : /*#__PURE__*/ React.createElement(React.Fragment, null, error && /*#__PURE__*/ React.createElement("div", { className: "fixed top-4 right-4 bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded z-50 interactive-element", __source: { fileName: "", lineNumber: 1136, columnNumber: 13 }, __self: this }, error), /*#__PURE__*/ React.createElement("main", { className: "flex-1 flex flex-col pb-16 md:pb-0", __source: { fileName: "", lineNumber: 1140, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative z-10 max-w-6xl mx-auto w-full px-4 flex-1", __source: { fileName: "", lineNumber: 1141, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-1 flex flex-col items-center justify-center mt-4 md:mt-20", __source: { fileName: "", lineNumber: 1142, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "hidden md:block text-2xl md:text-4xl font-serif text-center mb-4 text-[#1B4B43]", __source: { fileName: "", lineNumber: 1143, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-gray-500 font-light text-lg md:text-2xl block mb-2", __source: { fileName: "", lineNumber: 1144, columnNumber: 19 }, __self: this }, "Find trusted"), /*#__PURE__*/ React.createElement("span", { className: "font-medium block", __source: { fileName: "", lineNumber: 1147, columnNumber: 19 }, __self: this }, "Pet Boarders (Home Based) | Groomers | Dog Walkers"), /*#__PURE__*/ React.createElement("span", { className: "text-gray-500 font-light text-lg md:text-2xl block mt-2", __source: { fileName: "", lineNumber: 1150, columnNumber: 19 }, __self: this }, "near you")), /*#__PURE__*/ React.createElement("div", { className: "hidden md:block w-full max-w-4xl mx-auto px-2 md:px-4", __source: { fileName: "", lineNumber: 1154, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative bg-white/90 backdrop-blur-sm rounded-[50px] shadow-[0_2px_8px_rgba(27,75,67,0.08)] hover:shadow-[0_4px_12px_rgba(27,75,67,0.12)] transition-shadow duration-300 p-2 md:p-3 flex search-container", __source: { fileName: "", lineNumber: 1155, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-2 px-2 md:px-4 relative flex-1", __source: { fileName: "", lineNumber: 1156, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-map-marker-alt text-[#1B4B43]", __source: { fileName: "", lineNumber: 1157, columnNumber: 23 }, __self: this }), /*#__PURE__*/ React.createElement("input", { type: "text", placeholder: "Enter your location to search nearest Sitter, Dog Walker, Groomer", className: "w-full outline-none cursor-pointer bg-transparent py-2 md:py-3 text-sm md:text-base", value: location, onClick: ()=>setShowLocation(true), readOnly: true, name: "location", __source: { fileName: "", lineNumber: 1158, columnNumber: 23 }, __self: this })), /*#__PURE__*/ React.createElement("button", { onClick: handleSearch, className: "bg-[#1B4B43] text-white px-4 md:px-6 py-2 rounded-full hover:bg-[#143832] primary-button ml-2 text-sm md:text-base", __source: { fileName: "", lineNumber: 1168, columnNumber: 21 }, __self: this }, "Search"))), /*#__PURE__*/ React.createElement("div", { className: "md:hidden w-full mt-0", __source: { fileName: "", lineNumber: 1178, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "service-section mb-8", __source: { fileName: "", lineNumber: 1180, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "px-4 py-2 relative", __source: { fileName: "", lineNumber: 1181, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("div", { onClick: ()=>handleServiceSearch(services[0].title), className: "block cursor-pointer", __source: { fileName: "", lineNumber: 1182, columnNumber: 23 }, __self: this }, /*#__PURE__*/ React.createElement("h4", { className: "text-xl font-semibold text-[#1B4B43] inline-flex items-center gap-1.5", __source: { fileName: "", lineNumber: 1186, columnNumber: 25 }, __self: this }, services[0].title, /*#__PURE__*/ React.createElement("i", { className: "fas fa-info-circle text-[#1B4B43]/70 text-sm hover:text-[#1B4B43] cursor-pointer", onClick: (e)=>{ e.preventDefault(); e.stopPropagation(); alert(services[0].tooltip); }, __source: { fileName: "", lineNumber: 1188, columnNumber: 27 }, __self: this })), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 text-sm mb-2 font-roboto", __source: { fileName: "", lineNumber: 1197, columnNumber: 25 }, __self: this }, "Your pet stays at sitter's home"), /*#__PURE__*/ React.createElement("div", { className: "w-full aspect-[2.5/1.5] bg-white rounded-2xl shadow-lg hover:shadow-xl transition-all duration-300 overflow-hidden relative group service-tile", __source: { fileName: "", lineNumber: 1200, columnNumber: 25 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: services[0].image, alt: services[0].title, className: "absolute inset-0 w-full h-full object-cover object-bottom", __source: { fileName: "", lineNumber: 1201, columnNumber: 27 }, __self: this }))))), /*#__PURE__*/ React.createElement("div", { className: "section-divider", __source: { fileName: "", lineNumber: 1211, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "service-section mb-8", __source: { fileName: "", lineNumber: 1214, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "px-6", __source: { fileName: "", lineNumber: 1215, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-medium text-[#1B4B43] mb-4", __source: { fileName: "", lineNumber: 1216, columnNumber: 23 }, __self: this }, "Additional Boarding Services"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-3 gap-4", __source: { fileName: "", lineNumber: 1219, columnNumber: 23 }, __self: this }, services.slice(1, 4).map((service)=>/*#__PURE__*/ React.createElement("div", { key: service.title, onClick: ()=>handleServiceSearch(service.title), className: "flex flex-col cursor-pointer", __source: { fileName: "", lineNumber: 1221, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "block", __source: { fileName: "", lineNumber: 1226, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("h4", { className: "text-[#1B4B43] font-medium text-sm mt-2 inline-flex items-center gap-1", __source: { fileName: "", lineNumber: 1227, columnNumber: 31 }, __self: this }, service.title, /*#__PURE__*/ React.createElement("i", { className: "fas fa-info-circle text-[#1B4B43]/70 text-xs hover:text-[#1B4B43] cursor-pointer", onClick: (e)=>{ e.preventDefault(); e.stopPropagation(); alert(service.tooltip); }, __source: { fileName: "", lineNumber: 1229, columnNumber: 33 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "aspect-square bg-white rounded-xl shadow-lg hover:shadow-xl transition-all duration-300 overflow-hidden relative group service-tile", __source: { fileName: "", lineNumber: 1238, columnNumber: 31 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: service.image, alt: service.title, className: "w-full h-full object-cover object-bottom", __source: { fileName: "", lineNumber: 1239, columnNumber: 33 }, __self: this })))))))), /*#__PURE__*/ React.createElement("div", { className: "section-divider", __source: { fileName: "", lineNumber: 1252, columnNumber: 19 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "service-section", __source: { fileName: "", lineNumber: 1255, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "px-6", __source: { fileName: "", lineNumber: 1256, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "text-lg font-medium text-[#1B4B43] mb-4", __source: { fileName: "", lineNumber: 1257, columnNumber: 23 }, __self: this }, "Daily Care Services"), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 gap-4", __source: { fileName: "", lineNumber: 1260, columnNumber: 23 }, __self: this }, services.slice(4, 6).map((service)=>/*#__PURE__*/ React.createElement("div", { key: service.title, onClick: ()=>handleServiceSearch(service.title), className: "flex flex-col cursor-pointer", __source: { fileName: "", lineNumber: 1262, columnNumber: 27 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "block", __source: { fileName: "", lineNumber: 1267, columnNumber: 29 }, __self: this }, /*#__PURE__*/ React.createElement("h4", { className: "text-[#1B4B43] font-medium text-sm mt-2 inline-flex items-center gap-1", __source: { fileName: "", lineNumber: 1268, columnNumber: 31 }, __self: this }, service.title, /*#__PURE__*/ React.createElement("i", { className: "fas fa-info-circle text-[#1B4B43]/70 text-xs hover:text-[#1B4B43] cursor-pointer", onClick: (e)=>{ e.preventDefault(); e.stopPropagation(); alert(service.tooltip); }, __source: { fileName: "", lineNumber: 1270, columnNumber: 33 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "aspect-[4/3] bg-white rounded-xl shadow-lg hover:shadow-xl transition-all duration-300 overflow-hidden relative group service-tile", __source: { fileName: "", lineNumber: 1279, columnNumber: 31 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: service.image, alt: service.title, className: "w-full h-full object-cover object-bottom", __source: { fileName: "", lineNumber: 1280, columnNumber: 33 }, __self: this })))))))), /*#__PURE__*/ React.createElement("p", { className: "text-[10px] text-gray-400 text-center mt-16", __source: { fileName: "", lineNumber: 1293, columnNumber: 19 }, __self: this }, "Made with Love, Inspired by Pets | An IIM Alumni Initiative")))))), renderMobileMenu(), /*#__PURE__*/ React.createElement("div", { className: "md:hidden fixed bottom-0 left-0 right-0 bg-white shadow-lg z-50 border-t border-gray-100", __source: { fileName: "", lineNumber: 1304, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex justify-around h-16 items-center px-1", __source: { fileName: "", lineNumber: 1305, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "http://adopt.sniffbnb.com/", target: "_blank", rel: "noopener noreferrer", className: "flex-1 flex flex-col items-center justify-center py-1 relative overflow-hidden material-button", __source: { fileName: "", lineNumber: 1306, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-6 h-6 flex items-center justify-center mb-1", __source: { fileName: "", lineNumber: 1312, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-heart text-[#1B4B43] text-lg", __source: { fileName: "", lineNumber: 1313, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "text-[9px] text-[#1B4B43] font-medium text-center leading-none", __source: { fileName: "", lineNumber: 1315, columnNumber: 13 }, __self: this }, "Adopt Pet")), /*#__PURE__*/ React.createElement("a", { href: "https://services.sniffbnb.com/", target: "_blank", rel: "noopener noreferrer", className: "flex-1 flex flex-col items-center justify-center py-1 relative overflow-hidden material-button", __source: { fileName: "", lineNumber: 1320, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-6 h-6 flex items-center justify-center mb-1", __source: { fileName: "", lineNumber: 1326, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-briefcase text-[#1B4B43] text-lg", __source: { fileName: "", lineNumber: 1327, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "text-[9px] text-[#1B4B43] font-medium text-center leading-none max-w-[80px]", __source: { fileName: "", lineNumber: 1329, columnNumber: 13 }, __self: this }, "Become Service Provider")), /*#__PURE__*/ React.createElement("div", { className: "flex-1 flex flex-col items-center justify-center py-1 relative overflow-hidden material-button", __source: { fileName: "", lineNumber: 1334, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center", __source: { fileName: "", lineNumber: 1335, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-[8px] bg-yellow-400/90 text-yellow-800 px-1.5 rounded-full font-medium whitespace-nowrap shadow-sm mb-1", __source: { fileName: "", lineNumber: 1336, columnNumber: 15 }, __self: this }, "Coming Soon"), /*#__PURE__*/ React.createElement("div", { className: "w-6 h-6 flex items-center justify-center mb-1", __source: { fileName: "", lineNumber: 1339, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-stethoscope text-[#1B4B43] text-lg", __source: { fileName: "", lineNumber: 1340, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "text-[9px] text-[#1B4B43] font-medium text-center leading-none", __source: { fileName: "", lineNumber: 1342, columnNumber: 15 }, __self: this }, "Vet"))), /*#__PURE__*/ React.createElement("div", { className: "flex-1 flex flex-col items-center justify-center py-1 relative overflow-hidden material-button", __source: { fileName: "", lineNumber: 1348, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col items-center", __source: { fileName: "", lineNumber: 1349, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-[8px] bg-yellow-400/90 text-yellow-800 px-1.5 rounded-full font-medium whitespace-nowrap shadow-sm mb-1", __source: { fileName: "", lineNumber: 1350, columnNumber: 15 }, __self: this }, "Coming Soon"), /*#__PURE__*/ React.createElement("div", { className: "w-6 h-6 flex items-center justify-center mb-1", __source: { fileName: "", lineNumber: 1353, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-shopping-bag text-[#1B4B43] text-lg", __source: { fileName: "", lineNumber: 1354, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("span", { className: "text-[9px] text-[#1B4B43] font-medium text-center leading-none", __source: { fileName: "", lineNumber: 1356, columnNumber: 15 }, __self: this }, "Shop"))))), /*#__PURE__*/ React.createElement("div", { className: "hidden md:block", __source: { fileName: "", lineNumber: 1363, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement(Footer, { brandName: "Sniffbnb", description: "Making pet care easy and stress-free for everyone.", socialLinks: [ { href: "#", icon: "fab fa-facebook", label: "Facebook" }, { href: "#", icon: "fab fa-twitter", label: "Twitter" }, { href: "#", icon: "fab fa-instagram", label: "Instagram" } ], quickLinks: [ { href: "/sniffbnb-search", text: "Find a Sitter" }, { href: "https://services.sniffbnb.com/", text: "Become a Service Provider", target: "_blank", rel: "noopener noreferrer" } ], supportLinks: [ { href: "#", text: "Safety" }, { href: "#", text: "Terms of Service" }, { href: "#", text: "Privacy Policy" }, { href: "/cancellation-refund-policy", text: "Cancellation & Refund Policy", target: "_blank", rel: "noopener noreferrer" } ], contactDetails: [ { icon: "fas fa-envelope", text: "support@sniffbnb.com" }, { icon: "fas fa-phone", text: "+91 - 9653539979" }, { icon: "fas fa-map-marker-alt", text: "Gurugram, Haryana" } ], paymentIcons: [ "fab fa-cc-visa", "fab fa-cc-mastercard", "fab fa-cc-amex" ], year: 2025, __source: { fileName: "", lineNumber: 1364, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 1405, columnNumber: 7 }, __self: this }, ` @keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } } .loading-overlay { position: absolute; inset: 0; background: rgba(255, 255, 255, 0.9); display: flex; align-items: center; justify-center; animation: fadeIn 0.2s ease-out; } .loading-spinner { width: 30px; height: 30px; border: 3px solid #f3f3f3; border-top: 3px solid #1B4B43; border-radius: 50%; animation: spin 1s linear infinite; } @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } `)); }