@extends('layouts.app')

@section('title', $student->full_name)

@php
    $rows = [
        'Admission Number' => $student->admission_no,
        'UPI' => $student->upi,
        'Admission Code' => $student->admission_code,
        'Assessment No' => $student->assessment_no,
        'Pathway' => $student->pathway,
        'Full Name' => $student->full_name,
        'Gender' => $student->gender,
        'Date of Birth' => $student->date_of_birth?->format('d M Y'),
        'Date of Admission' => $student->date_of_admission?->format('d M Y'),
        'Birth Certificate Entry' => $student->birth_certificate_entry,
        'Citizenship' => $student->citizenship,
        'Home County' => $student->home_county,
        'Special Needs' => $student->special_needs,
        'Religion' => $student->religion,
        'Class' => $student->class_name.' '.$student->stream,
        'Category' => $student->category,
        'KCPE / Entry Marks' => $student->kcpe_marks ? (string) $student->kcpe_marks : '',
        'KJSEA Points' => $student->kjsea_points ? (string) $student->kjsea_points : '',
        'Previous School' => $student->previous_school,
        'House' => $student->house,
        'Address' => $student->address,
    ];
    $parentRows = [
        'Father' => $student->parent_name,
        'Father Phone' => $student->parent_phone,
        'Father National ID' => $student->parent_national_id,
        'Father Email' => $student->parent_email,
        'Mother' => $student->mother_name,
        'Mother Phone' => $student->mother_phone,
        'Mother National ID' => $student->mother_national_id,
        'Mother Email' => $student->mother_email,
        'Guardian' => $student->guardian_name,
        'Guardian Relationship' => $student->guardian_relationship,
        'Guardian National ID' => $student->guardian_national_id,
        'Guardian Phone' => $student->guardian_phone,
        'Guardian Email' => $student->guardian_email,
    ];
    $transportRows = [
        'Route' => $student->transport_route,
        'Drop-off' => $student->transport_drop_off,
        'Mode' => $student->transport_mode,
    ];
@endphp

@section('content')
    <div class="flex flex-col gap-6">
        <div class="flex items-end justify-between gap-3">
            <div class="flex items-center gap-3">
                <span class="flex size-12 items-center justify-center rounded-xl bg-primary/10 text-sm font-semibold text-primary">
                    {{ strtoupper(substr($student->first_name, 0, 1) . substr($student->surname, 0, 1)) }}
                </span>
                <div>
                    <h1 class="text-lg font-semibold">{{ $student->full_name }}</h1>
                    <p class="text-xs text-muted-foreground">
                        Adm No {{ $student->admission_no }} · {{ $student->class_name }} {{ $student->stream }} · {{ $student->category }}
                    </p>
                </div>
            </div>
            <div class="flex items-center gap-2">
                <a href="{{ route('students.index') }}" class="rounded-lg border border-border px-3 py-2 text-sm transition-colors hover:bg-accent">Back</a>
                <a href="{{ route('students.edit', $student) }}" class="rounded-lg border border-border px-3 py-2 text-sm transition-colors hover:bg-accent">Edit</a>
                <form method="post" action="{{ route('students.transfer', $student) }}"
                      onsubmit="return confirm('Transfer {{ $student->full_name }} out?')" class="flex items-center gap-2">
                    @csrf
                    <input name="reason" value="Transferred to another school"
                           class="hidden h-9 w-56 rounded-lg border border-input bg-transparent px-3 text-xs outline-none focus-visible:border-ring">
                    <button type="submit" class="rounded-lg border border-destructive/40 px-3 py-2 text-sm text-destructive transition-colors hover:bg-destructive/10">Transfer out</button>
                </form>
            </div>
        </div>

        <div class="grid grid-cols-1 gap-4 lg:grid-cols-3">
            <div class="rounded-xl border border-border bg-card p-4 lg:col-span-2">
                <h2 class="mb-3 text-xs font-semibold uppercase tracking-wide text-muted-foreground">Student Details</h2>
                <dl class="grid grid-cols-2 gap-x-6 gap-y-3">
                    @foreach ($rows as $label => $value)
                        <div class="flex flex-col gap-0.5">
                            <dt class="text-xs text-muted-foreground">{{ $label }}</dt>
                            <dd class="text-sm {{ $value === '' || $value === null ? 'text-muted-foreground/60' : '' }}">{{ $value ?: '—' }}</dd>
                        </div>
                    @endforeach
                </dl>
            </div>

            <div class="flex flex-col gap-4">
                <div class="rounded-xl border border-border bg-card p-4">
                    <h2 class="mb-3 text-xs font-semibold uppercase tracking-wide text-muted-foreground">Transport</h2>
                    <dl class="flex flex-col gap-2.5">
                        @foreach ($transportRows as $label => $value)
                            <div class="flex flex-col gap-0.5">
                                <dt class="text-xs text-muted-foreground">{{ $label }}</dt>
                                <dd class="text-sm {{ $value === '' || $value === null ? 'text-muted-foreground/60' : '' }}">{{ $value ?: '—' }}</dd>
                            </div>
                        @endforeach
                    </dl>
                </div>

                <div class="rounded-xl border border-border bg-card p-4">
                    <h2 class="mb-3 text-xs font-semibold uppercase tracking-wide text-muted-foreground">Parent / Guardian</h2>
                    <dl class="flex flex-col gap-2.5">
                        @foreach ($parentRows as $label => $value)
                            <div class="flex flex-col gap-0.5">
                                <dt class="text-xs text-muted-foreground">{{ $label }}</dt>
                                <dd class="text-sm {{ $value === '' || $value === null ? 'text-muted-foreground/60' : '' }}">{{ $value ?: '—' }}</dd>
                            </div>
                        @endforeach
                    </dl>
                </div>
            </div>
        </div>
    </div>
@endsection