<aside id="sidebar" class="sidebar">
    <ul class="sidebar-nav" id="sidebar-nav">
        <li class="nav-item">
            <a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'index.php' ? '' : 'collapsed'; ?>" href="index.php">
                <i class="bi bi-grid"></i>
                <span>Dashboard</span>
            </a>
        </li>

        <li class="nav-item">
            <a class="nav-link <?php echo in_array(basename($_SERVER['PHP_SELF']), ['users.php', 'user-details.php']) ? '' : 'collapsed'; ?>" href="users.php">
                <i class="bi bi-people"></i>
                <span>Users</span>
            </a>
        </li>

        <li class="nav-item">
            <a class="nav-link collapsed" data-bs-target="#pins-nav" data-bs-toggle="collapse" href="#">
                <i class="bi bi-key"></i><span>PIN Management</span><i class="bi bi-chevron-down ms-auto"></i>
            </a>
            <ul id="pins-nav" class="nav-content collapse <?php echo in_array(basename($_SERVER['PHP_SELF']), ['pin-requests.php', 'pin-list.php']) ? 'show' : ''; ?>" data-bs-parent="#sidebar-nav">
                <li>
                    <a href="pin-requests.php" class="<?php echo basename($_SERVER['PHP_SELF']) == 'pin-requests.php' ? 'active' : ''; ?>">
                        <i class="bi bi-circle"></i><span>PIN Requests</span>
                    </a>
                </li>
                <li>
                    <a href="pin-list.php" class="<?php echo basename($_SERVER['PHP_SELF']) == 'pin-list.php' ? 'active' : ''; ?>">
                        <i class="bi bi-circle"></i><span>PIN List</span>
                    </a>
                </li>
            </ul>
        </li>

        <!-- SUPPORT SECTION - ADD THIS -->
        <li class="nav-item">
            <a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'support.php' ? '' : 'collapsed'; ?>" href="support.php">
                <i class="bi bi-headset"></i>
                <span>Support Tickets</span>
                <?php
                // Show unread support tickets count
                if (isset($conn)) {
                    $support_query = "SELECT 
                                        (SELECT COUNT(DISTINCT ticket_id) FROM support_messages WHERE is_read = 0 AND sender_type = 'user') as ticket_count,
                                        (SELECT COUNT(*) FROM support_messages WHERE is_read = 0 AND sender_type = 'user') as message_count";
                    $support_result = mysqli_query($conn, $support_query);
                    $support_data = mysqli_fetch_assoc($support_result);
                    $total_unread = $support_data['ticket_count'] + $support_data['message_count'];
                    
                    if ($total_unread > 0) {
                        echo '<span class="badge bg-danger rounded-pill ms-2" id="sidebarSupportBadge">' . $total_unread . '</span>';
                    } else {
                        echo '<span class="badge bg-danger rounded-pill ms-2" id="sidebarSupportBadge" style="display: none;">0</span>';
                    }
                }
                ?>
            </a>
        </li>

        <li class="nav-item">
            <a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'withdrawals.php' ? '' : 'collapsed'; ?>" href="withdrawals.php">
                <i class="bi bi-cash"></i>
                <span>Withdrawals</span>
                <?php
                // Show pending count
                if (isset($conn)) {
                    $result = mysqli_query($conn, "SELECT COUNT(*) as pending FROM witdrawl WHERE status = 0");
                    $pending = mysqli_fetch_assoc($result)['pending'];
                    if ($pending > 0) {
                        echo '<span class="badge bg-danger rounded-pill ms-2">' . $pending . '</span>';
                    }
                }
                ?>
            </a>
        </li>

        <li class="nav-item">
            <a class="nav-link collapsed" data-bs-target="#income-nav" data-bs-toggle="collapse" href="#">
                <i class="bi bi-graph-up"></i><span>Income</span><i class="bi bi-chevron-down ms-auto"></i>
            </a>
            <ul id="income-nav" class="nav-content collapse" data-bs-parent="#sidebar-nav">
                <li>
                    <a href="income-history.php">
                        <i class="bi bi-circle"></i><span>Income History</span>
                    </a>
                </li>
                <li>
                    <a href="level-rewards.php">
                        <i class="bi bi-circle"></i><span>Level Rewards</span>
                    </a>
                </li>
            </ul>
        </li>

        <li class="nav-item">
            <a class="nav-link collapsed" data-bs-target="#reports-nav" data-bs-toggle="collapse" href="#">
                <i class="bi bi-file-text"></i><span>Reports</span><i class="bi bi-chevron-down ms-auto"></i>
            </a>
            <ul id="reports-nav" class="nav-content collapse" data-bs-parent="#sidebar-nav">
                <li>
                    <a href="sales-report.php">
                        <i class="bi bi-circle"></i><span>Sales Report</span>
                    </a>
                </li>
            </ul>
        </li>

        <li class="nav-item">
            <a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'company-settings.php' ? '' : 'collapsed'; ?>" href="company-settings.php">
                <i class="bi bi-building"></i>
                <span>Company Settings</span>
            </a>
        </li>

        <li class="nav-item">
            <a class="nav-link <?php echo basename($_SERVER['PHP_SELF']) == 'profile.php' ? '' : 'collapsed'; ?>" href="profile.php">
                <i class="bi bi-person"></i>
                <span>Profile</span>
            </a>
        </li>

        <li class="nav-item">
            <a class="nav-link collapsed" href="logout.php">
                <i class="bi bi-box-arrow-right"></i>
                <span>Logout</span>
            </a>
        </li>
    </ul>
</aside>

<!-- Add JavaScript for real-time badge updates -->
<script>
// Update sidebar support badge in real-time
function updateSidebarSupportBadge() {
    fetch('ajax/get_support_notifications.php')
        .then(response => response.json())
        .then(data => {
            const badge = document.getElementById('sidebarSupportBadge');
            const total = data.unread_tickets + data.unread_messages;
            
            if (badge) {
                if (total > 0) {
                    badge.textContent = total;
                    badge.style.display = 'inline';
                } else {
                    badge.style.display = 'none';
                }
            }
        })
        .catch(error => console.error('Error updating sidebar badge:', error));
}

// Update every 10 seconds
setInterval(updateSidebarSupportBadge, 10000);

// Update when page becomes visible
document.addEventListener('visibilitychange', function() {
    if (!document.hidden) {
        updateSidebarSupportBadge();
    }
});
</script>

<style>
/* Ensure badge styling matches */
.sidebar-nav .nav-link .badge {
    float: right;
    margin-top: 2px;
    font-size: 0.7rem;
    padding: 3px 7px;
}

/* Active state styling */
.sidebar-nav .nav-link:not(.collapsed) .badge {
    background-color: #fff !important;
    color: #4154f1 !important;
}
</style>