Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The "Pan Hub" is a modern web application designed for the Agência Pan to facilitate collaboration and communication among team members and clients. It features a sleek dashboard that showcases employee profiles, client management, news updates, and interactive sections for events and celebrations, all while maintaining a premium and user-friendly interface.

## CORE FEATURES
1. **Colaboradores Section**: Displays team members in a fluid grid layout with photos, names, roles, and contact information. Users can upload their photos and link to social media profiles, with interactive icons that reveal additional information.

2. **Clientes Section**: Features individual cards for each client, highlighting names and account managers. Clicking a client’s name provides access to relevant Google Drive files.

3. **Notícias/Anúncios/Eventos Section**: Includes a prominent news banner with a carousel of images, showcasing updates and events. Each announcement features a date, title, and rich text description, with options to add links to virtual meetings.

4. **Aniversariantes do Mês Section**: An interactive list displaying monthly birthdays, allowing users to click through to view yearly anniversaries and engage with celebratory animations.

5. **Colaboradores de Férias/Day Off Section**: A compact display of team members who are on vacation or off, using a minimal design to prioritize clarity and space.

6. **Chat/Comunicação Section**: A real-time chat interface resembling WhatsApp, where team members can send messages that display names, photos, and timestamps, fostering seamless communication.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - Clean, simple design with ample white space, a minimal color palette, and a strong focus on typography.
- **Color Mode**: Light theme with dark text on light backgrounds to enhance readability and maintain a professional appearance.
- **Layout**: The main dashboard layout will feature a top navigation bar, followed by various sections stacked vertically, with each section clearly defined and spaced to allow for easy navigation and interaction.
- **Typography**: Use modern and legible typefaces such as "Roboto" for body text and "Montserrat" for headings. Establish a clear hierarchy with larger font sizes for titles and smaller sizes for descriptions.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for building the application.
- **Styling**: Tailwind CSS for rapid and responsive design implementation.
- **UI Components**: Utilize shadcn/ui for modern, customizable UI components.
- **State Management**: Implement Zustand or React Context API for managing application state as needed.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui.
2. **Create Components**: Develop individual components for each section (Colaboradores, Clientes, Notícias, Aniversariantes, etc.) using functional components in React.
3. **Implement Routing**: Use React Router for section navigation, ensuring a smooth user experience.
4. **State Management**: Set up state management for handling user interactions, such as uploading photos and managing messages in the chat section.
5. **Style Components**: Apply Tailwind CSS classes to each component, focusing on maintaining a minimalist aesthetic and ensuring responsive design.
6. **Test Interactivity**: Ensure all interactive elements function as intended, including the chat system and clickable components for clients and news.

## USER EXPERIENCE
Users will have an intuitive experience navigating the "Pan Hub" dashboard. They can quickly access information about team members, clients, and news updates. The chat feature will allow for real-time communication, fostering collaboration. The layout will be responsive, adapting to various screen sizes to accommodate both desktop and mobile users, ensuring that all key functionalities are easily accessible regardless of device. Celebratory animations and interactive elements will enhance user engagement while maintaining an elegant and professional feel throughout the application.