<?php
// ১. সেশন এবং সিকিউরিটি চেক
if (session_status() === PHP_SESSION_NONE) { session_start(); }
if (!isset($_SESSION['student_id'])) { header("Location: login"); exit; }

// ডাটাবেস কানেকশন
require_once __DIR__ . '/../db_connect.php'; 
date_default_timezone_set('Asia/Dhaka');

$student_id = $_SESSION['student_id'];
$student_name = $_SESSION['student_name'] ?? 'Student';

try {
    // ২. রিয়েল-টাইম নোটিফিকেশন লজিক
    $stmt_unread = $pdo->prepare("SELECT COUNT(*) FROM notifications WHERE student_id = ? AND is_read = 0");
    $stmt_unread->execute([$student_id]);
    $notif_unread = $stmt_unread->fetchColumn();

    $stmt_list = $pdo->prepare("SELECT * FROM notifications WHERE student_id = ? ORDER BY created_at DESC LIMIT 5");
    $stmt_list->execute([$student_id]);
    $notif_list = $stmt_list->fetchAll(PDO::FETCH_ASSOC);
} catch (Exception $e) {
    $notif_unread = 0; $notif_list = [];
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Student Portal | Ahmad Academy</title>
    
        <link rel="icon" type="image/png" href="<?= htmlspecialchars($site_logo) ?>">

    
    <link href="https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css">
    
    <style>
        :root { 
            --primary: #064e3b; 
            --primary-dark: #022c22;
            --accent: #d4af37; 
            --sidebar-width: 280px; 
            --bg-color: #f8fafc;
        }
        body { background: var(--bg-color); font-family: 'Outfit', sans-serif; overflow-x: hidden; }
        
        /* Sidebar & Layout */
        #sidebar { 
            width: var(--sidebar-width); height: 100vh; position: fixed; left: 0; top: 0; 
            background: var(--primary-dark); color: #fff; transition: 0.3s; 
            z-index: 1050; border-right: 3px solid var(--accent);
        }
        .main-wrapper { margin-left: var(--sidebar-width); transition: 0.3s; min-height: 100vh; display: flex; flex-direction: column; }
        #sidebar-overlay { display: none; position: fixed; width: 100vw; height: 100vh; background: rgba(0,0,0,0.4); z-index: 1040; top: 0; left: 0; backdrop-filter: blur(3px); }

        @media (max-width: 991px) {
            #sidebar { left: calc(var(--sidebar-width) * -1); }
            #sidebar.active { left: 0; }
            .main-wrapper { margin-left: 0; }
            #sidebar-overlay.active { display: block; }
        }

        /* Navbar & Dropdowns */
        .top-navbar { background: #ffffff; padding: 12px 25px; box-shadow: 0 4px 15px rgba(0,0,0,0.03); border-bottom: 1px solid #f1f5f9; position: sticky; top: 0; z-index: 1030; display: flex; justify-content: space-between; align-items: center; }
        .custom-dropdown-wrapper { position: relative; display: inline-block; }
        .custom-dropdown-menu { 
            position: absolute; top: 135%; right: 0; background: #fff; border-radius: 16px;
            box-shadow: 0 10px 40px rgba(0,0,0,0.1); width: 300px; opacity: 0; visibility: hidden; 
            transform: translateY(10px); transition: 0.3s ease; 
            border: 1px solid #f1f5f9; z-index: 9999; overflow: hidden;
        }
        /* এটি ড্রপডাউন দেখানোর জন্য */
        .custom-dropdown-menu.show { opacity: 1; visibility: visible; transform: translateY(0); }

        .notif-btn { width: 42px; height: 42px; border-radius: 50%; background: #f8fafc; border: 1px solid #e2e8f0; display: flex; align-items: center; justify-content: center; cursor: pointer; color: #64748b; position: relative; }
        .unread-badge { position: absolute; top: -2px; right: -2px; background: #ef4444; color: #fff; font-size: 9px; padding: 2px 5px; border-radius: 50%; border: 2px solid #fff; }

        .profile-avatar { width: 38px; height: 38px; border-radius: 50%; border: 2px solid var(--accent); object-fit: cover; }
        .content-area { padding: 25px; flex: 1; }
    </style>
</head>
<body>

<div id="sidebar-overlay" onclick="toggleSidebar()"></div>

<div id="sidebar">
    <?php 
    // সাইডবার ফাইল লোডার (আপনার দেওয়া লজিক)
    $files = ['sidebar.php', 'user_sidebar.php', 'student_sidebar.php'];
    $directories = [__DIR__ . '/', dirname(__DIR__) . '/', dirname(__DIR__) . '/admin/'];
    $found = false;
    foreach ($directories as $dir) {
        foreach ($files as $file) {
            $full_path = $dir . $file;
            if (file_exists($full_path)) { include $full_path; $found = true; break 2; }
        }
    }
    if (!$found) echo "<div class='p-3 text-danger'>⚠️ Sidebar file missing!</div>";
    ?>
</div>

<div class="main-wrapper">
    <nav class="top-navbar">
        <div class="d-flex align-items-center gap-3">
            <button class="btn btn-light d-lg-none border shadow-sm" onclick="toggleSidebar()">
                <i class="fas fa-bars" style="color: var(--primary);"></i>
            </button>
            <div class="fw-bold small text-uppercase d-none d-md-block" style="letter-spacing: 1px; color: var(--primary);">
                <i class="fas fa-graduation-cap me-1"></i> Ahmad Academy
            </div>
        </div>
        
        <div class="d-flex align-items-center gap-3">
            <div class="custom-dropdown-wrapper">
                <div class="notif-btn" onclick="toggleDropdown('notif-menu')">
                    <i class="fas fa-bell"></i>
                    <?php if($notif_unread > 0): ?>
                        <span class="unread-badge"><?= $notif_unread ?></span>
                    <?php endif; ?>
                </div>
                <div class="custom-dropdown-menu" id="notif-menu">
                    <div class="p-3 text-white fw-bold d-flex justify-content-between align-items-center" style="background: var(--primary);">
                        <span>Notifications</span>
                        <small class="badge bg-white text-dark"><?= $notif_unread ?> New</small>
                    </div>
                    <div style="max-height: 300px; overflow-y: auto;">
                        <?php if(empty($notif_list)): ?>
                            <div class="p-4 text-center text-muted small">No updates</div>
                        <?php else: foreach($notif_list as $n): ?>
                            <a href="<?= $n['link'] ?>" class="p-3 border-bottom d-flex gap-3 text-decoration-none">
                                <div class="bg-light p-2 rounded-circle" style="width:35px; height:35px; display:flex; align-items:center; justify-content:center;"><i class="fas fa-info-circle text-primary"></i></div>
                                <div class="overflow-hidden">
                                    <div class="fw-bold text-dark small text-truncate"><?= htmlspecialchars($n['title']) ?></div>
                                    <div class="text-muted" style="font-size: 10px;"><?= date('h:i A', strtotime($n['created_at'])) ?></div>
                                </div>
                            </a>
                        <?php endforeach; endif; ?>
                    </div>
                    <a href="notifications.php" class="d-block text-center p-2 text-decoration-none fw-bold small text-primary bg-light">View All</a>
                </div>
            </div>

            <div class="custom-dropdown-wrapper">
                <div class="d-flex align-items-center gap-2 cursor-pointer" onclick="toggleDropdown('profile-menu')">
                    <img src="https://ui-avatars.com/api/?name=<?= urlencode($student_name); ?>&background=064e3b&color=fff&bold=true" class="profile-avatar">
                    <i class="fas fa-chevron-down text-muted small d-none d-sm-block"></i>
                </div>
                <div class="custom-dropdown-menu p-2" id="profile-menu" style="width: 220px;">
                    <div class="p-2 border-bottom mb-2 text-center">
                        <div class="fw-bold text-dark small"><?= htmlspecialchars($student_name) ?></div>
                        <div class="text-muted" style="font-size: 10px;">ID: #<?= $student_id ?></div>
                    </div>
                    <a href="profile" class="dropdown-item p-2 small fw-bold text-muted"><i class="fas fa-user-circle me-2"></i> Account</a>
                    <a href="logout" class="dropdown-item p-2 small fw-bold text-danger border-top mt-1 pt-2"><i class="fas fa-sign-out-alt me-2"></i> Logout</a>
                </div>
            </div>
        </div>
    </nav>
    
    <div class="content-area">

<script>
    function toggleSidebar() {
        document.getElementById('sidebar').classList.toggle('active');
        document.getElementById('sidebar-overlay').classList.toggle('active');
    }

    function toggleDropdown(menuId) {
        // অন্য সব খোলা মেনু বন্ধ করা
        document.querySelectorAll('.custom-dropdown-menu').forEach(m => {
            if(m.id !== menuId) m.classList.remove('show');
        });
        // টার্গেট মেনু ওপেন বা ক্লোজ করা
        document.getElementById(menuId).classList.toggle('show');
    }

    // স্ক্রিনের অন্য জায়গায় ক্লিক করলে ড্রপডাউন বন্ধ হওয়া
    window.onclick = function(event) {
        if (!event.target.closest('.custom-dropdown-wrapper')) {
            document.querySelectorAll('.custom-dropdown-menu').forEach(menu => {
                menu.classList.remove('show');
            });
        }
    }
</script>