@extends('layouts.guru')

@section('title', 'Analitik Kelas — ZAXARA Guru')

@php
    $totalPenguasaan = array_sum($distribusiLevel);
    $maksSesiMingguan = max(1, collect($trenMingguan)->max('jumlah_sesi'));
    $labelLevel = ['belum' => 'Belum', 'lemah' => 'Lemah', 'cukup' => 'Cukup', 'lancar' => 'Lancar'];
    $warnaLevel = ['belum' => 'var(--ink-faint)', 'lemah' => 'var(--amber)', 'cukup' => 'var(--blue)', 'lancar' => 'var(--green)'];
@endphp

@section('content')
<h1 style="font-size:20px;margin:0 0 20px;">Analitik Kelas — {{ $kelas->nama }}</h1>

<div style="display:flex;flex-direction:column;gap:20px;">

    <div class="card">
        <div class="label" style="margin-bottom:14px;">Distribusi Level Penguasaan</div>

        @if ($totalPenguasaan === 0)
            <p style="font-size:13px;color:var(--ink-faint);margin:0;">Belum ada data penguasaan di kelas ini.</p>
        @else
            <div style="display:flex;flex-direction:column;gap:10px;">
                @foreach ($distribusiLevel as $level => $jumlah)
                    <div style="display:flex;align-items:center;gap:12px;">
                        <div style="width:70px;font-size:13px;font-weight:700;flex-shrink:0;">{{ $labelLevel[$level] }}</div>
                        <div style="flex:1;background:var(--surface-alt);border-radius:999px;height:14px;overflow:hidden;">
                            <div style="width:{{ $totalPenguasaan > 0 ? round($jumlah / $totalPenguasaan * 100) : 0 }}%;height:100%;background:{{ $warnaLevel[$level] }};border-radius:999px;"></div>
                        </div>
                        <div style="width:34px;text-align:right;font-size:13px;font-weight:800;flex-shrink:0;">{{ $jumlah }}</div>
                    </div>
                @endforeach
            </div>
            <p style="font-size:12px;color:var(--ink-faint);margin:14px 0 0;">
                Total {{ $totalPenguasaan }} baris penguasaan (murid × unit yang sudah pernah disentuh) di kelas ini.
            </p>
        @endif
    </div>

    <div class="card">
        <div class="label" style="margin-bottom:8px;">Unit Paling Banyak "Macet" di Level Lemah</div>
        <p style="font-size:12px;color:var(--ink-faint);margin:0 0 12px;">
            Sinyal materi yang mungkin perlu dijelaskan ulang, atau memang di atas kemampuan rata-rata kelas saat ini.
        </p>

        <table>
            <thead>
                <tr><th>Unit</th><th>Jumlah Murid Tersangkut</th></tr>
            </thead>
            <tbody>
                @forelse ($unitMacet as $baris)
                    <tr>
                        <td>{{ $baris->unit->materi->judul }} — {{ $baris->unit->judul }}</td>
                        <td>
                            <span class="chip chip-amber">{{ $baris->jumlah_murid }} murid</span>
                        </td>
                    </tr>
                @empty
                    <tr><td colspan="2">Tidak ada unit yang macet di level lemah saat ini — bagus!</td></tr>
                @endforelse
            </tbody>
        </table>
    </div>

    <div class="card">
        <div class="label" style="margin-bottom:14px;">Tren Keaktifan Mingguan ({{ count($trenMingguan) }} Minggu Terakhir)</div>
        <p style="font-size:12px;color:var(--ink-faint);margin:0 0 16px;">
            Jumlah sesi belajar SAH (lolos aturan bukti kerja, PROJECT-SPEC.md §3) per minggu — minggu ini di paling kanan.
        </p>

        <div style="display:flex;align-items:flex-end;gap:8px;height:140px;">
            @foreach ($trenMingguan as $minggu)
                <div style="flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;height:100%;justify-content:flex-end;">
                    <div style="font-size:11px;font-weight:800;color:var(--ink-soft);">{{ $minggu['jumlah_sesi'] }}</div>
                    <div style="width:100%;max-width:28px;height:{{ max(4, round($minggu['jumlah_sesi'] / $maksSesiMingguan * 100)) }}%;background:var(--brand-gradient);border-radius:6px 6px 2px 2px;"></div>
                    <div style="font-size:10px;color:var(--ink-faint);white-space:nowrap;">{{ \Illuminate\Support\Carbon::parse($minggu['mulai'])->format('d/m') }}</div>
                </div>
            @endforeach
        </div>
    </div>

</div>
@endsection