function GoalTracker({ goal, progress, recommendations = [] }) { const [selectedTab, setSelectedTab] = useState("progress"); const percent = Math.min(progress / goal * 100, 100); return /*#__PURE__*/ React.createElement("div", { className: "rounded-lg bg-white p-6 shadow-lg w-full max-w-md", __source: { fileName: "", lineNumber: 6, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "mb-4", __source: { fileName: "", lineNumber: 7, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "relative h-4 bg-gray-200 rounded-full", __source: { fileName: "", lineNumber: 8, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "absolute h-full bg-blue-500 rounded-full transition-all duration-500 ease-in-out", style: { width: `${percent}%` }, __source: { fileName: "", lineNumber: 9, columnNumber: 11 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "mt-2 text-right text-sm text-gray-600 font-roboto", __source: { fileName: "", lineNumber: 14, columnNumber: 9 }, __self: this }, progress, " / ", goal)), /*#__PURE__*/ React.createElement("div", { className: "flex gap-2 mb-4", __source: { fileName: "", lineNumber: 19, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setSelectedTab("progress"), className: `px-4 py-2 rounded-lg font-roboto ${selectedTab === "progress" ? "bg-blue-500 text-white" : "bg-gray-100"}`, __source: { fileName: "", lineNumber: 20, columnNumber: 9 }, __self: this }, "Progress"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setSelectedTab("recommendations"), className: `px-4 py-2 rounded-lg font-roboto ${selectedTab === "recommendations" ? "bg-blue-500 text-white" : "bg-gray-100"}`, __source: { fileName: "", lineNumber: 30, columnNumber: 9 }, __self: this }, "AI Tips")), selectedTab === "progress" && /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 43, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 44, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-roboto", __source: { fileName: "", lineNumber: 45, columnNumber: 13 }, __self: this }, "Current Streak"), /*#__PURE__*/ React.createElement("span", { className: "font-roboto", __source: { fileName: "", lineNumber: 46, columnNumber: 13 }, __self: this }, "🔥 3 days")), /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between", __source: { fileName: "", lineNumber: 48, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("span", { className: "font-roboto", __source: { fileName: "", lineNumber: 49, columnNumber: 13 }, __self: this }, "Best Streak"), /*#__PURE__*/ React.createElement("span", { className: "font-roboto", __source: { fileName: "", lineNumber: 50, columnNumber: 13 }, __self: this }, "7 days"))), selectedTab === "recommendations" && /*#__PURE__*/ React.createElement("ul", { className: "space-y-3", __source: { fileName: "", lineNumber: 56, columnNumber: 9 }, __self: this }, recommendations.map((tip, index)=>/*#__PURE__*/ React.createElement("li", { key: index, className: "flex items-start gap-2 font-roboto", __source: { fileName: "", lineNumber: 58, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-lightbulb text-yellow-400 mt-1", __source: { fileName: "", lineNumber: 59, columnNumber: 15 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 60, columnNumber: 15 }, __self: this }, tip))))); } function GoalTrackerStory() { const mockRecommendations = [ "Try breaking your goal into smaller tasks", "Schedule specific times for goal-related activities", "Share your progress with a friend for accountability" ]; return /*#__PURE__*/ React.createElement("div", { className: "p-8 bg-gray-100 min-h-screen", __source: { fileName: "", lineNumber: 77, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-8", __source: { fileName: "", lineNumber: 78, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement(GoalTracker, { goal: 100, progress: 65, recommendations: mockRecommendations, __source: { fileName: "", lineNumber: 79, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement(GoalTracker, { goal: 50, progress: 50, recommendations: mockRecommendations, __source: { fileName: "", lineNumber: 84, columnNumber: 9 }, __self: this }), /*#__PURE__*/ React.createElement(GoalTracker, { goal: 200, progress: 40, recommendations: mockRecommendations, __source: { fileName: "", lineNumber: 89, columnNumber: 9 }, __self: this }))); } function CareerCoach({ profile = {}, recommendations = [], mentors = [] }) { const [selectedTab, setSelectedTab] = useState("profile"); return /*#__PURE__*/ React.createElement("div", { className: "max-w-7xl mx-auto px-4 py-8", __source: { fileName: "", lineNumber: 5, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap gap-4 mb-8", __source: { fileName: "", lineNumber: 6, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setSelectedTab("profile"), className: `px-6 py-2 rounded-full font-roboto ${selectedTab === "profile" ? "bg-[#2563eb] text-white" : "bg-gray-100"}`, __source: { fileName: "", lineNumber: 7, columnNumber: 9 }, __self: this }, "Profile Matching"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setSelectedTab("jobs"), className: `px-6 py-2 rounded-full font-roboto ${selectedTab === "jobs" ? "bg-[#2563eb] text-white" : "bg-gray-100"}`, __source: { fileName: "", lineNumber: 13, columnNumber: 9 }, __self: this }, "Job Recommendations"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setSelectedTab("mentors"), className: `px-6 py-2 rounded-full font-roboto ${selectedTab === "mentors" ? "bg-[#2563eb] text-white" : "bg-gray-100"}`, __source: { fileName: "", lineNumber: 19, columnNumber: 9 }, __self: this }, "Mentorship")), selectedTab === "profile" && /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-lg p-6", __source: { fileName: "", lineNumber: 28, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("h2", { className: "text-2xl font-roboto mb-4", __source: { fileName: "", lineNumber: 29, columnNumber: 11 }, __self: this }, "Your Career Profile"), /*#__PURE__*/ React.createElement("div", { className: "grid md:grid-cols-2 gap-6", __source: { fileName: "", lineNumber: 30, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 31, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 32, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block font-roboto mb-2", __source: { fileName: "", lineNumber: 33, columnNumber: 17 }, __self: this }, "Skills"), /*#__PURE__*/ React.createElement("input", { type: "text", name: "skills", className: "w-full p-2 border rounded", placeholder: "Add your skills", __source: { fileName: "", lineNumber: 34, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 41, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "block font-roboto mb-2", __source: { fileName: "", lineNumber: 42, columnNumber: 17 }, __self: this }, "Experience"), /*#__PURE__*/ React.createElement("textarea", { name: "experience", className: "w-full p-2 border rounded", rows: "4", placeholder: "Describe your experience", __source: { fileName: "", lineNumber: 43, columnNumber: 17 }, __self: this }))), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-50 p-4 rounded", __source: { fileName: "", lineNumber: 51, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-roboto mb-3", __source: { fileName: "", lineNumber: 52, columnNumber: 15 }, __self: this }, "Match Score"), /*#__PURE__*/ React.createElement("div", { className: "text-4xl font-bold text-[#2563eb]", __source: { fileName: "", lineNumber: 53, columnNumber: 15 }, __self: this }, "87%"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 mt-2", __source: { fileName: "", lineNumber: 54, columnNumber: 15 }, __self: this }, "Profile completion status")))), selectedTab === "jobs" && /*#__PURE__*/ React.createElement("div", { className: "grid md:grid-cols-2 lg:grid-cols-3 gap-6", __source: { fileName: "", lineNumber: 61, columnNumber: 9 }, __self: this }, recommendations.map((job, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "bg-white rounded-lg shadow-lg p-6", __source: { fileName: "", lineNumber: 63, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center justify-between mb-4", __source: { fileName: "", lineNumber: 64, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-roboto text-lg", __source: { fileName: "", lineNumber: 65, columnNumber: 17 }, __self: this }, job.title || "Software Engineer"), /*#__PURE__*/ React.createElement("i", { className: "fas fa-bookmark text-gray-400", __source: { fileName: "", lineNumber: 68, columnNumber: 17 }, __self: this })), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600 mb-4", __source: { fileName: "", lineNumber: 70, columnNumber: 15 }, __self: this }, job.company || "Tech Corp"), /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-2 text-sm text-gray-500", __source: { fileName: "", lineNumber: 71, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-map-marker-alt", __source: { fileName: "", lineNumber: 72, columnNumber: 17 }, __self: this }), /*#__PURE__*/ React.createElement("span", { __source: { fileName: "", lineNumber: 73, columnNumber: 17 }, __self: this }, job.location || "Remote"))))), selectedTab === "mentors" && /*#__PURE__*/ React.createElement("div", { className: "grid md:grid-cols-2 lg:grid-cols-3 gap-6", __source: { fileName: "", lineNumber: 81, columnNumber: 9 }, __self: this }, mentors.map((mentor, index)=>/*#__PURE__*/ React.createElement("div", { key: index, className: "bg-white rounded-lg shadow-lg p-6", __source: { fileName: "", lineNumber: 83, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex items-center gap-4 mb-4", __source: { fileName: "", lineNumber: 84, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "w-16 h-16 rounded-full bg-gray-200 flex items-center justify-center", __source: { fileName: "", lineNumber: 85, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-user text-2xl text-gray-400", __source: { fileName: "", lineNumber: 86, columnNumber: 19 }, __self: this })), /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 88, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("h3", { className: "font-roboto text-lg", __source: { fileName: "", lineNumber: 89, columnNumber: 19 }, __self: this }, mentor.name || "Sarah Johnson"), /*#__PURE__*/ React.createElement("p", { className: "text-gray-600", __source: { fileName: "", lineNumber: 92, columnNumber: 19 }, __self: this }, mentor.role || "Senior Product Manager"))), /*#__PURE__*/ React.createElement("button", { className: "w-full bg-[#2563eb] text-white py-2 rounded font-roboto", __source: { fileName: "", lineNumber: 97, columnNumber: 15 }, __self: this }, "Connect"))))); } function CareerCoachStory() { const sampleMentors = [ { name: "Sarah Johnson", role: "Senior Product Manager" }, { name: "Michael Chen", role: "Tech Lead" }, { name: "Emily Brown", role: "UX Director" } ]; const sampleJobs = [ { title: "Software Engineer", company: "Tech Corp", location: "Remote" }, { title: "Product Manager", company: "Innovation Inc", location: "New York" }, { title: "UX Designer", company: "Design Co", location: "San Francisco" } ]; return /*#__PURE__*/ React.createElement("div", { className: "bg-gray-50 min-h-screen", __source: { fileName: "", lineNumber: 126, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(CareerCoach, { mentors: sampleMentors, recommendations: sampleJobs, profile: {}, __source: { fileName: "", lineNumber: 127, columnNumber: 7 }, __self: this })); } function NavigationBar() { return /*#__PURE__*/ React.createElement("nav", { className: "bg-gradient-to-r from-[#2C1810] to-[#1a1a1a] p-4", __source: { fileName: "", lineNumber: 3, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "container mx-auto", __source: { fileName: "", lineNumber: 4, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("ul", { className: "flex space-x-6 text-white font-roboto", __source: { fileName: "", lineNumber: 5, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 6, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/dashboard", className: "hover:text-[#FFD700] transition-colors duration-300", __source: { fileName: "", lineNumber: 7, columnNumber: 13 }, __self: this }, "Dashboard")), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 14, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/career", className: "hover:text-[#FFD700] transition-colors duration-300", __source: { fileName: "", lineNumber: 15, columnNumber: 13 }, __self: this }, "Career")), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 22, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/goals", className: "hover:text-[#FFD700] transition-colors duration-300", __source: { fileName: "", lineNumber: 23, columnNumber: 13 }, __self: this }, "Goals")), /*#__PURE__*/ React.createElement("li", { __source: { fileName: "", lineNumber: 30, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("a", { href: "/community", className: "hover:text-[#FFD700] transition-colors duration-300", __source: { fileName: "", lineNumber: 31, columnNumber: 13 }, __self: this }, "Community"))))); } function NavigationBarStory() { return /*#__PURE__*/ React.createElement("div", { __source: { fileName: "", lineNumber: 46, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(NavigationBar, { __source: { fileName: "", lineNumber: 47, columnNumber: 7 }, __self: this })); } function HealthTracker() { const [activeTab, setActiveTab] = useState('period'); const [periodData, setPeriodData] = useState({ lastPeriod: '', cycleLength: '' }); const [fitnessData, setFitnessData] = useState({ workouts: [], goals: '' }); const [sleepData, setSleepData] = useState({ hours: '', quality: '' }); const [nutritionData, setNutritionData] = useState({ meals: [], waterIntake: 0 }); return /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-lg shadow-lg p-6 max-w-[800px] mx-auto", __source: { fileName: "", lineNumber: 9, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement("h1", { className: "text-2xl font-poppins font-bold text-[#2D3748] mb-6", __source: { fileName: "", lineNumber: 10, columnNumber: 7 }, __self: this }, "Health Tracker"), /*#__PURE__*/ React.createElement("div", { className: "flex flex-wrap gap-4 mb-6", __source: { fileName: "", lineNumber: 12, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActiveTab('period'), className: `px-4 py-2 rounded-full ${activeTab === 'period' ? 'bg-[#F687B3] text-white' : 'bg-[#FED7E2] text-[#702459]'}`, __source: { fileName: "", lineNumber: 13, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-calendar-alt mr-2", __source: { fileName: "", lineNumber: 17, columnNumber: 11 }, __self: this }), "Period Tracking"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActiveTab('fitness'), className: `px-4 py-2 rounded-full ${activeTab === 'fitness' ? 'bg-[#4299E1] text-white' : 'bg-[#BEE3F8] text-[#2A4365]'}`, __source: { fileName: "", lineNumber: 19, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-running mr-2", __source: { fileName: "", lineNumber: 23, columnNumber: 11 }, __self: this }), "Fitness Plans"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActiveTab('sleep'), className: `px-4 py-2 rounded-full ${activeTab === 'sleep' ? 'bg-[#9F7AEA] text-white' : 'bg-[#E9D8FD] text-[#44337A]'}`, __source: { fileName: "", lineNumber: 25, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-moon mr-2", __source: { fileName: "", lineNumber: 29, columnNumber: 11 }, __self: this }), "Sleep Tracking"), /*#__PURE__*/ React.createElement("button", { onClick: ()=>setActiveTab('nutrition'), className: `px-4 py-2 rounded-full ${activeTab === 'nutrition' ? 'bg-[#48BB78] text-white' : 'bg-[#C6F6D5] text-[#22543D]'}`, __source: { fileName: "", lineNumber: 31, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fas fa-utensils mr-2", __source: { fileName: "", lineNumber: 35, columnNumber: 11 }, __self: this }), "Nutrition")), /*#__PURE__*/ React.createElement("div", { className: "bg-gray-50 p-6 rounded-lg", __source: { fileName: "", lineNumber: 39, columnNumber: 7 }, __self: this }, activeTab === 'period' && /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 41, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col", __source: { fileName: "", lineNumber: 42, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "text-gray-600 mb-2", __source: { fileName: "", lineNumber: 43, columnNumber: 15 }, __self: this }, "Last Period Date"), /*#__PURE__*/ React.createElement("input", { type: "date", className: "border rounded-lg p-2", value: periodData.lastPeriod, onChange: (e)=>setPeriodData({ ...periodData, lastPeriod: e.target.value }), __source: { fileName: "", lineNumber: 44, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("div", { className: "flex flex-col", __source: { fileName: "", lineNumber: 51, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "text-gray-600 mb-2", __source: { fileName: "", lineNumber: 52, columnNumber: 15 }, __self: this }, "Cycle Length (days)"), /*#__PURE__*/ React.createElement("input", { type: "number", className: "border rounded-lg p-2", value: periodData.cycleLength, onChange: (e)=>setPeriodData({ ...periodData, cycleLength: e.target.value }), __source: { fileName: "", lineNumber: 53, columnNumber: 15 }, __self: this }))), activeTab === 'fitness' && /*#__PURE__*/ React.createElement("div", { className: "space-y-4", __source: { fileName: "", lineNumber: 64, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "flex flex-col", __source: { fileName: "", lineNumber: 65, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("label", { className: "text-gray-600 mb-2", __source: { fileName: "", lineNumber: 66, columnNumber: 15 }, __self: this }, "Fitness Goals"), /*#__PURE__*/ React.createElement("textarea", { className: "border rounded-lg p-2", value: fitnessData.goals, onChange: (e)=>setFitnessData({ ...fitnessData, goals: e.target.value }), __source: { fileName: "", lineNumber: 67, columnNumber: 15 }, __self: this }))))); } function MainComponent() { const goals = [ { id: 1, title: "Daily Wellness", goal: 100, progress: 65, icon: "fa-solid fa-spa", color: "from-[#FFD1DC] to-[#FF69B4]", recommendations: [ "Break this goal into smaller tasks", "Set regular check-in times", "Share progress with friends" ] }, { id: 2, title: "Career Growth", goal: 50, progress: 25, icon: "fa-solid fa-star", color: "from-[#B4D7FF] to-[#4A9EFF]", recommendations: [ "Create a daily routine", "Track progress in a journal", "Celebrate small wins" ] } ]; return /*#__PURE__*/ React.createElement("div", { className: "min-h-screen bg-gradient-to-br from-[#FFF5F7] to-[#F0F7FF]", __source: { fileName: "", lineNumber: 32, columnNumber: 5 }, __self: this }, /*#__PURE__*/ React.createElement(NavigationBar, { __source: { fileName: "", lineNumber: 33, columnNumber: 7 }, __self: this }), /*#__PURE__*/ React.createElement("div", { className: "container mx-auto px-4 py-12", __source: { fileName: "", lineNumber: 34, columnNumber: 7 }, __self: this }, /*#__PURE__*/ React.createElement("header", { className: "text-center mb-16", __source: { fileName: "", lineNumber: 35, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "inline-block bg-white p-3 rounded-full shadow-lg mb-6", __source: { fileName: "", lineNumber: 36, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-crown text-[#FFD700] text-3xl", __source: { fileName: "", lineNumber: 37, columnNumber: 13 }, __self: this })), /*#__PURE__*/ React.createElement("h1", { className: "text-5xl font-bold font-playfair text-[#2C1810] mb-4", __source: { fileName: "", lineNumber: 39, columnNumber: 11 }, __self: this }, "Your Goals Journey"), /*#__PURE__*/ React.createElement("p", { className: "text-[#666666] font-lato text-lg max-w-2xl mx-auto", __source: { fileName: "", lineNumber: 42, columnNumber: 11 }, __self: this }, "Transform your aspirations into achievements with style")), /*#__PURE__*/ React.createElement("main", { className: "max-w-5xl mx-auto", __source: { fileName: "", lineNumber: 47, columnNumber: 9 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "grid grid-cols-1 md:grid-cols-2 gap-8", __source: { fileName: "", lineNumber: 48, columnNumber: 11 }, __self: this }, goals.map((goalData)=>/*#__PURE__*/ React.createElement("div", { key: goalData.id, className: "transform hover:scale-105 transition-all duration-300", __source: { fileName: "", lineNumber: 50, columnNumber: 15 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white rounded-2xl shadow-xl overflow-hidden", __source: { fileName: "", lineNumber: 54, columnNumber: 17 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: `bg-gradient-to-r ${goalData.color} p-6 flex items-center gap-4`, __source: { fileName: "", lineNumber: 55, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "bg-white/30 p-3 rounded-full", __source: { fileName: "", lineNumber: 58, columnNumber: 21 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: `${goalData.icon} text-white text-2xl`, __source: { fileName: "", lineNumber: 59, columnNumber: 23 }, __self: this })), /*#__PURE__*/ React.createElement("h2", { className: "text-white font-playfair text-2xl", __source: { fileName: "", lineNumber: 61, columnNumber: 21 }, __self: this }, goalData.title)), /*#__PURE__*/ React.createElement("div", { className: "p-6", __source: { fileName: "", lineNumber: 65, columnNumber: 19 }, __self: this }, /*#__PURE__*/ React.createElement(GoalTracker, { goal: goalData.goal, progress: goalData.progress, recommendations: goalData.recommendations, __source: { fileName: "", lineNumber: 66, columnNumber: 21 }, __self: this })))))), /*#__PURE__*/ React.createElement("div", { className: "mt-16 bg-white rounded-2xl shadow-xl p-8 text-center", __source: { fileName: "", lineNumber: 77, columnNumber: 11 }, __self: this }, /*#__PURE__*/ React.createElement("div", { className: "inline-block bg-[#FFF5F7] p-4 rounded-full mb-6", __source: { fileName: "", lineNumber: 78, columnNumber: 13 }, __self: this }, /*#__PURE__*/ React.createElement("i", { className: "fa-solid fa-wand-magic-sparkles text-[#FF6B6B] text-3xl", __source: { fileName: "", lineNumber: 79, columnNumber: 15 }, __self: this })), /*#__PURE__*/ React.createElement("h2", { className: "font-playfair text-2xl text-[#2C1810] mb-4", __source: { fileName: "", lineNumber: 81, columnNumber: 13 }, __self: this }, "Ready to set a new goal?"), /*#__PURE__*/ React.createElement("button", { className: "bg-gradient-to-r from-[#FF6B6B] to-[#FF8E8E] text-white font-lato py-3 px-8 rounded-full hover:shadow-lg transform hover:scale-105 transition-all duration-300", __source: { fileName: "", lineNumber: 84, columnNumber: 13 }, __self: this }, "Create New Goal")))), /*#__PURE__*/ React.createElement("style", { jsx: true, global: true, __source: { fileName: "", lineNumber: 91, columnNumber: 7 }, __self: this }, ` @keyframes sparkle { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.2); opacity: 0.8; } } .fa-crown { animation: sparkle 2s infinite; } `)); }