Lovable Prompt Creator - AI Prompt Generator

## APPLICATION OVERVIEW
This web application serves as a management platform for administrators and superadmins to oversee resident information and access. The application restricts editing functionalities to authorized users, ensuring a secure and efficient management process. It allows for the activation and deactivation of residents while providing a streamlined interface for managing user roles.

## CORE FEATURES
1. **User Authentication**: Secure login for superadmins and admins, ensuring that only authorized personnel can access sensitive information.
2. **Resident Management**: Functionality for superadmins and admins to edit resident details, with options to activate or deactivate accounts.
3. **Role-Based Access Control**: Restriction of editing permissions exclusively to superadmins and admins, enhancing security and user management.
4. **User Creation**: Ability for superadmins and admins to add new residents to the system, with an optional email field in the model.
5. **Dashboard Overview**: A clean and concise dashboard displaying the status of residents and quick access to management features.
6. **Notification System**: Alerts for changes made to resident accounts, ensuring transparency and communication among admins.

## 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 single-page layout with a sidebar for navigation and a main content area displaying relevant features and information.

## TECHNICAL REQUIREMENTS
- **Framework**: React with TypeScript.
- **Styling**: Tailwind CSS for responsive design and utility-first styling.
- **UI Components**: shadcn/ui for modern and customizable UI components.
- **State Management**: Redux (or Context API) for managing global state as needed.

## IMPLEMENTATION STEPS
1. **Set Up Development Environment**: Initialize a new React project with TypeScript and install necessary packages including Tailwind CSS and shadcn/ui.
2. **Create Authentication Flow**: Implement user authentication using JWT or similar, ensuring secure access for superadmins and admins.
3. **Develop User Management Features**: Build out the resident management module including forms for editing and creating users with role-based access.
4. **Implement Responsive Design**: Use Tailwind CSS to create a responsive layout that adapts to different screen sizes.
5. **Set Up Notifications**: Integrate a notification system to alert admins about changes in resident status.
6. **Testing**: Conduct thorough testing of all features to ensure functionality and user experience are optimal.

## USER EXPERIENCE
The user experience is designed to be intuitive and straightforward. Upon logging in, users are greeted with a dashboard that provides an overview of residents. Superadmins and admins can easily navigate through resident management features via a sidebar, allowing for quick access to edit details or create new users. The design prioritizes clarity and minimalism, enhancing the overall workflow without unnecessary distractions. Responsive design principles ensure that the application is accessible on both desktop and mobile devices.