Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
Nex is a modern web application designed as an email template creator that allows users to easily generate and export HTML email templates. The application features a sleek, responsive interface, enabling users to create templates with blocks and quick setup for emails. This web app includes user authentication, a messaging feature for support, and an integrated payment system.

## CORE FEATURES
1. **Email Template Creator**: Users can design custom email templates using a block-based interface, allowing for an intuitive and flexible creation process.
2. **HTML Export**: Users can export their designs as HTML files for easy integration into email marketing platforms.
3. **User Authentication**: Secure login/sign-up process with options for Google authentication.
4. **Support Messaging**: A built-in chat feature for users to directly contact support and request assistance.
5. **Key Management**: Admins can generate and assign keys to users, manage expiration dates, and notify users of their key status.
6. **Pricing Plans**: Multiple subscription plans (Starter, Pro, Enterprise) with distinct features and payment integration through PayPal Business or Baridi Mobile.

## 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 feature a hero section at the top, followed by sections for feature descriptions, pricing cards, contact information, and a footer. Each section will be clearly defined with ample spacing for a clean look.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS for responsive design and utility-first styling.
- **UI Components**: Utilize shadcn/ui for modern UI components.
- **State Management**: Redux or Context API to manage user state and application data.

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Create a new React app using Create React App with TypeScript support.
2. **Install Dependencies**: Add Tailwind CSS, shadcn/ui, and any state management libraries (Redux or Context API).
3. **Build the Layout**: Create components for the hero section, feature descriptions, pricing cards, and contact form.
4. **Implement User Authentication**: Set up authentication flow using Supabase, integrating Google auth.
5. **Develop Email Template Creator**: Create the block-based email template builder and implement the HTML export functionality.
6. **Integrate Payment System**: Set up payment options using PayPal Business or Baridi Mobile for subscription management.
7. **Add Support Messaging**: Implement the chat feature allowing users to reach out to support.
8. **Key Management System**: Build the admin interface for generating and managing user keys.

## USER EXPERIENCE
Users will be greeted with a visually appealing hero section introducing Nex and its features. After signing up or logging in, they will have access to the email template creator where they can easily design and export templates. The support messaging feature will provide a seamless way for users to get assistance, while the admin interface will streamline key management. The responsive design ensures that all features are accessible on mobile and desktop devices, enhancing the overall user experience.