Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application is designed as a financial management system that allows users to track their monthly bills and financial transactions. It provides an organized platform for managing recurring expenses, income entries, and investments, ensuring users have a clear overview of their financial health.

## CORE FEATURES
1. **Monthly Bill Checklist**: Users can create a checklist of monthly bills and mark them as paid. The app will display upcoming bills based on their frequency (monthly, quarterly, semi-annually).
   
2. **Income Management**: Users can log general income entries that apply to all months (e.g., salary) and specific entries with installment limits (e.g., reimbursements in three installments).

3. **Expense Tracking**: The app allows users to input fixed and variable expenses. Users can track their spending and view detailed breakdowns for each month.

4. **Flexible Monthly Management**: Users can access specific months (e.g., January) to view the corresponding bills, income, and expenses, with the ability to edit entries as needed.

5. **Investment Registration**: Users can register investments independently of monthly tracking, including details like investment date and amount.

6. **Future Exclusion of General Entries**: When a general entry is deleted, it remains intact for past and current months but will not appear in future months.

## DESIGN SPECIFICATIONS
- **Visual Style**: A minimalist approach is emphasized, featuring a clean and simple design that utilizes ample white space to enhance the user experience and readability.
- **Color Mode**: A light theme with dark text on light backgrounds ensures that the interface is easy to navigate and visually appealing.
- **Layout**: The main layout consists of a sidebar for navigation (Monthly Bills, Income, Expenses, Investments) and a central content area displaying relevant information and forms. The use of cards for different sections enhances organization and clarity.
- **Typography**: Use sans-serif fonts like Inter or Roboto for clean readability. Headings should be bold for emphasis, while body text should maintain a regular weight for clarity. Maintain a clear hierarchy with larger sizes for headings and smaller sizes for body text.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript for robust and scalable application development.
- **Styling**: Tailwind CSS for utility-first styling, allowing for rapid design iterations while maintaining a consistent aesthetic.
- **UI Components**: Utilize shadcn/ui for pre-built components that align with the minimalist design ethos.
- **State Management**: Consider using React Context API or Zustand for managing global state across the application.

## 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 styling.

2. **Create the Core Components**:
   - Build components for the sidebar navigation, each feature section (Bill Checklist, Income, Expenses, Investments), and their respective forms.
   - Implement modals for adding and editing entries.

3. **Develop the Monthly Management Feature**:
   - Create a dynamic monthly view that fetches and displays bills, income, and expenses for the selected month.
   - Implement functionality to edit entries and mark bills as paid.

4. **Implement Data Management**:
   - Use local storage or a simple backend to persist data for general entries, ensuring they can be edited monthly while maintaining historical data.

5. **Investment Section Development**:
   - Create an independent investment registration form that allows users to add investments without tying them to specific months.

6. **Testing and Optimization**:
   - Conduct user testing to ensure the user experience is intuitive and fluid.
   - Optimize the application for responsiveness across different devices.

## USER EXPERIENCE
Users will navigate through a clean interface where they can easily access their monthly financial overview. They will have straightforward forms to input and manage their expenses and income, with an intuitive checklist for bills. The design will ensure users can focus on their financial management without distractions, promoting a seamless and efficient experience. Each interaction, from adding a new bill to checking off a completed payment, will be designed for clarity and ease of use, maintaining the minimalist aesthetic throughout.