Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The application is a web app designed for managing ticket reservations for "LA PASION DE CRISTO." Users can select seats through a cinema-like seating interface, allowing them to view available, selected, and reserved seats. The app will utilize Supabase for database management of reservations, customer details, and seat information.

## CORE FEATURES
1. **Seat Selection**: Interactive seating chart allowing users to select and reserve seats, with visual indicators for availability (red for reserved, gray for free, green for selected).
2. **Reservation Management**: Users can enter their name when reserving tickets, and the app will store this information along with seat IDs.
3. **Day Differentiation**: Options to differentiate between seat selections for Saturday and Sunday performances.
4. **Database Integration**: Use of Supabase to manage and store reservation data securely.
5. **User Notifications**: Confirmation messages upon successful seat reservation and notifications for any errors during the process.
6. **Responsive Design**: Accessible on various devices, ensuring a seamless experience on mobile and desktop.

## 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 layout will consist of a header, the interactive seating chart in the center, a reservation form below the chart, and a footer with contact information.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: React Context API or Zustand for managing application state

## IMPLEMENTATION STEPS
1. **Setup React Application**: Initialize a new React project with TypeScript and install Tailwind CSS.
2. **Install Dependencies**: Add Supabase, shadcn/ui, and any other necessary libraries for state management and routing.
3. **Design Layout**: Create the header, footer, and main content area for the seating chart and reservation form.
4. **Develop Seat Selection Component**: Implement the seating chart with visual indicators for seat status (reserved, available, selected).
5. **Integrate Supabase**: Set up Supabase to manage the database for reservations, creating tables for seats and customer details.
6. **Form Handling**: Build the reservation form to capture user input (name, day selection) and connect it to the database to store reservations.
7. **Add Notifications**: Implement user feedback mechanisms for successful reservations and error handling.
8. **Responsive Testing**: Ensure the application is fully responsive and performs well on different device sizes.

## USER EXPERIENCE
Users will interact with the app by selecting their desired seats on the seating chart. Upon selection, they will enter their name and choose the performance day (Saturday or Sunday). After submitting their reservation, users will receive a confirmation message, and the selected seats will be updated visually in real-time. The app will be designed to provide a smooth, intuitive experience, minimizing the number of clicks needed to complete a reservation.