Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This application is a web-based dashboard for simulating and managing virtual currency transactions (Robux). Users can view their balance, track purchases, and simulate buying packages of Robux. The app is designed with a focus on user experience, providing an intuitive interface that allows users to easily navigate through their dashboard, view transactions, and simulate purchases.

## CORE FEATURES
1. **Dashboard View**: Display the user's current balance, recent transactions, and key statistics about their virtual currency usage.
2. **Transaction History**: A dedicated section for users to view their past transactions, including amounts and dates.
3. **Purchase Simulation**: Users can select from various Robux packages and simulate purchasing them, which updates their balance and transaction history.
4. **User Profile Management**: A section where users can view and edit their profile information, such as name and email.
5. **Help and Support**: An FAQ section addressing common questions related to the app's functionality and Robux simulation.

## 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 application will feature a sidebar for navigation, a header for the current page title, and a main content area where all features are displayed based on user selection.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: React's built-in useState for local state management.

## IMPLEMENTATION STEPS
1. **Set Up the Project**:
   - Initialize a new React project using Create React App with TypeScript.
   - Install Tailwind CSS and configure it for your project.
   - Add Inter font from Google Fonts in your CSS.

2. **Create the Main Components**:
   - Build the main `App` component to house the sidebar, header, and main content area.
   - Create separate components for the Dashboard, Transaction List, Purchase Simulator, User Profile, and FAQ.

3. **Implement State Management**:
   - Use React's `useState` to manage the balance, transactions, and current page state.

4. **Build the Sidebar Navigation**:
   - Create a functional sidebar with buttons linking to each main feature (Dashboard, Transactions, Simulator, Profile, Support).

5. **Design the Dashboard**:
   - Implement the dashboard layout to display balance, recent transactions, and key statistics.

6. **Develop the Purchase Simulation**:
   - Create a grid layout for Robux packages and implement functionality to simulate purchases that update the balance and transaction history.

7. **Create the Profile Management Section**:
   - Provide form inputs for the user to update their name and email address, and include a save button.

8. **Add the Help and Support Section**:
   - Implement an FAQ section with predefined questions and answers.

9. **Style the Application**:
   - Use Tailwind CSS classes to apply the specified design specifications, ensuring a consistent and minimalist aesthetic.

10. **Test the Application**:
    - Ensure all features work correctly and the application is responsive across different screen sizes.

## USER EXPERIENCE
Users will first land on the dashboard where they can see their balance and recent transactions. They can navigate to other sections using the sidebar. In the purchase simulation section, users can easily select a package and simulate a transaction, which updates their balance in real-time. The profile section allows users to manage their information, while the help section provides quick answers to common queries. The overall flow is designed to be straightforward and user-friendly, emphasizing simplicity and clarity.