@extends('layouts.admin')
@section('title', 'Batches')
@section('heading', $batch->name)
@use('App\Models\InternEvaluation', 'E')
@use('App\Models\InternHospitalAllocation', 'Allocation')
@section('content')
@php
    $statusChip = [
        'upcoming'    => ['Upcoming',    'bg-blue-400/20 text-blue-50 ring-blue-200/40'],
        'in_progress' => ['In progress', 'bg-emerald-400/20 text-emerald-50 ring-emerald-200/40'],
        'completed'   => ['Completed',   'bg-white/10 text-white ring-white/20'],
        'inactive'    => ['Inactive',    'bg-white/10 text-blue-100 ring-white/20'],
    ][$batch->status()];
    $cycleChip = ['current' => 'bg-blue-600 text-white', 'completed' => 'bg-emerald-100 text-emerald-700', 'upcoming' => 'bg-slate-100 text-slate-600'];
@endphp

<a href="{{ route('admin.batches.index') }}" class="mb-4 inline-flex items-center gap-1 text-sm font-medium text-slmc-600 hover:underline"><i class="ri-arrow-left-line"></i> All batches</a>

{{-- ═════════ Header ═════════ --}}
<section class="bg-slmc-hero relative mb-6 overflow-hidden rounded-3xl p-6 text-white shadow-xl sm:p-8">
    <div class="relative flex flex-col gap-6 lg:flex-row lg:items-start lg:justify-between">
        <div class="min-w-0">
            <div class="mb-3 flex flex-wrap items-center gap-2">
                <span @class(['rounded-full px-3 py-1 text-xs font-bold tracking-wider uppercase', 'bg-white text-slmc' => $batch->type === 'main', 'bg-orange-500 text-white' => $batch->type === 'repeat'])>{{ $batch->typeLabel() }} batch</span>
                <span class="rounded-full px-3 py-1 text-xs font-semibold ring-1 {{ $statusChip[1] }}">{{ $statusChip[0] }}</span>
                <span class="font-mono text-xs text-blue-200">{{ $batch->code }}</span>
            </div>
            <h2 class="text-2xl font-bold sm:text-3xl">{{ $batch->name }}</h2>
            @if($batch->description)<p class="mt-2 max-w-2xl text-sm whitespace-pre-line text-blue-100/85">{{ $batch->description }}</p>@endif
        </div>
        <div class="flex shrink-0 flex-wrap gap-2">
            <a href="{{ route('admin.batches.edit', $batch) }}" class="inline-flex items-center gap-2 rounded-xl bg-white px-4 py-2.5 text-sm font-semibold text-slmc hover:bg-slmc-tint"><i class="ri-edit-line"></i> Edit</a>
            @unless($batch->allocations()->exists())
                <form method="POST" action="{{ route('admin.batches.destroy', $batch) }}" onsubmit="return confirm('Delete this batch? This cannot be undone.')">
                    @csrf @method('DELETE')
                    <button class="inline-flex items-center gap-2 rounded-xl border border-white/25 px-4 py-2.5 text-sm font-semibold text-white hover:bg-white/10"><i class="ri-delete-bin-line"></i> Delete</button>
                </form>
            @endunless
        </div>
    </div>

    <dl class="relative mt-6 grid grid-cols-2 gap-3 sm:grid-cols-4">
        @foreach([
            ['Batch year', $batch->year],
            ['Starts', $batch->starts_on->format('j M Y')],
            ['Completes', $batch->ends_on->format('j M Y')],
            ['Interns', number_format($batch->interns_count)],
        ] as [$label, $value])
            <div class="rounded-2xl bg-white/10 p-4 ring-1 ring-white/15 backdrop-blur">
                <dt class="text-[10px] font-semibold tracking-wider text-blue-200 uppercase">{{ $label }}</dt>
                <dd class="mt-0.5 text-lg font-bold">{{ $value }}</dd>
            </div>
        @endforeach
    </dl>

    <div class="relative mt-5">
        <div class="mb-1.5 flex justify-between text-xs text-blue-100"><span>Internship year progress</span><span class="font-semibold">{{ $batch->progressPercent() }}%</span></div>
        <div class="h-2 overflow-hidden rounded-full bg-white/15"><div class="h-full rounded-full bg-linear-to-r from-orange-400 to-amber-200" style="width: {{ $batch->progressPercent() }}%"></div></div>
    </div>
</section>

{{-- ═════════ Evaluation cycles ═════════ --}}
<section class="mb-6">
    <div class="mb-4 flex flex-wrap items-end justify-between gap-2">
        <div>
            <h3 class="text-lg font-bold text-slmc">Evaluation cycles</h3>
            <p class="text-sm text-gray-500">Generated automatically from the start date · one every 3 months</p>
        </div>
        <span class="inline-flex items-center gap-1.5 rounded-full bg-emerald-50 px-3 py-1 text-xs font-semibold text-emerald-700 ring-1 ring-emerald-200"><i class="ri-magic-line"></i> Auto-generated</span>
    </div>

    <div class="grid gap-6 lg:grid-cols-2">
        @foreach($batch->cycles->groupBy('period') as $period => $cycles)
            <div class="admin-card overflow-hidden">
                <div class="flex items-center gap-3 border-b border-slate-100 bg-slate-50/70 px-5 py-4">
                    <span class="flex size-9 items-center justify-center rounded-lg bg-slmc text-xs font-extrabold text-white">P{{ $period }}</span>
                    <div>
                        <p class="text-sm font-bold text-slmc">{{ Allocation::PERIOD_LABELS[$period] }}</p>
                        <p class="text-xs text-gray-500">{{ $cycles->first()->starts_on->format('j M Y') }} – {{ $cycles->last()->ends_on->format('j M Y') }}</p>
                    </div>
                </div>
                <ul class="divide-y divide-slate-100">
                    @foreach($cycles as $c)
                        @php
                            $counts = ($byQuarter[$c->quarter] ?? collect())->pluck('total', 'status');
                            $total = $counts->sum(); $locked = (int) ($counts[E::LOCKED] ?? 0);
                        @endphp
                        <li class="p-5">
                            <div class="flex items-start gap-4">
                                <span @class(['flex size-12 shrink-0 items-center justify-center rounded-2xl text-sm font-extrabold',
                                    'bg-emerald-500 text-white' => $c->state() === 'completed', 'bg-blue-600 text-white ring-4 ring-blue-100' => $c->state() === 'current', 'bg-slate-100 text-slate-500' => $c->state() === 'upcoming'])>Q{{ $c->quarter }}</span>
                                <div class="min-w-0 flex-1">
                                    <div class="flex flex-wrap items-center justify-between gap-2">
                                        <p class="font-bold text-slmc">Evaluation {{ $c->quarter }}</p>
                                        <span class="rounded-full px-2.5 py-0.5 text-[11px] font-semibold capitalize {{ $cycleChip[$c->state()] }}">{{ $c->state() }}</span>
                                    </div>
                                    <p class="text-sm text-gray-500"><i class="ri-calendar-line"></i> {{ $c->starts_on->format('j M Y') }} – {{ $c->ends_on->format('j M Y') }}</p>
                                    <div class="mt-3">
                                        <div class="mb-1 flex justify-between text-[11px] text-gray-500">
                                            <span>{{ $total }} started · {{ $locked }} received by SLMC</span>
                                            <span>{{ $batch->interns_count ? round($locked / max(1, $batch->interns_count) * 100) : 0 }}%</span>
                                        </div>
                                        <div class="flex h-1.5 overflow-hidden rounded-full bg-slate-100">
                                            @if($batch->interns_count)
                                                <span class="bg-emerald-500" style="width: {{ $locked / $batch->interns_count * 100 }}%"></span>
                                                <span class="bg-indigo-400" style="width: {{ ($total - $locked) / $batch->interns_count * 100 }}%"></span>
                                            @endif
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </li>
                    @endforeach
                </ul>
            </div>
        @endforeach
    </div>
</section>

<section class="admin-card flex flex-col gap-4 p-5 sm:flex-row sm:items-center sm:justify-between sm:p-6">
    <div class="flex items-center gap-4">
        <span class="flex size-12 shrink-0 items-center justify-center rounded-2xl bg-slmc-tint text-2xl text-slmc-600"><i class="ri-node-tree"></i></span>
        <div>
            <p class="font-bold text-slmc">{{ number_format($batch->placements_count) }} placements in this batch</p>
            <p class="text-sm text-gray-500">First and second six-month hospital allocations.</p>
        </div>
    </div>
    <a href="{{ route('admin.allocations.index', ['batch' => $batch->id]) }}" class="bg-login-panel inline-flex items-center justify-center gap-2 rounded-xl px-5 py-2.5 text-sm font-semibold text-white hover:brightness-110">View allocations <i class="ri-arrow-right-line"></i></a>
</section>
@endsection