<?php
// Start session if not already started
if (session_status() == PHP_SESSION_NONE && !headers_sent()) {
    session_start();
}

if (!isset($user_data)) {
    if (isset($user)) {
        $user_data = $user;
    } elseif (isset($current_user)) {
        $user_data = $current_user;
    } elseif (isset($auth) && method_exists($auth, 'getCurrentUser')) {
        $user_data = $auth->getCurrentUser();
    } else {
        // Fallback to prevent errors if user data is not available
        $user_data = ['username' => 'Guest', 'balance' => 0.00];
    }
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php echo $page_title ?? 'Dashboard'; ?> - <?php echo SITE_NAME; ?></title>
    <script src="https://cdn.tailwindcss.com"></script>
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
    <link rel="stylesheet" href="../assets/css/style.css">
</head>
<body class="bg-gray-100 font-sans text-gray-700">
    <div class="flex flex-col md:flex-row min-h-screen">
        <!-- Mobile Menu Button -->
        <div class="md:hidden bg-gray-900 p-4 flex justify-between items-center">
            <div class="flex items-center space-x-3">
                <i class="fas fa-chart-line text-2xl text-purple-500"></i>
                <span class="text-xl font-bold text-white"><?php echo SITE_NAME; ?></span>
            </div>
            <button id="menuToggle" class="text-white">
                <i class="fas fa-bars text-2xl"></i>
            </button>
        </div>

        <!-- Sidebar -->
        <div id="sidebar" class="w-64 bg-gray-900 text-white fixed inset-y-0 left-0 transform -translate-x-full md:relative md:translate-x-0 transition-transform duration-300 ease-in-out z-30 overflow-y-auto">
            <div class="p-6">

                <!-- User Info -->
                <div class="bg-gray-800 rounded-lg p-4 mb-6">
                    <div class="flex items-center space-x-3">
                        <div class="w-12 h-12 bg-gradient-to-r from-purple-600 to-blue-600 rounded-full flex items-center justify-center">
                            <i class="fas fa-user text-xl"></i>
                        </div>
                        <div class="flex-1 min-w-0">
                            <p class="font-semibold truncate"><?php echo htmlspecialchars($user_data['username'] ?? ''); ?></p>
                            <p class="text-gray-400 text-sm">Investor</p>
                            <p class="text-green-400 text-sm font-semibold">
                                $<?php echo number_format((float)($user_data['balance'] ?? 0), 2); ?>
                            </p>
                        </div>
                    </div>
                </div>

                <!-- Navigation -->
                <nav class="space-y-1">
                    <a href="dashboard.php" class="flex items-center space-x-3 p-3 rounded-lg bg-gradient-to-r from-purple-700 to-blue-700">
                        <i class="fas fa-home"></i>
                        <span>Dashboard</span>
                    </a>
                    <a href="deposit.php" class="flex items-center space-x-3 p-3 rounded-lg hover:bg-gray-800 transition-colors">
                        <i class="fas fa-money-bill-wave"></i>
                        <span>Deposit Funds</span>
                    </a>
                    <a href="withdrawal.php" class="flex items-center space-x-3 p-3 rounded-lg hover:bg-gray-800 transition-colors">
                        <i class="fas fa-wallet"></i>
                        <span>Withdraw Funds</span>
                    </a>
                    <a href="transactions.php" class="flex items-center space-x-3 p-3 rounded-lg hover:bg-gray-800 transition-colors">
                        <i class="fas fa-history"></i>
                        <span>Transaction History</span>
                    </a>
                    <a href="investment.php" class="flex items-center space-x-3 p-3 rounded-lg hover:bg-gray-800 transition-colors">
                        <i class="fas fa-chart-pie"></i>
                        <span>Investment Plans</span>
                    </a>
                    <a href="investments.php" class="flex items-center space-x-3 p-3 rounded-lg hover:bg-gray-800 transition-colors">
                        <i class="fas fa-coins"></i>
                        <span>My Investments</span>
                    </a>
                    <a href="profits.php" class="flex items-center space-x-3 p-3 rounded-lg hover:bg-gray-800 transition-colors">
                        <i class="fas fa-money-check-alt"></i>
                        <span>Profits History</span>
                    </a>
                    <a href="referral.php" class="flex items-center space-x-3 p-3 rounded-lg hover:bg-gray-800 transition-colors">
                        <i class="fas fa-users"></i>
                        <span>Referral Program</span>
                    </a>
                    <a href="support.php" class="flex items-center space-x-3 p-3 rounded-lg hover:bg-gray-800 transition-colors">
                        <i class="fas fa-headset"></i>
                        <span>Support</span>
                    </a>
                    <a href="profile.php" class="flex items-center space-x-3 p-3 rounded-lg hover:bg-gray-800 transition-colors">
                        <i class="fas fa-user"></i>
                        <span>Profile</span>
                    </a>
                    <a href="settings.php" class="flex items-center space-x-3 p-3 rounded-lg hover:bg-gray-800 transition-colors">
                        <i class="fas fa-cog"></i>
                        <span>Settings</span>
                    </a>
                    <a href="security.php" class="flex items-center space-x-3 p-3 rounded-lg hover:bg-gray-800 transition-colors">
                        <i class="fas fa-shield-alt"></i>
                        <span>Security</span>
                    </a>
                    <a href="../logout.php" class="flex items-center space-x-3 p-3 rounded-lg hover:bg-red-800 transition-colors text-red-400">
                        <i class="fas fa-sign-out-alt"></i>
                        <span>Logout</span>
                    </a>
                </nav>
            </div>
        </div>

        <!-- Main Content Container -->
        <div class="flex-1 flex flex-col">
            <!-- Top Bar -->
            <header class="bg-white shadow-sm p-4">
                <div class="flex items-center justify-between">
                    <div>
                        <h1 class="text-2xl font-bold text-gray-800"><?php echo $page_title ?? 'Dashboard'; ?></h1>
                    </div>
                    <div class="flex items-center space-x-4">
                        <!-- Notifications Bell -->
                        <div x-data="{ open: false }" class="relative">
                            <button @click="open = !open; markUserNotificationsAsRead();" class="relative p-2 text-gray-600 hover:text-gray-800 focus:outline-none">
                                <i class="fas fa-bell text-xl"></i>
                                <span id="user-notification-count" class="absolute -top-1 -right-1 bg-red-500 text-white text-xs rounded-full w-5 h-5 flex items-center justify-center" style="display: none;"></span>
                            </button>
                            <div x-show="open" @click.away="open = false" x-transition class="absolute right-0 mt-2 w-80 bg-white shadow-xl rounded-lg hidden z-50" style="max-height: 400px; overflow-y: auto;">
                                <div class="p-4 border-b">
                                    <h4 class="font-bold">Notifications</h4>
                                </div>
                                <div id="user-notification-list" class="space-y-1 p-2">
                                    <p class="text-center text-gray-500 text-sm p-4">Loading...</p>
                                </div>
                            </div>
                        </div>
                        <div class="text-right">
                            <p class="text-sm text-gray-600">Balance</p>
                            <p class="text-xl font-bold text-green-600">$<?php echo number_format((float)($user_data['balance'] ?? 0), 2); ?></p>
                        </div>
                    </div>
                </div>
            </header>
            <main class="flex-1 p-4 md:p-6 bg-gray-50">
        <!-- Flash Messages -->
        <?php if (isset($_SESSION['success'])): ?>
            <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 mt-4">
                <div class="bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded relative" role="alert">
                    <span class="block sm:inline"><?php echo $_SESSION['success']; ?></span>
                    <button type="button" class="absolute top-0 bottom-0 right-0 px-4 py-3" onclick="this.parentElement.style.display='none'">
                        <i class="fas fa-times"></i>
                    </button>
                </div>
            </div>
            <?php unset($_SESSION['success']); ?>
        <?php endif; ?>

        <?php if (isset($_SESSION['error'])): ?>
            <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 mt-4">
                <div class="bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative" role="alert">
                    <span class="block sm:inline"><?php echo $_SESSION['error']; ?></span>
                    <button type="button" class="absolute top-0 bottom-0 right-0 px-4 py-3" onclick="this.parentElement.style.display='none'">
                        <i class="fas fa-times"></i>
                    </button>
                </div>
            </div>
            <?php unset($_SESSION['error']); ?>
        <?php endif; ?>

        <?php if (isset($_SESSION['warning'])): ?>
            <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 mt-4">
                <div class="bg-yellow-100 border border-yellow-400 text-yellow-700 px-4 py-3 rounded relative" role="alert">
                    <span class="block sm:inline"><?php echo $_SESSION['warning']; ?></span>
                    <button type="button" class="absolute top-0 bottom-0 right-0 px-4 py-3" onclick="this.parentElement.style.display='none'">
                        <i class="fas fa-times"></i>
                    </button>
                </div>
            </div>
            <?php unset($_SESSION['warning']); ?>
        <?php endif; ?>

        <!-- Page Content -->
        <div class="container mx-auto">