Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
The project is a web application designed as a reservation panel for "Cal Mosso", a local artisanal bakery. The application serves as an internal tool for store staff, allowing them to view and manage bakery orders efficiently. It features a simple, user-friendly interface that prioritizes readability and ease of use.

## CORE FEATURES
1. **Header Section**: Displays the bakery's name and subtitle prominently, with filter options for better navigation.
2. **Three Columns Layout**: Each column represents different order statuses—Pending, Ready for Delivery, and Collected—with independent scrolling for each section.
3. **Collapsible Columns**: Users can expand or collapse each order status column to optimize screen space, with visual indicators to show the state of each column.
4. **Order Cards**: Each order card contains essential information like customer name, pickup time, product details, and payment status, presented in a clean and readable format.
5. **Responsive Design**: The layout adjusts for smaller screens, stacking columns vertically while prioritizing the most important section.
6. **Simple Mock Data**: Initially provided with mock data for testing and demonstration purposes without any database connection.

## 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 consists of three parallel columns with fixed headers and independent scrolling. The columns will resize based on their importance, with interactive features to collapse or expand.

## TECHNICAL REQUIREMENTS
- Framework: React with TypeScript
- Styling: Tailwind CSS
- UI Components: shadcn/ui
- State Management: Not required for initial implementation

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React project with TypeScript and install Tailwind CSS and shadcn/ui.
2. **Create the Header Component**: Develop a header that includes the bakery's name, subtitle, and filter options.
3. **Build the Column Layout**: Create three separate components for each order status column, ensuring they display the appropriate title, status bar, and card content.
4. **Implement Collapsible Functionality**: Add the ability to collapse and expand each column with appropriate visual indicators when toggled.
5. **Design Order Cards**: Implement the order card design to display customer details, pickup times, product lists, and payment status in a clear and concise manner.
6. **Add Mock Data**: Populate the columns with the provided mock data for testing purposes.
7. **Ensure Responsiveness**: Use Tailwind CSS utilities to ensure the layout adapts to different screen sizes, stacking the columns as needed.

## USER EXPERIENCE
The user experience focuses on quick access to information with minimal clicks. Staff can easily view pending, ready, and collected orders through a clean interface. The collapsible columns allow users to customize their view based on current needs, while the clear typography and layout ensure that information is presented in an organized manner, enhancing workflow efficiency. The use of warm, bakery-themed colors contributes to a friendly and welcoming environment, avoiding any corporate software feel.