Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application is designed to facilitate appointments for multiple pilates and physiotherapy professionals. Users can view available time slots, schedule appointments, and manage patient bookings efficiently. The application will cater to both mobile and desktop users, ensuring accessibility and ease of use across devices.

## CORE FEATURES
1. **Professional Schedule Management**  
   Each professional (Delmir, Milena, Célia, Brenda) has defined working hours and availability. Users can view and select time slots according to each professional's schedule.

2. **Patient Appointment Booking**  
   Patients can book appointments directly for their preferred professional within the available time slots, allowing a maximum of three patients per hour.

3. **Recurring Appointment Setup**  
   Users can set up recurring appointments for patients on specific days, simplifying the booking process for regular clients.

4. **Salary Percentage Configuration**  
   Admin users can configure and display the percentage of salary for each professional, providing transparency for financial arrangements.

5. **Financial Overview**  
   A financial section will be available for future use, initially set to zero, allowing for easy tracking of earnings and payments.

6. **Responsive Design**  
   The application will be fully responsive, ensuring a seamless experience for both mobile and desktop users.

## DESIGN SPECIFICATIONS
- **Visual Style:** Minimalist - Clean, simple design with plenty of white space, focusing on ease of navigation and readability.
- **Color Mode:** Light theme with dark text on light backgrounds, enhancing readability and user comfort.
- **Layout:** The main layout will feature a top navigation bar, a central appointment booking section, and a sidebar for professional information and financial management. Responsive grid layouts will be used to ensure proper alignment on various devices.
- **Typography:** Utilize a modern sans-serif font for headings (e.g., Montserrat) and a clean sans-serif font for body text (e.g., Open Sans), with a clear hierarchy for titles, subtitles, and body text.

## TECHNICAL REQUIREMENTS
- **Framework:** React with TypeScript
- **Styling:** Tailwind CSS for utility-first CSS styling
- **UI Components:** shadcn/ui for pre-designed UI components
- **State Management:** Redux or Context API for managing application state

## IMPLEMENTATION STEPS
1. **Set Up Project**  
   Initialize a new React project using Create React App with TypeScript support and install necessary dependencies (Tailwind CSS, shadcn/ui, Redux/Context API).

2. **Design Layout**  
   Create the layout structure using Tailwind CSS, ensuring responsive design principles are followed to accommodate mobile and desktop views.

3. **Develop Core Features**  
   Build the professional schedule management, patient appointment booking, and recurring appointment setup functionalities, integrating state management for seamless data handling.

4. **Implement Financial Overview**  
   Create a section for financial management, allowing admin users to configure salary percentages and display financial data.

5. **Test User Experience**  
   Conduct user testing to ensure smooth navigation, responsiveness, and overall functionality. Gather feedback for any necessary adjustments.

6. **Deploy Application**  
   Deploy the application to a web server, ensuring proper hosting for both mobile and desktop access.

## USER EXPERIENCE
Users will interact with the application by selecting their preferred professional from a list, viewing available time slots, and booking appointments directly. The interface will guide users through setting up recurring appointments and managing financial information, making the process straightforward and intuitive. The responsive design will ensure that users have a consistent experience, whether they are on a mobile device or a desktop computer.