@extends('layouts.portal')

@php
    use App\Support\ExamText;
    use App\Support\Share;
    $voided = $a->status === 'voided';
    $passed = ! $voided && $a->passed;
    $verdict = $voided ? 'void' : ($passed ? 'pass' : 'fail');
    $pct = (float) $a->percent;
    $mins = intdiv((int) $a->time_spent_seconds, 60);
    $secs = (int) $a->time_spent_seconds % 60;
    $timeTaken = $a->time_spent_seconds ? ($mins >= 60 ? intdiv($mins, 60).'h '.($mins % 60).'m' : $mins.'m '.str_pad((string) $secs, 2, '0', STR_PAD_LEFT).'s') : '—';
    $domains = collect($a->domain_scores ?? [])->map(fn ($d, $k) => $d + ['name' => $k])->sortBy('percent')->values();
    $weak = $domains->filter(fn ($d) => $d['percent'] < $exam->pass_percent)->take(2);
    $used = (int) ($elig['attempts_used'] ?? $a->attempt_no);
    $left = $exam->max_attempts ? max(0, $exam->max_attempts - $used) : null;
    $events = $a->violations > 0 || $a->auto_submitted ? $a->events()->get() : collect();
    $evLabels = ['tab_hidden' => 'Switched to another tab or window', 'window_blur' => 'Exam window lost focus', 'fullscreen_exit' => 'Left full screen', 'copy' => 'Copy attempts', 'paste' => 'Paste attempts', 'context_menu' => 'Right-click attempts'];
    $evCounts = $events->whereIn('type', array_keys($evLabels))->groupBy('type')->map->count();
    $autoNote = $events->firstWhere('type', 'auto_submit')?->meta['note'] ?? null;
    if ($autoNote === 'Time expired') { $autoNote = null; }
    $cred = $passed ? $a->credential : null;
    $issuance = $cred?->badge;
    $badge = $issuance?->badge;
    $enrolled = $exam->course && $a->user && $a->user->isEnrolledInCourse($exam->course_id);
    $shC = $cred ? Share::credential($cred) : null;
    $shB = $issuance ? Share::badge($issuance) : null;
@endphp

@section('title', 'Exam result')
@section('subtitle', $exam->title.' · attempt '.$a->attempt_no.' · '.($a->submitted_at?->format('d M Y, g:i A') ?? '—'))
@section('actions')
  <a class="btn btn-secondary btn-sm" href="{{ route('student.exams') }}"><x-icon name="arrow-left" :size="15"/> My exams</a>
  @if($a->isFinished())<a class="btn btn-secondary btn-sm" href="{{ route('exams.report', $a->code) }}" target="_blank" rel="noopener"><x-icon name="download" :size="15"/> Score report (PDF)</a>@endif
@endsection

@section('content')
<section class="result-hero {{ $verdict }} rs-hero" aria-labelledby="rs-verdict">
  <div class="rs-hero-main">
    <span class="rs-eyebrow">{{ $voided ? 'Attempt voided' : ($passed ? 'Congratulations' : 'Not passed this time') }}</span>
    <h2 id="rs-verdict" class="rs-verdict">
      @if($voided)This attempt was voided
      @elseif($passed)You passed {{ $exam->title }}
      @else You did not reach the pass mark @endif
    </h2>
    <p class="rs-lead">
      @if($voided){{ $a->void_reason ?: 'An administrator voided this attempt.' }} Contact your trainer or the academy office if you believe this is a mistake.
      @elseif($passed)You scored {{ rtrim(rtrim(number_format($pct, 2), '0'), '.') }}% against a pass mark of {{ $exam->pass_percent }}%.{{ $cred ? ' Your certificate and digital badge have been issued below.' : '' }}
      @else You scored {{ rtrim(rtrim(number_format($pct, 2), '0'), '.') }}%; the pass mark is {{ $exam->pass_percent }}%.@if($weak->isNotEmpty()) Focus your revision on {{ $weak->pluck('name')->join(', ', ' and ') }}.@endif @endif
    </p>
    <div class="rs-chips">
      @if($a->status === 'expired')<span class="rs-chip"><x-icon name="timer" :size="14"/> Time ran out; saved answers were graded</span>@endif
      @if($a->auto_submitted && $a->status !== 'expired')<span class="rs-chip"><x-icon name="shield-alert" :size="14"/> Submitted automatically</span>@endif
      <span class="rs-chip"><x-icon name="clock" :size="14"/> {{ $timeTaken }} of {{ $exam->duration_minutes }} min</span>
      <span class="rs-chip"><x-icon name="refresh" :size="14"/> Attempt {{ $a->attempt_no }}{{ $exam->max_attempts ? ' of '.$exam->max_attempts : '' }}</span>
    </div>
  </div>
  @unless($voided)
  <div class="rs-score" role="img" aria-label="Score {{ round($pct) }} percent, pass mark {{ $exam->pass_percent }} percent">
    <div class="rs-ring" style="--p:{{ min(100, $pct) }}"><div><div class="score-big">{{ round($pct) }}<small>%</small></div><span>Pass mark {{ $exam->pass_percent }}%</span></div></div>
  </div>
  @endunless
</section>

@if($voided)
  <div class="callout danger mt-3"><x-icon name="shield-alert" :size="20"/><div><b>Why was this voided?</b><br>{{ $a->void_reason ?: 'The attempt did not meet the exam rules.' }} A voided attempt does not count towards your score.@if($canRetake) You may sit the exam again.@endif</div></div>
@endif

@unless($voided)
<div class="kpis mt-3">
  <div class="card kpi"><span class="ico"><x-icon name="target" :size="20"/></span><span>Score</span><b>{{ rtrim(rtrim(number_format((float) $a->score, 2), '0'), '.') }} / {{ rtrim(rtrim(number_format((float) $a->max_score, 2), '0'), '.') }}</b><small>marks earned</small></div>
  <div class="card kpi {{ $passed ? 'green' : 'red' }}"><span class="ico"><x-icon name="{{ $passed ? 'check-circle' : 'alert' }}" :size="20"/></span><span>Result</span><b>{{ $passed ? 'Passed' : 'Not passed' }}</b><small>pass mark {{ $exam->pass_percent }}%</small></div>
  <div class="card kpi violet"><span class="ico"><x-icon name="timer" :size="20"/></span><span>Time taken</span><b>{{ $timeTaken }}</b><small>of {{ $exam->duration_minutes }} minutes</small></div>
  <div class="card kpi amber"><span class="ico"><x-icon name="history" :size="20"/></span><span>Attempt</span><b>{{ $a->attempt_no }}{{ $exam->max_attempts ? ' / '.$exam->max_attempts : '' }}</b><small>{{ $left === null ? 'unlimited attempts' : $left.' left' }}</small></div>
</div>
@endunless

@if($passed)
  <section class="panel rs-cred" aria-labelledby="rs-cred-h">
    <div class="panel-head"><h2 id="rs-cred-h">Your credential</h2>@if($cred)<x-pill :status="$cred->effectiveStatus()"/>@endif</div>
    <div class="panel-body">
      @if($cred)
        <div class="rs-cred-grid">
          @if($badge)<img class="rs-badge" src="{{ $badge->imageUrl() }}" alt="{{ $badge->name }} digital badge" width="140" height="140">@endif
          <div>
            <h3 class="mb-0">{{ $cred->title }}</h3>
            <p class="muted small">{{ $badge ? $badge->name.' badge · ' : '' }}Credential ID <span class="mono">{{ $cred->credential_id }}</span> · Issued {{ $cred->issued_at?->format('d M Y') }}</p>
            <div class="row mb-2">
              <a class="btn btn-primary btn-sm" href="{{ route('credentials.certificate.pdf', $cred->credential_id) }}"><x-icon name="download" :size="15"/> Download certificate (PDF)</a>
              @if($issuance)<a class="btn btn-secondary btn-sm" href="{{ route('badges.verify', $issuance->badge_id_code) }}"><x-icon name="badge-check" :size="15"/> Open badge page</a>@endif
              <a class="btn btn-secondary btn-sm" href="{{ route('credentials.verify', $cred->credential_id) }}"><x-icon name="shield" :size="15"/> Public verification</a>
            </div>
            <p class="label mb-0">Share your achievement</p>
            <div class="share-row mt-1">
              <a class="share-btn sh-linkedin" data-share-popup @if($issuance) data-track="{{ route('badges.track', $issuance->badge_id_code) }}" @endif data-channel="linkedin_profile" href="{{ ($shB ?? $shC)['linkedin_profile'] }}" target="_blank" rel="noopener"><x-icon name="linkedin" :size="16"/> Add to LinkedIn profile</a>
              <a class="share-btn sh-linkedin" data-share-popup data-channel="linkedin" href="{{ $shC['linkedin'] }}" target="_blank" rel="noopener"><x-icon name="share" :size="16"/> Post</a>
              <a class="share-btn sh-whatsapp" data-share-popup data-channel="whatsapp" href="{{ $shC['whatsapp'] }}" target="_blank" rel="noopener"><x-icon name="whatsapp" :size="16"/> WhatsApp</a>
              <a class="share-btn sh-x" data-share-popup data-channel="x" href="{{ $shC['x'] }}" target="_blank" rel="noopener"><x-icon name="x-twitter" :size="16"/> Post on X</a>
              <button type="button" class="share-btn sh-copy" data-copy="{{ $shC['url'] }}" data-channel="link"><x-icon name="copy" :size="16"/> Copy link</button>
            </div>
          </div>
        </div>
      @else
        <div class="callout"><x-icon name="info" :size="20"/><div>Your certificate and badge are being prepared. They will appear under <a href="{{ route('student.credentials') }}">Certificates &amp; badges</a> and you will receive an email when they are ready.</div></div>
      @endif
    </div>
  </section>
@endif

@if(! $passed && ! $voided)
  <section class="panel rs-retake" aria-labelledby="rs-retake-h">
    <div class="panel-head"><h2 id="rs-retake-h">Retaking this exam</h2></div>
    <div class="panel-body">
      <div class="rs-retake-grid">
        <div>
          @if($canRetake)
            <p class="mb-2"><b>You can sit this exam again</b>{{ $left === null ? '.' : ' — '.$left.' '.\Illuminate\Support\Str::plural('attempt', $left).' left.' }} A new attempt draws a fresh set of questions with shuffled answer options.</p>
            <a class="btn btn-primary" href="{{ route('exams.show', $exam->slug) }}"><x-icon name="refresh" :size="16"/> Review rules &amp; retake</a>
          @elseif(! empty($elig['next_at']))
            <p class="mb-0"><b>Cooldown in effect.</b> You can retake this exam <time data-relative="{{ $elig['next_at']->toIso8601String() }}">{{ $elig['next_at']->diffForHumans() }}</time> ({{ $elig['next_at']->format('d M Y, g:i A') }}). Use the time to revise the domains below.</p>
          @else
            <p class="mb-0"><b>No retake available.</b> {{ $elig['reason'] ?? 'You have used all attempts for this exam.' }} Speak to your trainer if you need an extra attempt.</p>
          @endif
        </div>
        <dl class="kv">
          <dt>Attempts used</dt><dd>{{ $used }}{{ $exam->max_attempts ? ' of '.$exam->max_attempts : '' }}</dd>
          <dt>Cooldown</dt><dd>{{ $exam->cooldown_hours ? $exam->cooldown_hours.' hours between attempts' : 'None' }}</dd>
        </dl>
      </div>
    </div>
  </section>
@endif

@if($domains->isNotEmpty() && ! $voided)
  <section class="panel" aria-labelledby="rs-dom-h">
    <div class="panel-head"><h2 id="rs-dom-h">Performance by domain</h2><span class="small muted">Green marks reach the {{ $exam->pass_percent }}% pass mark</span></div>
    <div class="panel-body">
      @foreach($domains as $d)
        @php $dp = (float) $d['percent']; $tone = $dp >= $exam->pass_percent ? 'green' : ($dp >= $exam->pass_percent - 20 ? 'amber' : 'red'); @endphp
        <div class="domain-bar">
          <span><b>{{ $d['name'] }}</b><br><span class="xs muted">{{ $d['correct'] }} of {{ $d['total'] }} correct</span></span>
          <div class="progress {{ $tone }}" role="img" aria-label="{{ $d['name'] }}: {{ round($dp) }} percent"><i style="width:{{ min(100, $dp) }}%"></i></div>
          <b class="rs-dp">{{ round($dp) }}%</b>
        </div>
      @endforeach
    </div>
  </section>
@endif

@if(($evCounts->isNotEmpty() || $autoNote) && ! $voided)
  <section class="panel" aria-labelledby="rs-int-h">
    <div class="panel-head"><h2 id="rs-int-h">Integrity summary</h2>@if($a->violations)<span class="pill pill-amber">{{ $a->violations }} {{ \Illuminate\Support\Str::plural('flag', $a->violations) }}</span>@endif</div>
    <div class="panel-body">
      @if($evCounts->isNotEmpty())
        <ul class="rs-flags">@foreach($evCounts as $t => $n)<li><b>{{ $n }}×</b> {{ $evLabels[$t] }}</li>@endforeach</ul>
        <p class="small muted mb-0">These events are recorded for every proctored exam and may be reviewed by the academy before a certificate is confirmed.</p>
      @endif
      @if($autoNote)<div class="callout warn mt-2"><x-icon name="shield-alert" :size="18"/><div>{{ $autoNote }}. Answers saved before that moment were graded.</div></div>@endif
    </div>
  </section>
@endif

<section class="panel" aria-labelledby="rs-rev-h">
  <div class="panel-head">
    <h2 id="rs-rev-h">Question review</h2>
    @if($review)
      <div class="tabs rs-filter mb-0" role="group" aria-label="Filter questions" style="border:0;margin:0">
        <button type="button" class="active" data-filter="all">All ({{ count($review) }})</button>
        <button type="button" data-filter="no">Incorrect ({{ collect($review)->where('answered', true)->where('is_correct', false)->count() }})</button>
        <button type="button" data-filter="skip">Skipped ({{ collect($review)->where('answered', false)->count() }})</button>
        <button type="button" data-filter="ok">Correct ({{ collect($review)->where('is_correct', true)->count() }})</button>
      </div>
    @endif
  </div>
  @if($review)
    @foreach($review as $r)
      @php $state = ! $r['answered'] ? 'skip' : ($r['is_correct'] ? 'ok' : 'no'); @endphp
      <article class="q-review {{ $state }}" data-state="{{ $state }}">
        <div class="row between mb-1">
          <div class="row gap-1"><b>Question {{ $r['no'] }}</b>@if($r['domain'])<span class="ex-domain">{{ $r['domain'] }}</span>@endif</div>
          <span class="pill {{ ['ok' => 'pill-green', 'no' => 'pill-red', 'skip' => 'pill-gray'][$state] }}">{{ ['ok' => 'Correct', 'no' => 'Incorrect', 'skip' => 'Not answered'][$state] }}</span>
        </div>
        <div class="q-text rs-q">{{ ExamText::html($r['question']) }}</div>
        <dl class="rs-answers">
          <dt>Your answer</dt><dd class="{{ $state === 'ok' ? 'good' : ($state === 'no' ? 'bad' : 'none') }}">@if($r['given']){{ collect($r['given'])->map(fn ($t) => $t)->join(' · ') }}@else <i>No answer given</i>@endif</dd>
          @if($state !== 'ok')<dt>Correct answer</dt><dd class="good">{{ collect($r['correct'])->join(' · ') }}</dd>@endif
        </dl>
        @if($r['explanation'])<p class="rs-expl"><b>Why:</b> {{ $r['explanation'] }}</p>@endif
      </article>
    @endforeach
  @else
    <div class="panel-body">
      <div class="callout"><x-icon name="info" :size="20"/><div>
        @if($voided)Answers are not shown for voided attempts.
        @elseif($exam->show_review === 'none')The answer review is switched off for this exam. Your score and domain breakdown above show where to focus.
        @elseif($exam->show_review === 'after_pass' && ! $passed)Question-by-question answers are released only to candidates who pass this exam. Use the domain breakdown above to plan your revision, then retake when you are ready.
        @else The answer review is not available for this attempt. @endif
      </div></div>
    </div>
  @endif
</section>

<section class="panel" aria-labelledby="rs-next-h">
  <div class="panel-head"><h2 id="rs-next-h">What to do next</h2></div>
  <div class="panel-body rs-next">
    @if($enrolled && $exam->course)
      <a class="res-card" href="{{ route('lms.course', $exam->course->slug) }}"><span class="res-ico"><x-icon name="book-open" :size="20"/></span><div><b>Revise the course</b><div class="small muted">{{ $exam->course->title }}: lessons, class materials and quizzes</div></div></a>
    @endif
    @foreach($labs as $lab)
      <a class="res-card" href="{{ route('labs.show', $lab->slug) }}"><span class="res-ico"><x-icon name="flask" :size="20"/></span><div><b>{{ $lab->title }}</b><div class="small muted">Hands-on lab · {{ $lab->duration_minutes }} min · {{ ucfirst($lab->difficulty) }}</div></div></a>
    @endforeach
    @if($passed)
      <a class="res-card" href="{{ route('portfolio.mine') }}"><span class="res-ico"><x-icon name="id-card" :size="20"/></span><div><b>Add it to your portfolio</b><div class="small muted">Show employers your verified credential</div></div></a>
      <a class="res-card" href="{{ route('careers.index') }}"><span class="res-ico"><x-icon name="briefcase" :size="20"/></span><div><b>Browse open roles</b><div class="small muted">Apply with your verified certificate</div></div></a>
    @endif
    <a class="res-card" href="{{ route('student.credentials') }}"><span class="res-ico"><x-icon name="award" :size="20"/></span><div><b>Certificates &amp; badges</b><div class="small muted">Everything you have earned so far</div></div></a>
  </div>
</section>
@endsection

@if($review)
@push('scripts')
<script nonce="{{ csp_nonce() }}">
(function () {
  var bar = document.querySelector('.rs-filter'); if (!bar) return;
  bar.addEventListener('click', function (e) {
    var b = e.target.closest('[data-filter]'); if (!b) return;
    var f = b.getAttribute('data-filter');
    Array.prototype.forEach.call(bar.querySelectorAll('[data-filter]'), function (x) { x.classList.toggle('active', x === b); });
    Array.prototype.forEach.call(document.querySelectorAll('.q-review'), function (r) { r.hidden = f !== 'all' && r.getAttribute('data-state') !== f; });
  });
})();
</script>
@endpush
@endif