Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application is designed for clients to register, log in, and monitor ongoing projects. Administrators can manage users and their access rights, ensuring that each client can only view the projects they are authorized to see. The application features a clean and modern interface that emphasizes simplicity and usability.

## CORE FEATURES
1. **User Registration and Login**: Clients can register using their name, email, and phone number on their first access. Subsequent logins will allow them to keep their session active.
2. **User Management for Admin**: Administrators can invite and manage users, assigning roles as CLIENTS, COLABORADORES, or ADMINISTRADORES with specific project access.
3. **Project Timeline**: Each project will feature a vertical timeline where content such as images, documents, and videos can be uploaded and organized. Os arquivo em PDF e as imagens no formato 360º são as mais importantes nessa timeline.
4. **Content Interaction**: Users can click on content items within the timeline to view detailed information in an overlay window, with options to edit or delete content available only to administrators.
5. **Event Management**: Administrators can drag and drop files into events, create new content, and reorder items within events seamlessly.
6. **Real-Time Updates**: Changes made by the administrator are saved instantly, enhancing the collaborative experience for clients.

## 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 application will feature a clean layout with a prominent navigation bar, a hero section for project access, and a sidebar for user management. The project timeline will be the central focus, with a responsive design to accommodate various devices.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Redux or Context API for managing user sessions and project data

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React project with TypeScript and install required libraries (Tailwind CSS, shadcn/ui).
2. **Create User Authentication**: Implement registration and login functionalities using a secure authentication method (JWT or OAuth).
3. **Develop User Management Interface**: Build the administrator's dashboard to manage users and their permissions.
4. **Implement Project Timeline**: Create the vertical timeline component for displaying project content and allow drag-and-drop functionality for file uploads.
5. **Create Event Management Features**: Enable the ability to edit, reorder, and delete content items within each project event.
6. **Test User Interactions**: Conduct usability testing to refine user experience and ensure that the application functions smoothly across devices.

## USER EXPERIENCE
Clients will have a straightforward onboarding process, beginning with registration and subsequent logins. The application will provide a clean interface where they can easily navigate to their projects. The project timeline will allow for intuitive interaction with content, while administrators will have robust management tools to oversee user access and project details. Real-time updates ensure that all users are kept informed of changes and developments.