Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application will serve as a platform for users to find and book appointments at clinics across India. It will provide a comprehensive list of clinics, allowing users to view details about each clinic, including descriptions, contact information, and the qualifications of the doctors working there. The app aims to streamline the process of finding healthcare services and booking appointments.

## CORE FEATURES
1. **Clinic Directory**: A searchable and filterable list of clinics based on location, specialties, and availability.
2. **Appointment Booking**: Users can book appointments directly through the app by selecting a clinic and available time slots.
3. **Clinic Details**: Each clinic will have a dedicated page displaying a description, contact information, and a list of doctors with their names, numbers, and degrees.
4. **User Profiles**: Users can create accounts to manage their appointments and save favorite clinics for easy access.
5. **Contact Clinic**: A feature allowing users to directly contact clinics via phone or email for inquiries.
6. **Reviews and Ratings**: Users can leave reviews and ratings for clinics, helping others make informed decisions.

## 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 header with navigation, a hero section showcasing the app’s purpose, followed by the clinic directory and a footer with contact information and links.

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

## IMPLEMENTATION STEPS
1. **Set up the React environment**: Initialize a new React project with TypeScript and install Tailwind CSS.
2. **Create the main components**: Develop the header, hero section, clinic list component, clinic details page, and user profile page.
3. **Implement routing**: Use React Router to handle navigation between the clinic list, details, and user profile.
4. **Build the clinic directory**: Fetch clinic data from a mock API or database and display it on the clinic list page.
5. **Develop appointment booking logic**: Create a form for users to select a clinic and available time slots for booking.
6. **Add user authentication**: Implement user account creation and login functionality, allowing users to save their favorite clinics and manage appointments.
7. **Integrate contact features**: Provide options for users to contact clinics directly through phone or email.
8. **Incorporate reviews and ratings**: Allow users to submit reviews for clinics and display these on each clinic's detail page.
9. **Style the application**: Use Tailwind CSS to apply the specified design, ensuring responsiveness and accessibility.
10. **Testing and deployment**: Conduct thorough testing for user flows and deploy the application on a suitable hosting platform.

## USER EXPERIENCE
Users will have a straightforward experience starting from the landing page, where they can search for clinics. Upon selecting a clinic from the directory, they will be directed to a detailed view featuring all relevant information. The booking process will be intuitive, guiding users through selecting a date and time, with confirmation notifications. Users will also be able to manage their profiles, view appointment history, and leave feedback, fostering an engaging and user-friendly environment.