Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
"Jardín de Propósitos" is a web application designed for productivity and goal management, incorporating gamification elements to engage users in achieving their objectives. The app features a clean and modern aesthetic, promoting a zen-like experience as users cultivate their goals through interactive gardening metaphors.

## CORE FEATURES
1. **Main Dashboard (El Jardín)**: A central hub displaying up to three active goal slots, each represented by a plant that reflects the user's progress. Users can add new goals, see health indicators, and manage their tasks from this view.
2. **Goal Creation Modal (Plantación)**: Users can input their goals in natural language, triggering an AI simulation that categorizes the goal and generates a sequential list of microtasks, promoting structured task management.
3. **Interaction and Gamification Logic (Cultivo y Marchitado)**: As users complete tasks, plants' health improves and evolves through growth stages. Completed tasks yield customization points for personalizing plants, while a simulation feature tests plant health over inactivity.
4. **Achievements Greenhouse (Invernadero de Logros)**: An archival section showcasing all successfully completed goals, presented in a visually appealing grid format, reinforcing user accomplishments.

## DESIGN SPECIFICATIONS
- **Visual Style**: minimalist - Clean, simple design with plenty of white space, minimal color palette, and focus on typography.
- **Color Mode**: Light theme with dark text on light backgrounds.
- **Primary Color**: #1978E5 (accent for buttons, links, highlights).
- **Typography**: Use Inter from Google Fonts for headings, Inter for body text and UI elements.
- **Border Radius**: 8px (moderately rounded) for buttons, cards, and inputs.
- **Layout**: The layout consists of a sidebar or tab navigation, a central dashboard area for displaying goals and their corresponding plants, and modal overlays for goal creation and task management.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui for building responsive and accessible components.
- **State Management**: Use React Context or Zustand for managing application state.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and integrate Tailwind CSS.
2. **Build Navigation**: Create a sidebar or tab navigation for switching between the main dashboard and the achievements section.
3. **Develop Main Dashboard**:
   - Implement slots for plants with conditional rendering based on their state (empty or active).
   - Include progress bars and interactive buttons for care actions.
4. **Create Goal Modal**:
   - Develop the input form for goal creation, integrating the simulated AI logic for plant assignment and microtask generation.
   - Ensure visibility rules for microtasks are implemented according to the specified logic.
5. **Gamification Logic**:
   - Implement the health bar and growth stages for plants based on task completion.
   - Add simulation buttons for testing plant health and reset functionalities.
6. **Achievements Section**: Design the greenhouse display for completed goals, ensuring it visually represents the user's achievements.

## USER EXPERIENCE
Users will experience a seamless journey starting from the main dashboard, where they can easily add and manage their goals. The interaction with plants will be intuitive, with visual cues indicating health and progress. Completing tasks will lead to satisfying visual changes in the plants, encouraging users to return daily and maintain their goals. The achievements section will serve as a motivational tool, celebrating user successes and fostering a sense of accomplishment.