Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application is an expense management tool designed for company employees to efficiently track and manage their expenses. It allows users to submit expense reports, categorize expenses, and streamline approval processes, enhancing financial oversight and accountability within the organization.

## CORE FEATURES
1. **User Authentication**: Secure login and registration for employees with roles defined for different levels of access (e.g., employee, manager, admin).
2. **Expense Submission**: Users can easily enter expense details, attach receipts, and categorize their expenses for better tracking.
3. **Dashboard**: A user-friendly dashboard where employees can view their expense reports, status updates, and analytics on spending trends.
4. **Approval Workflow**: Managers can review and approve or reject expense submissions, with notifications sent to employees regarding the status of their submissions.
5. **Reporting**: Generate detailed reports on company spending, categorized by departments, projects, or individual employees.
6. **Integration with Accounting**: Seamless integration with existing accounting systems for easy reconciliation and financial reporting.

## DESIGN SPECIFICATIONS
- **Visual Style**: Minimalist - The application will feature a clean, simple design with plenty of white space to enhance readability and focus on user tasks.
- **Color Mode**: Light theme with dark text on light backgrounds to ensure high contrast and readability.
- **Layout**: The main layout will consist of a sidebar for navigation, a top bar for user information and notifications, and a central content area displaying forms, reports, and dashboards. Cards will be used to present individual expense entries and analytics.
- **Typography**: Use a sans-serif font like Inter or Roboto for clarity, with a clear hierarchy (e.g., larger headings, standard size for body text, and smaller sizes for captions).

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for building the user interface.
- **Styling**: Tailwind CSS for responsive design and utility-first styling.
- **UI Components**: Utilize shadcn/ui for consistent and polished UI components.
- **State Management**: React Query for efficient data fetching and caching.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui.
2. **Create Authentication Flow**: Implement user authentication with secure login, registration, and role management.
3. **Develop Expense Submission Form**: Build a form component for users to input expense details and attach receipts.
4. **Design the Dashboard**: Create a dashboard that displays a summary of submitted expenses, including status and analytics.
5. **Implement Approval Workflow**: Develop the manager's interface for reviewing and approving expenses, including notifications for users.
6. **Generate Reporting Features**: Create reporting capabilities to compile and visualize expense data for better financial oversight.
7. **Testing and Debugging**: Conduct thorough testing of all features, focusing on user interactions and responsiveness across devices.

## USER EXPERIENCE
Users will begin by logging in to the application, where they are greeted by a clean dashboard displaying their recent expenses and status updates. The intuitive navigation allows users to easily submit new expenses or view reports. Managers will have a dedicated section for reviewing expense submissions, enabling quick approvals or rejections. The overall experience will prioritize simplicity and ease of use, ensuring that employees can focus on managing their expenses efficiently without unnecessary complexity.