@php

    $grade = $marksheet->grades;
    $isNumeric = is_numeric($grade);
    if ($isNumeric) {
        $score = (int)$grade;

        if ($score >= 90)       $letter = 'A';
        elseif ($score >= 80)   $letter = 'B';
        elseif ($score >= 60)   $letter = 'C';
        elseif ($score >= 40)   $letter = 'D';
        else                    $letter = 'E';

    } else {
        $letter = strtoupper($grade);
        switch ($letter) {
            case 'A': $score = 95; break;
            case 'B': $score = 85; break;
            case 'C': $score = 65; break;
            case 'D': $score = 50; break;
            default:  $score = 15; break; // E
        }
    }
    $status = $letter === 'E' ? 'fail' : 'pass';
    $color = $status === 'pass' ? 'success' : 'danger';
@endphp
<div class="modal fade" id="marksModal" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered modal-lg">
        <div class="modal-content border-0 shadow-lg">
            <div class="modal-header border-0 pb-0">
                <h5 class="modal-title fw-semibold">{{ $assessment->assessmentDetails->name }} — Marksheet</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>

            <div class="modal-body p-4">
                
                <div class="row gy-4">

                    <div class="col-md-6 border-md-end pe-md-4 border-end border-light">
                        <h6 class="text-muted fw-semibold mb-3">Assessment Details</h6>

                        <dl class="row g-2 mb-0">
                            <dt class="col-5 text-muted small">Assessment:</dt>
                            <dd class="col-7 small">{{ $assessment->assessmentDetails->name }}</dd>

                            <dt class="col-5 text-muted small">Batch:</dt>
                            <dd class="col-7 small">{{ $assessment->assessmentDetails->batchDetails->name }}</dd>

                            <dt class="col-5 text-muted small">Course:</dt>
                            <dd class="col-7 small">{{ $assessment->assessmentDetails->batchDetails->centreProgramDetails->program->title }}</dd>

                            <dt class="col-5 text-muted small">Duration:</dt>
                            <dd class="col-7 small">{{ $assessment->assessmentDetails->batchDetails->centreProgramDetails->program->total_hours }} Hours</dd>

                            <dt class="col-5 text-muted small">Assessor:</dt>
                            <dd class="col-7 small">{{ $assessment->assessmentDetails->assessor_name }}</dd>
                        </dl>
                    </div>
                    <div class="col-md-6">
                        <div class="text-center bg-light-subtle p-4">

                            <div>
                                <span class="badge text-bg-{{ $color }} fs-5 mb-3">
                                    STATUS: {{ strtoupper($status) }}
                                </span>
                            </div>

                            <span class="text-muted text-uppercase small fw-medium">Overall Score</span>

                            @if($isNumeric)
                                {{-- Show numeric % --}}
                                <h2 class="fw-bolder display-3 text-{{ $color }} my-1">
                                    {{ $score }}%
                                </h2>
                            @else
                                {{-- Show letter grade --}}
                                <h2 class="fw-bolder display-3 text-{{ $color }} my-1">
                                    {{ $letter }}
                                </h2>
                            @endif


                            {{-- If numeric score, show progress bar --}}
                            @if($isNumeric)
                                <div class="progress rounded-pill" style="height: 12px;">
                                    <div class="progress-bar rounded-pill bg-{{ $color }}"
                                        role="progressbar"
                                        style="width: {{ $score }}%"
                                        aria-valuenow="{{ $score }}"
                                        aria-valuemin="0"
                                        aria-valuemax="100">
                                    </div>
                                </div>
                            @endif

                        </div>
                    </div>

                    

                </div> 
            </div> 
            <div class="modal-footer border-0 d-flex justify-content-end">
                <button class="btn btn-outline-secondary rounded-pill px-4" data-bs-dismiss="modal">Close</button>
            </div>

        </div>
    </div>
</div>