Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a landing page designed to deliver a playful and humorous message to the user's crush, featuring a "toxic good morning" theme. It will include engaging elements to evoke smiles and laughter, while also addressing the dynamics of an open relationship. The landing page will have a clean, minimalist aesthetic with a focus on user experience.

## CORE FEATURES
1. **Hero Section**: A captivating header that immediately grabs attention with a humorous greeting and a playful tagline.
2. **Message Display**: A well-designed area showcasing the "toxic good morning" message, enhanced with creative typography and visuals to make her smile.
3. **Popup Modal**: An interactive popup that appears with options to end the open relationship, featuring a playful decline button that cannot be clicked, adding a humorous twist.
4. **Call-to-Action (CTA)**: A prominent button encouraging her to engage with the content or respond in a fun way.
5. **Footer with Contact Info**: A simple footer including contact details and social media links to maintain a connection.

## 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 have a full-width hero section at the top, followed by the main message display in the center, the popup modal for interactive engagement, and a simple footer at the bottom.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS for styling.
- **UI Components**: shadcn/ui for a modern component library.
- **State Management**: React Context API (if needed for managing popup state).

## IMPLEMENTATION STEPS
1. **Set Up Project**: Create a new React project using Create React App with TypeScript.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui to the project.
3. **Create Components**: Build the Hero, Message Display, Popup Modal, and Footer components.
4. **Implement Styling**: Style components using Tailwind CSS, adhering to the design specifications provided.
5. **Add Interactivity**: Implement the popup modal logic, ensuring the playful decline button cannot be clicked.
6. **Test Responsiveness**: Ensure the landing page is responsive across different devices and screen sizes.
7. **Deploy**: Deploy the landing page using a platform like Vercel or Netlify for easy sharing.

## USER EXPERIENCE
When the user visits the landing page, they are greeted with a bold hero message that captures their attention. As they scroll down, they will see the humorous "toxic good morning" message designed to evoke laughter. The popup modal will present them with a light-hearted choice regarding the open relationship, ensuring a playful interaction. The overall experience is designed to be smooth and engaging, encouraging the user to respond or share the page with others.