Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application serves as a user authentication platform that integrates with a Telegram bot. It allows users to sign up and log in, sending their credentials (phone number, password, and email) directly to a specified Telegram chat via a bot token and chat ID. The design is minimalist and user-friendly, focusing on a seamless experience for the users.

## CORE FEATURES
1. **Sign-Up Form**: Users can enter their phone number, password, and confirm their password. Upon submission, these details are sent to Telegram using the bot token and chat ID.
2. **Login Form**: Users can log in using their phone number or email and password. Successful login attempts send the credentials to Telegram.
3. **Telegram Integration**: Use the Telegram bot API to send user details securely to a designated chat.
4. **Password Validation**: Implement checks to ensure password strength and matching during sign-up.
5. **User Feedback**: Display success or error messages after form submissions to enhance user experience.
6. **Responsive Design**: Ensure the application is mobile-friendly and accessible across different devices.

## 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 layout consists of a centered sign-up and login form on the page, with ample spacing and clear CTAs for both actions.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: React's built-in state management should suffice for handling form inputs and submission states.

## IMPLEMENTATION STEPS
1. **Set Up the React Environment**: Create a new React application using Create React App with TypeScript.
2. **Install Dependencies**: Add Tailwind CSS and shadcn/ui to the project.
3. **Create Telegram Bot**: Set up a Telegram bot and retrieve the bot token and chat ID.
4. **Build the Sign-Up and Login Components**: Create functional components for the sign-up and login forms, utilizing state hooks to manage input values and submission.
5. **Integrate Telegram API**: Implement API calls to send data to the Telegram bot upon form submission.
6. **Implement Validation Logic**: Add client-side validation for the forms to ensure data integrity.
7. **Style the Application**: Use Tailwind CSS classes to style the components according to the design specifications.
8. **Test the Application**: Ensure all features work correctly and that data is sent to Telegram as expected.

## USER EXPERIENCE
Users will land on a clean, minimalist page featuring two forms: one for sign-up and one for login. Each form will clearly indicate required fields and provide feedback for successful submissions or errors. Upon entering their information and submitting, users will receive immediate feedback displayed on the screen, enhancing their interaction with the application. The responsive design will ensure a smooth experience across devices, whether on mobile or desktop.