<?php
// instructors.php - Dynamic Instructors Page
require_once 'includes/config.php';
require_once 'includes/site-data.php';

// Get all active instructors
$instructors = $pdo->query("
    SELECT u.*, 
           COUNT(DISTINCT c.id) as course_count,
           COUNT(DISTINCT e.user_id) as student_count,
           COALESCE(AVG(r.rating), 0) as avg_rating,
           COUNT(DISTINCT r.id) as review_count
    FROM users u
    LEFT JOIN courses c ON u.id = c.instructor_id AND c.status = 'published'
    LEFT JOIN enrollments e ON c.id = e.course_id AND e.payment_status = 'completed'
    LEFT JOIN reviews r ON c.id = r.course_id
    WHERE u.role = 'instructor' 
    AND u.status != 'suspended'
    AND u.show_on_website = 1
    GROUP BY u.id
    ORDER BY student_count DESC
")->fetchAll();
?>
<!DOCTYPE html>
<html lang="bn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>ইন্সট্রাক্টর - <?= htmlspecialchars($S['site_title'] ?? 'বাংলা LMS') ?></title>
    <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">
    <link href="https://unpkg.com/aos@2.3.1/dist/aos.css" rel="stylesheet">
    <style>
        :root { --primary: <?= $S['primary_color'] ?? '#6C5CE7' ?>; --g1: linear-gradient(135deg, <?= $S['primary_color'] ?? '#667eea' ?>, <?= $S['primary_color'] ?? '#764ba2' ?>dd); --g2: linear-gradient(135deg, #f093fb, #f5576c); --g3: linear-gradient(135deg, #4facfe, #00f2fe); --g4: linear-gradient(135deg, #43e97b, #38f9d7); --dark: #1a1a2e; --shadow: 0 5px 25px rgba(0,0,0,0.08); --shadow-lg: 0 20px 60px rgba(0,0,0,0.15); }
        * { margin:0; padding:0; box-sizing:border-box; }
        body { background:#f0f2f8; font-family:'Segoe UI','Hind Siliguri',Arial,sans-serif; }
        
        .navbar { background:rgba(255,255,255,0.9); backdrop-filter:blur(15px); box-shadow:0 2px 20px rgba(0,0,0,0.06); padding:14px 0; position:sticky; top:0; z-index:1000; }
        .navbar-brand { font-weight:800; font-size:1.3rem; background:var(--g1); -webkit-background-clip:text; -webkit-text-fill-color:transparent; text-decoration:none; display:flex; align-items:center; gap:8px; }
        .navbar-brand img { height:36px; }
        .nav-link { color:#555; text-decoration:none; font-weight:500; margin:0 12px; transition:0.3s; }
        .nav-link:hover, .nav-link.active { color:var(--primary); }
        .btn-login { background:var(--g1); color:white; border-radius:50px; padding:8px 20px; font-weight:600; text-decoration:none; transition:0.3s; display:inline-flex; align-items:center; gap:6px; font-size:0.9rem; }
        .btn-login:hover { transform:translateY(-2px); box-shadow:0 8px 20px rgba(108,92,231,0.3); color:white; }
        .btn-instructor { background:var(--g4); color:#0d4d2b; border-radius:50px; padding:8px 20px; font-weight:600; text-decoration:none; transition:0.3s; display:inline-flex; align-items:center; gap:6px; font-size:0.9rem; }
        .btn-instructor:hover { transform:translateY(-2px); box-shadow:0 8px 20px rgba(67,233,123,0.3); color:#0d4d2b; }
        
        .hero { background:var(--g1); color:white; padding:60px 0 80px; text-align:center; position:relative; overflow:hidden; }
        .hero::after { content:''; position:absolute; bottom:-28px; left:50%; transform:translateX(-50%); width:56px; height:56px; background:#f0f2f8; border-radius:50%; }
        .hero h1 { font-size:2.5rem; font-weight:800; }
        
        .container { max-width:1100px; margin:0 auto; padding:30px 20px; }
        
        .instructor-card { background:white; border-radius:20px; overflow:hidden; box-shadow:var(--shadow); transition:all 0.4s; text-align:center; }
        .instructor-card:hover { transform:translateY(-12px); box-shadow:var(--shadow-lg); }
        .card-top { padding:30px 20px; position:relative; }
        .avatar { width:100px; height:100px; border-radius:50%; object-fit:cover; border:4px solid var(--primary); margin-bottom:12px; transition:0.4s; }
        .instructor-card:hover .avatar { transform:scale(1.08); border-color:#f5576c; }
        .online-dot { position:absolute; bottom:50px; right:calc(50% - 60px); width:16px; height:16px; background:#28a745; border-radius:50%; border:3px solid white; }
        .name { font-weight:700; font-size:1.1rem; color:var(--dark); }
        .designation { color:var(--primary); font-weight:600; font-size:0.85rem; }
        .stats-row { display:flex; justify-content:space-around; padding:15px; border-top:1px solid #f0f0f0; }
        .stat-val { font-weight:800; font-size:1.2rem; color:var(--primary); }
        .stat-lbl { font-size:0.7rem; color:#888; }
        .card-bottom { padding:15px 20px 20px; }
        .btn-profile { background:var(--g1); color:white; border-radius:50px; padding:8px 20px; font-weight:600; text-decoration:none; display:inline-block; transition:0.3s; font-size:0.85rem; }
        .btn-profile:hover { transform:translateY(-2px); box-shadow:0 8px 20px rgba(108,92,231,0.3); color:white; }
        
        .counter-section { background:white; border-radius:16px; padding:30px; margin-bottom:30px; box-shadow:var(--shadow); display:flex; justify-content:space-around; flex-wrap:wrap; gap:15px; }
        .counter-item { text-align:center; }
        .counter-val { font-size:2rem; font-weight:800; color:var(--primary); }
        .counter-lbl { color:#888; font-size:0.85rem; }
        
        footer { background:var(--dark); color:white; text-align:center; padding:25px; margin-top:50px; }
        
        @media (max-width:768px) { .hero h1 { font-size:1.8rem; } }
    </style>
</head>
<body>

<nav class="navbar">
    <div class="container" style="display:flex;justify-content:space-between;align-items:center;">
        <a href="index.php" class="navbar-brand">
            <?php if(($S['use_image_logo']??'0')=='1' && !empty($S['logo_image']) && file_exists('uploads/logo/'.$S['logo_image'])): ?>
                <img src="uploads/logo/<?=$S['logo_image']?>" alt="<?=htmlspecialchars($S['site_title']??'LMS')?>">
            <?php else: ?>
                <i class="fas <?=$S['logo_icon']??'fa-graduation-cap'?> me-2"></i><?=htmlspecialchars($S['logo_text']??'বাংলা LMS')?>
            <?php endif; ?>
        </a>
        <div style="display:flex;gap:12px;align-items:center;flex-wrap:wrap;">
            <a href="index.php" class="nav-link">হোম</a>
            <a href="courses.php" class="nav-link">কোর্স</a>
            <a href="packages.php" class="nav-link">প্যাকেজ</a>
            <a href="instructors.php" class="nav-link active">ইন্সট্রাক্টর</a>
            <a href="about.php" class="nav-link">আমাদের সম্পর্কে</a>
            <a href="contact.php" class="nav-link">যোগাযোগ</a>
            
            <?php if(isLoggedIn()): ?>
                <?php if(($_SESSION['user_role']??'')=='instructor' || ($_SESSION['user_role']??'')=='admin'): ?>
                    <a href="admin/dashboard.php" class="btn-instructor"><i class="fas fa-tachometer-alt"></i> ড্যাশবোর্ড</a>
                <?php else: ?>
                    <a href="dashboard.php" class="btn-login"><i class="fas fa-user"></i> ড্যাশবোর্ড</a>
                <?php endif; ?>
            <?php else: ?>
                <a href="auth.php" class="btn-login"><i class="fas fa-sign-in-alt"></i> লগইন</a>
                <a href="auth.php?mode=register" class="btn-instructor"><i class="fas fa-chalkboard-teacher"></i> ইন্সট্রাক্টর হিসেবে যোগ দিন</a>
            <?php endif; ?>
        </div>
    </div>
</nav>

<section class="hero">
    <h1>👨‍🏫 আমাদের ইন্সট্রাক্টরবৃন্দ</h1>
    <p>অভিজ্ঞ ও দক্ষ ইন্সট্রাক্টরদের কাছ থেকে শিখুন</p>
</section>

<div class="container">
    
    <!-- Counter -->
    <div class="counter-section" data-aos="fade-up">
        <div class="counter-item"><div class="counter-val"><?=count($instructors)?>+</div><div class="counter-lbl">ইন্সট্রাক্টর</div></div>
        <div class="counter-item"><div class="counter-val"><?=array_sum(array_column($instructors,'course_count'))?>+</div><div class="counter-lbl">কোর্স</div></div>
        <div class="counter-item"><div class="counter-val"><?=number_format(array_sum(array_column($instructors,'student_count')))?>+</div><div class="counter-lbl">শিক্ষার্থী</div></div>
        <div class="counter-item"><div class="counter-val"><?=array_sum(array_column($instructors,'review_count'))?>+</div><div class="counter-lbl">রিভিউ</div></div>
    </div>
    
    <!-- Instructor Grid -->
    <div class="row g-4">
        <?php if(count($instructors) > 0): ?>
            <?php foreach($instructors as $ins): ?>
                <div class="col-md-6 col-lg-4" data-aos="fade-up">
                    <div class="instructor-card">
                        <div class="card-top">
                            <div class="position-relative d-inline-block">
                                <img src="uploads/avatars/<?=$ins['avatar']?:'default-avatar.png'?>" class="avatar" alt="<?=htmlspecialchars($ins['full_name'])?>" onerror="this.src='https://ui-avatars.com/api/?name=<?=urlencode($ins['full_name'])?>&background=<?=str_replace('#','',$S['primary_color']??'6C5CE7')?>&color=fff&size=100'">
                                <span class="online-dot"></span>
                            </div>
                            <h5 class="name"><?=htmlspecialchars($ins['full_name'])?></h5>
                            <p class="designation"><?=htmlspecialchars($ins['designation']??'ইন্সট্রাক্টর')?></p>
                            <?php if($ins['avg_rating']>0): ?><small class="text-warning">⭐<?=round($ins['avg_rating'],1)?> (<?=$ins['review_count']?>)</small><?php endif; ?>
                        </div>
                        <div class="stats-row">
                            <div><div class="stat-val"><?=$ins['course_count']?></div><div class="stat-lbl">কোর্স</div></div>
                            <div><div class="stat-val"><?=number_format($ins['student_count'])?></div><div class="stat-lbl">শিক্ষার্থী</div></div>
                            <div><div class="stat-val"><?=$ins['review_count']?></div><div class="stat-lbl">রিভিউ</div></div>
                        </div>
                        <div class="card-bottom">
                            <a href="instructor-profile.php?id=<?=$ins['id']?>" class="btn-profile"><i class="fas fa-user me-1"></i> প্রোফাইল দেখুন</a>
                        </div>
                    </div>
                </div>
            <?php endforeach; ?>
        <?php else: ?>
            <div class="col-12 text-center py-5 text-muted"><i class="fas fa-users fa-3x mb-3" style="opacity:0.3;"></i><h5>কোন ইন্সট্রাক্টর নেই</h5></div>
        <?php endif; ?>
    </div>
    
    <!-- Become Instructor CTA -->
    <?php if(!isLoggedIn() || ($_SESSION['user_role']??'')=='student'): ?>
        <div class="text-center mt-5 p-5 rounded-4" style="background:var(--g1);color:white;" data-aos="zoom-in">
            <h3>👨‍🏫 আপনি কি ইন্সট্রাক্টর হতে চান?</h3>
            <p>আমাদের সাথে যোগ দিন এবং আপনার জ্ঞান শেয়ার করুন</p>
            <a href="auth.php?mode=register" class="btn btn-light btn-lg rounded-pill px-4 mt-2" style="color:var(--primary);font-weight:700;">
                <i class="fas fa-chalkboard-teacher me-2"></i>ইন্সট্রাক্টর হিসেবে যোগ দিন
            </a>
        </div>
    <?php endif; ?>
</div>

<footer>
    <p>&copy; <?=date('Y')?> <?=htmlspecialchars($S['footer_text']??'বাংলা LMS | সর্বস্বত্ব সংরক্ষিত')?></p>
</footer>

<script src="https://unpkg.com/aos@2.3.1/dist/aos.js"></script>
<script>AOS.init({duration:700,once:true});</script>
</body>
</html>