Lovable Prompt Creator - AI Prompt Generator

# APPLICATION OVERVIEW
This web application is a clean, modern, and beginner-friendly fitness tracking platform tailored for students. It enables users to sign up and log in, allowing them to track their daily workouts, steps, water intake, and calories burned. The application provides a seamless experience for monitoring fitness progress through visual charts, achievement badges, and motivational quotes.

## CORE FEATURES
1. **User Authentication**: Secure sign-up and login functionality to protect user data.
2. **Daily Tracking**: Users can log daily workouts, steps taken, water intake, and calories burned with an intuitive interface.
3. **Progress Visualization**: Weekly charts and streak counters to help users visualize their fitness journey and maintain motivation.
4. **Profile Management**: A personal profile section where users can set and manage their fitness goals.
5. **Motivational Elements**: Daily motivational quotes and achievement badges to encourage users and celebrate their milestones.
6. **Responsive Design**: A mobile-responsive layout that ensures accessibility and usability across various devices.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - The design should be clean and simple with an abundance of white space, focusing on clarity and readability.
- **Color Mode**: Light theme featuring soft light-blue accents with dark text on light backgrounds to enhance readability.
- **Layout**: Utilize a card-based layout with rounded corners for UI components, arranged in a grid format for easy navigation and interaction. Key sections should include a dashboard overview, tracking inputs, and progress displays, all spaced evenly for a balanced aesthetic.
- **Typography**: Use clean sans-serif fonts like 'Inter' or 'Roboto' for body text, with larger headings to establish a clear hierarchy. Maintain consistent font sizes and weights to improve readability and user engagement.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for robust type checking and enhanced development experience.
- **Styling**: Tailwind CSS for utility-first styling, enabling rapid design iterations and a responsive layout.
- **UI Components**: Utilize shadcn/ui for pre-built, accessible components that adhere to the minimalist design principles.
- **State Management**: Use React Context or a state management library (like Zustand) if necessary, to manage user data and application state efficiently.

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React project using Create React App with TypeScript.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui to the project for styling and UI components.
3. **Create User Authentication**: Implement user authentication using Firebase or Auth0 for secure sign-in and sign-up functionalities.
4. **Design the UI Layout**: Create the main layout using Tailwind CSS, ensuring a clean, minimalist design with a responsive grid system.
5. **Build Core Features**: Develop components for tracking daily workouts, steps, water intake, and calories burned. Ensure these components are modular and reusable.
6. **Implement Progress Visualization**: Integrate charting libraries (like Chart.js or Recharts) to create visual representations of user progress.
7. **Profile Management**: Design a user profile section where fitness goals can be set and updated. Implement local storage to save user preferences and activity data.
8. **Add Motivational Features**: Create a dynamic section for displaying motivational quotes and a badge system for user achievements.
9. **Testing**: Conduct thorough testing across devices and browsers to ensure responsiveness and user experience.
10. **Deployment**: Deploy the application using Vercel or Netlify for easy access and updates.

## USER EXPERIENCE
Users will begin by creating an account or logging in. Upon entering the app, they are greeted with a clean dashboard displaying their current stats and progress. They can easily navigate to the tracking section to log their daily activities, which are visually represented in charts on their profile. Motivational quotes and achievement badges pop up at key milestones, encouraging continued engagement. The responsive design ensures users have a smooth experience whether on a mobile device or desktop, making it easy to stay on top of their fitness goals.