{{--
    Single exam card row. Shared by every section on the My Exams page so
    all rows render with the same shape regardless of bucket.

    Props:
      $app      Application (approved, with post + post.quotas eager-loaded)
      $attempt  ?ExamAttempt — latest attempt for this application, or null
      $tone     CSS modifier class for the left-border accent: is-live |
                is-upnext | is-soon | is-done | '' (no accent)
--}}
@php
    $post     = $app->post;
    $when     = $post?->exam_login_enabled_at;
    $isDone   = $attempt && ($attempt->isCompleted() || $attempt->status === 'in_review');
    $inProg   = $attempt && $attempt->isInProgress();
    $isLive   = !$isDone && !$inProg && $post && $post->exam_login_enabled && $when && $when->lte(now());
    $isUpnext = !$isDone && !$inProg && !$isLive && $when && $when->gt(now());

    // Render countdown intensity — anything within 2 hours is "soon".
    $isSoon = $isUpnext && $when->diffInHours(now()) <= 2;
@endphp

<div class="exam-card {{ $tone }}">
    <div>
        <div class="exam-card-code">{{ $post?->code ?? '—' }} · {{ $post?->bps ?? '' }}</div>
        <div class="exam-card-title">{{ $post?->title ?? 'Post unavailable' }}</div>
        <div class="exam-card-meta">
            <span class="exam-card-meta-stat">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 11H5l-2 9h12l-2-9h-4M12 4a4 4 0 010 8 4 4 0 010-8z"/></svg>
                Roll: <strong>{{ $app->roll_number ?? '—' }}</strong>
            </span>
            @if($when)
                <span class="exam-card-meta-stat">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="4" width="18" height="18" rx="2"/><path d="M16 2v4M8 2v4M3 10h18"/></svg>
                    Exam: <strong>{{ $when->format('d M Y, h:i A') }}</strong>
                </span>
            @else
                <span class="exam-card-meta-stat" style="color:var(--text-tertiary);">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"/><path d="M12 8v4M12 16h.01"/></svg>
                    Date not announced yet
                </span>
            @endif
            @if($isDone && $attempt)
                <span class="exam-card-meta-stat">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M20 6L9 17l-5-5"/></svg>
                    Completed
                </span>
            @elseif($inProg)
                <span class="exam-card-meta-stat" style="color:var(--success-700);">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M5 3l14 9-14 9V3z"/></svg>
                    In progress — sign back in to resume
                </span>
            @endif
        </div>
    </div>

    <div class="exam-card-cta">
        @if($isUpnext)
            <span class="exam-countdown {{ $isSoon ? 'is-soon' : '' }}">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" width="11" height="11"><circle cx="12" cy="12" r="10"/><path d="M12 6v6l4 2"/></svg>
                Starts in {{ $when->diffForHumans(['parts' => 2, 'short' => true, 'syntax' => \Carbon\CarbonInterface::DIFF_ABSOLUTE]) }}
            </span>
            @if($app->roll_number)
                <a href="{{ route('candidate.applications.roll-slip', $app) }}" class="btn btn-secondary btn-sm" target="_blank">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="13" height="13"><path d="M14 2H6a2 2 0 00-2 2v16a2 2 0 002 2h12a2 2 0 002-2V8z"/><path d="M14 2v6h6"/></svg>
                    View roll slip
                </a>
            @endif
        @elseif($isLive)
            <a href="{{ url('/exam-portal/login') }}" class="btn btn-primary btn-sm" target="_blank">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" width="13" height="13"><path d="M5 3l14 9-14 9V3z"/></svg>
                Go to exam portal
            </a>
            <span class="exam-card-cta-meta">Use roll {{ $app->roll_number }} + exam password</span>
        @elseif($inProg)
            <a href="{{ url('/exam-portal/login') }}" class="btn btn-primary btn-sm" target="_blank">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" width="13" height="13"><path d="M5 3l14 9-14 9V3z"/></svg>
                Resume exam
            </a>
        @elseif($isDone && $attempt)
            <a href="{{ route('candidate.applications.show', $app) }}" class="btn btn-secondary btn-sm">
                <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" width="13" height="13"><path d="M1 12s4-8 11-8 11 8 11 8-4 8-11 8-11-8-11-8z"/><circle cx="12" cy="12" r="3"/></svg>
                View result
            </a>
        @else
            <span class="status-pill s-neutral">Awaiting schedule</span>
            @if($app->roll_number)
                <a href="{{ route('candidate.applications.roll-slip', $app) }}" class="btn btn-secondary btn-sm" target="_blank">
                    View roll slip
                </a>
            @endif
        @endif
    </div>
</div>