<!DOCTYPE html>
<html>
<head>
    <title>Laporan Nilai Siswa</title>
    <link href="https://fonts.googleapis.com/css2?family=Poppins&display=swap" rel="stylesheet">
    <style>
        body { font-family: 'Poppins', sans-serif; font-size: 12px; padding: 30px; color: #333; }
        .header { border-bottom: 2px solid #000; padding-bottom: 10px; margin-bottom: 30px; }
        .school-text h2 { margin: 0; font-size: 18px; font-weight: 600; }
        .school-text p { margin: 2px 0; font-size: 11px; }
        h3 { text-align: center; font-size: 16px; margin-bottom: 15px; }
        table { width: 100%; border-collapse: collapse; margin-top: 15px; }
        th, td { border: 1px solid #000; padding: 8px 10px; font-size: 11px; }
        th { background-color: #e8f0fe; text-align: center; }
    </style>
</head>
<body>

    <div class="header">
        <div class="school-text">
            <h2>SLB NEGERI JEMBER</h2>
            <p>Jl. DR. Soebandi, Krajan, Kec. Patrang, Kabupaten Jember, Jawa Timur 68111</p>
            <p>Email: slbnjbr@gmail.com</p>
        </div>
    </div>

    <h3>Laporan Nilai Siswa</h3>
    <p>Kelas: <strong>{{ $task->classroom->name }}</strong></p>
    <p>Tugas: <strong>{{ $task->name }}</strong></p>

    <table>
        <thead>
            <tr>
                <th>No</th>
                <th>Nama Siswa</th>
                <th>Nilai</th>
            </tr>
        </thead>
        <tbody>
            @foreach($grades as $index => $nilai)
                <tr>
                    <td align="center">{{ $index + 1 }}</td>
                    <td>{{ $nilai->student->name }}</td>
                    <td align="center">{{ $nilai->grade }}</td>
                </tr>
            @endforeach
        </tbody>
    </table>

</body>
</html>
