Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The project is a web application designed to provide users with weather forecasts for multiple cities. It will feature a clean and minimalist interface that allows users to easily select cities and view current weather conditions and forecasts, making it user-friendly and efficient.

## CORE FEATURES
1. **City Search**: Users can search for cities by name to view their current weather and forecasts.
2. **Multi-City Forecast**: Users can add multiple cities to their favorites and view weather forecasts side by side.
3. **Current Weather Display**: Show current temperature, weather conditions, humidity, and wind speed for the selected city.
4. **Extended Forecast**: Provide a 7-day weather forecast for each selected city.
5. **Responsive Design**: Ensure the application is fully responsive, providing a seamless experience on mobile and desktop devices.
6. **Location Access**: Option to use geolocation to automatically display the weather for the user's current location.

## 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 header with the app title and search bar, followed by a grid display of the selected cities' weather cards, and a footer with links to terms and privacy policy.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Redux for state management of user preferences and weather data

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui.
2. **Create Components**: Develop core components such as Header, SearchBar, WeatherCard, and Footer.
3. **Implement Routing**: Set up React Router for navigation if necessary for future scalability.
4. **API Integration**: Integrate a weather API (e.g., OpenWeatherMap) to fetch weather data based on user input.
5. **State Management**: Set up Redux to manage the state of selected cities and weather data.
6. **Styling**: Apply Tailwind CSS for styling components according to the defined design specifications.
7. **Testing**: Conduct thorough testing across different devices and screen sizes to ensure responsiveness and functionality.
8. **Deployment**: Deploy the application to a hosting service like Vercel or Netlify for public access.

## USER EXPERIENCE
Users will start by landing on the main page, where they can enter a city name in the search bar. After selecting a city, they will see a clean and organized card displaying the current weather and a 7-day forecast. Users can easily add or remove cities, and the layout will adjust responsively to provide an optimal viewing experience on any device. The minimalist design will enhance usability, allowing users to focus on the information provided without distractions.