Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application serves as a recipe suggestion platform, allowing users to browse and select from a variety of ingredients available in the market. The main purpose is to empower users to discover new recipes based on their chosen ingredients, enhancing meal preparation with a user-friendly interface and a clean, minimalist aesthetic.

## CORE FEATURES
1. **Ingredient Selector**: Users can choose multiple ingredients from a comprehensive list, enabling tailored recipe suggestions based on available items.
2. **Recipe Suggestions**: The app displays a curated list of recipes that incorporate the selected ingredients, complete with preparation time and difficulty level.
3. **User Ratings and Reviews**: Users can rate recipes and leave reviews, helping to build a community of shared culinary experiences and feedback.
4. **Save and Share Recipes**: Users have the option to save their favorite recipes to a personal list and share them via social media or email.
5. **Search Functionality**: A robust search feature allows users to filter recipes based on dietary restrictions, meal types, or cuisines.
6. **Responsive Design**: The application is fully responsive, ensuring a seamless experience across all devices, from desktops to mobile phones.

## DESIGN SPECIFICATIONS
- **Visual Style**: The application employs a minimalist approach, emphasizing clean lines, ample white space, and a focus on typography to enhance readability and user engagement.
- **Color Mode**: A light theme is utilized, featuring dark text on light backgrounds for optimal contrast and clarity.
- **Layout**: The main layout consists of a top navigation bar for easy access to different sections, a central area for ingredient selection and recipe display, and a sidebar for user ratings and saved recipes. 
- **Typography**: The primary font choice is a clean sans-serif typeface for body text (e.g., "Roboto"), with larger, bold headers to establish a clear hierarchy and guide user navigation.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for building a robust, type-safe interface.
- **Styling**: Tailwind CSS for a modern, utility-first styling approach that aligns with the minimalist design.
- **UI Components**: Utilize `shadcn/ui` for pre-built, customizable UI elements that enhance user experience.
- **State Management**: Implement React Context API or Zustand for managing global state effectively.

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React project with TypeScript using Create React App or Vite.
2. **Install Dependencies**: Install Tailwind CSS, `shadcn/ui`, and any necessary state management libraries.
3. **Create Component Structure**: Develop core components including IngredientSelector, RecipeDisplay, ReviewSection, and NavigationBar.
4. **Implement API Integration**: Set up a backend or utilize a recipe API to fetch recipe data based on selected ingredients.
5. **Design Layout**: Apply Tailwind CSS classes to create the desired layout, ensuring responsive design principles are followed.
6. **Add Interactivity**: Implement state management for handling user selections, recipe filtering, and managing saved recipes.
7. **Testing**: Conduct thorough testing across different devices and screen sizes to ensure functionality and user experience.

## USER EXPERIENCE
Users start by selecting their ingredients from the Ingredient Selector. As they choose items, the Recipe Suggestions area updates in real-time, displaying recipes that match their selections. Users can click on a recipe to view detailed instructions, ratings, and reviews. The intuitive navigation makes it easy to switch between sections, while the responsive design ensures a consistent experience whether on a mobile device or desktop. Users can save their favorite recipes and share them directly through social platforms, fostering community engagement and interaction.