Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The "Interactive World Map" is a web application designed to provide users with an immersive experience of exploring global geography through an interactive full-screen world map. Users can interact with countries, continents, and oceans, gaining insights into each region's basic information while enjoying a clean and modern design.

## CORE FEATURES
1. **Interactive World Map**: A full-screen map that allows users to click or hover over various geographical areas, providing an engaging visual experience.
2. **Zoom and Pan Functionality**: Users can easily zoom in and out of the map and pan across different regions to explore various countries and oceans.
3. **Highlight Countries on Hover**: When users hover over a country, it is highlighted to enhance visibility and encourage exploration.
4. **Country Information Sidebar**: Clicking on a country opens a side panel displaying essential information, including the country name, capital, population, and flag.
5. **Search Functionality**: Users can quickly find countries using a search bar, improving navigation and accessibility.
6. **Language Switching**: The application supports two languages, Portuguese and English, allowing users to switch languages seamlessly.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - The design focuses on a clean and simple aesthetic with ample white space, emphasizing typography and user interaction.
- **Color Mode**: Light theme with dark text on light backgrounds to ensure readability and a modern feel.
- **Layout**: The main layout consists of a full-screen interactive map centered in the viewport, with a collapsible side panel on the right for country information and a search bar at the top.
- **Typography**: Use a sans-serif font (e.g., Helvetica or Arial) for a modern look. Headings should be bold and slightly larger, while body text remains legible and straightforward.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for a robust and type-safe development environment.
- **Styling**: Tailwind CSS for rapid and efficient styling, allowing for responsive design.
- **UI Components**: Utilize shadcn/ui for pre-built UI elements to maintain consistency and speed up development.
- **State Management**: Consider using React Context or Redux for managing application state, especially for language switching and search functionality.

## IMPLEMENTATION STEPS
1. **Set Up the React Project**: Initialize a new React project using Create React App with TypeScript.
2. **Install Dependencies**: Install Tailwind CSS and shadcn/ui for styling and UI components.
3. **Create the Map Component**: Develop the full-screen interactive map using a library like Leaflet or Google Maps API.
4. **Implement Hover and Click Events**: Add event listeners for hover and click interactions to highlight countries and open the sidebar.
5. **Build the Sidebar Component**: Create a collapsible side panel that displays the country information fetched from a public API or static data.
6. **Integrate Search Functionality**: Implement a search bar that filters countries based on user input.
7. **Add Language Switching**: Develop functionality to switch between Portuguese and English, updating the UI text accordingly.
8. **Test Responsiveness**: Ensure the application is fully responsive, adjusting the layout for both desktop and mobile views.
9. **Deploy the Application**: Use a service like Vercel or Netlify to deploy the web application for public access.

## USER EXPERIENCE
Users begin their journey on the full-screen interactive map, where they can easily zoom and pan to find countries. Hovering over a country highlights it, prompting users to click for more information. The sidebar provides quick access to essential details. The search functionality allows users to find specific countries rapidly, while language switching enhances accessibility for a broader audience. The overall experience is designed to be intuitive, engaging, and informative, encouraging exploration and learning.