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

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

        @include('public.portals.teacher.partials.nav')

        {{-- Header --}}
        <div class="d-flex justify-content-between align-items-center mb-4">
            <div>
                <h4 class="fw-bold mb-1">{{ __('front.submission_details') }}</h4>
                <p class="text-muted2 mb-0">
                    <i class="fas fa-tasks me-1"></i> {{ $submission->assignment->title }}
                    <span class="mx-2">•</span>
                    <i class="fas fa-user me-1"></i> {{ $submission->student->name ?? 'Unknown' }}
                </p>
            </div>
            <div class="d-flex gap-2">
                <a href="{{ route('teacher.assignments.show', $submission->assignment_id) }}"
                   class="btn btn-outline-secondary btn-rounded">
                    <i class="fas fa-arrow-left me-2"></i> {{ __('front.back_to_assignment') }}
                </a>
                @if(!$submission->grade)
                    <a href="{{ route('teacher.submissions.grade', $submission->id) }}"
                       class="btn btn-primary btn-rounded">
                        <i class="fas fa-check-circle me-2"></i> {{ __('front.grade_submission') }}
                    </a>
                @endif
            </div>
        </div>

        <div class="row g-4">
            {{-- Left Column: Student & Submission Info --}}
            <div class="col-lg-4">
                <div class="card-soft p-4 shadow-soft">
                    <h6 class="fw-bold mb-3"><i class="fas fa-info-circle me-2"></i> {{ __('front.submission_info') }}</h6>

                    <table class="table table-borderless">
                        <tr>
                            <td class="text-muted2">{{ __('front.student') }}</td>
                            <td class="fw-semibold">{{ $submission->student->name ?? '—' }}</td>
                        </tr>
                        <tr>
                            <td class="text-muted2">{{ __('front.email_2') }}</td>
                            <td>{{ $submission->student->email ?? '—' }}</td>
                        </tr>
                        <tr>
                            <td class="text-muted2">{{ __('front.submitted_at') }}</td>
                            <td>{{ $submission->submitted_at->format('M d, Y h:i A') }}</td>
                        </tr>
                        <tr>
                            <td class="text-muted2">{{ __('front.status') }}</td>
                            <td>
                                @if($submission->grade)
                                    <span class="badge bg-success">{{ __('front.graded') }}</span>
                                @else
                                    <span class="badge bg-warning">{{ __('front.pending') }}</span>
                                @endif
                            </td>
                        </tr>
                        @if($submission->grade)
                        <tr>
                            <td class="text-muted2">{{ __('front.grade') }}</td>
                            <td><span class="badge bg-success fs-6">{{ $submission->grade }} / {{ $submission->assignment->max_grade }}</span></td>
                        </tr>
                        <tr>
                            <td class="text-muted2">{{ __('front.graded_at') }}</td>
                            <td>{{ $submission->graded_at ? $submission->graded_at->format('M d, Y h:i A') : '—' }}</td>
                        </tr>
                        @endif
                    </table>

                    @if($submission->comments)
                        <hr>
                        <h6 class="fw-bold mb-2">{{ __('front.student_s_comments') }}</h6>
                        <div class="p-3 bg-light rounded-3">
                            {{ $submission->comments }}
                        </div>
                    @endif
                </div>
            </div>

            {{-- Right Column: File Preview & Feedback --}}
            <div class="col-lg-8">
                {{-- File Preview Card --}}
                <div class="card-soft p-4 shadow-soft mb-4">
                    <div class="d-flex justify-content-between align-items-center mb-3">
                        <h6 class="fw-bold mb-0"><i class="fas fa-file-alt me-2"></i> {{ __('front.submitted_file') }}</h6>
                        <a href="{{ route('teacher.submissions.download', $submission->id) }}"
                           class="btn btn-sm btn-primary rounded-pill">
                            <i class="fas fa-download me-1"></i> {{ __('front.download') }}
                        </a>
                    </div>

                    @if($submission->file_path && Storage::disk('public')->exists($submission->file_path))
                        @php
                            $ext = strtolower(pathinfo($submission->file_path, PATHINFO_EXTENSION));
                            $isImage = in_array($ext, ['jpg', 'jpeg', 'png', 'gif', 'webp']);
                            $isPdf = $ext === 'pdf';
                        @endphp

                        @if($isImage)
                            <div class="text-center">
                                <img src="{{ Storage::url($submission->file_path) }}"
                                     alt="Submission" class="img-fluid rounded-3" style="max-height: 400px;">
                            </div>
                        @elseif($isPdf)
                            <div class="ratio ratio-16x9">
                                <iframe src="{{ Storage::url($submission->file_path) }}"
                                        style="border-radius: 0.5rem;"></iframe>
                            </div>
                        @else
                            <div class="text-center py-5 bg-light rounded-3">
                                <i class="fas fa-file fa-4x text-muted mb-3"></i>
                                <p class="mb-0">{{ __('front.preview_not_available_for_this_file_type') }}</p>
                            </div>
                        @endif
                    @else
                        <div class="text-center py-5 bg-light rounded-3">
                            <i class="fas fa-exclamation-triangle fa-3x text-warning mb-3"></i>
                            <p class="mb-0">{{ __('front.file_not_found_or_unavailable') }}</p>
                        </div>
                    @endif
                </div>

                {{-- Feedback Card (if graded) --}}
                @if($submission->feedback)
                    <div class="card-soft p-4 shadow-soft">
                        <h6 class="fw-bold mb-3"><i class="fas fa-comment me-2"></i> {{ __('front.your_feedback') }}</h6>
                        <div class="p-3 bg-light rounded-3">
                            {!! nl2br(e($submission->feedback)) !!}
                        </div>
                    </div>
                @endif
            </div>
        </div>

    </div>
</section>
@endsection