{% extends "public/base.html" %}
{% block title %}Students | {{ profile.name if profile }}{% endblock %}

{% block content %}
<div class="page-header">
    <div class="breadcrumb"><a href="/">Home</a> / {{ profile.students_header or 'Students Supervised' }}</div>
    <h1 class="page-title">{{ profile.students_header or 'Students Supervised' }}</h1>
    <p class="page-subtitle">{{ profile.students_subheader or 'PhD Scholars and MTech Students' }}</p>
</div>

<!-- Stats Overview -->
<section class="mb-16">
    <div class="grid md:grid-cols-4 gap-4">
        <div class="terminal-box p-6 text-center border-cyan">
            <p class="text-4xl font-bold text-cyan">{{ stats.phd_total }}</p>
            <p class="text-white/40 text-xs mt-2">{{ profile.students_stat1_label or 'Total PhD' }}</p>
        </div>
        <div class="terminal-box p-6 text-center border-pink">
            <p class="text-4xl font-bold text-pink">{{ stats.phd_completed }}</p>
            <p class="text-white/40 text-xs mt-2">{{ profile.students_stat2_label or 'PhD Completed' }}</p>
        </div>
        <div class="terminal-box p-6 text-center border-amber">
            <p class="text-4xl font-bold text-amber">{{ stats.phd_ongoing }}</p>
            <p class="text-white/40 text-xs mt-2">{{ profile.students_stat3_label or 'PhD Ongoing' }}</p>
        </div>
        <div class="terminal-box p-6 text-center">
            <p class="text-4xl font-bold text-white">{{ stats.mtech_total }}+</p>
            <p class="text-white/40 text-xs mt-2">{{ profile.students_stat4_label or 'MTech Supervised' }}</p>
        </div>
    </div>
</section>

<!-- PhD Students -->
{% if phd_students %}
<section class="mb-16">
    <div class="flex items-center gap-4 mb-8">
        <div class="h-px flex-1 bg-gradient-to-r from-transparent to-cyan/50"></div>
        <h2 class="text-xl font-bold text-white tracking-tighter uppercase">{{ profile.students_phd_title or
            'PhD_Scholars' }}</h2>
    </div>
    <div class="terminal-box overflow-x-auto">
        <table class="data-table">
            <thead>
                <tr>
                    <th>No.</th>
                    <th>Student Name</th>
                    <th>Thesis Title</th>
                    <th>Status</th>
                    <th>Category</th>
                    <th>Single/Joint</th>
                </tr>
            </thead>
            <tbody>
                {% for student in phd_students %}
                <tr>
                    <td class="text-white/40">{{ loop.index }}</td>
                    <td class="text-white text-sm">{{ student.name }}</td>
                    <td class="text-white/60 text-sm">{{ student.thesis_title or '-' }}</td>
                    <td
                        class="{% if student.status == 'Completed' %}status-completed{% elif student.status == 'Ongoing' %}status-ongoing{% else %}status-submitted{% endif %}">
                        {{ student.status }}</td>
                    <td class="text-white/50 text-xs">{{ student.category or '-' }}</td>
                    <td class="text-{% if student.supervision == 'Single' %}cyan{% else %}pink{% endif %}">{{
                        student.supervision or '-' }}</td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
</section>
{% endif %}

<!-- MTech Students -->
{% if mtech_students %}
<section class="mb-16">
    <div class="flex items-center gap-4 mb-8">
        <div class="h-px flex-1 bg-gradient-to-r from-transparent to-amber/50"></div>
        <h2 class="text-xl font-bold text-white tracking-tighter uppercase">{{ profile.students_mtech_title or
            'MTech_Students' }}</h2>
    </div>
    <div class="terminal-box overflow-x-auto">
        <table class="data-table">
            <thead>
                <tr>
                    <th>No.</th>
                    <th>Student Name</th>
                    <th>Thesis Title</th>
                    <th>Status</th>
                </tr>
            </thead>
            <tbody>
                {% for student in mtech_students %}
                <tr>
                    <td class="text-white/40">{{ loop.index }}</td>
                    <td class="text-white text-sm">{{ student.name }}</td>
                    <td class="text-white/60 text-sm">{{ student.thesis_title or '-' }}</td>
                    <td
                        class="{% if student.status == 'Completed' %}status-completed{% elif student.status == 'Ongoing' %}status-ongoing{% else %}status-submitted{% endif %}">
                        {{ student.status }}</td>
                </tr>
                {% endfor %}
            </tbody>
        </table>
    </div>
</section>
{% endif %}
{% endblock %}