Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application is an e-commerce platform designed for selling artisanal soaps, utilizing a WooCommerce-like structure. It will be fully developed in Spanish, providing users with an intuitive shopping experience that includes essential e-commerce functionalities like a shopping cart, coupon usage, and a contact form, all wrapped in a modern, naturalistic aesthetic.

## CORE FEATURES
1. **Product Catalog**: Display a grid of artisanal soap products with images, descriptions, and prices, allowing users to browse and select items easily.
2. **Shopping Cart**: Enable users to add products to their cart, view itemized selections, and proceed to checkout seamlessly.
3. **Coupon System**: Implement functionality for users to enter discount codes at checkout, providing an incentive for purchases.
4. **Contact Form**: A simple, user-friendly form for inquiries, feedback, or support that connects directly to the business's email.
5. **Responsive Design**: Ensure the application adapts beautifully across devices, from mobile to desktop, maintaining usability and aesthetics.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist aesthetic featuring a clean and simple design with ample white space, focusing on easy navigation and readability.
- **Color Mode**: Light theme with pastel colors blending between purple and pink, creating a soothing and inviting atmosphere.
- **Layout**: A single-page layout with sections for the hero banner, product catalog, featured items, testimonials, and a footer with the contact form.
- **Typography**: Use of modern, sans-serif fonts for headings (e.g., Montserrat) and a clean serif font for body text (e.g., Lora) to establish a clear visual hierarchy.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for robust, type-safe development.
- **Styling**: Tailwind CSS for responsive and customizable styling.
- **UI Components**: Utilize shadcn/ui for a cohesive and modern component library.
- **State Management**: Implement Context API for managing the shopping cart state.

## IMPLEMENTATION STEPS
1. **Set up the Development Environment**: Initialize a new React project using Create React App with TypeScript template.
2. **Install Dependencies**: Install Tailwind CSS and shadcn/ui components for styling and UI.
3. **Create Layout Components**: Develop the main layout structure, including the header, footer, and main content area.
4. **Build the Product Catalog**: Create a component to fetch and display products from a static data source or API.
5. **Implement the Shopping Cart**: Develop cart functionality with context provider to manage state across components.
6. **Add Coupon Functionality**: Create a form for coupon input and logic to apply discounts during checkout.
7. **Develop the Contact Form**: Implement a form component that captures user inquiries and sends them via email (using a service like EmailJS).
8. **Style the Application**: Apply Tailwind CSS classes to achieve the desired pastel color scheme and minimalist aesthetic.
9. **Test Responsiveness**: Ensure all components are responsive and function correctly on various screen sizes.
10. **Deploy the Application**: Choose a hosting platform for deployment (e.g., Vercel, Netlify) and configure domain settings.

## USER EXPERIENCE
Users will enjoy a seamless shopping experience, starting from an engaging hero section that highlights featured products. They can easily navigate through the product catalog, add items to their cart, and apply coupons effortlessly. The checkout process will be straightforward, with clear calls to action leading users to complete their purchases. The contact form will provide a direct line for customer inquiries, enhancing user engagement and support.