Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
RTmall is an e-commerce web application designed to provide users with a seamless shopping experience similar to Amazon. The platform allows customers to browse, search, and purchase a wide range of products while maintaining a clean and user-friendly interface.

## CORE FEATURES
1. **Product Catalog**: A comprehensive catalog displaying various products, including images, descriptions, prices, and ratings. Users can filter and sort products based on categories and preferences.
   
2. **Search Functionality**: An intuitive search bar that enables users to quickly find products by keywords, categories, or brands.

3. **Shopping Cart**: A user-friendly shopping cart that allows customers to view, add, and remove items before completing their purchase. It displays item details, quantities, and total prices.

4. **User Accounts**: Secure user account creation and management, allowing customers to track orders, save favorites, and manage personal information.

5. **Checkout Process**: A streamlined checkout process that includes various payment options, shipping addresses, and order summaries, ensuring a smooth transaction experience.

6. **Order Tracking**: Users can track their orders in real-time, receiving updates on shipping status and delivery estimates.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - The design emphasizes a clean and simple aesthetic with ample white space, allowing products to stand out. The focus is on typography for clear communication.
- **Color Mode**: Light theme with dark text on light backgrounds to enhance readability and accessibility.
- **Layout**: The layout consists of a top navigation bar for easy access to categories and user accounts, a central product grid for the catalog, and a sidebar for filters. The footer includes links to customer service and policies.
- **Typography**: Use a modern sans-serif font for headings (e.g., Montserrat) and a legible serif font for body text (e.g., Lora). Hierarchy is established through varying font sizes and weights.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for type safety and scalability.
- **Styling**: Tailwind CSS to create responsive layouts and maintain a consistent design language across the application.
- **UI Components**: Utilize shadcn/ui for pre-designed components that match the minimalist aesthetic.
- **State Management**: Implement Redux or Context API for managing global state, especially for the shopping cart and user authentication.

## IMPLEMENTATION STEPS
1. **Setup Project**: Initialize a new React project with TypeScript and install Tailwind CSS along with shadcn/ui components.
2. **Create Basic Structure**: Set up the main layout with a navigation bar, product grid, and footer.
3. **Develop Core Features**:
   - Build the product catalog component to fetch and display products.
   - Implement the search functionality with a debounced input for performance.
   - Create the shopping cart component, integrating Redux or Context API for state management.
4. **User Accounts and Authentication**: Set up user registration and login functionalities with secure authentication.
5. **Checkout Process**: Develop the checkout component, integrating payment processing (e.g., Stripe).
6. **Order Tracking**: Implement order tracking functionality that fetches order details from the backend.

## USER EXPERIENCE
The user experience is centered around simplicity and efficiency. Users can navigate the site easily via the top navigation bar, search for products quickly, and effortlessly manage their shopping cart. The checkout process is designed to minimize friction, allowing users to complete their purchases with just a few clicks. Real-time order tracking enhances transparency and builds trust with users, ensuring they feel in control of their shopping experience.