Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a web application designed to provide a comprehensive Scope of Work for HR solutions tailored specifically for Indian companies. The application will serve as a platform for HR professionals to access, outline, and manage HR service requirements efficiently, ensuring that all HR processes are clearly defined and aligned with best practices.

## CORE FEATURES
1. **User Authentication**: Secure login and registration for users to manage their profiles and access personalized content.
2. **Scope of Work Templates**: Pre-defined templates for various HR services that users can customize according to their needs.
3. **Collaboration Tools**: Features for team members to comment, edit, and review scopes of work in real-time.
4. **Document Management**: Upload and store relevant documents associated with HR services, ensuring easy access and retrieval.
5. **Reporting Dashboard**: Visual representation of HR service statuses and metrics, helping users track progress and compliance.
6. **Contact Support**: Easy access to customer support for assistance with the platform and HR-related queries.

## 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 simple header with navigation, a sidebar for additional features, and a main content area that adapts based on the selected feature, ensuring a clear and intuitive user experience.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Redux Toolkit (for managing global state if necessary)

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install necessary dependencies (React Router, Redux Toolkit, Tailwind CSS).
2. **Create Authentication Module**: Develop user authentication features using Firebase or Auth0, ensuring secure login and registration.
3. **Design UI Components**: Create reusable components for the dashboard, forms, and templates using Tailwind CSS and shadcn/ui.
4. **Implement Scope of Work Templates**: Build a module to allow users to select, customize, and save templates for HR services.
5. **Develop Collaboration Features**: Implement real-time commenting and editing functionalities using WebSocket or similar technologies.
6. **Set Up Document Management**: Integrate file upload functionality and establish a database structure for storing user documents.
7. **Create Reporting Dashboard**: Use chart libraries to visualize HR metrics and service statuses in a user-friendly manner.
8. **Testing**: Conduct thorough testing of all features, ensuring they work seamlessly across different devices and browsers.
9. **Deployment**: Deploy the application on a cloud platform such as Vercel or AWS and ensure it is accessible to users.

## USER EXPERIENCE
Users will navigate through a clean and intuitive interface where they can easily access different modules. The authentication process will be straightforward, allowing users to quickly log in or sign up. Once inside, users can select from various templates, customize their scope of work, and collaborate with team members seamlessly. The dashboard will provide insights into their HR service statuses, making it easy to stay informed. The layout will adapt responsively, ensuring a smooth experience on both desktop and mobile devices.