@extends('layouts.admin')

@section('page_kicker', 'Scheduling')
@section('page_title', 'Book a visit')

@section('content')
    <div class="admin-content-card mx-auto max-w-xl">
        <p class="text-sm leading-relaxed text-slate-600">Choose an independent clinician and a time. They can accept, propose another slot, or decline in their dashboard.</p>
        @if ($errors->any())
            <div class="mt-5 rounded-2xl border border-red-200/80 bg-red-50/90 p-4 text-sm text-red-900">
                <ul class="list-inside list-disc space-y-1">
                    @foreach ($errors->all() as $err)
                        <li>{{ $err }}</li>
                    @endforeach
                </ul>
            </div>
        @endif
        <form method="POST" action="{{ route('patient.telehealth.book.store') }}" class="mt-8 space-y-5">
            @csrf
            <div>
                <label class="admin-form-label" for="doctor_user_id">Clinician</label>
                <select id="doctor_user_id" name="doctor_user_id" required class="admin-input">
                    <option value="">Select…</option>
                    @foreach($doctors as $doc)
                        @if($doc->user)
                            <option value="{{ $doc->user_id }}" @selected((string) $doc->user_id === (string) old('doctor_user_id', $selectedDoctorUserId ?? ''))>
                                {{ $doc->user->name }} — {{ $doc->specialization }}
                            </option>
                        @endif
                    @endforeach
                </select>
            </div>
            <div>
                <label class="admin-form-label" for="scheduled_at">Preferred date &amp; time</label>
                <input id="scheduled_at" type="datetime-local" name="scheduled_at" value="{{ old('scheduled_at') }}" required min="{{ now()->addHour()->format('Y-m-d\TH:i') }}" class="admin-input">
            </div>
            <div>
                <label class="admin-form-label" for="channel">Channel</label>
                <select id="channel" name="channel" class="admin-input">
                    <option value="video" @selected(old('channel', 'video') === 'video')>Video</option>
                    <option value="chat" @selected(old('channel') === 'chat')>Chat-only session</option>
                </select>
            </div>
            <div>
                <label class="admin-form-label" for="reason">Reason / focus (optional)</label>
                <textarea id="reason" name="reason" rows="3" maxlength="2000" class="admin-input" placeholder="e.g. follow-up anxiety, medication review">{{ old('reason') }}</textarea>
            </div>
            <div class="flex flex-wrap gap-3 border-t border-slate-100 pt-6">
                <button type="submit" class="admin-btn-primary">Submit request</button>
                <a href="{{ route('patient.telehealth.doctors') }}" class="admin-btn-secondary">Browse profiles</a>
            </div>
        </form>
    </div>
@endsection