Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The "Fake Sender Robux" is a web application designed to simulate the process of sending Robux, a virtual currency used in the Roblox gaming platform. This application offers users a clean and user-friendly interface to understand how Robux transactions work, allowing them to visualize transactions without facilitating actual exchanges.

## CORE FEATURES
1. **User Accounts**: Users can create accounts to save their preferences and transaction history, enhancing personalization.
2. **Simulated Transactions**: Users can input desired amounts of Robux and see a visual representation of sending these amounts.
3. **Transaction History**: A well-organized view of past simulated transactions, complete with filtering options to enhance usability.
4. **User Dashboard**: A straightforward dashboard that displays the user's account balance and recent activity, providing quick access to key information.
5. **Help Section**: A resourceful section filled with FAQs and guides on how Robux transactions function within Roblox, ensuring users have the information they need.

## 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 features a top navigation bar, a central content area displaying transactions and the dashboard, and a footer with helpful links.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: React Context API for user authentication and transaction state management

## IMPLEMENTATION STEPS
1. **Set up the project**: Initialize a new React project with TypeScript using Create React App.
2. **Install dependencies**: Add Tailwind CSS and shadcn/ui for styling and UI components.
3. **Create the folder structure**: Organize components, pages, and styles into respective directories.
4. **Build User Authentication**: Implement user registration and login functionality using React Context API to manage user state.
5. **Develop the Dashboard**: Create a dashboard component that displays the user's balance and recent transactions.
6. **Implement Simulated Transactions**: Create a form where users can input Robux amounts and visualize the transaction results.
7. **Design the Help Section**: Add a dedicated help component that includes FAQs and resources for users.
8. **Test the application**: Ensure all features function smoothly and are responsive across different devices and screen sizes.
9. **Deploy**: Use a hosting platform like Vercel or Netlify for deployment.

## USER EXPERIENCE
Users will begin their journey on the login page, where they can enter their credentials to access their accounts. Upon logging in, they will be directed to their dashboard, which provides a clear overview of their balance and recent transactions. The interface is intuitive, allowing users to initiate a simulated transaction through a straightforward form, receiving instant feedback on the transaction's outcome. The help section remains easily accessible, ensuring users can find guidance when needed, leading to a seamless interaction throughout the application.