function Project({ text, icon, onClick }) { return /*#__PURE__*/ React.createElement("span", { onClick: onClick, className: "inline-flex items-center px-4 py-2 bg-[#7CB342] text-white rounded-lg hover:bg-[#558B2F] transition-colors duration-200 shadow-sm cursor-pointer", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "mr-2", __source: { fileName: "", lineNumber: 7, columnNumber: 7 }, __self: this }, icon), text); } function ProjectStory() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 15, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(Project, { text: "Back to Home", icon: "←", onClick: ()=>alert('Back to Home clicked'), __source: { fileName: "", lineNumber: 16, columnNumber: 7 }, __self: this })); } function Footer1({ copyrightYear = "2025", links = [] }) { return /*#__PURE__*/ React.createElement("footer", { className: "bg-[#7CB342] text-white w-full py-4", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-4 md:px-8 flex flex-col md:flex-row justify-between items-center", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-sm mb-2 md:mb-0", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, "© ", copyrightYear, " AutisticAudio. All rights reserved."), /*#__PURE__*/ React.createElement("div", { className: "flex gap-6", __source: { fileName: "", lineNumber: 8, columnNumber: 9 }, __self: this }, links.map((link, index)=>/*#__PURE__*/ React.createElement("a", { key: index, href: link.href, className: "text-white hover:text-[#E0E7D1] transition-colors", __source: { fileName: "", lineNumber: 10, columnNumber: 13 }, __self: this }, link.label))))); } function Footer1Story() { const defaultLinks = [ { href: "/about", label: "About" }, { href: "/contact", label: "Contact" } ]; const extendedLinks = [ { href: "/about", label: "About" }, { href: "/contact", label: "Contact" }, { href: "/privacy", label: "Privacy" }, { href: "/terms", label: "Terms" } ]; return /*#__PURE__*/ React.createElement("div", { className: "space-y-8", __source: { fileName: "", lineNumber: 38, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 39, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-bold mb-4", __source: { fileName: "", lineNumber: 40, columnNumber: 9 }, __self: this }, "Default Footer"), /*#__PURE__*/ React.createElement(Footer1, { links: defaultLinks, __source: { fileName: "", lineNumber: 41, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 44, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-bold mb-4", __source: { fileName: "", lineNumber: 45, columnNumber: 9 }, __self: this }, "Footer with Extended Links"), /*#__PURE__*/ React.createElement(Footer1, { links: extendedLinks, __source: { fileName: "", lineNumber: 46, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 49, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-bold mb-4", __source: { fileName: "", lineNumber: 50, columnNumber: 9 }, __self: this }, "Footer with Custom Year"), /*#__PURE__*/ React.createElement(Footer1, { copyrightYear: "2024", links: defaultLinks, __source: { fileName: "", lineNumber: 51, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 54, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-lg font-bold mb-4", __source: { fileName: "", lineNumber: 55, columnNumber: 9 }, __self: this }, "Footer without Links"), /*#__PURE__*/ React.createElement(Footer1, { __source: { fileName: "", lineNumber: 56, columnNumber: 9 }, __self: this }))); } function PageHeader({ title = "AutisticAudio", showBackButton = true }) { return /*#__PURE__*/ React.createElement("header", { className: "flex items-center justify-between px-4 md:px-8 py-4 pt-8", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-4", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, showBackButton && /*#__PURE__*/ React.createElement("a", { href: "/", className: "inline-flex items-center px-4 py-2 bg-[#7CB342] text-white rounded-lg hover:bg-[#558B2F] transition-colors duration-200 shadow-sm", __source: { fileName: "", lineNumber: 6, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "mr-2", __source: { fileName: "", lineNumber: 10, columnNumber: 13 }, __self: this }, "←"), "Back to Home"), /*#__PURE__*/ React.createElement("div", { className: "flex items-center", __source: { fileName: "", lineNumber: 14, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative", __source: { fileName: "", lineNumber: 15, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-4xl", __source: { fileName: "", lineNumber: 16, columnNumber: 13 }, __self: this }, "🧩"), /*#__PURE__*/ React.createElement("div", { className: "absolute -top-1 -right-1 animate-float text-xl", __source: { fileName: "", lineNumber: 17, columnNumber: 13 }, __self: this }, "⭐")))), /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold bg-gradient-to-r from-[#7CB342] via-[#64B5F6] to-[#FFB74D] text-transparent bg-clip-text animate-shimmer", __source: { fileName: "", lineNumber: 24, columnNumber: 7 }, __self: this }, title)); } function PageHeaderStory() { return /*#__PURE__*/ React.createElement("div", { className: "bg-[#F5F9E9] space-y-8 p-4", __source: { fileName: "", lineNumber: 33, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "border-2 border-dashed border-[#7CB342] p-4 rounded-lg", __source: { fileName: "", lineNumber: 34, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-[#558B2F] mb-4", __source: { fileName: "", lineNumber: 35, columnNumber: 9 }, __self: this }, "Default Header with Back Button:"), /*#__PURE__*/ React.createElement(PageHeader, { title: "AutisticAudio", __source: { fileName: "", lineNumber: 38, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "border-2 border-dashed border-[#7CB342] p-4 rounded-lg", __source: { fileName: "", lineNumber: 41, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-[#558B2F] mb-4", __source: { fileName: "", lineNumber: 42, columnNumber: 9 }, __self: this }, "Header without Back Button:"), /*#__PURE__*/ React.createElement(PageHeader, { title: "AutisticAudio", showBackButton: false, __source: { fileName: "", lineNumber: 43, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "border-2 border-dashed border-[#7CB342] p-4 rounded-lg", __source: { fileName: "", lineNumber: 46, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-[#558B2F] mb-4", __source: { fileName: "", lineNumber: 47, columnNumber: 9 }, __self: this }, "Header with Custom Title:"), /*#__PURE__*/ React.createElement(PageHeader, { title: "Custom Page Title", __source: { fileName: "", lineNumber: 48, columnNumber: 9 }, __self: this })), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 51, columnNumber: 7 }, __self: this }, ` @keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } } .animate-float { animation: float 2s ease-in-out infinite; } @keyframes shimmer { 0% { background-position: -200% center; } 100% { background-position: 200% center; } } .animate-shimmer { animation: shimmer 3s linear infinite; background-size: 200% auto; } `)); } function Layout1({ children }) { const defaultLinks = [ { href: "/about", label: "About" }, { href: "/contact", label: "Contact" } ]; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen flex flex-col", __source: { fileName: "", lineNumber: 8, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex-1", __source: { fileName: "", lineNumber: 9, columnNumber: 7 }, __self: this }, children), /*#__PURE__*/ React.createElement(React.Fragment, null)); } function Layout1Story() { return /*#__PURE__*/ React.createElement("div", { className: "space-y-8", __source: { fileName: "", lineNumber: 17, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 18, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-[#558B2F] mb-4", __source: { fileName: "", lineNumber: 19, columnNumber: 9 }, __self: this }, "Layout with Content"), /*#__PURE__*/ React.createElement(Layout1, { __source: { fileName: "", lineNumber: 22, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-8 rounded-xl shadow-sm", __source: { fileName: "", lineNumber: 23, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-bold text-[#558B2F] mb-4", __source: { fileName: "", lineNumber: 24, columnNumber: 13 }, __self: this }, "Sample Page Content"), /*#__PURE__*/ React.createElement("p", { className: "text-[#558B2F]", __source: { fileName: "", lineNumber: 27, columnNumber: 13 }, __self: this }, "This is an example of how content will appear within the layout.")))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 34, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-[#558B2F] mb-4", __source: { fileName: "", lineNumber: 35, columnNumber: 9 }, __self: this }, "Layout with Minimal Content"), /*#__PURE__*/ React.createElement(Layout1, { __source: { fileName: "", lineNumber: 38, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-center py-12", __source: { fileName: "", lineNumber: 39, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "text-4xl", __source: { fileName: "", lineNumber: 40, columnNumber: 13 }, __self: this }, "👋"), /*#__PURE__*/ React.createElement("p", { className: "text-[#558B2F] mt-4", __source: { fileName: "", lineNumber: 41, columnNumber: 13 }, __self: this }, "Welcome!")))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 46, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-[#558B2F] mb-4", __source: { fileName: "", lineNumber: 47, columnNumber: 9 }, __self: this }, "Layout with Multiple Sections"), /*#__PURE__*/ React.createElement(Layout1, { __source: { fileName: "", lineNumber: 50, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid md:grid-cols-2 gap-8", __source: { fileName: "", lineNumber: 51, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white p-6 rounded-xl shadow-sm", __source: { fileName: "", lineNumber: 52, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-[#558B2F] mb-4", __source: { fileName: "", lineNumber: 53, columnNumber: 15 }, __self: this }, "Section One"), /*#__PURE__*/ React.createElement("p", { className: "text-[#558B2F]", __source: { fileName: "", lineNumber: 56, columnNumber: 15 }, __self: this }, "Content for section one.")), /*#__PURE__*/ React.createElement("div", { className: "bg-white p-6 rounded-xl shadow-sm", __source: { fileName: "", lineNumber: 58, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-[#558B2F] mb-4", __source: { fileName: "", lineNumber: 59, columnNumber: 15 }, __self: this }, "Section Two"), /*#__PURE__*/ React.createElement("p", { className: "text-[#558B2F]", __source: { fileName: "", lineNumber: 62, columnNumber: 15 }, __self: this }, "Content for section two.")))))); } const SpeechContext = React.createContext(null); function GlobalSpeech({ children }) { const [synth, setSynth] = React.useState(null); const [speaking, setSpeaking] = React.useState(false); const [voice, setVoice] = React.useState(null); React.useEffect(()=>{ if (typeof window !== "undefined" && "speechSynthesis" in window) { setSynth(window.speechSynthesis); const loadVoices = ()=>{ const voices = window.speechSynthesis.getVoices(); const samantha = voices.find((voice)=>voice.name === "Samantha"); if (samantha) { setVoice(samantha); } }; window.speechSynthesis.onvoiceschanged = loadVoices; loadVoices(); return ()=>{ window.speechSynthesis.cancel(); }; } }, []); const speak = React.useCallback((text, options = {})=>{ if (!synth || !voice) return; synth.cancel(); const utterance = new SpeechSynthesisUtterance(text); utterance.voice = voice; utterance.rate = options.rate || 0.9; utterance.pitch = options.pitch || 1; utterance.onstart = ()=>setSpeaking(true); utterance.onend = ()=>setSpeaking(false); utterance.onerror = ()=>setSpeaking(false); synth.speak(utterance); }, [ synth, voice ]); const stop = React.useCallback(()=>{ if (synth) { synth.cancel(); setSpeaking(false); } }, [ synth ]); const value = React.useMemo(()=>({ speak, stop, speaking, supported: !!synth, voice }), [ speak, stop, speaking, synth, voice ]); return /*#__PURE__*/ React.createElement(React.Fragment, null); } function useSpeech() { const context = React.useContext(SpeechContext); if (!context) { throw new Error('useSpeech must be used within a SpeechProvider'); } return context; } function GlobalSpeechStory() { return /*#__PURE__*/ React.createElement("div", { className: "p-8 space-y-8", __source: { fileName: "", lineNumber: 73, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 74, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-[#558B2F] mb-4", __source: { fileName: "", lineNumber: 75, columnNumber: 9 }, __self: this }, "Basic Speech Example"), /*#__PURE__*/ React.createElement(GlobalSpeech, { __source: { fileName: "", lineNumber: 76, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement(SpeechDemo, { __source: { fileName: "", lineNumber: 77, columnNumber: 11 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 81, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-[#558B2F] mb-4", __source: { fileName: "", lineNumber: 82, columnNumber: 9 }, __self: this }, "Multiple Speech Components"), /*#__PURE__*/ React.createElement(GlobalSpeech, { __source: { fileName: "", lineNumber: 83, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 gap-4", __source: { fileName: "", lineNumber: 84, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement(SpeechDemo, { text: "Hello! How are you?", __source: { fileName: "", lineNumber: 85, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement(SpeechDemo, { text: "I'm doing great, thank you!", __source: { fileName: "", lineNumber: 86, columnNumber: 13 }, __self: this })))), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 91, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-xl font-bold text-[#558B2F] mb-4", __source: { fileName: "", lineNumber: 92, columnNumber: 9 }, __self: this }, "Speech with Different Options"), /*#__PURE__*/ React.createElement(GlobalSpeech, { __source: { fileName: "", lineNumber: 93, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 94, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement(SpeechDemo, { text: "This is normal speed", options: { rate: 1 }, __source: { fileName: "", lineNumber: 95, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement(SpeechDemo, { text: "This is slower", options: { rate: 0.7 }, __source: { fileName: "", lineNumber: 96, columnNumber: 13 }, __self: this }), /*#__PURE__*/ React.createElement(SpeechDemo, { text: "This is faster", options: { rate: 1.2 }, __source: { fileName: "", lineNumber: 97, columnNumber: 13 }, __self: this }))))); } // Demo component to show speech functionality function SpeechDemo({ text = "Click to hear me speak!", options = {} }) { const { speak, stop, speaking, supported } = useSpeech(); if (!supported) { return /*#__PURE__*/ React.createElement("div", { className: "p-4 bg-red-100 text-red-700 rounded-lg", __source: { fileName: "", lineNumber: 111, columnNumber: 7 }, __self: this }, "Speech synthesis is not supported in your browser"); } return /*#__PURE__*/ React.createElement("button", { onClick: ()=>speaking ? stop() : speak(text, options), className: `px-6 py-3 rounded-lg text-white transition-colors duration-200 ${speaking ? "bg-[#558B2F] hover:bg-[#33691E]" : "bg-[#7CB342] hover:bg-[#558B2F]"}`, __source: { fileName: "", lineNumber: 118, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "flex items-center gap-2", __source: { fileName: "", lineNumber: 126, columnNumber: 7 }, __self: this }, speaking ? /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 129, columnNumber: 13 }, __self: this }, "Stop"), /*#__PURE__*/ React.createElement("span", { className: "text-xl", __source: { fileName: "", lineNumber: 130, columnNumber: 13 }, __self: this }, "⏹️")) : /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 134, columnNumber: 13 }, __self: this }, "Play"), /*#__PURE__*/ React.createElement("span", { className: "text-xl", __source: { fileName: "", lineNumber: 135, columnNumber: 13 }, __self: this }, "▶️")))); } function MainComponent() { const [isHovered, setIsHovered] = React.useState(null); const [speechSupported, setSpeechSupported] = React.useState(false); const [voices, setVoices] = React.useState([]); const { data: user, loading: userLoading } = useUser(); React.useEffect(()=>{ if (typeof window !== "undefined" && "speechSynthesis" in window) { setSpeechSupported(true); const loadVoices = ()=>{ const availableVoices = window.speechSynthesis.getVoices(); setVoices(availableVoices); }; window.speechSynthesis.onvoiceschanged = loadVoices; loadVoices(); } }, []); const handleSpeech = ()=>{ if (!speechSupported || voices.length === 0) return; const utterance = new SpeechSynthesisUtterance("Welcome to the home page. Choose an activity."); let selectedVoice = voices.find((v)=>v.name === "Samantha") || voices.find((v)=>v.lang.toLowerCase().includes("en") && v.name.toLowerCase().includes("female")) || voices.find((v)=>v.lang.toLowerCase().includes("en") && v.gender?.toLowerCase() === "female") || voices.find((v)=>v.lang.toLowerCase().includes("en")); if (selectedVoice) { utterance.voice = selectedVoice; } utterance.rate = 0.85; utterance.pitch = 1.1; window.speechSynthesis.cancel(); window.speechSynthesis.speak(utterance); }; const menuItems = [ { id: 1, icon: "fa-utensils", label: "Food", href: "/food" }, { id: 2, icon: "fa-person-running", label: "Activities", href: "/activities" }, { id: 3, icon: "fa-heart", label: "Emotions", href: "/emotions" }, { id: 4, icon: "fa-shower", label: "Hygiene", href: "/hygiene" }, { id: 5, icon: "fa-calendar-day", label: "Daily Planner", href: "/daily-planner" }, { id: 6, icon: "fa-calculator", label: "Numbers", href: "/numbers" }, { id: 7, icon: "fa-shapes", label: "Shapes", href: "/shapes" }, { id: 8, icon: "fa-paw", label: "Animals", href: "/unnamed-project" } ]; const defaultLinks = [ { href: "/about", label: "About" }, { href: "/contact", label: "Contact" } ]; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gradient-to-br from-[#E8F3E8] to-[#F5F9E9] flex flex-col", __source: { fileName: "", lineNumber: 80, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "container mx-auto px-4 md:px-8 pt-8", __source: { fileName: "", lineNumber: 81, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 82, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex md:hidden items-center gap-3", __source: { fileName: "", lineNumber: 83, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-4xl", __source: { fileName: "", lineNumber: 84, columnNumber: 13 }, __self: this }, "🧩"), /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold bg-gradient-to-r from-[#7CB342] via-[#FFB74D] to-[#FF69B4] text-transparent bg-clip-text animate-shimmer", __source: { fileName: "", lineNumber: 85, columnNumber: 13 }, __self: this }, "AutisticAudio")), /*#__PURE__*/ React.createElement("div", { className: "hidden md:flex items-center gap-3", __source: { fileName: "", lineNumber: 90, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "text-4xl", __source: { fileName: "", lineNumber: 91, columnNumber: 13 }, __self: this }, "🧩"), /*#__PURE__*/ React.createElement("h1", { className: "text-3xl font-bold bg-gradient-to-r from-[#7CB342] via-[#FFB74D] to-[#FF69B4] text-transparent bg-clip-text animate-shimmer", __source: { fileName: "", lineNumber: 92, columnNumber: 13 }, __self: this }, "AutisticAudio")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-4", __source: { fileName: "", lineNumber: 97, columnNumber: 11 }, __self: this }, !userLoading && !user && /*#__PURE__*/ React.createElement(React.Fragment, null, /*#__PURE__*/ React.createElement("a", { href: "/account/signin", className: "text-[#558B2F] hover:text-[#7CB342] transition-colors duration-200", __source: { fileName: "", lineNumber: 100, columnNumber: 17 }, __self: this }, "Sign In"), /*#__PURE__*/ React.createElement("a", { href: "/account/signup", className: "bg-[#7CB342] text-white px-4 py-2 rounded-lg hover:bg-[#558B2F] transition-colors duration-200", __source: { fileName: "", lineNumber: 106, columnNumber: 17 }, __self: this }, "Sign Up")), !userLoading && user && /*#__PURE__*/ React.createElement("a", { href: "/account/logout", className: "text-[#558B2F] hover:text-[#7CB342] transition-colors duration-200", __source: { fileName: "", lineNumber: 115, columnNumber: 15 }, __self: this }, "Sign Out")))), /*#__PURE__*/ React.createElement("main", { className: "container mx-auto px-4 md:px-8 mt-8 flex-grow pb-24", __source: { fileName: "", lineNumber: 126, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "rounded-xl overflow-hidden border-4 border-[#7CB342] shadow-sm mb-8", __source: { fileName: "", lineNumber: 127, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("img", { src: "https://ucarecdn.com/0661bd9d-3320-47d5-b252-46e0ae378759/", alt: "Hero", className: "w-full h-auto", __source: { fileName: "", lineNumber: 128, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mb-8 flex justify-center", __source: { fileName: "", lineNumber: 135, columnNumber: 9 }, __self: this }, speechSupported && /*#__PURE__*/ React.createElement("button", { onClick: handleSpeech, className: "bg-[#7CB342] text-white font-semibold py-2 px-4 rounded-lg shadow hover:bg-[#558B2F] transition duration-200 flex items-center gap-2", __source: { fileName: "", lineNumber: 137, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-5 h-5 flex items-center justify-center", __source: { fileName: "", lineNumber: 141, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-0 h-0 border-t-[6px] border-t-transparent border-b-[6px] border-b-transparent border-l-[10px] border-l-white ml-1", __source: { fileName: "", lineNumber: 142, columnNumber: 17 }, __self: this })), "Speak Welcome Message")), /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-2 md:grid-cols-4 gap-4 md:gap-6", __source: { fileName: "", lineNumber: 149, columnNumber: 9 }, __self: this }, menuItems.map((item)=>/*#__PURE__*/ React.createElement("a", { target: "_self", href: item.href, key: item.id, className: "relative bg-white rounded-xl p-6 md:p-8 flex flex-col items-center justify-between min-h-[160px] transition-all duration-300 hover:scale-105 shadow-sm", style: { border: `4px solid ${item.id === 1 ? "#7CB342" : item.id === 2 ? "#64B5F6" : item.id === 3 ? "#FFB74D" : item.id === 4 ? "#81C784" : item.id === 5 ? "#90CAF9" : item.id === 6 ? "#FFA726" : item.id === 7 ? "#66BB6A" : item.id === 8 ? "#42A5F5" : item.id === 9 ? "#7CB342" : "#64B5F6"}` }, onMouseEnter: ()=>setIsHovered(item.id), onMouseLeave: ()=>setIsHovered(null), __source: { fileName: "", lineNumber: 151, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `fas ${item.icon} text-3xl md:text-4xl ${isHovered === item.id ? "text-[#558B2F]" : "text-[#7CB342]"}`, __source: { fileName: "", lineNumber: 182, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { className: "text-[#558B2F] font-medium text-center mt-4", __source: { fileName: "", lineNumber: 187, columnNumber: 15 }, __self: this }, item.label))))), /*#__PURE__*/ React.createElement("footer", { className: "fixed bottom-0 left-0 right-0 bg-[#7CB342] text-white py-4 px-6 shadow-lg z-10", __source: { fileName: "", lineNumber: 195, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto flex justify-between items-center", __source: { fileName: "", lineNumber: 196, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("p", { className: "text-sm", __source: { fileName: "", lineNumber: 197, columnNumber: 11 }, __self: this }, "© 2025 AutisticAudio. All rights reserved."), /*#__PURE__*/ React.createElement("div", { className: "flex items-center space-x-4", __source: { fileName: "", lineNumber: 198, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/about", className: "text-sm hover:text-[#F5F9E9] transition-colors duration-200", __source: { fileName: "", lineNumber: 199, columnNumber: 13 }, __self: this }, "About"), /*#__PURE__*/ React.createElement("a", { href: "/contact", className: "text-sm hover:text-[#F5F9E9] transition-colors duration-200", __source: { fileName: "", lineNumber: 205, columnNumber: 13 }, __self: this }, "Contact")))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 215, columnNumber: 7 }, __self: this }, ` @keyframes float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-10px); } } .animate-float { animation: float 2s ease-in-out infinite; } @keyframes shimmer { 0% { background-position: -200% center; } 100% { background-position: 200% center; } } .animate-shimmer { animation: shimmer 3s linear infinite; background-size: 200% auto; } `)); }