Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This application is a modern, responsive web app designed as a landing page for Manuela's Baby Shower. It aims to provide guests with a seamless experience for selecting symbolic gifts and processing payments using the Pix payment system in Brazil.

## CORE FEATURES
1. **Hero Section**: A welcoming introduction featuring the title "Manuela’s Baby Shower," a warm subtitle, event date, location, and time, all styled with soft colors.
   
2. **Gift List**: A dynamic list of gift items including their names, prices, and quantity selectors, allowing users to select multiple items and specify quantities.

3. **Selection Summary**: An overview summarizing selected items, their quantities, and the total amount, which updates in real-time as users modify their selections.

4. **Pix Payment**: A feature that generates a Pix QR code and a “Copy and Paste” code for payment, including a user-friendly button to copy the Pix code and a gentle reminder after payment.

5. **User Experience**: A clean, intuitive interface that prioritizes mobile responsiveness, smooth animations, and clear visual feedback during interactions.

6. **Optional Extras**: A message field for guests to leave a note for Manuela, visual confirmation after Pix code generation, and the ability to edit gift selections before finalizing payment.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist with a clean and simple design that utilizes plenty of white space, focusing on a minimal color palette and elegant typography.
- **Color Mode**: Light theme with soft pastel colors (light pink, beige, off-white) and dark text for clear readability.
- **Layout**: 
  - Hero section at the top, followed by the gift list.
  - Selection summary displayed prominently before the payment section.
  - Clear separation between sections with ample spacing for a cozy feel.
- **Typography**: 
  - Use gentle, rounded sans-serif fonts for headings (e.g., Poppins or Nunito).
  - Body text should have a clean and legible font (e.g., Roboto or Lato) with appropriate sizing for hierarchy.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS for responsive design and utility-first styling.
- **UI Components**: Utilize shadcn/ui for consistent and modern UI elements.
- **State Management**: Use React's Context API or Redux for managing state across the application.

## IMPLEMENTATION STEPS
1. **Set Up the Project**:
   - Initialize a new React project with TypeScript.
   - Install Tailwind CSS and configure it for the project.

2. **Create the Hero Section**:
   - Structure the hero section with appropriate headings and an event details display.
   - Style using Tailwind CSS to achieve a soft color palette.

3. **Develop the Gift List Component**:
   - Create a list of gift items with input controls for quantity selection.
   - Implement state management to handle selected items and quantities.

4. **Implement the Selection Summary**:
   - Add a summary section that dynamically displays selected items and total cost.
   - Ensure real-time updates on quantity changes.

5. **Integrate Pix Payment Functionality**:
   - Generate a Pix QR code and a copyable code based on the total amount.
   - Include user instructions and a button for copying the Pix code.

6. **Enhance User Experience**:
   - Focus on mobile-first design, ensuring all components are responsive.
   - Add smooth animations and visual feedback for user interactions.

## USER EXPERIENCE
The user journey begins with a warm welcome on the landing page, guiding them through the gift selection process with an intuitive interface. Users can easily browse the gift list, select their desired items, and see a real-time summary of their choices. Upon proceeding to payment, a clear and straightforward Pix payment section provides necessary codes and instructions, ensuring a smooth checkout process. Visual confirmations and a cozy aesthetic enhance the overall experience, making guests feel connected to the celebration.