Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This application is a web-based platform that allows users to explore various countries around the world. Users can select a country to view detailed information accompanied by beautiful images, enhancing their understanding and appreciation of each location. The app will also support the addition of more countries over time, making it a continuously expanding resource for travel enthusiasts.

## CORE FEATURES
1. **Country Selection**: Users can browse and select from a list of countries to explore.
2. **Country Details**: Each country page will display a high-quality image, a brief description, and key facts to engage users.
3. **Dynamic Country Addition**: Admin functionality to add new countries easily, ensuring the app stays updated with the latest information.
4. **Search Functionality**: Users can search for specific countries using a search bar to quickly find information.
5. **Favorites**: Users can save their favorite countries for quick reference in the future.
6. **Responsive Design**: The app will adjust seamlessly across various devices, ensuring a consistent experience on desktops, tablets, and mobile phones.

## DESIGN SPECIFICATIONS
- **Visual Style**: The design will be minimalist, featuring a clean and simple aesthetic with ample white space. The focus will be on readability and user engagement through typography and imagery.
- **Color Mode**: The app will utilize a light theme with dark text on light backgrounds to ensure maximum legibility and comfort for users.
- **Layout**: A grid layout will be employed for the country selection page, with cards representing each country. Each card will include an image, country name, and a brief description. The country detail pages will have a header featuring the country image, followed by the description and facts laid out in a clear, linear fashion.
- **Typography**: Use a sans-serif font like "Helvetica Neue" or "Roboto" for body text, with larger, bold headings (e.g., 24px for main titles and 18px for subtitles) to create a clear visual hierarchy.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript to ensure scalable and maintainable code.
- **Styling**: Tailwind CSS for utility-first styling, allowing for rapid design adjustments.
- **UI Components**: Utilize shadcn/ui for pre-built components that match the minimalist aesthetic.
- **State Management**: Employ React Context API for global state management of country data and favorites.

## IMPLEMENTATION STEPS
1. **Set up the React project**: Initialize a new React application using Create React App with TypeScript.
2. **Install dependencies**: Add Tailwind CSS and shadcn/ui using npm or yarn.
3. **Create the Country Selection Page**: Develop a grid layout that displays country cards. Each card will link to the respective country detail page.
4. **Build the Country Detail Page**: Implement a page that displays the country image, description, and key facts. Ensure the layout is responsive.
5. **Implement Dynamic Country Addition**: Create an admin interface for adding new countries to the app, including form validation.
6. **Add Search Functionality**: Integrate a search bar that filters the country list based on user input.
7. **Implement Favorites Feature**: Allow users to save and view their favorite countries using local storage or React Context for state management.
8. **Test Responsiveness**: Ensure the app performs well on various screen sizes and devices.

## USER EXPERIENCE
Users will land on the country selection page, where they can visually explore countries represented by cards. Upon selecting a country, they will be taken to a detail page showcasing an image and information. The search bar will allow quick access to specific countries, while the favorites feature will enable users to mark countries of interest for future visits. The overall experience will prioritize ease of navigation, ensuring users can explore and learn about different countries effortlessly.