Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The CUPRA SENSES application is a web app designed for in-car use, providing an immersive multisensory experience for users driving CUPRA's modern and sporty vehicles. It allows users to input their destination, calculate travel time, and engage with a unique experience that enhances their mood through haptics, aromas, lights, and sound, tailored to the journey's context.

## CORE FEATURES
1. **Destination Input**: Users can easily enter their desired destination through an intuitive interface.
2. **Travel Time Estimation**: Integrates Google Maps API to calculate and display the estimated duration of the trip.
3. **CUPRA SENSES Experience Prompt**: If the journey exceeds 40 minutes, a prompt appears asking if the user wants to engage with CUPRA SENSES.
4. **Immersion Level Selection**: Users can choose between three levels of immersion (basic, intermediate, and maximum) with brief descriptions for each level.
5. **Adjustable Settings**: Users can modify their sensory experience settings before starting the journey and adjust them as needed during the trip.
6. **Journey Summary**: Provides a summary screen of selected settings and options before the trip begins.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - The design features a clean and simple aesthetic with ample white space, ensuring ease of readability and focus.
- **Color Mode**: Light theme with dark text on light backgrounds to enhance visibility and reduce distraction while driving.
- **Layout**: A single-column layout that prioritizes user input sections at the top, followed by travel time and experience selection. Each section should be visually distinct with appropriate spacing.
- **Typography**: Use a sans-serif font for modern appeal, prioritizing legibility. Headings should be bold and slightly larger (e.g., 24px), while body text should be regular weight at 16px with ample line spacing.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for type safety and component-based architecture.
- **Styling**: Tailwind CSS for utility-first styling, ensuring a responsive design.
- **UI Components**: Utilize shadcn/ui for consistent and modern UI components.
- **State Management**: Redux or Context API (specify based on complexity of state management needs).

## IMPLEMENTATION STEPS
1. **Set Up the React Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui.
2. **Create Core Components**:
   - Destination Input Component
   - Travel Time Display Component
   - CUPRA SENSES Prompt Component
   - Immersion Level Selector Component
   - Settings Adjustment Component
   - Journey Summary Component
3. **Integrate Google Maps API**: Set up API calls to fetch travel time and display it in the Travel Time Display Component.
4. **Implement State Management**: Use Redux or Context API to manage user inputs and settings throughout the application.
5. **Design and Style**: Apply Tailwind CSS classes to ensure a clean, minimalist aesthetic in line with CUPRA’s branding.
6. **Test Responsiveness**: Ensure the application is fully responsive and works seamlessly across different screen sizes.

## USER EXPERIENCE
The user experience begins with an intuitive input screen where users can enter their destination. Upon receiving the travel time, if it exceeds 40 minutes, the application prompts the user to engage with the CUPRA SENSES experience. After selecting their desired level of immersion, a summary screen displays all chosen settings, allowing users to confirm their preferences before beginning their journey. The design emphasizes minimal distraction while providing essential information clearly and effectively.