    <!DOCTYPE html>
    <html>
    <head>
        <title>User Management Admin</title>
        <style>
            body { font-family: Arial, sans-serif; padding: 20px; }
            .section { margin-bottom: 30px; padding: 20px; border: 1px solid #ddd; }
            input, button { padding: 8px; margin: 5px; }
            table { width: 100%; border-collapse: collapse; }
            th, td { padding: 10px; border: 1px solid #ddd; text-align: left; }
            th { background: #f5f5f5; }
        </style>
    </head>
    <body>
        <h1>User Management Admin</h1>
        
        <div class="section">
            <h3>Add Single User</h3>
            <input type="text" id="newUsername" placeholder="Username">
            <input type="email" id="newEmail" placeholder="Email (optional)">
            <input type="password" id="newPassword" placeholder="Password (optional)">
            <button onclick="addUser()">Add User</button>
        </div>
        
        <div class="section">
            <h3>Bulk Add Users</h3>
            <textarea id="bulkUsers" rows="5" cols="50" placeholder="username1,email1,password1&#10;username2,email2,password2&#10;username3,email3,password3"></textarea>
            <br><button onclick="bulkAdd()">Bulk Add Users</button>
        </div>
        
        <div class="section">
            <h3>Registered Users</h3>
            <button onclick="loadUsers()">Refresh List</button>
            <table id="usersTable">
                <thead>
                    <tr><th>Username</th><th>Email</th><th>Created</th><th>Actions</th></tr>
                </thead>
                <tbody></tbody>
            </table>
        </div>
        
        <div class="section">
            <h3>Currently Online</h3>
            <button onclick="loadOnlineUsers()">Refresh Online</button>
            <div id="onlineUsers"></div>
        </div>
        
        <script>
            // Add single user
            async function addUser() {
                const username = document.getElementById('newUsername').value;
                const email = document.getElementById('newEmail').value;
                const password = document.getElementById('newPassword').value;
                
                const response = await fetch('user_manager.php', {
                    method: 'POST',
                    headers: { 'Content-Type': 'application/json' },
                    body: JSON.stringify({ 
                        action: 'admin_add_user',
                        username: username,
                        email: email,
                        password: password
                    })
                });
                
                const result = await response.json();
                alert(result.message);
                if (result.success) {
                    loadUsers();
                    document.getElementById('newUsername').value = '';
                    document.getElementById('newEmail').value = '';
                    document.getElementById('newPassword').value = '';
                }
            }
            
            // Bulk add users
            async function bulkAdd() {
                const text = document.getElementById('bulkUsers').value;
                const lines = text.split('\n').filter(line => line.trim());
                const users = [];
                
                for (const line of lines) {
                    const [username, email, password] = line.split(',');
                    if (username && username.trim()) {
                        users.push({
                            username: username.trim(),
                            email: email ? email.trim() : '',
                            password: password ? password.trim() : ''
                        });
                    }
                }
                
                if (users.length === 0) {
                    alert('No valid users to add');
                    return;
                }
                
                const response = await fetch('user_manager.php', {
                    method: 'POST',
                    headers: { 'Content-Type': 'application/json' },
                    body: JSON.stringify({ 
                        action: 'bulk_add_users',
                        users: users
                    })
                });
                
                const result = await response.json();
                alert(`Added ${result.added} users. Errors: ${result.errors.join(', ')}`);
                loadUsers();
                document.getElementById('bulkUsers').value = '';
            }
            
            // Load registered users
            async function loadUsers() {
                const response = await fetch('user_manager.php', {
                    method: 'POST',
                    headers: { 'Content-Type': 'application/json' },
                    body: JSON.stringify({ action: 'admin_list_users' })
                });
                
                const result = await response.json();
                const tbody = document.querySelector('#usersTable tbody');
                
                if (result.users && result.users.length > 0) {
                    tbody.innerHTML = result.users.map(user => `
                        <tr>
                            <td>${user.username}</td>
                            <td>${user.email || 'N/A'}</td>
                            <td>${new Date(user.created * 1000).toLocaleDateString()}</td>
                            <td>
                                <button onclick="removeUser('${user.username}')">Remove</button>
                            </td>
                        </tr>
                    `).join('');
                } else {
                    tbody.innerHTML = '<tr><td colspan="4">No users registered</td></tr>';
                }
            }
            
            // Remove user
            async function removeUser(username) {
                if (!confirm(`Remove user ${username}?`)) return;
                
                const response = await fetch('user_manager.php', {
                    method: 'POST',
                    headers: { 'Content-Type': 'application/json' },
                    body: JSON.stringify({ 
                        action: 'admin_remove_user',
                        username: username
                    })
                });
                
                const result = await response.json();
                alert(result.message);
                loadUsers();
            }
            
            // Load online users
            async function loadOnlineUsers() {
                const response = await fetch('user_manager.php', {
                    method: 'POST',
                    headers: { 'Content-Type': 'application/json' },
                    body: JSON.stringify({ action: 'get_online_users' })
                });
                
                const result = await response.json();
                const div = document.getElementById('onlineUsers');
                
                if (result.users && result.users.length > 0) {
                    div.innerHTML = '<strong>Online:</strong> ' + result.users.join(', ');
                } else {
                    div.innerHTML = '<strong>No users currently online</strong>';
                }
            }
            
            // Load data on page load
            window.onload = function() {
                loadUsers();
                loadOnlineUsers();
            };
        </script>
    </body>
    </html>
    