@extends('layouts.app')
@section('title', 'Exam Results')
@section('page-title', 'Results — ' . $exam->title)
@section('content')

<div style="display: flex; align-items: center; gap: 12px; margin-bottom: 24px; flex-wrap: wrap;">
    <a href="{{ route('tester.exams.index') }}" class="btn btn-outline btn-sm">
        <i class="bi bi-arrow-left"></i> Back
    </a>
    <a href="{{ route('tester.exams.registrations', $exam) }}" class="btn btn-outline btn-sm">
        <i class="bi bi-people"></i> Candidates
    </a>
    <div style="margin-left: auto;">
        <a href="{{ route('tester.exams.export', $exam) }}" class="btn btn-success">
            <i class="bi bi-file-earmark-excel"></i> Export to Excel &amp; Email
        </a>
    </div>
</div>

{{-- Stats --}}
<div class="stat-grid" style="margin-bottom: 24px;">
    <div class="stat-card accent">
        <div class="stat-icon accent"><i class="bi bi-people"></i></div>
        <div class="stat-value">{{ $stats['total'] }}</div>
        <div class="stat-label">Total Graded</div>
    </div>
    <div class="stat-card green">
        <div class="stat-icon green"><i class="bi bi-check-circle"></i></div>
        <div class="stat-value">{{ $stats['passed'] }}</div>
        <div class="stat-label">Passed</div>
    </div>
    <div class="stat-card purple">
        <div class="stat-icon purple"><i class="bi bi-bar-chart"></i></div>
        <div class="stat-value">{{ $stats['avg_pct'] }}%</div>
        <div class="stat-label">Average Score</div>
    </div>
    <div class="stat-card amber">
        <div class="stat-icon amber"><i class="bi bi-trophy"></i></div>
        <div class="stat-value">{{ round($stats['highest']) }}%</div>
        <div class="stat-label">Highest Score</div>
    </div>
</div>

{{-- Pass rate bar --}}
@if($stats['total'] > 0)
<div class="card" style="margin-bottom: 24px;">
    <div class="card-body">
        <div style="display: flex; justify-content: space-between; margin-bottom: 10px;">
            <span style="font-weight: 600;">Pass Rate</span>
            <span style="font-weight: 700; color: var(--green);">
                {{ $stats['total'] > 0 ? round(($stats['passed'] / $stats['total']) * 100) : 0 }}%
                ({{ $stats['passed'] }}/{{ $stats['total'] }})
            </span>
        </div>
        <div class="progress" style="height: 12px;">
            <div class="progress-bar" style="width: {{ $stats['total'] > 0 ? ($stats['passed'] / $stats['total']) * 100 : 0 }}%"></div>
        </div>
    </div>
</div>
@endif

{{-- Results table --}}
<div class="card">
    <div class="card-header">
        <h5>Candidate Results</h5>
        <span class="text-muted text-sm">{{ $attempts->total() }} result(s)</span>
    </div>
    <div class="table-wrapper">
        <table>
            <thead>
                <tr>
                    <th>Candidate</th>
                    <th>Attempt</th>
                    <th>Score</th>
                    <th>%</th>
                    <th>Grade</th>
                    <th>Status</th>
                    <th>Time Taken</th>
                    <th>Submitted</th>
                </tr>
            </thead>
            <tbody>
                @forelse($attempts as $att)
                <tr>
                    <td>
                        <div style="font-weight: 600;">{{ $att->candidate->name }}</div>
                        <div class="text-xs text-muted">{{ $att->candidate->email }}</div>
                    </td>
                    <td class="text-sm">#{{ $att->attempt_number }}</td>
                    <td style="font-weight: 700;">{{ $att->total_score }}/{{ $exam->total_marks }}</td>
                    <td>
                        <span style="font-weight: 700; color: {{ $att->passed ? 'var(--green)' : 'var(--red)' }};">
                            {{ round($att->percentage, 1) }}%
                        </span>
                    </td>
                    <td>
                        <span style="font-family: 'Syne', sans-serif; font-weight: 800; font-size: 1.1rem;
                            color: {{ in_array($att->grade_label, ['A+','A']) ? 'var(--green)' : (in_array($att->grade_label, ['B','C']) ? 'var(--amber)' : 'var(--red)') }};">
                            {{ $att->grade_label }}
                        </span>
                    </td>
                    <td>
                        <span class="badge {{ $att->passed ? 'badge-success' : 'badge-danger' }}">
                            {{ $att->passed ? 'PASS' : 'FAIL' }}
                        </span>
                    </td>
                    <td class="text-sm text-muted">
                        {{ $att->time_taken_seconds ? gmdate('H:i:s', $att->time_taken_seconds) : '—' }}
                    </td>
                    <td class="text-xs text-muted">
                        {{ $att->submitted_at?->format('M j, Y H:i') }}
                    </td>
                </tr>
                @empty
                <tr>
                    <td colspan="8" style="text-align: center; padding: 60px; color: var(--muted);">
                        No graded results yet.
                    </td>
                </tr>
                @endforelse
            </tbody>
        </table>
    </div>
    @if($attempts->hasPages())
    <div class="pagination-wrapper">{{ $attempts->links() }}</div>
    @endif
</div>
@endsection