{% extends 'base.html.twig' %}

{% block stylesheets %}
    {{ parent() }}
    <link href="{{ asset('student/css/student-portal.css') }}" rel="stylesheet">
{% endblock %}

{% block body %}
    <div class="student-portal">
        <nav class="sidebar">
            <div class="sidebar-header">
                <img src="{{ asset('student/images/logo.png') }}" alt="Logo" class="logo">
                <h3>Portail Étudiant</h3>
            </div>
            
            <ul class="nav flex-column">
                <li class="nav-item">
                    <a href="{{ path('app_student_dashboard') }}" class="nav-link {% if app.request.get('_route') == 'app_student_dashboard' %}active{% endif %}">
                        <i class="fas fa-home"></i> Tableau de bord
                    </a>
                </li>
                <li class="nav-item">
                    <a href="{{ path('app_student_courses') }}" class="nav-link {% if app.request.get('_route') == 'app_student_courses' %}active{% endif %}">
                        <i class="fas fa-book"></i> Mes cours
                    </a>
                </li>
                <li class="nav-item">
                    <a href="{{ path('app_student_grades') }}" class="nav-link {% if app.request.get('_route') == 'app_student_grades' %}active{% endif %}">
                        <i class="fas fa-graduation-cap"></i> Mes notes
                    </a>
                </li>
                <li class="nav-item">
                    <a href="{{ path('app_student_profile') }}" class="nav-link {% if app.request.get('_route') == 'app_student_profile' %}active{% endif %}">
                        <i class="fas fa-user"></i> Mon profil
                    </a>
                </li>
            </ul>
        </nav>

        <main class="content">
            <header class="content-header">
                <div class="user-info">
                    <span>{{ app.user.firstName }} {{ app.user.lastName }}</span>
                    <small>{{ app.user.department }} - Niveau {{ app.user.level }}</small>
                </div>
                <div class="header-actions">
                    <a href="{{ path('app_logout') }}" class="btn btn-outline-danger">
                        <i class="fas fa-sign-out-alt"></i> Déconnexion
                    </a>
                </div>
            </header>

            <div class="content-body">
                {% for label, messages in app.flashes %}
                    {% for message in messages %}
                        <div class="alert alert-{{ label }} alert-dismissible fade show">
                            {{ message }}
                            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                        </div>
                    {% endfor %}
                {% endfor %}

                {% block content %}{% endblock %}
            </div>
        </main>
    </div>
{% endblock %}

{% block javascripts %}
    {{ parent() }}
    <script src="{{ asset('student/js/student-portal.js') }}"></script>
{% endblock %}