Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This project is a web application for a delivery service, featuring a Kanban-style interface for managing orders. Users will be able to view and manage their orders categorized into 'Pending', 'Completed', 'Out for Delivery', and 'Delivered'. The application aims to provide a clean and efficient user experience for both customers and delivery personnel.

## CORE FEATURES
1. **Side Menu Navigation**: A left sidebar with a red background and white font, allowing users to easily navigate through different sections of the app.
2. **Kanban Board**: Centralized display of orders in a Kanban format, with categories for 'To Do', 'Completed', 'Out for Delivery', and 'Delivered', enabling drag-and-drop functionality for order management.
3. **Order Management**: Users can add, edit, and delete orders with ease, ensuring a smooth workflow and real-time updates.
4. **Real-Time Notifications**: Users receive updates on order status changes and notifications when orders are out for delivery or delivered.
5. **User Authentication**: Secure login and registration features to allow users to manage their own orders and information securely.
6. **Responsive Design**: Optimized layout for various devices, ensuring a seamless experience whether on desktop or mobile.

## 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 layout features a left-side navigation menu with a prominent red background, while the main content area displays the Kanban board in the center, allowing for easy visibility and interaction with the orders.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS.
- **UI Components**: shadcn/ui for modern UI elements.
- **State Management**: Use React's Context API or Redux for managing global state if needed.

## IMPLEMENTATION STEPS
1. **Set Up Project**: Initialize a new React project with TypeScript using Create React App.
2. **Install Dependencies**: Install Tailwind CSS and shadcn/ui components for styling and UI elements.
3. **Create Layout**: Develop the main layout with a left-side navigation menu and a central Kanban board.
4. **Implement Authentication**: Set up user authentication with necessary routes and components for login and registration.
5. **Build Kanban Board**: Create the Kanban component with draggable functionality using libraries like React Beautiful DnD.
6. **State Management**: Implement state management to handle order data and user sessions.
7. **Add Notification System**: Integrate a notification system to inform users about order status changes.
8. **Responsive Design**: Ensure the application is responsive and works well on various screen sizes.
9. **Testing**: Conduct thorough testing for functionality and user experience before deployment.

## USER EXPERIENCE
Users will interact with the application primarily through the left-side navigation menu to access different order categories. They can drag and drop orders within the Kanban board to reflect their status changes. Notifications will keep them informed of any updates, while the clean and minimalist design ensures that users can focus on their tasks without distractions. The application should provide a seamless experience across devices, enhancing usability for all users.