@extends('layouts.portal')
@section('title', 'Assign Consultant')
@section('heading', 'Assign Supervisory Consultant')
@section('content')
<a href="{{ route('director.dashboard') }}" class="mb-4 inline-flex items-center gap-1 rounded-lg bg-white/90 px-3 py-1.5 text-sm font-medium text-slmc shadow-sm hover:bg-white"><i class="ri-arrow-left-line"></i> Back to dashboard</a>

<div class="grid gap-6 lg:grid-cols-3">
    <section class="slmc-card slmc-card-accent p-6">
        <p class="text-xs font-semibold tracking-widest text-slmc-600 uppercase">Intern Medical Officer</p>
        <h2 class="mt-1 text-xl font-bold text-slmc">{{ $allocation->intern->name }}</h2>
        <p class="text-sm text-gray-500">{{ $allocation->intern->registration_no ?? $allocation->intern->email }}</p>
        <dl class="mt-5 space-y-3 text-sm">
            <div><dt class="text-[10px] font-bold tracking-wider text-slate-500 uppercase">Hospital</dt><dd class="font-semibold text-slmc">{{ $allocation->hospital->name }}</dd></div>
            <div><dt class="text-[10px] font-bold tracking-wider text-slate-500 uppercase">Batch</dt><dd class="font-semibold text-slmc">{{ $allocation->batch?->name ?? '—' }}</dd></div>
            <div><dt class="text-[10px] font-bold tracking-wider text-slate-500 uppercase">Period</dt><dd class="font-semibold text-slmc">{{ $allocation->periodLabel() }}</dd><dd class="text-xs text-gray-500">{{ $allocation->starts_on->format('j M Y') }} – {{ $allocation->endsOn()->format('j M Y') }}</dd></div>
            <div><dt class="text-[10px] font-bold tracking-wider text-slate-500 uppercase">Current consultant</dt><dd class="font-semibold {{ $allocation->consultant ? 'text-slmc' : 'text-amber-600' }}">{{ $allocation->consultant?->name ?? 'Not assigned' }}</dd></div>
        </dl>
    </section>

    <section class="slmc-card p-6 lg:col-span-2">
        <h3 class="mb-1 text-lg font-bold text-slmc">Placement details</h3>
        <p class="mb-5 text-sm text-gray-500">The consultant will review this intern's quarterly evaluations before they come to you for approval.</p>

        @if($consultants->isEmpty())
            <div class="rounded-2xl border border-amber-200 bg-amber-50 p-4 text-sm text-amber-800"><i class="ri-error-warning-line"></i> No consultants are attached to {{ $allocation->hospital->name }} yet. Contact SLMC administration.</div>
        @else
            <form method="POST" action="{{ route('director.allocations.assign.update', $allocation) }}" class="space-y-5">
                @csrf @method('PUT')
                <div>
                    <label for="consultant_id" class="text-sm font-semibold text-slmc">Supervisory Consultant <span class="text-red-500">*</span></label>
                    <select id="consultant_id" name="consultant_id" required class="slmc-input mt-1.5 pl-3 @error('consultant_id') border-red-400 @enderror"
                        onchange="const s=this.selectedOptions[0].dataset.specialty; const f=document.getElementById('specialty'); if(s && !f.dataset.touched) f.value=s;">
                        <option value="">Select a consultant…</option>
                        @foreach($consultants as $c)
                            <option value="{{ $c->id }}" data-specialty="{{ $c->specialty }}" @selected((int) old('consultant_id', $allocation->consultant_id) === $c->id)>{{ $c->name }}{{ $c->specialty ? ' — '.$c->specialty : '' }}</option>
                        @endforeach
                    </select>
                    @error('consultant_id')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
                </div>
                <div class="grid gap-5 md:grid-cols-2">
                    <div>
                        <label for="unit" class="text-sm font-semibold text-slmc">Unit / Ward <span class="text-red-500">*</span></label>
                        <input id="unit" name="unit" required maxlength="120" placeholder="e.g. Medical Unit 1" value="{{ old('unit', $allocation->unit) }}" class="slmc-input mt-1.5 pl-3 @error('unit') border-red-400 @enderror">
                        @error('unit')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
                    </div>
                    <div>
                        <label for="specialty" class="text-sm font-semibold text-slmc">Specialty <span class="text-red-500">*</span></label>
                        <input id="specialty" name="specialty" required maxlength="120" placeholder="e.g. General Medicine" value="{{ old('specialty', $allocation->specialty) }}" oninput="this.dataset.touched=1" class="slmc-input mt-1.5 pl-3 @error('specialty') border-red-400 @enderror">
                        @error('specialty')<p class="mt-1 text-xs text-red-600">{{ $message }}</p>@enderror
                    </div>
                </div>
                <div class="flex justify-end">
                    <button type="submit" class="bg-login-panel flex items-center gap-2 rounded-xl px-6 py-3 text-sm font-semibold text-white shadow hover:brightness-110">
                        <i class="ri-user-shared-line"></i> {{ $allocation->consultant ? 'Update assignment' : 'Assign consultant' }}
                    </button>
                </div>
            </form>
        @endif
    </section>
</div>
@endsection