Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This application is a web-based travel agency dedicated to showcasing and booking boutique hotels in Bavaria. It aims to provide users with a seamless experience for discovering unique accommodations, planning their stays, and making reservations, all while maintaining a clean and minimalist aesthetic.

## CORE FEATURES
1. **Hotel Listings**: A curated list of boutique hotels in Bavaria, complete with high-quality images, descriptions, pricing, and availability.
2. **Search and Filter**: Users can search for hotels based on various criteria such as location, price range, amenities, and guest ratings.
3. **Detailed Hotel Pages**: Each hotel will have a dedicated page featuring detailed descriptions, photo galleries, user reviews, and a booking button.
4. **User Accounts**: Allow users to create accounts to save their favorite hotels, view booking history, and manage reservations.
5. **Booking System**: An integrated system that allows users to check availability, book rooms, and receive confirmation emails.
6. **Responsive Design**: Ensure the application is fully responsive, providing an optimal experience on desktop, tablet, and mobile devices.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - Emphasizes clean lines and simplicity, with abundant white space to enhance readability and focus on content.
- **Color Mode**: Light theme featuring dark text on light backgrounds, ensuring high contrast and legibility.
- **Layout**: A grid-based layout for hotel listings, with a fixed navigation bar at the top that includes links to Home, Search, and User Account. The hotel detail pages will have a side-by-side layout for images and information.
- **Typography**: Utilize a sans-serif font like "Helvetica Neue" for headlines and "Arial" for body text. Headings should be bold with a clear hierarchy (H1 for titles, H2 for sections, H3 for subsections).

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for type safety and robust component development.
- **Styling**: Tailwind CSS for utility-first CSS that allows for rapid and responsive UI development.
- **UI Components**: Use shadcn/ui for pre-built components that fit the minimalist aesthetic.
- **State Management**: Utilize React Context API or Zustand for managing global state effectively.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize the React application with TypeScript and install Tailwind CSS.
2. **Design Layout**: Create the main layout structure with a navigation bar, footer, and grid for hotel listings.
3. **Develop Core Features**:
   - Implement the hotel listing component using shadcn/ui components.
   - Create the search and filter functionality with state management.
   - Build detailed hotel pages with routing in React.
4. **User Authentication**: Integrate user account management with sign-up and login functionalities.
5. **Booking System**: Develop the booking system, ensuring secure transactions and user confirmations.
6. **Responsive Design**: Use Tailwind CSS to ensure all components are responsive across devices.
7. **Testing**: Conduct thorough testing of all features, including usability testing with target users.

## USER EXPERIENCE
Users will first land on the homepage where they can view a selection of boutique hotels. They can easily navigate to the search feature to find hotels based on their preferences. Each hotel listing will provide a quick overview, and clicking on a hotel will take users to a detailed page where they can see more images and book their stay. Users will have the ability to create accounts to manage their preferences and bookings, ensuring a personalized and streamlined experience throughout their journey on the site. The responsive design guarantees that users have a consistent experience whether they are on a desktop or mobile device.