@extends('page.user-dashboard.app')
   @push('css')
        <link rel="stylesheet" href="{{ asset('assets/css/sweetalert2.min.css') }}">
    @endpush
@section('content_dash')
    <div class="container mx-auto p-4">
        <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6">
            @if (count($courses) == 0)
      <div class="flex flex-col items-center justify-center py-6 text-center col-span-full">
    <img src="{{ asset('assets/images/no-order.png') }}" class="w-[100px] mb-3" alt="">
    
    <h3 class="text-xl font-medium text-gray-700 mb-2">
        {{ __('messages.no_exams') }}
    </h3>
    
    <p class="text-gray-500 max-w-md mx-auto mb-6">
        {{ __('messages.no_exams_desc') }}
    </p>

</div>


            @endif
            @foreach ($courses as $enrollment)
                @php
                    $course = $enrollment->course;
                    $now = \Carbon\Carbon::now();
                @endphp
  @forelse ($course->exams as $exam)
                <div
                    class="bg-white rounded-xl shadow-md overflow-hidden border border-gray-200 hover:shadow-xl transition-shadow duration-300">

                    <img src="{{ asset('assets/images/exam.jpg') }}" class="w-full h-40 object-cover">


                    <div class="p-4">
                          
                                @php
                                    $start = \Carbon\Carbon::parse($exam->start_time);
                                    $end = \Carbon\Carbon::parse($exam->end_time);
                                @endphp

                            <div class="">
    <h3 class="text-lg font-medium">{{ $exam->title }}</h3>

    @if(isset($examResults[$exam->id]))
        <p class="text-green-600 font-medium mt-2">
            You have already taken this exam. <br>
            Score: {{ $examResults[$exam->id] }} / {{ $exam->total_marks }}
        </p>
    @else
        @php
            $start = \Carbon\Carbon::parse($exam->start_time);
            $end   = \Carbon\Carbon::parse($exam->end_time);
        @endphp

        @if ($now->between($start, $end))
            <a href="{{ route('dashboard.exam.view', $exam->id) }}"
                class="btn-primary w-full block text-center !py-2 my-2">
                Start Exam
            </a>
            <p class="text-gray-600 text-sm mt-1">
                Ends at: {{ $end->format('d M, h:i A') }}
            </p>
        @elseif($now->lt($start))
            <p class="text-gray-600 text-sm mt-1">
                Exam will start at: {{ $start->format('d M, h:i A') }}
            </p>
        @else
            <p class="text-red-500 text-sm mt-2">
                Exam ended at: {{ $end->format('d M, h:i A') }}
            </p>
        @endif
    @endif
</div>

                           
                      
                    </div>
                </div>
                 @empty
                      <div class="flex flex-col items-center justify-center py-6 text-center col-span-full">
    <img src="{{ asset('assets/images/no-order.png') }}" class="w-[100px] mb-3" alt="">
    
    <h3 class="text-xl font-medium text-gray-700 mb-2">
        {{ __('messages.no_exams') }}
    </h3>
    
    <p class="text-gray-500 max-w-md mx-auto mb-6">
        {{ __('messages.no_exams_desc') }}
    </p>

</div>

                @endforelse

            @endforeach

        </div>
    </div>

    @push('js')
        <script src="{{ asset('assets/js/sweetalert2.min.js') }}"></script>
        @if (session('exam_message'))
     <script>
Swal.fire({
    title: '<strong>🎉 Exam Submitted!</strong>',
    html: `
        <div style="text-align:center; line-height:1.6;">
      
         
            <p><strong>Total Questions:</strong> {{ session('exam_total') }}</p>
            <p><span style="color:green;"><strong>Correct:</strong> {{ session('exam_score') }}</span></p>
            <p><span style="color:red;"><strong>Wrong:</strong> {{ session('exam_wrong') }}</span></p>
               <h3>শীঘ্রই ফলাফল এবং অবস্থান দেখানো হবে।</h3>
        </div>
    `,
    icon: 'success',
    confirmButtonText: 'OK',
    confirmButtonColor: '#3085d6',
    background: '#f0f9ff',
    showCloseButton: true,
});
</script>

        @endif
    @endpush
@endsection