Merge Users and Teams Management.

app.py

@@ -40,6 +40,7 @@ from routes.system_admin import system_admin_bp
 from routes.announcements import announcements_bp
 from routes.export import export_bp
 from routes.export_api import export_api_bp
+from routes.organization import organization_bp
 
 # Import auth decorators from routes.auth
 from routes.auth import login_required, admin_required, system_admin_required, role_required, company_required
@@ -105,6 +106,7 @@ app.register_blueprint(system_admin_bp)
 app.register_blueprint(announcements_bp)
 app.register_blueprint(export_bp)
 app.register_blueprint(export_api_bp)
+app.register_blueprint(organization_bp)
 
 # Import and register invitations blueprint
 from routes.invitations import invitations_bp

routes/company.py

@@ -218,27 +218,8 @@ def admin_company():
 @admin_required
 @company_required
 def company_users():
-    """List all users in the company with detailed information"""
+    """Redirect to the unified organization management page"""
-    users = User.query.filter_by(company_id=g.company.id).order_by(User.created_at.desc()).all()
+    return redirect(url_for('organization.admin_organization'))
-
-    # Calculate user statistics
-    user_stats = {
-        'total': len(users),
-        'verified': len([u for u in users if u.is_verified]),
-        'unverified': len([u for u in users if not u.is_verified]),
-        'blocked': len([u for u in users if u.is_blocked]),
-        'active': len([u for u in users if not u.is_blocked and u.is_verified]),
-        'admins': len([u for u in users if u.role == Role.ADMIN]),
-        'supervisors': len([u for u in users if u.role == Role.SUPERVISOR]),
-        'team_leaders': len([u for u in users if u.role == Role.TEAM_LEADER]),
-        'team_members': len([u for u in users if u.role == Role.TEAM_MEMBER]),
-    }
-
-    return render_template('company_users.html', 
-                         title='Company Users', 
-                         company=g.company,
-                         users=users,
-                         stats=user_stats)
 
 
 # Setup company route (separate from company blueprint due to different URL)

routes/organization.py

@@ -0,0 +1,231 @@
+from flask import Blueprint, render_template, redirect, url_for, flash, request, jsonify, g
+from models import db, User, Team, Role, Company
+from routes.auth import login_required, admin_required, company_required
+from sqlalchemy import or_
+
+# Create the blueprint
+organization_bp = Blueprint('organization', __name__)
+
+@organization_bp.route('/admin/organization')
+@login_required
+@company_required
+@admin_required
+def admin_organization():
+    """Comprehensive organization management interface"""
+    company = g.user.company
+    
+    # Get all teams and users for the company
+    teams = Team.query.filter_by(company_id=company.id).order_by(Team.name).all()
+    users = User.query.filter_by(company_id=company.id).order_by(User.username).all()
+    
+    return render_template('admin_organization.html',
+                         title='Organization Management',
+                         teams=teams,
+                         users=users,
+                         Role=Role)
+
+@organization_bp.route('/api/organization/teams/<int:team_id>', methods=['GET', 'PUT', 'DELETE'])
+@login_required
+@company_required
+@admin_required
+def api_team(team_id):
+    """API endpoint for team operations"""
+    team = Team.query.filter_by(id=team_id, company_id=g.user.company_id).first_or_404()
+    
+    if request.method == 'GET':
+        return jsonify({
+            'id': team.id,
+            'name': team.name,
+            'description': team.description,
+            'members': [{'id': u.id, 'username': u.username} for u in team.users]
+        })
+    
+    elif request.method == 'PUT':
+        data = request.get_json()
+        team.name = data.get('name', team.name)
+        team.description = data.get('description', team.description)
+        
+        try:
+            db.session.commit()
+            return jsonify({'success': True, 'message': 'Team updated successfully'})
+        except Exception as e:
+            db.session.rollback()
+            return jsonify({'success': False, 'message': str(e)}), 400
+    
+    elif request.method == 'DELETE':
+        # Unassign all users from the team
+        for user in team.users:
+            user.team_id = None
+        
+        db.session.delete(team)
+        db.session.commit()
+        return jsonify({'success': True, 'message': 'Team deleted successfully'})
+
+@organization_bp.route('/api/organization/teams', methods=['POST'])
+@login_required
+@company_required
+@admin_required
+def api_create_team():
+    """API endpoint to create a new team"""
+    data = request.get_json()
+    
+    team = Team(
+        name=data.get('name'),
+        description=data.get('description'),
+        company_id=g.user.company_id
+    )
+    
+    try:
+        db.session.add(team)
+        db.session.commit()
+        return jsonify({'success': True, 'message': 'Team created successfully', 'team_id': team.id})
+    except Exception as e:
+        db.session.rollback()
+        return jsonify({'success': False, 'message': str(e)}), 400
+
+@organization_bp.route('/api/organization/users/<int:user_id>', methods=['GET', 'PUT', 'DELETE'])
+@login_required
+@company_required
+@admin_required
+def api_user(user_id):
+    """API endpoint for user operations"""
+    user = User.query.filter_by(id=user_id, company_id=g.user.company_id).first_or_404()
+    
+    if request.method == 'GET':
+        return jsonify({
+            'id': user.id,
+            'username': user.username,
+            'email': user.email,
+            'role': user.role.name if user.role else 'TEAM_MEMBER',
+            'team_id': user.team_id,
+            'is_blocked': user.is_blocked
+        })
+    
+    elif request.method == 'PUT':
+        data = request.get_json()
+        
+        # Update user fields
+        if 'email' in data:
+            user.email = data['email']
+        if 'role' in data:
+            user.role = Role[data['role']]
+        if 'team_id' in data:
+            user.team_id = data['team_id'] if data['team_id'] else None
+        if 'is_blocked' in data:
+            user.is_blocked = data['is_blocked']
+        if 'password' in data and data['password']:
+            user.set_password(data['password'])
+        
+        try:
+            db.session.commit()
+            return jsonify({'success': True, 'message': 'User updated successfully'})
+        except Exception as e:
+            db.session.rollback()
+            return jsonify({'success': False, 'message': str(e)}), 400
+    
+    elif request.method == 'DELETE':
+        if user.id == g.user.id:
+            return jsonify({'success': False, 'message': 'Cannot delete your own account'}), 400
+        
+        db.session.delete(user)
+        db.session.commit()
+        return jsonify({'success': True, 'message': 'User deleted successfully'})
+
+@organization_bp.route('/api/organization/users', methods=['POST'])
+@login_required
+@company_required
+@admin_required
+def api_create_user():
+    """API endpoint to create a new user"""
+    data = request.get_json()
+    
+    # Check if username already exists
+    if User.query.filter_by(username=data.get('username')).first():
+        return jsonify({'success': False, 'message': 'Username already exists'}), 400
+    
+    user = User(
+        username=data.get('username'),
+        email=data.get('email'),
+        company_id=g.user.company_id,
+        role=Role[data.get('role', 'TEAM_MEMBER')],
+        team_id=data.get('team_id') if data.get('team_id') else None
+    )
+    user.set_password(data.get('password'))
+    
+    try:
+        db.session.add(user)
+        db.session.commit()
+        return jsonify({'success': True, 'message': 'User created successfully', 'user_id': user.id})
+    except Exception as e:
+        db.session.rollback()
+        return jsonify({'success': False, 'message': str(e)}), 400
+
+@organization_bp.route('/api/organization/users/<int:user_id>/toggle-status', methods=['POST'])
+@login_required
+@company_required
+@admin_required
+def api_toggle_user_status(user_id):
+    """Toggle user active/blocked status"""
+    user = User.query.filter_by(id=user_id, company_id=g.user.company_id).first_or_404()
+    
+    if user.id == g.user.id:
+        return jsonify({'success': False, 'message': 'Cannot block your own account'}), 400
+    
+    user.is_blocked = not user.is_blocked
+    db.session.commit()
+    
+    status = 'blocked' if user.is_blocked else 'unblocked'
+    return jsonify({'success': True, 'message': f'User {status} successfully'})
+
+@organization_bp.route('/api/organization/users/<int:user_id>/assign-team', methods=['POST'])
+@login_required
+@company_required
+@admin_required
+def api_assign_team(user_id):
+    """Assign user to a team"""
+    user = User.query.filter_by(id=user_id, company_id=g.user.company_id).first_or_404()
+    data = request.get_json()
+    
+    team_id = data.get('team_id')
+    if team_id:
+        team = Team.query.filter_by(id=team_id, company_id=g.user.company_id).first_or_404()
+        user.team_id = team.id
+    else:
+        user.team_id = None
+    
+    db.session.commit()
+    return jsonify({'success': True, 'message': 'Team assignment updated'})
+
+@organization_bp.route('/api/organization/search', methods=['GET'])
+@login_required
+@company_required
+@admin_required
+def api_organization_search():
+    """Search users and teams"""
+    query = request.args.get('q', '').lower()
+    
+    if not query:
+        return jsonify({'users': [], 'teams': []})
+    
+    # Search users
+    users = User.query.filter(
+        User.company_id == g.user.company_id,
+        or_(
+            User.username.ilike(f'%{query}%'),
+            User.email.ilike(f'%{query}%')
+        )
+    ).limit(10).all()
+    
+    # Search teams
+    teams = Team.query.filter(
+        Team.company_id == g.user.company_id,
+        or_(
+            Team.name.ilike(f'%{query}%'),
+            Team.description.ilike(f'%{query}%')
+        )
+    ).limit(10).all()
+    
+    return jsonify({
+        'users': [{'id': u.id, 'username': u.username, 'email': u.email} for u in users],
+        'teams': [{'id': t.id, 'name': t.name, 'description': t.description} for t in teams]
+    })

routes/teams.py

@@ -16,9 +16,8 @@ teams_bp = Blueprint('teams', __name__, url_prefix='/admin/teams')
 @admin_required
 @company_required
 def admin_teams():
-    team_repo = TeamRepository()
+    # Redirect to the new unified organization management page
-    teams = team_repo.get_with_member_count(g.user.company_id)
+    return redirect(url_for('organization.admin_organization'))
-    return render_template('admin_teams.html', title='Team Management', teams=teams)
 
 
 @teams_bp.route('/create', methods=['GET', 'POST'])

routes/users.py

@@ -38,9 +38,8 @@ def get_available_roles():
 @admin_required
 @company_required
 def admin_users():
-    user_repo = UserRepository()
+    # Redirect to the new unified organization management page
-    users = user_repo.get_by_company(g.user.company_id)
+    return redirect(url_for('organization.admin_organization'))
-    return render_template('admin_users.html', title='User Management', users=users)
 
 
 @users_bp.route('/create', methods=['GET', 'POST'])

templates/admin_company.html

@@ -31,7 +31,7 @@
         <div class="stat-card">
             <div class="stat-value">{{ stats.total_teams }}</div>
             <div class="stat-label">Teams</div>
-            <a href="{{ url_for('teams.admin_teams') }}" class="stat-link">Manage <i class="ti ti-arrow-right"></i></a>
+            <a href="{{ url_for('organization.admin_organization') }}" class="stat-link">Manage <i class="ti ti-arrow-right"></i></a>
         </div>
         <div class="stat-card">
             <div class="stat-value">{{ stats.total_projects }}</div>
@@ -139,19 +139,11 @@
                 </div>
                 <div class="card-body">
                     <div class="action-grid">
-                        <a href="{{ url_for('users.admin_users') }}" class="action-item">
+                        <a href="{{ url_for('organization.admin_organization') }}" class="action-item">
-                            <div class="action-icon"><i class="ti ti-users"></i></div>
+                            <div class="action-icon"><i class="ti ti-sitemap"></i></div>
                             <div class="action-content">
-                                <h3>Manage Users</h3>
+                                <h3>Manage Organization</h3>
-                                <p>User accounts & permissions</p>
+                                <p>Users, teams & structure</p>
-                            </div>
-                        </a>
-                        
-                        <a href="{{ url_for('teams.admin_teams') }}" class="action-item">
-                            <div class="action-icon"><i class="ti ti-users-group"></i></div>
-                            <div class="action-content">
-                                <h3>Manage Teams</h3>
-                                <p>Organize company structure</p>
                             </div>
                         </a>
                         

templates/admin_teams.html

@@ -1,602 +0,0 @@
-{% extends 'layout.html' %}
-
-{% block content %}
-<div class="teams-admin-container">
-    <!-- Header Section -->
-    <div class="page-header">
-        <div class="header-content">
-            <div class="header-left">
-                <h1 class="page-title">
-                    <i class="ti ti-users page-icon"></i>
-                    Team Management
-                </h1>
-                <p class="page-subtitle">Manage teams and their members across your organization</p>
-            </div>
-            <div class="header-actions">
-                <a href="{{ url_for('teams.create_team') }}" class="btn btn-primary">
-                    <i class="ti ti-plus"></i>
-                    Create New Team
-                </a>
-            </div>
-        </div>
-    </div>
-
-    <!-- Team Statistics -->
-    {% if teams %}
-    <div class="stats-section">
-        <div class="stat-card">
-            <div class="stat-value">{{ teams|length if teams else 0 }}</div>
-            <div class="stat-label">Total Teams</div>
-        </div>
-        <div class="stat-card">
-            <div class="stat-value">{{ teams|map(attribute='users')|map('length')|sum if teams else 0 }}</div>
-            <div class="stat-label">Total Members</div>
-        </div>
-        <div class="stat-card">
-            <div class="stat-value">{{ (teams|map(attribute='users')|map('length')|sum / teams|length)|round(1) if teams else 0 }}</div>
-            <div class="stat-label">Avg Team Size</div>
-        </div>
-    </div>
-    {% endif %}
-
-    <!-- Main Content -->
-    <div class="teams-content">
-        {% if teams %}
-            <!-- Search Bar -->
-            <div class="search-section">
-                <div class="search-container">
-                    <i class="ti ti-search search-icon"></i>
-                    <input type="text" 
-                           class="search-input" 
-                           id="teamSearch" 
-                           placeholder="Search teams by name or description...">
-                </div>
-            </div>
-
-            <!-- Teams Grid -->
-            <div class="teams-grid" id="teamsGrid">
-                {% for team in teams %}
-                    <div class="team-card" data-team-name="{{ team.name.lower() }}" data-team-desc="{{ team.description.lower() if team.description else '' }}">
-                        <div class="team-header">
-                            <div class="team-icon-wrapper">
-                                <i class="ti ti-users team-icon"></i>
-                            </div>
-                            <div class="team-meta">
-                                <span class="member-count">{{ team.users|length }} members</span>
-                            </div>
-                        </div>
-                        
-                        <div class="team-body">
-                            <h3 class="team-name">{{ team.name }}</h3>
-                            <p class="team-description">
-                                {{ team.description if team.description else 'No description provided' }}
-                            </p>
-                            
-                            <div class="team-info">
-                                <div class="info-item">
-                                    <i class="ti ti-calendar info-icon"></i>
-                                    <span class="info-text">Created {{ team.created_at.strftime('%b %d, %Y') }}</span>
-                                </div>
-                                {% if team.users %}
-                                <div class="info-item">
-                                    <i class="ti ti-user info-icon"></i>
-                                    <span class="info-text">Led by {{ team.users[0].username }}</span>
-                                </div>
-                                {% endif %}
-                            </div>
-                            
-                            <!-- Member Avatars -->
-                            {% if team.users %}
-                            <div class="member-avatars">
-                                {% for member in team.users[:5] %}
-                                    <div class="member-avatar" title="{{ member.username }}">
-                                        {{ member.username[:2].upper() }}
-                                    </div>
-                                {% endfor %}
-                                {% if team.users|length > 5 %}
-                                    <div class="member-avatar more" title="{{ team.users|length - 5 }} more members">
-                                        +{{ team.users|length - 5 }}
-                                    </div>
-                                {% endif %}
-                            </div>
-                            {% endif %}
-                        </div>
-                        
-                        <div class="team-actions">
-                            <a href="{{ url_for('teams.manage_team', team_id=team.id) }}" class="btn btn-manage">
-                                <i class="ti ti-settings"></i>
-                                Manage Team
-                            </a>
-                            <form method="POST" 
-                                  action="{{ url_for('teams.delete_team', team_id=team.id) }}" 
-                                  class="delete-form"
-                                  onsubmit="return confirm('Are you sure you want to delete the team \"{{ team.name }}\"? This action cannot be undone.');">
-                                <button type="submit" class="btn btn-delete" title="Delete Team">
-                                    <i class="ti ti-trash"></i>
-                                </button>
-                            </form>
-                        </div>
-                    </div>
-                {% endfor %}
-            </div>
-            
-            <!-- No Results Message -->
-            <div class="no-results" id="noResults" style="display: none;">
-                <div class="empty-icon"><i class="ti ti-search-off" style="font-size: 4rem;"></i></div>
-                <p class="empty-message">No teams found matching your search</p>
-                <p class="empty-hint">Try searching with different keywords</p>
-            </div>
-        {% else %}
-            <!-- Empty State -->
-            <div class="empty-state">
-                <div class="empty-icon"><i class="ti ti-users" style="font-size: 4rem;"></i></div>
-                <h2 class="empty-title">No Teams Yet</h2>
-                <p class="empty-message">Create your first team to start organizing your workforce</p>
-                <a href="{{ url_for('teams.create_team') }}" class="btn btn-primary btn-lg">
-                    <i class="ti ti-plus"></i>
-                    Create First Team
-                </a>
-            </div>
-        {% endif %}
-    </div>
-</div>
-
-<style>
-/* Container */
-.teams-admin-container {
-    max-width: 1400px;
-    margin: 0 auto;
-    padding: 2rem;
-}
-
-/* Page Header */
-.page-header {
-    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-    border-radius: 16px;
-    padding: 2rem;
-    margin-bottom: 2rem;
-    color: white;
-    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
-}
-
-.header-content {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    flex-wrap: wrap;
-    gap: 2rem;
-}
-
-.page-title {
-    font-size: 2rem;
-    font-weight: 700;
-    margin: 0;
-    display: flex;
-    align-items: center;
-    gap: 0.75rem;
-}
-
-.page-icon {
-    font-size: 2.5rem;
-    display: inline-block;
-    animation: float 3s ease-in-out infinite;
-}
-
-@keyframes float {
-    0%, 100% { transform: translateY(0); }
-    50% { transform: translateY(-10px); }
-}
-
-.page-subtitle {
-    font-size: 1.1rem;
-    opacity: 0.9;
-    margin: 0.5rem 0 0 0;
-}
-
-/* Stats Section */
-.stats-section {
-    display: grid;
-    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
-    gap: 1.5rem;
-    margin-bottom: 2rem;
-}
-
-.stat-card {
-    background: white;
-    padding: 1.5rem;
-    border-radius: 12px;
-    text-align: center;
-    border: 1px solid #e5e7eb;
-    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
-    transition: all 0.3s ease;
-}
-
-.stat-card:hover {
-    transform: translateY(-2px);
-    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
-}
-
-.stat-value {
-    font-size: 2.5rem;
-    font-weight: 700;
-    margin-bottom: 0.5rem;
-    color: #667eea;
-}
-
-.stat-label {
-    font-size: 0.9rem;
-    color: #6b7280;
-    text-transform: uppercase;
-    letter-spacing: 0.5px;
-    font-weight: 600;
-}
-
-/* Search Section */
-.search-section {
-    margin-bottom: 2rem;
-}
-
-.search-container {
-    position: relative;
-    max-width: 500px;
-}
-
-.search-icon {
-    position: absolute;
-    left: 1rem;
-    top: 50%;
-    transform: translateY(-50%);
-    font-size: 1.25rem;
-    opacity: 0.6;
-}
-
-.search-input {
-    width: 100%;
-    padding: 1rem 1rem 1rem 3rem;
-    border: 2px solid #e5e7eb;
-    border-radius: 12px;
-    font-size: 1rem;
-    transition: all 0.3s ease;
-    background: white;
-}
-
-.search-input:focus {
-    outline: none;
-    border-color: #667eea;
-    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
-}
-
-/* Teams Grid */
-.teams-grid {
-    display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(350px, 1fr));
-    gap: 1.5rem;
-    margin-bottom: 2rem;
-}
-
-/* Team Card */
-.team-card {
-    background: white;
-    border-radius: 12px;
-    border: 1px solid #e5e7eb;
-    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
-    transition: all 0.3s ease;
-    overflow: hidden;
-    display: flex;
-    flex-direction: column;
-}
-
-.team-card:hover {
-    transform: translateY(-4px);
-    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
-}
-
-.team-header {
-    background: linear-gradient(135deg, #f3f4f6 0%, #e5e7eb 100%);
-    padding: 1.5rem;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-}
-
-.team-icon-wrapper {
-    width: 60px;
-    height: 60px;
-    background: white;
-    border-radius: 50%;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
-}
-
-.team-icon {
-    font-size: 2rem;
-}
-
-.member-count {
-    background: white;
-    color: #6b7280;
-    padding: 0.5rem 1rem;
-    border-radius: 20px;
-    font-size: 0.875rem;
-    font-weight: 600;
-}
-
-.team-body {
-    padding: 1.5rem;
-    flex: 1;
-    display: flex;
-    flex-direction: column;
-}
-
-.team-name {
-    font-size: 1.5rem;
-    font-weight: 700;
-    color: #1f2937;
-    margin: 0 0 0.5rem 0;
-}
-
-.team-description {
-    color: #6b7280;
-    line-height: 1.6;
-    margin-bottom: 1.5rem;
-    flex: 1;
-}
-
-.team-info {
-    display: flex;
-    flex-direction: column;
-    gap: 0.5rem;
-    margin-bottom: 1.5rem;
-}
-
-.info-item {
-    display: flex;
-    align-items: center;
-    gap: 0.5rem;
-    color: #6b7280;
-    font-size: 0.875rem;
-}
-
-.info-icon {
-    font-size: 1rem;
-}
-
-/* Member Avatars */
-.member-avatars {
-    display: flex;
-    margin-bottom: 1rem;
-}
-
-.member-avatar {
-    width: 36px;
-    height: 36px;
-    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-    color: white;
-    border-radius: 50%;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    font-size: 0.875rem;
-    font-weight: 600;
-    margin-right: -8px;
-    border: 2px solid white;
-    position: relative;
-    z-index: 1;
-    transition: all 0.2s ease;
-}
-
-.member-avatar:hover {
-    transform: scale(1.1);
-    z-index: 10;
-}
-
-.member-avatar.more {
-    background: #6b7280;
-    font-size: 0.75rem;
-}
-
-/* Team Actions */
-.team-actions {
-    padding: 1.5rem;
-    background: #f8f9fa;
-    border-top: 1px solid #e5e7eb;
-    display: flex;
-    gap: 0.75rem;
-    align-items: center;
-}
-
-.delete-form {
-    margin: 0;
-}
-
-/* Buttons */
-.btn {
-    padding: 0.75rem 1.5rem;
-    border: none;
-    border-radius: 8px;
-    font-weight: 600;
-    font-size: 1rem;
-    cursor: pointer;
-    transition: all 0.2s ease;
-    display: inline-flex;
-    align-items: center;
-    gap: 0.5rem;
-    text-decoration: none;
-}
-
-.btn-primary {
-    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-    color: white;
-}
-
-.btn-primary:hover {
-    transform: translateY(-2px);
-    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
-}
-
-.btn-manage {
-    background: white;
-    color: #667eea;
-    border: 2px solid #e5e7eb;
-    flex: 1;
-    justify-content: center;
-}
-
-.btn-manage:hover {
-    background: #f3f4f6;
-    border-color: #667eea;
-}
-
-.btn-delete {
-    background: #fee2e2;
-    color: #dc2626;
-    padding: 0.75rem;
-    min-width: auto;
-}
-
-.btn-delete:hover {
-    background: #dc2626;
-    color: white;
-}
-
-.btn-lg {
-    padding: 1rem 2rem;
-    font-size: 1.1rem;
-}
-
-/* Empty State */
-.empty-state {
-    text-align: center;
-    padding: 4rem 2rem;
-    background: white;
-    border-radius: 12px;
-    border: 2px dashed #e5e7eb;
-}
-
-.empty-icon {
-    font-size: 4rem;
-    margin-bottom: 1.5rem;
-    opacity: 0.3;
-}
-
-.empty-title {
-    font-size: 1.75rem;
-    font-weight: 700;
-    color: #1f2937;
-    margin-bottom: 0.5rem;
-}
-
-.empty-message {
-    font-size: 1.1rem;
-    color: #6b7280;
-    margin-bottom: 2rem;
-}
-
-.empty-hint {
-    color: #9ca3af;
-    font-size: 0.875rem;
-}
-
-/* No Results */
-.no-results {
-    text-align: center;
-    padding: 3rem;
-}
-
-/* Responsive Design */
-@media (max-width: 768px) {
-    .teams-admin-container {
-        padding: 1rem;
-    }
-    
-    .page-header {
-        padding: 1.5rem;
-    }
-    
-    .page-title {
-        font-size: 2rem;
-    }
-    
-    .header-content {
-        flex-direction: column;
-        text-align: center;
-    }
-    
-    .header-stats {
-        grid-template-columns: 1fr;
-    }
-    
-    .teams-grid {
-        grid-template-columns: 1fr;
-    }
-    
-    .team-actions {
-        flex-direction: column;
-    }
-    
-    .btn-manage {
-        width: 100%;
-    }
-}
-
-/* Animations */
-@keyframes slideIn {
-    from {
-        opacity: 0;
-        transform: translateY(20px);
-    }
-    to {
-        opacity: 1;
-        transform: translateY(0);
-    }
-}
-
-.team-card {
-    animation: slideIn 0.4s ease-out;
-    animation-fill-mode: both;
-}
-
-.team-card:nth-child(1) { animation-delay: 0.05s; }
-.team-card:nth-child(2) { animation-delay: 0.1s; }
-.team-card:nth-child(3) { animation-delay: 0.15s; }
-.team-card:nth-child(4) { animation-delay: 0.2s; }
-.team-card:nth-child(5) { animation-delay: 0.25s; }
-.team-card:nth-child(6) { animation-delay: 0.3s; }
-</style>
-
-<script>
-document.addEventListener('DOMContentLoaded', function() {
-    const searchInput = document.getElementById('teamSearch');
-    const teamsGrid = document.getElementById('teamsGrid');
-    const noResults = document.getElementById('noResults');
-    
-    if (searchInput && teamsGrid) {
-        searchInput.addEventListener('input', function() {
-            const searchTerm = this.value.toLowerCase().trim();
-            const teamCards = teamsGrid.querySelectorAll('.team-card');
-            let visibleCount = 0;
-            
-            teamCards.forEach(card => {
-                const teamName = card.getAttribute('data-team-name');
-                const teamDesc = card.getAttribute('data-team-desc');
-                
-                if (teamName.includes(searchTerm) || teamDesc.includes(searchTerm)) {
-                    card.style.display = '';
-                    visibleCount++;
-                } else {
-                    card.style.display = 'none';
-                }
-            });
-            
-            // Show/hide no results message
-            if (noResults) {
-                noResults.style.display = visibleCount === 0 ? 'block' : 'none';
-            }
-        });
-    }
-});
-</script>
-
-{% endblock %}

templates/company_users.html

@@ -1,204 +0,0 @@
-{% extends "layout.html" %}
-
-{% block content %}
-<div class="admin-container">
-    <div class="admin-header">
-        <h1>Company Users - {{ company.name }}</h1>
-        <a href="{{ url_for('users.create_user') }}" class="btn btn-success">Create New User</a>
-    </div>
-    
-    <!-- User Statistics -->
-    <div class="stats-section">
-        <h2>User Statistics</h2>
-        <div class="stats-grid">
-            <div class="stat-card">
-                <h3>{{ stats.total }}</h3>
-                <p>Total Users</p>
-            </div>
-            <div class="stat-card">
-                <h3>{{ stats.active }}</h3>
-                <p>Active Users</p>
-            </div>
-            <div class="stat-card">
-                <h3>{{ stats.unverified }}</h3>
-                <p>Unverified</p>
-            </div>
-            <div class="stat-card">
-                <h3>{{ stats.blocked }}</h3>
-                <p>Blocked</p>
-            </div>
-            <div class="stat-card">
-                <h3>{{ stats.admins }}</h3>
-                <p>Administrators</p>
-            </div>
-            <div class="stat-card">
-                <h3>{{ stats.supervisors }}</h3>
-                <p>Supervisors</p>
-            </div>
-        </div>
-    </div>
-    
-    <!-- User List -->
-    <div class="admin-section">
-        <h2>User List</h2>
-        {% if users %}
-            <div class="user-list">
-                <table class="data-table">
-                    <thead>
-                        <tr>
-                            <th>Username</th>
-                            <th>Email</th>
-                            <th>Role</th>
-                            <th>Team</th>
-                            <th>Status</th>
-                            <th>Created</th>
-                            <th>Actions</th>
-                        </tr>
-                    </thead>
-                    <tbody>
-                        {% for user in users %}
-                        <tr>
-                            <td>
-                                {{ user.username }}
-                                {% if user.two_factor_enabled %}
-                                    <span class="security-badge" title="2FA Enabled"><i class="ti ti-lock"></i></span>
-                                {% endif %}
-                            </td>
-                            <td>{{ user.email }}</td>
-                            <td>
-                                <span class="role-badge role-{{ user.role.name.lower() }}">
-                                    {{ user.role.value }}
-                                </span>
-                            </td>
-                            <td>
-                                {% if user.team %}
-                                    <span class="team-badge">{{ user.team.name }}</span>
-                                {% else %}
-                                    <span class="text-muted">No team</span>
-                                {% endif %}
-                            </td>
-                            <td>
-                                <span class="status-badge {% if user.is_blocked %}status-blocked{% elif not user.is_verified %}status-unverified{% else %}status-active{% endif %}">
-                                    {% if user.is_blocked %}Blocked{% elif not user.is_verified %}Unverified{% else %}Active{% endif %}
-                                </span>
-                            </td>
-                            <td>{{ user.created_at.strftime('%Y-%m-%d') }}</td>
-                            <td>
-                                <a href="{{ url_for('users.edit_user', user_id=user.id) }}" class="btn btn-sm btn-primary">Edit</a>
-                                {% if user.id != g.user.id %}
-                                    <form method="POST" action="{{ url_for('users.toggle_user_status', user_id=user.id) }}" style="display: inline;">
-                                        {% if user.is_blocked %}
-                                            <button type="submit" class="btn btn-sm btn-success">Unblock</button>
-                                        {% else %}
-                                            <button type="submit" class="btn btn-sm btn-warning">Block</button>
-                                        {% endif %}
-                                    </form>
-                                    <button class="btn btn-sm btn-danger" onclick="confirmDelete({{ user.id }}, '{{ user.username }}')">Delete</button>
-                                {% endif %}
-                            </td>
-                        </tr>
-                        {% endfor %}
-                    </tbody>
-                </table>
-            </div>
-        {% else %}
-            <div class="empty-state">
-                <h3>No Users Found</h3>
-                <p>There are no users in this company yet.</p>
-                <a href="{{ url_for('users.create_user') }}" class="btn btn-primary">Add First User</a>
-            </div>
-        {% endif %}
-    </div>
-
-    <!-- Navigation -->
-    <div class="admin-section">
-        <a href="{{ url_for('companies.admin_company') }}" class="btn btn-secondary"><i class="ti ti-arrow-left"></i> Back to Company Management</a>
-    </div>
-</div>
-
-<script>
-function confirmDelete(userId, username) {
-    if (confirm(`Are you sure you want to delete user "${username}"? This action cannot be undone.`)) {
-        fetch(`/admin/users/delete/${userId}`, {
-            method: 'POST',
-            headers: {
-                'Content-Type': 'application/json',
-            }
-        }).then(response => {
-            if (response.ok) {
-                location.reload();
-            } else {
-                alert('Error deleting user');
-            }
-        });
-    }
-}
-</script>
-
-<style>
-.security-badge {
-    font-size: 12px;
-    margin-left: 5px;
-}
-
-.role-badge {
-    padding: 2px 8px;
-    border-radius: 12px;
-    font-size: 12px;
-    font-weight: 500;
-    display: inline-block;
-}
-
-.role-admin {
-    background-color: #ff6b6b;
-    color: white;
-}
-
-.role-supervisor {
-    background-color: #ffa726;
-    color: white;
-}
-
-.role-team_leader {
-    background-color: #42a5f5;
-    color: white;
-}
-
-.role-team_member {
-    background-color: #66bb6a;
-    color: white;
-}
-
-.team-badge {
-    background-color: #e3f2fd;
-    color: #1976d2;
-    padding: 2px 8px;
-    border-radius: 12px;
-    font-size: 12px;
-    border: 1px solid #bbdefb;
-}
-
-.status-unverified {
-    background-color: #fff3cd;
-    color: #856404;
-}
-
-.empty-state {
-    text-align: center;
-    padding: 40px 20px;
-    background-color: #f8f9fa;
-    border: 1px solid #dee2e6;
-    border-radius: 8px;
-}
-
-.empty-state h3 {
-    color: #666;
-    margin-bottom: 10px;
-}
-
-.empty-state p {
-    color: #888;
-    margin-bottom: 20px;
-}
-</style>
-{% endblock %}

templates/create_user.html

@@ -1,55 +0,0 @@
-{% extends "layout.html" %}
-
-{% block content %}
-<div class="admin-container">
-    <h1>Create New User</h1>
-        
-    <form method="POST" action="{{ url_for('users.create_user') }}" class="user-form">
-        <div class="form-group">
-            <label for="username">Username</label>
-            <input type="text" id="username" name="username" class="form-control" required autofocus>
-        </div>
-        
-        <div class="form-group">
-            <label for="email">Email</label>
-            <input type="email" id="email" name="email" class="form-control" required>
-        </div>
-        
-        <div class="form-group">
-            <label for="password">Password</label>
-            <input type="password" id="password" name="password" class="form-control" required>
-        </div>
-        
-        <div class="form-group">
-            <label for="role">Role</label>
-            <select id="role" name="role" class="form-control">
-                {% for role in roles %}
-                <option value="{{ role.name }}">{{ role.value }}</option>
-                {% endfor %}
-            </select>
-        </div>
-        
-        <div class="form-group">
-            <label for="team_id">Team (Optional)</label>
-            <select id="team_id" name="team_id" class="form-control">
-                <option value="">No Team</option>
-                {% for team in teams %}
-                <option value="{{ team.id }}">{{ team.name }}</option>
-                {% endfor %}
-            </select>
-        </div>
-        
-        <div class="form-group">
-            <label class="checkbox-container">
-                <input type="checkbox" name="auto_verify"> Auto-verify (skip email verification)
-                <span class="checkmark"></span>
-            </label>
-        </div>
-        
-        <div class="form-group">
-            <button type="submit" class="btn btn-success">Create User</button>
-            <a href="{{ url_for('users.admin_users') }}" class="btn btn-secondary">Cancel</a>
-        </div>
-    </form>
-</div>
-{% endblock %}

templates/edit_user.html

@@ -1,53 +0,0 @@
-{% extends "layout.html" %}
-
-{% block content %}
-<div class="admin-container">
-    <h1>Edit User: {{ user.username }}</h1>
-        
-    <form method="POST" action="{{ url_for('users.edit_user', user_id=user.id) }}" class="user-form">
-        <div class="form-group">
-            <label for="username">Username</label>
-            <input type="text" id="username" name="username" class="form-control" value="{{ user.username }}" required>
-        </div>
-        
-        <div class="form-group">
-            <label for="email">Email</label>
-            <input type="email" id="email" name="email" class="form-control" value="{{ user.email }}" required>
-        </div>
-        
-        <div class="form-group">
-            <label for="password">New Password (leave blank to keep current)</label>
-            <input type="password" id="password" name="password" class="form-control">
-        </div>
-        
-        <div class="form-group">
-            <label for="role">Role</label>
-            <select id="role" name="role" class="form-control">
-                {% for role in roles %}
-                <option value="{{ role.name }}" {% if user.role == role %}selected{% endif %}>
-                    {{ role.name.replace('_', ' ').title() }}
-                </option>
-                {% endfor %}
-            </select>
-        </div>
-        
-        <div class="form-group">
-            <label for="team_id">Team</label>
-            <select id="team_id" name="team_id" class="form-control">
-                <option value="">-- No Team --</option>
-                {% for team in teams %}
-                <option value="{{ team.id }}" {% if user.team_id == team.id %}selected{% endif %}>
-                    {{ team.name }}
-                </option>
-                {% endfor %}
-            </select>
-        </div>
-        
-        
-        <div class="form-group">
-            <button type="submit" class="btn btn-primary">Update User</button>
-            <a href="{{ url_for('users.admin_users') }}" class="btn btn-secondary">Cancel</a>
-        </div>
-    </form>
-</div>
-{% endblock %}

templates/layout.html

@@ -135,10 +135,9 @@
                     <!-- Role-based menu items -->
                     {% if g.user.role == Role.ADMIN or g.user.role == Role.SYSTEM_ADMIN %}
                     <li class="nav-divider">Admin</li>
+                    <li><a href="{{ url_for('organization.admin_organization') }}" data-tooltip="Organization"><i class="nav-icon ti ti-sitemap"></i><span class="nav-text">Organization</span></a></li>
                     <li><a href="{{ url_for('companies.admin_company') }}" data-tooltip="Company Settings"><i class="nav-icon ti ti-building"></i><span class="nav-text">Company Settings</span></a></li>
-                    <li><a href="{{ url_for('users.admin_users') }}" data-tooltip="Manage Users"><i class="nav-icon ti ti-users"></i><span class="nav-text">Manage Users</span></a></li>
                     <li><a href="{{ url_for('invitations.list_invitations') }}" data-tooltip="Invitations"><i class="nav-icon ti ti-mail"></i><span class="nav-text">Invitations</span></a></li>
-                    <li><a href="{{ url_for('teams.admin_teams') }}" data-tooltip="Manage Teams"><i class="nav-icon ti ti-users-group"></i><span class="nav-text">Manage Teams</span></a></li>
                     <li><a href="{{ url_for('projects.admin_projects') }}" data-tooltip="Manage Projects"><i class="nav-icon ti ti-folder"></i><span class="nav-text">Manage Projects</span></a></li>
                     {% if g.user.role == Role.SYSTEM_ADMIN %}
                     <li class="nav-divider">System Admin</li>

templates/team_form.html

@@ -1,694 +0,0 @@
-{% extends 'layout.html' %}
-
-{% block content %}
-<div class="team-form-container">
-    <!-- Header Section -->
-    <div class="page-header">
-        <div class="header-content">
-            <div class="header-left">
-                <h1 class="page-title">
-                    <span class="team-icon"><i class="ti ti-users"></i></span>
-                    {% if team %}
-                        {{ team.name }}
-                    {% else %}
-                        Create New Team
-                    {% endif %}
-                </h1>
-                <p class="page-subtitle">
-                    {% if team %}
-                        Manage team details and members
-                    {% else %}
-                        Set up a new team for your organization
-                    {% endif %}
-                </p>
-            </div>
-            <div class="header-actions">
-                <a href="{{ url_for('teams.admin_teams') }}" class="btn btn-outline">
-                    <i class="ti ti-arrow-left"></i> Back to Teams
-                </a>
-            </div>
-        </div>
-    </div>
-
-    <!-- Main Content Grid -->
-    <div class="content-grid">
-        <!-- Left Column: Team Details -->
-        <div class="content-column">
-            <!-- Team Details Card -->
-            <div class="card team-details-card">
-                <div class="card-header">
-                    <h2 class="card-title">
-                        <span class="icon">📝</span>
-                        Team Details
-                    </h2>
-                </div>
-                <div class="card-body">
-                    <form method="POST" action="{% if team %}{{ url_for('teams.manage_team', team_id=team.id) }}{% else %}{{ url_for('teams.create_team') }}{% endif %}" class="modern-form">
-                        {% if team %}
-                        <input type="hidden" name="action" value="update_team">
-                        {% endif %}
-                        
-                        <div class="form-group">
-                            <label for="name" class="form-label">Team Name</label>
-                            <input type="text" 
-                                   class="form-control" 
-                                   id="name" 
-                                   name="name" 
-                                   value="{{ team.name if team else '' }}" 
-                                   placeholder="Enter team name"
-                                   required>
-                            <span class="form-hint">Choose a descriptive name for your team</span>
-                        </div>
-                        
-                        <div class="form-group">
-                            <label for="description" class="form-label">Description</label>
-                            <textarea class="form-control" 
-                                      id="description" 
-                                      name="description" 
-                                      rows="4"
-                                      placeholder="Describe the team's purpose and responsibilities...">{{ team.description if team else '' }}</textarea>
-                            <span class="form-hint">Optional: Add details about this team's role</span>
-                        </div>
-                        
-                        <div class="form-actions">
-                            <button type="submit" class="btn btn-primary">
-                                <span class="icon"><i class="ti ti-check"></i></span>
-                                {% if team %}Save Changes{% else %}Create Team{% endif %}
-                            </button>
-                            {% if not team %}
-                            <a href="{{ url_for('teams.admin_teams') }}" class="btn btn-outline">Cancel</a>
-                            {% endif %}
-                        </div>
-                    </form>
-                </div>
-            </div>
-
-            {% if team %}
-            <!-- Team Statistics -->
-            <div class="card stats-card">
-                <div class="card-header">
-                    <h2 class="card-title">
-                        <span class="icon">📊</span>
-                        Team Statistics
-                    </h2>
-                </div>
-                <div class="card-body">
-                    <div class="stats-grid">
-                        <div class="stat-item">
-                            <div class="stat-value">{{ team_members|length if team_members else 0 }}</div>
-                            <div class="stat-label">Team Members</div>
-                        </div>
-                        <div class="stat-item">
-                            <div class="stat-value">{{ team.projects|length if team.projects else 0 }}</div>
-                            <div class="stat-label">Active Projects</div>
-                        </div>
-                        <div class="stat-item">
-                            <div class="stat-value">{{ team.created_at.strftime('%b %Y') if team.created_at else 'N/A' }}</div>
-                            <div class="stat-label">Created</div>
-                        </div>
-                    </div>
-                </div>
-            </div>
-            {% endif %}
-        </div>
-
-        <!-- Right Column: Team Members (only for existing teams) -->
-        {% if team %}
-        <div class="content-column">
-            <!-- Current Members Card -->
-            <div class="card members-card">
-                <div class="card-header">
-                    <h2 class="card-title">
-                        <span class="icon">👤</span>
-                        Team Members
-                    </h2>
-                    <span class="member-count">{{ team_members|length if team_members else 0 }} members</span>
-                </div>
-                <div class="card-body">
-                    {% if team_members %}
-                        <div class="members-list">
-                            {% for member in team_members %}
-                                <div class="member-item">
-                                    <div class="member-avatar">
-                                        {{ member.username[:2].upper() }}
-                                    </div>
-                                    <div class="member-info">
-                                        <div class="member-name">{{ member.username }}</div>
-                                        <div class="member-details">
-                                            <span class="member-email">{{ member.email }}</span>
-                                            <span class="member-role role-badge role-{{ member.role.name.lower() }}">
-                                                {{ member.role.value }}
-                                            </span>
-                                        </div>
-                                    </div>
-                                    <div class="member-actions">
-                                        <form method="POST" action="{{ url_for('teams.manage_team', team_id=team.id) }}" class="remove-form">
-                                            <input type="hidden" name="action" value="remove_member">
-                                            <input type="hidden" name="user_id" value="{{ member.id }}">
-                                            <button type="submit" 
-                                                    class="btn-icon btn-danger" 
-                                                    onclick="return confirm('Remove {{ member.username }} from the team?')"
-                                                    title="Remove from team">
-                                                <span class="icon"><i class="ti ti-x"></i></span>
-                                            </button>
-                                        </form>
-                                    </div>
-                                </div>
-                            {% endfor %}
-                        </div>
-                    {% else %}
-                        <div class="empty-state">
-                            <div class="empty-icon"><i class="ti ti-users"></i></div>
-                            <p class="empty-message">No members in this team yet</p>
-                            <p class="empty-hint">Add members using the form below</p>
-                        </div>
-                    {% endif %}
-                </div>
-            </div>
-
-            <!-- Add Member Card -->
-            <div class="card add-member-card">
-                <div class="card-header">
-                    <h2 class="card-title">
-                        <span class="icon"><i class="ti ti-plus"></i></span>
-                        Add Team Member
-                    </h2>
-                </div>
-                <div class="card-body">
-                    {% if available_users %}
-                        <form method="POST" action="{{ url_for('teams.manage_team', team_id=team.id) }}" class="modern-form">
-                            <input type="hidden" name="action" value="add_member">
-                            
-                            <div class="form-group">
-                                <label for="user_id" class="form-label">Select User</label>
-                                <select class="form-control form-select" id="user_id" name="user_id" required>
-                                    <option value="">Choose a user to add...</option>
-                                    {% for user in available_users %}
-                                        <option value="{{ user.id }}">
-                                            {{ user.username }} - {{ user.email }}
-                                            {% if user.role %}({{ user.role.value }}){% endif %}
-                                        </option>
-                                    {% endfor %}
-                                </select>
-                                <span class="form-hint">Only users not already in a team are shown</span>
-                            </div>
-                            
-                            <div class="form-actions">
-                                <button type="submit" class="btn btn-success">
-                                    <span class="icon">+</span>
-                                    Add to Team
-                                </button>
-                            </div>
-                        </form>
-                    {% else %}
-                        <div class="empty-state">
-                            <div class="empty-icon"><i class="ti ti-check"></i></div>
-                            <p class="empty-message">All users are assigned</p>
-                            <p class="empty-hint">No available users to add to this team</p>
-                        </div>
-                    {% endif %}
-                </div>
-            </div>
-        </div>
-        {% else %}
-        <!-- Placeholder for new teams -->
-        <div class="content-column">
-            <div class="card info-card">
-                <div class="card-body">
-                    <div class="info-content">
-                        <div class="info-icon"><i class="ti ti-bulb"></i></div>
-                        <h3>Team Members</h3>
-                        <p>After creating the team, you'll be able to add members and manage team composition from this page.</p>
-                    </div>
-                </div>
-            </div>
-        </div>
-        {% endif %}
-    </div>
-</div>
-
-<style>
-/* Container and Layout */
-.team-form-container {
-    max-width: 1400px;
-    margin: 0 auto;
-    padding: 2rem;
-}
-
-/* Page Header */
-.page-header {
-    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-    border-radius: 16px;
-    padding: 2.5rem;
-    margin-bottom: 2rem;
-    color: white;
-    box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1);
-}
-
-.header-content {
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-    flex-wrap: wrap;
-    gap: 1.5rem;
-}
-
-.header-left {
-    flex: 1;
-}
-
-.page-title {
-    font-size: 2.5rem;
-    font-weight: 700;
-    margin: 0;
-    display: flex;
-    align-items: center;
-    gap: 1rem;
-}
-
-.team-icon {
-    font-size: 3rem;
-    display: inline-block;
-    animation: float 3s ease-in-out infinite;
-}
-
-@keyframes float {
-    0%, 100% { transform: translateY(0); }
-    50% { transform: translateY(-10px); }
-}
-
-.page-subtitle {
-    font-size: 1.1rem;
-    opacity: 0.9;
-    margin: 0.5rem 0 0 0;
-}
-
-/* Content Grid */
-.content-grid {
-    display: grid;
-    grid-template-columns: 1fr 1.5fr;
-    gap: 2rem;
-    margin-bottom: 2rem;
-}
-
-@media (max-width: 1024px) {
-    .content-grid {
-        grid-template-columns: 1fr;
-    }
-}
-
-/* Cards */
-.card {
-    background: white;
-    border-radius: 12px;
-    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
-    border: 1px solid #e5e7eb;
-    margin-bottom: 1.5rem;
-    overflow: hidden;
-    transition: all 0.3s ease;
-}
-
-.card:hover {
-    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
-    transform: translateY(-2px);
-}
-
-.card-header {
-    background: #f8f9fa;
-    padding: 1.5rem;
-    border-bottom: 1px solid #e5e7eb;
-    display: flex;
-    justify-content: space-between;
-    align-items: center;
-}
-
-.card-title {
-    font-size: 1.25rem;
-    font-weight: 600;
-    margin: 0;
-    color: #1f2937;
-    display: flex;
-    align-items: center;
-    gap: 0.5rem;
-}
-
-.card-title .icon {
-    font-size: 1.5rem;
-}
-
-.card-body {
-    padding: 1.5rem;
-}
-
-/* Info Card for New Teams */
-.info-card {
-    background: linear-gradient(135deg, #f3f4f6 0%, #e5e7eb 100%);
-    border: none;
-}
-
-.info-content {
-    text-align: center;
-    padding: 2rem;
-}
-
-.info-icon {
-    font-size: 3rem;
-    margin-bottom: 1rem;
-}
-
-.info-content h3 {
-    color: #1f2937;
-    margin-bottom: 0.5rem;
-}
-
-.info-content p {
-    color: #6b7280;
-    font-size: 1.05rem;
-    line-height: 1.6;
-}
-
-/* Forms */
-.modern-form {
-    display: flex;
-    flex-direction: column;
-    gap: 1.5rem;
-}
-
-.form-group {
-    display: flex;
-    flex-direction: column;
-    gap: 0.5rem;
-}
-
-.form-label {
-    font-weight: 600;
-    color: #374151;
-    font-size: 0.95rem;
-}
-
-.form-control {
-    padding: 0.75rem 1rem;
-    border: 2px solid #e5e7eb;
-    border-radius: 8px;
-    font-size: 1rem;
-    transition: all 0.2s ease;
-    background-color: #f9fafb;
-}
-
-.form-control:focus {
-    outline: none;
-    border-color: #667eea;
-    background-color: white;
-    box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
-}
-
-.form-select {
-    cursor: pointer;
-}
-
-.form-hint {
-    font-size: 0.875rem;
-    color: #6b7280;
-}
-
-.form-actions {
-    display: flex;
-    gap: 1rem;
-    margin-top: 0.5rem;
-}
-
-/* Buttons */
-.btn {
-    padding: 0.75rem 1.5rem;
-    border: none;
-    border-radius: 8px;
-    font-weight: 600;
-    font-size: 1rem;
-    cursor: pointer;
-    transition: all 0.2s ease;
-    display: inline-flex;
-    align-items: center;
-    gap: 0.5rem;
-    text-decoration: none;
-}
-
-.btn-primary {
-    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-    color: white;
-}
-
-.btn-primary:hover {
-    transform: translateY(-2px);
-    box-shadow: 0 4px 12px rgba(102, 126, 234, 0.3);
-}
-
-.btn-success {
-    background: linear-gradient(135deg, #10b981 0%, #059669 100%);
-    color: white;
-}
-
-.btn-success:hover {
-    transform: translateY(-2px);
-    box-shadow: 0 4px 12px rgba(16, 185, 129, 0.3);
-}
-
-.btn-outline {
-    background: white;
-    color: #6b7280;
-    border: 2px solid #e5e7eb;
-}
-
-.btn-outline:hover {
-    background: #f3f4f6;
-    border-color: #d1d5db;
-}
-
-.btn-icon {
-    width: 36px;
-    height: 36px;
-    padding: 0;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    border-radius: 8px;
-    border: none;
-    cursor: pointer;
-    transition: all 0.2s ease;
-}
-
-.btn-danger {
-    background: #fee2e2;
-    color: #dc2626;
-}
-
-.btn-danger:hover {
-    background: #dc2626;
-    color: white;
-}
-
-/* Team Statistics */
-.stats-grid {
-    display: grid;
-    grid-template-columns: repeat(3, 1fr);
-    gap: 1.5rem;
-}
-
-.stat-item {
-    text-align: center;
-    padding: 1.5rem;
-    background: #f8f9fa;
-    border-radius: 8px;
-}
-
-.stat-value {
-    font-size: 2rem;
-    font-weight: 700;
-    color: #667eea;
-    margin-bottom: 0.5rem;
-}
-
-.stat-label {
-    font-size: 0.875rem;
-    color: #6b7280;
-    font-weight: 500;
-}
-
-/* Members List */
-.members-list {
-    display: flex;
-    flex-direction: column;
-    gap: 1rem;
-}
-
-.member-item {
-    display: flex;
-    align-items: center;
-    padding: 1rem;
-    background: #f8f9fa;
-    border-radius: 8px;
-    transition: all 0.2s ease;
-}
-
-.member-item:hover {
-    background: #f3f4f6;
-    transform: translateX(4px);
-}
-
-.member-avatar {
-    width: 48px;
-    height: 48px;
-    background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
-    color: white;
-    border-radius: 50%;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    font-weight: 600;
-    font-size: 1.1rem;
-    margin-right: 1rem;
-}
-
-.member-info {
-    flex: 1;
-}
-
-.member-name {
-    font-weight: 600;
-    color: #1f2937;
-    font-size: 1.05rem;
-}
-
-.member-details {
-    display: flex;
-    align-items: center;
-    gap: 1rem;
-    margin-top: 0.25rem;
-}
-
-.member-email {
-    color: #6b7280;
-    font-size: 0.875rem;
-}
-
-.member-count {
-    background: #e5e7eb;
-    color: #6b7280;
-    padding: 0.25rem 0.75rem;
-    border-radius: 20px;
-    font-size: 0.875rem;
-    font-weight: 500;
-}
-
-/* Role Badges */
-.role-badge {
-    padding: 0.25rem 0.75rem;
-    border-radius: 20px;
-    font-size: 0.75rem;
-    font-weight: 600;
-    text-transform: uppercase;
-}
-
-.role-team_member {
-    background: #dbeafe;
-    color: #1e40af;
-}
-
-.role-team_leader {
-    background: #fef3c7;
-    color: #92400e;
-}
-
-.role-supervisor {
-    background: #ede9fe;
-    color: #5b21b6;
-}
-
-.role-admin {
-    background: #fee2e2;
-    color: #991b1b;
-}
-
-.role-system_admin {
-    background: #fce7f3;
-    color: #be185d;
-}
-
-/* Empty States */
-.empty-state {
-    text-align: center;
-    padding: 3rem 1.5rem;
-}
-
-.empty-icon {
-    font-size: 3rem;
-    margin-bottom: 1rem;
-    opacity: 0.3;
-}
-
-.empty-message {
-    font-size: 1.1rem;
-    color: #1f2937;
-    margin-bottom: 0.5rem;
-}
-
-.empty-hint {
-    color: #6b7280;
-    font-size: 0.875rem;
-}
-
-/* Remove Form */
-.remove-form {
-    margin: 0;
-}
-
-/* Responsive Design */
-@media (max-width: 768px) {
-    .team-form-container {
-        padding: 1rem;
-    }
-    
-    .page-header {
-        padding: 1.5rem;
-    }
-    
-    .page-title {
-        font-size: 2rem;
-    }
-    
-    .stats-grid {
-        grid-template-columns: 1fr;
-        gap: 1rem;
-    }
-    
-    .member-details {
-        flex-direction: column;
-        align-items: flex-start;
-        gap: 0.5rem;
-    }
-}
-
-/* Animation */
-@keyframes slideIn {
-    from {
-        opacity: 0;
-        transform: translateY(20px);
-    }
-    to {
-        opacity: 1;
-        transform: translateY(0);
-    }
-}
-
-.card {
-    animation: slideIn 0.3s ease-out;
-}
-
-.card:nth-child(2) {
-    animation-delay: 0.1s;
-}
-
-.card:nth-child(3) {
-    animation-delay: 0.2s;
-}
-</style>
-{% endblock %}