diff --git a/api_v1_roles.php b/api_v1_roles.php
index efeecc3..2b2dd23 100644
--- a/api_v1_roles.php
+++ b/api_v1_roles.php
@@ -28,7 +28,7 @@ if ($_SERVER['REQUEST_METHOD'] === 'GET') {
 
     // Fetch members and their roles
     $stmt = db()->prepare("
-        SELECT u.id, u.display_name as username, u.username as login_name, u.avatar_url, 
+        SELECT u.id, u.display_name as username, u.username as login_name, u.avatar_url, u.status,
                GROUP_CONCAT(DISTINCT r.id) as role_ids,
                GROUP_CONCAT(DISTINCT r.name) as role_names,
                (SELECT r2.color FROM roles r2 JOIN user_roles ur2 ON r2.id = ur2.role_id WHERE ur2.user_id = u.id AND r2.server_id = ? ORDER BY r2.position DESC LIMIT 1) as role_color,
diff --git a/assets/js/main.js b/assets/js/main.js
index 76da6e7..cea717f 100644
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -889,23 +889,31 @@ document.addEventListener('DOMContentLoaded', () => {
     }
 
     function updatePresenceUI(userId, status) {
-        const memberItem = document.querySelector(`.start-dm-btn[data-user-id="${userId}"] .message-avatar`);
-        if (memberItem) {
-            let indicator = memberItem.querySelector('.presence-indicator');
-            if (!indicator) {
-                indicator = document.createElement('div');
-                indicator.className = 'presence-indicator';
-                memberItem.appendChild(indicator);
+        const selectors = [
+            `.start-dm-btn[data-user-id="${userId}"] .message-avatar`,
+            `.member-item[data-user-id="${userId}"] .message-avatar`
+        ];
+        
+        selectors.forEach(selector => {
+            const container = document.querySelector(selector);
+            if (container) {
+                let indicator = container.querySelector('.presence-indicator');
+                if (!indicator) {
+                    indicator = document.createElement('div');
+                    indicator.className = 'presence-indicator';
+                    container.appendChild(indicator);
+                }
+                indicator.style.position = 'absolute';
+                indicator.style.bottom = '0';
+                indicator.style.right = '0';
+                indicator.style.width = '10px';
+                indicator.style.height = '10px';
+                indicator.style.borderRadius = '50%';
+                indicator.style.border = '2px solid var(--bg-members)';
+                indicator.style.backgroundColor = status === 'online' ? '#23a559' : '#80848e';
+                container.style.backgroundColor = status === 'online' ? '#23a559' : '#80848e';
             }
-            indicator.style.position = 'absolute';
-            indicator.style.bottom = '0';
-            indicator.style.right = '0';
-            indicator.style.width = '10px';
-            indicator.style.height = '10px';
-            indicator.style.borderRadius = '50%';
-            indicator.style.border = '2px solid var(--bg-members)';
-            indicator.style.backgroundColor = status === 'online' ? '#23a559' : '#80848e';
-        }
+        });
     }
 
     // Presence indicators initialization (can be expanded)
@@ -1916,7 +1924,7 @@ document.addEventListener('DOMContentLoaded', () => {
 
                 item.innerHTML = `
                     <div class="message-avatar" style="width: 32px; height: 32px; background-color: ${statusColor}; position: relative; ${avatarBg}">
-                        ${m.status === 'online' ? `<div style="position: absolute; bottom: 0; right: 0; width: 10px; height: 10px; background-color: #23a559; border-radius: 50%; border: 2px solid var(--bg-members);"></div>` : ''}
+                        <div class="presence-indicator" style="position: absolute; bottom: 0; right: 0; width: 10px; height: 10px; background-color: ${statusColor}; border-radius: 50%; border: 2px solid var(--bg-members);"></div>
                     </div>
                     <span style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap; ${m.role_color ? `color: ${m.role_color};` : ''}">
                         ${escapeHTML(m.username)}
diff --git a/auth/logout.php b/auth/logout.php
index 5717527..7f1161a 100644
--- a/auth/logout.php
+++ b/auth/logout.php
@@ -4,6 +4,8 @@ require_once __DIR__ . '/session.php';
 $user = getCurrentUser();
 if ($user) {
     try {
+        // Update user status
+        db()->prepare("UPDATE users SET status = 'offline' WHERE id = ?")->execute([$user['id']]);
         // Clean up DB session
         db()->prepare("DELETE FROM voice_sessions WHERE user_id = ?")->execute([$user['id']]);
     } catch (Exception $e) {
diff --git a/index.php b/index.php
index e367c7f..889ce19 100644
--- a/index.php
+++ b/index.php
@@ -134,6 +134,10 @@ function parse_emotes($content, $username_to_mention = null) {
 requireLogin();
 
 $user = getCurrentUser();
+if ($user) {
+    db()->prepare("UPDATE users SET status = 'online' WHERE id = ?")->execute([$user['id']]);
+    $user['status'] = 'online'; // Update local variable too
+}
 $current_user_id = $user['id'];
 $messages = []; // Initialize messages array
 $threads = [];
@@ -1684,7 +1688,9 @@ $projectImageUrl = $_SERVER['PROJECT_IMAGE_URL'] ?? '';
             <div class="channel-item member-item" data-user-id="<?php echo $m['id']; ?>" data-username="<?php echo htmlspecialchars($m['username']); ?>" data-avatar="<?php echo htmlspecialchars($m['avatar_url'] ?? ''); ?>" data-role-ids="<?php echo $m['role_ids'] ?? ''; ?>" data-badge-data="<?php echo htmlspecialchars($m['badge_data'] ?? ''); ?>" style="color: var(--text-primary); margin-bottom: 8px; cursor: pointer;">
                 <div class="message-avatar" style="width: 32px; height: 32px; background-color: <?php echo ($m['status'] ?? 'offline') == 'online' ? '#23a559' : '#80848e'; ?>; position: relative; <?php echo $m['avatar_url'] ? "background-image: url('{$m['avatar_url']}');" : ""; ?>">
                     <?php if(($m['status'] ?? 'offline') == 'online'): ?>
-                        <div style="position: absolute; bottom: 0; right: 0; width: 10px; height: 10px; background-color: #23a559; border-radius: 50%; border: 2px solid var(--bg-members);"></div>
+                        <div class="presence-indicator" style="position: absolute; bottom: 0; right: 0; width: 10px; height: 10px; background-color: #23a559; border-radius: 50%; border: 2px solid var(--bg-members);"></div>
+                    <?php else: ?>
+                        <div class="presence-indicator" style="position: absolute; bottom: 0; right: 0; width: 10px; height: 10px; background-color: #80848e; border-radius: 50%; border: 2px solid var(--bg-members);"></div>
                     <?php endif; ?>
                 </div>
                 <span style="overflow: hidden; text-overflow: ellipsis; white-space: nowrap; <?php echo !empty($m['role_color']) ? "color: {$m['role_color']};" : ""; ?>">