Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application will allow users to manage budgets across different areas, enabling each area to create its own budget. Users can analyze and model budgets based on historical data from previous years, providing insights and facilitating informed decision-making.

## CORE FEATURES
1. **Area Budget Creation**: Each area can independently create and manage its budget, including setting limits and tracking expenditures.
2. **Historical Data Analysis**: Users can view and analyze budget data from previous years to identify trends and make informed adjustments.
3. **Budget Modeling**: Tools to simulate different budget scenarios based on historical performance, helping areas plan future budgets effectively.
4. **Reporting Dashboard**: A comprehensive dashboard offering visual reports on budget performance, historical comparisons, and spending trends.
5. **User Authentication**: Secure login for users to ensure that sensitive budget information is protected and accessible only to authorized personnel.
6. **Collaborative Features**: Allow multiple users to collaborate on budget planning, with role-based permissions for better management.

## 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 consist of a top navigation bar, a sidebar for area selection, a central content area for budget management and reporting, and a footer for additional links and information.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Redux or Context API for managing application state

## IMPLEMENTATION STEPS
1. **Setup Project**: Initialize a new React project with TypeScript and install Tailwind CSS.
2. **Install Dependencies**: Add shadcn/ui for UI components and Redux/Context API for state management.
3. **Create Authentication Flow**: Implement user authentication using a secure method (e.g., JWT).
4. **Design Layout**: Build the main layout structure using Tailwind CSS, ensuring responsiveness.
5. **Develop Budget Features**: Create components for budget creation, analysis, and reporting.
6. **Implement Historical Data Analysis**: Add functionality to pull and analyze historical budget data.
7. **Testing**: Conduct thorough testing to ensure functionality and user experience are optimal.
8. **Deployment**: Prepare the application for deployment on a hosting platform of choice.

## USER EXPERIENCE
Users will interact with the application through a clean and intuitive interface. Upon logging in, they can select their area from the sidebar and navigate to budget creation or analysis sections. The dashboard will provide easy access to reports and modeling tools, enhancing their ability to make data-driven budget decisions. The minimalist design ensures that users can focus on their tasks without distractions, while responsive design principles guarantee usability across devices.