Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a web application designed to provide AI-driven mental health support that communicates in users' dialects, effectively removing the stigma associated with traditional clinical therapy. The application aims to offer a safe, approachable platform for users to engage with mental health resources tailored to their cultural context.

## CORE FEATURES
1. **AI Chatbot**: An interactive AI-powered chatbot that engages users in conversations about mental health, using their dialect to foster comfort and relatability.
2. **Resource Library**: A collection of articles, videos, and self-help tools that are easily accessible to users for additional support.
3. **Mood Tracker**: A simple tool for users to log their feelings and track their mental health over time, providing insights and patterns.
4. **Community Support**: A forum or discussion board where users can share experiences and support each other in a stigma-free environment.
5. **Emergency Contacts**: Quick access buttons to local mental health services and hotlines for immediate assistance.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - Clean, simple design with plenty of white space, focusing on readability and ease of navigation.
- **Color Mode**: Light theme with dark text on light backgrounds to enhance clarity and reduce eye strain.
- **Layout**: A single-column layout with a prominent header, followed by sections for the chatbot, resource library, mood tracker, community support, and emergency contacts. Each section should have ample spacing for a clean look.
- **Typography**: Use of a sans-serif font for clarity (e.g., Arial or Helvetica) with a clear hierarchy: larger, bold headings for section titles and regular weight for body text.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for building a scalable and maintainable application.
- **Styling**: Tailwind CSS for rapid, responsive design with utility-first styling.
- **UI Components**: Utilize shadcn/ui to ensure modern and accessible UI components.
- **State Management**: Implement React Context API or Zustand for state management, ensuring a smooth user experience across components.

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React project with TypeScript using Create React App or Vite.
2. **Install Dependencies**: Install Tailwind CSS and shadcn/ui components for styling and UI consistency.
3. **Create Core Components**: Develop the main components for the AI chatbot, resource library, mood tracker, community support, and emergency contacts.
4. **Implement State Management**: Set up the Context API or Zustand to manage user state and interactions across the application.
5. **Design the Layout**: Use Tailwind CSS to structure the layout based on the minimalist design specifications, ensuring responsiveness across devices.
6. **Integrate AI Functionality**: Implement the AI chatbot backend using suitable AI models or APIs that can support dialect recognition and response generation.
7. **Test the User Experience**: Conduct usability testing with target users to refine interactions and ensure the bot effectively communicates in their dialect.

## USER EXPERIENCE
The user journey starts with a clean landing page where users are greeted by the AI chatbot, inviting them to start a conversation. Users can easily navigate to the resource library or mood tracker through clear call-to-action buttons. The community support section encourages users to engage with others, while emergency contacts are prominently displayed for quick access. The application is designed to be intuitive, ensuring that users feel comfortable seeking mental health support without the pressure of traditional therapy settings.