@extends('public.layout.app')
@section('title', __('front.teacher_dashboard'))

@section('body')
<section class="pt-5" style="background-color: #f5f7fc;">
    <div class="container">

        {{-- ========== TOP BAR WITH LOGO & LOGOUT ========== --}}
        <div class="d-flex justify-content-between align-items-center mb-4">
            {{-- Logo / Brand --}}
            <div class="d-flex align-items-center">
                <div class="bg-primary bg-opacity-10 rounded-3 p-2 me-3">
                    <i class="fas fa-chalkboard-teacher fa-2x text-primary"></i>
                </div>
                <div>
                    <h4 class="fw-bold mb-0">{{ __('front.teacher_portal') }}</h4>
                    <span class="text-muted2 small">{{ __('front.dashboard') }}</span>
                </div>
            </div>
            {{-- Logout button --}}
            <form method="POST" action="{{ route('logout') }}" class="m-0">
                @csrf
                <button type="submit" class="btn btn-outline-danger btn-rounded px-4">
                    <i class="fas fa-sign-out-alt me-2"></i> {{ __('front.logout') }}
                </button>
            </form>
        </div>

        {{-- Teacher Navigation (your existing partial) --}}
        @include('public.portals.teacher.partials.nav')

        {{-- Welcome Card --}}
        <div class="card-soft p-4 p-lg-5 shadow-soft mb-4">
            <div class="d-flex flex-wrap align-items-center justify-content-between gap-2">
                <div>
                    <h4 class="fw-bold mb-1">Welcome back, {{ auth()->user()->name ?? 'Teacher' }}!</h4>
                    <div class="text-muted2">{{ __('front.manage_your_courses_students_quizzes_and_submissions_fr') }}</div>
                </div>
                <div class="d-flex gap-2">
                    <a href="{{ route('teacher.courses.index') }}" class="btn btn-primary btn-rounded btn-sm">
                        <i class="fas fa-book-open me-1"></i> {{ __('front.my_courses') }}
                    </a>
                    <a href="{{ route('teacher.quizzes.index') }}" class="btn btn-outline-primary btn-rounded btn-sm">
                        <i class="fas fa-clipboard-list me-1"></i> {{ __('front.quizzes') }}
                    </a>
                </div>
            </div>
        </div>

        {{-- Stats Cards (MDB style, preserving your colors) --}}
        <div class="row g-4 mb-4">
            <div class="col-md-3">
                <div class="card-soft p-3 shadow-soft h-100 d-flex align-items-center">
                    <div class="bg-primary bg-opacity-10 rounded-circle p-3 me-3">
                        <i class="fas fa-book-open text-primary fa-2x"></i>
                    </div>
                    <div class="flex-grow-1">
                        <div class="text-muted2 small">{{ __('front.my_courses') }}</div>
                        <div class="fw-bold fs-3">{{ $stats['courses'] ?? 0 }}</div>
                    </div>
                </div>
            </div>
            <div class="col-md-3">
                <div class="card-soft p-3 shadow-soft h-100 d-flex align-items-center">
                    <div class="bg-success bg-opacity-10 rounded-circle p-3 me-3">
                        <i class="fas fa-user-graduate text-success fa-2x"></i>
                    </div>
                    <div class="flex-grow-1">
                        <div class="text-muted2 small">{{ __('front.students') }}</div>
                        <div class="fw-bold fs-3">{{ $stats['students'] ?? 0 }}</div>
                    </div>
                </div>
            </div>
            <div class="col-md-3">
                <div class="card-soft p-3 shadow-soft h-100 d-flex align-items-center">
                    <div class="bg-warning bg-opacity-10 rounded-circle p-3 me-3">
                        <i class="fas fa-clipboard-list text-warning fa-2x"></i>
                    </div>
                    <div class="flex-grow-1">
                        <div class="text-muted2 small">{{ __('front.quizzes') }}</div>
                        <div class="fw-bold fs-3">{{ $stats['quizzes'] ?? 0 }}</div>
                    </div>
                </div>
            </div>
            <div class="col-md-3">
                <div class="card-soft p-3 shadow-soft h-100 d-flex align-items-center">
                    <div class="bg-info bg-opacity-10 rounded-circle p-3 me-3">
                        <i class="fas fa-upload text-info fa-2x"></i>
                    </div>
                    <div class="flex-grow-1">
                        <div class="text-muted2 small">{{ __('front.submissions') }}</div>
                        <div class="fw-bold fs-3">{{ $stats['submissions'] ?? 0 }}</div>
                    </div>
                </div>
            </div>
        </div>

        {{-- Main Content Grid --}}
        <div class="row g-4">
            {{-- My Courses --}}
            <div class="col-lg-6">
                <div class="card-soft p-4 shadow-soft h-100">
                    <div class="d-flex justify-content-between align-items-center mb-3">
                        <h5 class="fw-bold mb-0">
                            <i class="fas fa-book-open text-primary me-2"></i> {{ __('front.my_courses') }}
                        </h5>
                        <a href="{{ route('teacher.courses.index') }}" class="btn btn-link btn-sm text-primary p-0">
                            {{ __('front.view_all') }} <i class="fas fa-arrow-right ms-1"></i>
                        </a>
                    </div>

                    @if(($myCourses ?? collect())->count() == 0)
                        <div class="text-center py-4">
                            <i class="fas fa-books fa-3x text-muted mb-3 opacity-50"></i>
                            <p class="text-muted2 mb-0">{{ __('front.you_haven_t_created_any_courses_yet') }}</p>
                        </div>
                    @else
                        <div class="list-group list-group-flush">
                            @foreach($myCourses as $c)
                                <a href="{{ route('teacher.courses.show', $c->id) }}"
                                   class="list-group-item list-group-item-action d-flex justify-content-between align-items-center border-0 px-0">
                                    <div>
                                        <div class="fw-semibold">{{ $c->title }}</div>
                                        <div class="text-muted2 small">
                                            <i class="fas fa-code me-1"></i> {{ $c->code ?? '—' }} •
                                            <i class="fas fa-clock me-1"></i> {{ $c->credit_hours ?? '—' }} Credits
                                        </div>
                                    </div>
                                    <span class="badge bg-primary rounded-pill">#{{ $c->id }}</span>
                                </a>
                            @endforeach
                        </div>
                    @endif
                </div>
            </div>

            {{-- Recent Students --}}
            <div class="col-lg-6">
                <div class="card-soft p-4 shadow-soft h-100">
                    <div class="d-flex justify-content-between align-items-center mb-3">
                        <h5 class="fw-bold mb-0">
                            <i class="fas fa-users text-success me-2"></i> {{ __('front.recent_students') }}
                        </h5>
                    </div>

                    @if(($recentEnrollments ?? collect())->count() == 0)
                        <div class="text-center py-4">
                            <i class="fas fa-user-plus fa-3x text-muted mb-3 opacity-50"></i>
                            <p class="text-muted2 mb-0">{{ __('front.no_students_have_enrolled_yet') }}</p>
                        </div>
                    @else
                        <div class="list-group list-group-flush">
                            @foreach($recentEnrollments as $s)
                                <div class="list-group-item border-0 px-0">
                                    <div class="d-flex align-items-center">
                                        <div class="avatar-circle bg-secondary bg-opacity-10 rounded-circle d-flex align-items-center justify-content-center me-3"
                                             style="width: 40px; height: 40px;">
                                            <span class="fw-semibold">{{ substr($s->name, 0, 1) }}</span>
                                        </div>
                                        <div>
                                            <div class="fw-semibold">{{ $s->name }}</div>
                                            <div class="text-muted2 small">{{ $s->email }}</div>
                                        </div>
                                    </div>
                                </div>
                            @endforeach
                        </div>
                    @endif
                </div>
            </div>

            {{-- Recent Quizzes --}}
            <div class="col-lg-6">
                <div class="card-soft p-4 shadow-soft h-100">
                    <div class="d-flex justify-content-between align-items-center mb-3">
                        <h5 class="fw-bold mb-0">
                            <i class="fas fa-clipboard-list text-warning me-2"></i> {{ __('front.recent_quizzes') }}
                        </h5>
                        <a href="{{ route('teacher.quizzes.index') }}" class="btn btn-link btn-sm text-primary p-0">
                            {{ __('front.view_all') }} <i class="fas fa-arrow-right ms-1"></i>
                        </a>
                    </div>

                    @if(($recentQuizzes ?? collect())->count() == 0)
                        <div class="text-center py-4">
                            <i class="fas fa-clipboard fa-3x text-muted mb-3 opacity-50"></i>
                            <p class="text-muted2 mb-0">{{ __('front.you_haven_t_created_any_quizzes_yet') }}</p>
                        </div>
                    @else
                        <div class="list-group list-group-flush">
                            @foreach($recentQuizzes as $q)
                                <a href="{{ route('teacher.quizzes.show', $q->id) }}"
                                   class="list-group-item list-group-item-action d-flex justify-content-between align-items-center border-0 px-0">
                                    <div>
                                        <div class="fw-semibold">{{ $q->title ?? 'Quiz' }}</div>
                                        <div class="text-muted2 small">
                                            <i class="fas fa-book me-1"></i> {{ __('front.course') }}#{{ $q->course_id ?? '—' }}
                                        </div>
                                    </div>
                                    <span class="badge bg-dark rounded-pill">#{{ $q->id }}</span>
                                </a>
                            @endforeach
                        </div>
                    @endif
                </div>
            </div>

            {{-- Recent Submissions --}}
            <div class="col-lg-6">
                <div class="card-soft p-4 shadow-soft h-100">
                    <div class="d-flex justify-content-between align-items-center mb-3">
                        <h5 class="fw-bold mb-0">
                            <i class="fas fa-paper-plane text-info me-2"></i> {{ __('front.recent_submissions') }}
                        </h5>
                        <a href="" class="btn btn-link btn-sm text-primary p-0">
                            {{ __('front.view_all') }} <i class="fas fa-arrow-right ms-1"></i>
                        </a>
                    </div>

                    @if(($recentSubmissions ?? collect())->count() == 0)
                        <div class="text-center py-4">
                            <i class="fas fa-inbox fa-3x text-muted mb-3 opacity-50"></i>
                            <p class="text-muted2 mb-0">{{ __('front.no_recent_submissions') }}</p>
                        </div>
                    @else
                        <div class="list-group list-group-flush">
                            @foreach($recentSubmissions as $r)
                                <div class="list-group-item border-0 px-0 d-flex justify-content-between align-items-center">
                                    <div>
                                        <div class="fw-semibold">{{ $r->quiz_title ?? ('Quiz #'.$r->quiz_id) }}</div>
                                        <div class="text-muted2 small">
                                            <i class="fas fa-user me-1"></i> {{ $r->student_name ?? ('Student #'.$r->student_user_id) }}
                                        </div>
                                    </div>
                                    @if(isset($r->score))
                                        <span class="badge bg-success rounded-pill px-3 py-2">
                                            <i class="fas fa-check me-1"></i> {{ (int)$r->score }}
                                        </span>
                                    @else
                                        <span class="badge bg-secondary rounded-pill px-3 py-2">
                                            <i class="fas fa-clock me-1"></i> {{ __('front.pending') }}
                                        </span>
                                    @endif
                                </div>
                            @endforeach
                        </div>
                    @endif
                </div>
            </div>
        </div>

    </div>
</section>

<style>
    /* Small helper for avatar circles */
    .avatar-circle {
        width: 40px;
        height: 40px;
        font-size: 16px;
        font-weight: 600;
        display: flex;
        align-items: center;
        justify-content: center;
    }
</style>
@endsection