Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a web application to refine the existing "DFC — Demonstrativo do Fluxo de Caixa" panel by removing a redundant analytical panel and enhancing the visual layout for improved readability and professionalism. The goal is to create a compact, modern design that mirrors the style of the "DRE — Demonstrativo de Resultado do Exercício".

## CORE FEATURES
1. **Panel Cleanup**: Remove the "DFC — Demonstração do Fluxo de Caixa (Analítica)" panel, including all related components, routes, and logic, ensuring no broken references remain.
2. **Visual Refactoring**: Improve the layout of the existing "DFC — Demonstrativo do Fluxo de Caixa" by reducing vertical spacing and adjusting element sizes for better organization.
3. **Enhanced Readability**: Implement a more compact design with improved alignment of categories, values, and percentages, creating a clearer visual hierarchy.
4. **Responsive Design**: Ensure the DFC panel maintains responsiveness across devices while improving the overall visual aesthetics, making better use of available space.
5. **Subtle UI Improvements**: Utilize a modern financial table layout with features like hover effects on rows, and clearer distinctions between totals and subcategories.
6. **Consistent Style**: Apply consistent typography and design elements that align with the existing dashboards in the system while maintaining the current theme.

## 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 streamlined financial table, emphasizing compact rows with reduced padding, improved alignment, and highlighted totals, while avoiding excessive vertical space.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Use React Context or a similar solution if needed for managing state efficiently.

## IMPLEMENTATION STEPS
1. **Remove Redundant Components**:
   - Identify and delete the "DFC — Demonstração do Fluxo de Caixa (Analítica)" panel and all related imports, routes, and functions.
   - Verify that no broken references or dependencies remain in the application.

2. **Refactor Visual Layout**:
   - Adjust the CSS for the "DFC — Demonstrativo do Fluxo de Caixa" panel to reduce vertical spacing between lines and categories.
   - Decrease the height of blocks/cards and standardize the height of rows for consistency.

3. **Enhance Alignment and Hierarchy**:
   - Ensure proper alignment for categories, values, percentages, and expand/collapse icons.
   - Implement visual hierarchy features by emphasizing totals and subtotals, indenting subcategories, and using contrasting colors for different groups.

4. **Improve UI Elements**:
   - Apply a modern financial table layout, including hover effects and improved spacing between groups of data.
   - Use subtle separators to enhance the visual organization without creating visual clutter.

5. **Test Responsiveness**:
   - Test the application on various devices and screen sizes to ensure responsive design remains intact after the changes.

6. **Review and Clean CSS**:
   - Audit the existing CSS/Tailwind for any redundant styles related to the old layout and remove them for better performance.

## USER EXPERIENCE
Users will interact with a clean and efficient financial dashboard that allows for quick reading and comprehension of cash flow data. With improved spacing and organization, users can easily identify totals and subtotals, navigate through categories, and utilize expandable sections for deeper insights without distraction from excessive visual elements. The overall experience will feel professional, resembling an executive dashboard that meets the needs of financial analysis.