Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application is a responsive business management system designed for the perfume brand Parisbelle. It aims to streamline the management of raw material purchasing, stock control, costing, and production workflows, allowing the owner to efficiently manage operations through a clean, user-friendly interface.

## CORE FEATURES
1. **Dashboard**: A comprehensive overview displaying key metrics such as total stock values, outstanding payments, and alerts for pending follow-ups, all presented in an intuitive layout.
2. **Supplier Management**: A module to manage supplier details, track purchase orders, payment statuses, and maintain records of communication.
3. **Raw Material Management**: A database to track raw materials, including their stock levels, purchasing details, and pricing history, enabling quick access and updates.
4. **Purchase Orders**: An automated system for creating, tracking, and managing purchase orders for raw materials, including status updates and payment tracking.
5. **Production Workflow**: A robust module to manage production jobs, linking raw materials issued to manufacturers with finished goods received, including cost calculations and tracking.
6. **Cost Sheet Module**: A detailed costing system that calculates total product costs based on various inputs, allowing for margin analysis and reporting.

## 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**: A structured layout with a sidebar for navigation, a top header for alerts, and a central area for displaying reports, forms, and metrics.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript
- **Styling**: Tailwind CSS
- **UI Components**: shadcn/ui
- **State Management**: Redux Toolkit (if needed for managing complex state)

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React project with TypeScript and set up Tailwind CSS for styling.
2. **Design the Layout**: Create the main layout structure with a sidebar and a top navigation bar. Implement responsive design principles to ensure usability on mobile devices.
3. **Develop Core Modules**:
   - Implement the Dashboard using cards and charts to display key metrics.
   - Create the Supplier Management module with forms for adding/editing supplier data.
   - Build the Raw Material Management system to track stock levels and purchasing details.
   - Set up the Purchase Orders module with forms for creating and managing orders.
   - Develop the Production Workflow module to track production jobs and finished goods.
   - Create the Cost Sheet Module for detailed product costing.
4. **Add Routing**: Implement routing to navigate between different modules using React Router.
5. **Implement State Management**: Set up Redux Toolkit to manage application state, especially for handling data across different modules.
6. **Testing**: Conduct thorough testing across different devices and screen sizes to ensure responsiveness and functionality.
7. **Deployment**: Prepare the application for deployment, ensuring all configurations are set for a production environment.

## USER EXPERIENCE
The application will provide a seamless experience, allowing the user to quickly navigate through modules with a sidebar. Key metrics will be visible on the dashboard, and forms will be designed for fast data entry, ensuring efficient operations. Users will receive alerts for pending tasks, and all interactions will be mobile-friendly, ensuring usability on the go.