@extends('layouts.app')

@section('content')
<div class="page-header">
    <div>
        <h1 class="page-title">Attempts for "{{ $training->title }}"</h1>
        <p class="page-subtitle">Inspect user-wise pitch attempts, trigger AI reviews, and assign final grades.</p>
    </div>
    <a href="{{ route('trainings.index') }}" class="btn btn-secondary">Back to Trainings</a>
</div>

<div class="grid grid-cols-1" style="gap: 20px;">
    @forelse($training->assignments as $assignment)
        @php 
            $user = $assignment->user;
            $attempts = $userAttempts->get($user->id, collect());
            $gradedAttempt = $attempts->whereNotNull('grade')->first();
        @endphp

        <div class="card">
            <div style="display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--border); padding-bottom: 14px; margin-bottom: 16px; flex-wrap: wrap; gap: 10px;">
                <div>
                    <h3 style="font-size: 18px; font-weight: 700; color: var(--white);">{{ $user->name }}</h3>
                    <div style="font-size: 13px; color: var(--text-dim);">{{ $user->email }}</div>
                </div>

                <div>
                    @if($gradedAttempt)
                        <span class="badge-role" style="background: rgba(16,185,129,0.2); color: var(--green); border: 1px solid rgba(16,185,129,0.4); font-size: 13px; padding: 4px 10px;">
                            Final Grade: {{ $gradedAttempt->grade }}
                        </span>
                    @else
                        <span class="badge-role" style="background: rgba(245,158,11,0.15); color: var(--amber); font-size: 12px;">
                            Pending Final Grade
                        </span>
                    @endif
                </div>
            </div>

            <h4 style="font-size: 14px; font-weight: 700; color: var(--text-dim); margin-bottom: 12px; text-transform: uppercase; letter-spacing: 0.05em;">
                Submitted Attempts ({{ $attempts->count() }})
            </h4>

            @if($attempts->count() > 0)
                <div class="table-container">
                    <table class="table">
                        <thead>
                            <tr>
                                <th>Attempt #</th>
                                <th>Submitted At</th>
                                <th>Duration</th>
                                <th>Score</th>
                                <th>AI Review Status</th>
                                <th>Assigned Grade</th>
                                <th>Actions</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($attempts as $index => $attempt)
                                <tr>
                                    <td class="mono font-bold">Attempt #{{ $attempts->count() - $index }}</td>
                                    <td style="font-size: 13px;">{{ $attempt->created_at->format('M d, Y h:i A') }} ({{ $attempt->created_at->diffForHumans() }})</td>
                                    <td class="mono">{{ round($attempt->duration_sec) }}s</td>
                                    <td>
                                        <span class="mono font-bold text-accent" style="font-size: 15px;">
                                            {{ $attempt->overall_score ?: 'N/A' }}/100
                                        </span>
                                    </td>
                                    <td>
                                        @if($attempt->llm_report)
                                            <span class="text-green font-semibold" style="font-size: 12px;">AI Generated</span>
                                        @else
                                            <span class="text-dim" style="font-size: 12px;">Not Generated</span>
                                        @endif
                                    </td>
                                    <td>
                                        @if($attempt->grade)
                                            <span class="mono font-bold text-green" style="font-size: 14px;">{{ $attempt->grade }}</span>
                                        @else
                                            <span class="text-dim" style="font-size: 12px;">Ungraded</span>
                                        @endif
                                    </td>
                                    <td>
                                        <a href="{{ route('attempt.show', $attempt) }}" class="btn btn-primary btn-sm">
                                            Select & Review Attempt
                                        </a>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            @else
                <p style="font-size: 13px; color: var(--text-dim); font-style: italic;">No pitch attempts submitted by this user yet.</p>
            @endif
        </div>
    @empty
        <div class="card" style="text-align: center; padding: 40px;">
            <p style="color: var(--text-dim);">No sales representatives assigned to this training scenario.</p>
        </div>
    @endforelse
</div>
@endsection