Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The application is a web app designed to facilitate strategic project management for buyers in the tier 1 automotive sector. It aims to streamline communication, resource allocation, and project tracking, ensuring that all stakeholders can collaborate effectively and make informed decisions.

## CORE FEATURES
1. **User Authentication**: Secure login and registration for users to manage their profiles and access project data.
2. **Dashboard Overview**: A centralized dashboard displaying active projects, key metrics, and notifications to keep users informed about their tasks and responsibilities.
3. **Project Management Tools**: Features to create, edit, and track the progress of projects, including timelines, milestones, and task assignments.
4. **Collaboration Hub**: A space for team members to discuss projects, share documents, and provide updates in real-time.
5. **Reporting and Analytics**: Generating reports on project performance, resource utilization, and other key metrics to facilitate strategic decision-making.
6. **Integration with Tools**: Ability to connect with other tools commonly used in the automotive industry for data import/export and enhanced functionalities.

## 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 main layout will consist of a top navigation bar, a sidebar for quick access to features, and a responsive main content area that adapts to different screen sizes, ensuring a seamless user experience.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui.
- **State Management**: Redux or Context API for managing application state as needed.

## IMPLEMENTATION STEPS
1. **Setup Project Environment**: Initialize the React project with TypeScript and install necessary dependencies (React Router, Tailwind CSS, etc.).
2. **Configure Tailwind CSS**: Set up Tailwind CSS by creating a configuration file and including it in the project.
3. **Create Authentication Module**: Develop user authentication features, including login, registration, and password recovery.
4. **Build Dashboard Component**: Design and implement the dashboard layout, incorporating charts and metrics for real-time project monitoring.
5. **Develop Project Management Tools**: Create components for adding, editing, and tracking projects, ensuring intuitive user interactions.
6. **Implement Collaboration Hub**: Set up real-time messaging and document sharing functionalities using WebSockets or similar technologies.
7. **Add Reporting Features**: Integrate reporting tools to generate and export project performance data.
8. **Test and Optimize**: Conduct thorough testing for responsiveness and user experience, making adjustments based on feedback.

## USER EXPERIENCE
Key interactions include seamless navigation through the top bar and sidebar, intuitive forms for project management, and real-time updates in the collaboration hub. Users should feel empowered to manage their projects effectively with minimal clicks, ensuring that critical information is always at their fingertips while maintaining a clean and organized interface.