Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
"Autonomoconia" is a mobile web application designed for budget generation and management using voice input. The app allows users to record their budget requests and automatically generates a detailed budget document. It features a clean and minimalist design, ensuring ease of use and an intuitive user experience.

## CORE FEATURES
1. **Voice Recording**: Users can tap a microphone icon to record their voice. The app changes the icon color during recording, providing feedback to the user.
2. **Backend Processing**: Once recording is complete, the audio is sent to Google App Script, which processes the audio through Gemini to convert it to text, checks it against a price list on Google Drive, and generates a budget document.
3. **Budget List**: A dedicated screen displays a list of created budgets, featuring rows for each entry with options to review, share via WhatsApp, or delete.
4. **Real-Time Updates**: The "Grabar" screen provides real-time feedback on the processing steps, enhancing user engagement and understanding of the workflow.
5. **Minimalist Design**: The application follows a linear design approach, focusing on user-friendly navigation with ample white space and a clean layout.

## 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 features a bottom navigation bar for transitioning between the "Grabar" and "Presupuestos" screens. The "Grabar" screen contains the microphone icon and a status indicator, while the "Presupuestos" screen presents a table of generated budgets.

## TECHNICAL REQUIREMENTS
- Framework: React with TypeScript
- Styling: Tailwind CSS
- UI Components: shadcn/ui
- State Management: Context API or Zustand (for managing application state if needed)

## IMPLEMENTATION STEPS
1. Set up the React application with Create React App and TypeScript.
2. Install Tailwind CSS and configure it for styling.
3. Create the main app structure with routing for two screens: "Grabar" and "Presupuestos".
4. Implement the microphone component on the "Grabar" screen with audio recording functionality.
5. Set up backend integration with Google App Script to handle audio processing and budget document generation.
6. Develop the budget list UI on the "Presupuestos" screen, including options for reviewing, sharing, and deleting budgets.
7. Implement real-time feedback on the "Grabar" screen to indicate processing steps.
8. Test the application thoroughly to ensure all features work as intended and provide a smooth user experience.

## USER EXPERIENCE
Users will interact with the application by tapping the microphone to record their requests. They will receive visual feedback throughout the recording and processing phases. Once completed, users can view their generated budgets in a clear list format on the "Presupuestos" screen, with easy access to review, share, or delete options. The overall experience is designed to be straightforward, minimizing any complexities in budget management.