Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The project is an e-commerce web application designed for a T-shirt brand, featuring a dark theme aesthetic while maintaining a minimalist design. The primary goal is to provide users with a seamless shopping experience, showcasing products in a clean layout that emphasizes easy navigation and conversion.

## CORE FEATURES
1. **Product Catalog**: A visually appealing grid layout displaying T-shirt designs, with filtering options by size, color, and style.
2. **Product Details Page**: Dedicated pages for each T-shirt, providing high-quality images, descriptions, size guides, and customer reviews.
3. **Shopping Cart**: Functionality for users to add and manage products in their cart, with options to update quantities or remove items.
4. **Checkout Process**: A streamlined checkout flow that includes user authentication, payment integration, and shipping options.
5. **User Accounts**: Option for users to create accounts to track orders, save favorite products, and manage their profiles.
6. **Responsive Design**: Mobile-friendly layout ensuring optimal usability on all devices.

## 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 main layout will consist of a top navigation bar, a hero section highlighting featured products, a grid layout for the product catalog, and a footer with contact information and links.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Redux (for managing global state)

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui for styling.
2. **Create Layout Components**: Build the main layout components including the navigation bar, footer, and product grid.
3. **Implement Routing**: Use React Router to manage different views (Home, Product Details, Checkout).
4. **Develop Product Catalog**: Create a component to fetch and display products from a mock API or local JSON.
5. **Build Product Details Page**: Develop the layout for individual product pages with images, descriptions, and reviews.
6. **Shopping Cart Functionality**: Implement the shopping cart state using Redux, allowing users to add/remove products.
7. **Checkout Flow**: Create a multi-step form for user authentication and payment processing.
8. **Responsive Design**: Ensure all components are responsive, utilizing Tailwind's utility classes for different screen sizes.
9. **Testing**: Conduct thorough testing across devices and browsers to ensure usability and performance.

## USER EXPERIENCE
Users will start on the homepage, greeted by a hero section with featured T-shirt designs. They can navigate through categories, view product details, and add items to their shopping cart seamlessly. The checkout process will be easy to follow, ensuring a smooth transaction experience. Emphasis will be placed on clean navigation and quick access to support or contact information, enhancing overall user satisfaction.