Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
Sipe (Sistema Integral de Pasaje Estudiantil) is a comprehensive web application designed to manage a national database of student transportation passes. The system will facilitate centralized data management for recharge centers and transporters, allowing students to utilize smart cards with a defined limit of monthly passes, ensuring efficient and streamlined transport access.

## CORE FEATURES
1. **User Registration and Authentication**: Allow students and transporters to securely register and log in to their accounts, managing their personal information and access to features.
2. **Centralized Database Management**: Utilize PostgreSQL to store and manage student data, pass usage, and transaction records across the nation.
3. **Smart Card Management**: Implement functionality to track and manage smart cards, including the allocation of monthly passes (maximum of 60 per month, with a limit of 4 per day).
4. **Recharge Center Integration**: Enable recharge centers to access the system for processing pass recharges and transactions.
5. **Transporter Interface**: Provide transporters with an interface to monitor their trips and manage payments, including the ability to process card transactions.
6. **Reporting Dashboard**: Create a dashboard for administrators to view usage statistics, reports on student pass usage, and recharge center activities.

## 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 responsive layout with a top navigation bar for easy access to major sections, a sidebar for additional navigation options, and a main content area for displaying features and data.

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

## IMPLEMENTATION STEPS
1. **Set Up the Project**: Initialize a new React project with TypeScript, install required dependencies including Tailwind CSS and shadcn/ui components.
2. **Database Configuration**: Set up PostgreSQL database and define the schema for user data, pass records, and transaction logs.
3. **Build User Authentication**: Develop registration and login functionality using JWT for secure authentication.
4. **Create Smart Card Management**: Implement features for managing smart cards, including pass allocation and tracking.
5. **Develop Recharge Center Functionality**: Create interfaces for recharge centers to manage transactions and monitor pass usage.
6. **Design Admin Dashboard**: Build a reporting dashboard for administrators to view statistics and manage the system.
7. **Testing and Deployment**: Test the application for usability and security, then deploy it on a suitable hosting platform.

## USER EXPERIENCE
Users will experience a seamless journey from registration to managing their transport passes. Students will log in to view their pass balance and transaction history, while transporters will monitor their trips and payments via a dedicated interface. Administrators will have access to robust reporting features, ensuring oversight and management of the entire system. Responsive design ensures accessibility across various devices, enhancing user engagement and satisfaction.