@extends('layouts.app')

@section('content')
    <style>
        .form-shell { margin-top: 18px; display: grid; gap: 16px; }
        .form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
        .field label { display: block; margin-bottom: 6px; font-weight: 500; }
        .field input, .field select, .field textarea { width: 100%; border: 1px solid #cfd8e3; border-radius: 8px; padding: 10px 12px; font: inherit; background: #fff; }
        .field textarea { min-height: 92px; resize: vertical; }
        .field.full { grid-column: 1 / -1; }
        .section-title { margin: 0 0 12px; font-size: 18px; }
        .photo-preview { display: flex; align-items: start; gap: 12px; flex-wrap: wrap; }
        .photo-preview img { width: 180px; max-width: 100%; border-radius: 8px; border: 1px solid var(--line); }
        .form-actions { display: flex; gap: 10px; justify-content: flex-end; flex-wrap: wrap; }
        .small-muted { color: var(--muted); font-size: 13px; margin-top: 4px; }
        @media (max-width: 860px) {
            .form-grid { grid-template-columns: 1fr; }
            .form-actions .btn { width: 100%; }
        }
    </style>

    <h1 class="page-title">บันทึกเยี่ยมบ้าน</h1>
    <p class="page-subtitle">
        {{ $student->full_name }} | {{ $classroom->name }} | {{ $classroom->academicYear->label }}
    </p>

    @if ($errors->any())
        <div class="notice" style="background:#fff4ed;border-color:#fedf89;color:#b54708;">
            กรุณาตรวจสอบข้อมูลที่กรอกอีกครั้ง
        </div>
    @endif

    <form class="form-shell" method="post" enctype="multipart/form-data" action="{{ route('home-visits.store', [$classroom, $student]) }}">
        @csrf

        <div class="card">
            <h2 class="section-title">ข้อมูลการเยี่ยมบ้าน</h2>
            <div class="form-grid">
                <div class="field">
                    <label for="visit_date">วันที่เยี่ยมบ้าน</label>
                    <input id="visit_date" type="date" name="visit_date" value="{{ old('visit_date', optional($visit->visit_date)->format('Y-m-d') ?? now()->format('Y-m-d')) }}">
                    @error('visit_date') <div class="small-muted">{{ $message }}</div> @enderror
                </div>

                <div class="field">
                    <label for="home_type">ประเภทที่อยู่อาศัย</label>
                    <select id="home_type" name="home_type">
                        <option value="">เลือกประเภท</option>
                        @foreach ($homeTypes as $value => $label)
                            <option value="{{ $value }}" @selected(old('home_type', $visit->home_type) === $value)>{{ $label }}</option>
                        @endforeach
                    </select>
                    @error('home_type') <div class="small-muted">{{ $message }}</div> @enderror
                </div>

                <div class="field full">
                    <label for="address">ที่อยู่</label>
                    <textarea id="address" name="address" placeholder="กรอกที่อยู่หรือข้อมูลตำแหน่งบ้าน">{{ old('address', $visit->address) }}</textarea>
                </div>

                <div class="field">
                    <label for="home_style">ลักษณะบ้าน</label>
                    <input id="home_style" name="home_style" value="{{ old('home_style', $visit->home_style) }}" placeholder="เช่น บ้านเดี่ยว">
                </div>

                <div class="field">
                    <label for="environment">สภาพแวดล้อมรอบบ้าน</label>
                    <input id="environment" name="environment" value="{{ old('environment', $visit->environment) }}" placeholder="เช่น สวนผลไม้">
                </div>

                <div class="field">
                    <label for="living_with">อาศัยอยู่กับ</label>
                    <input id="living_with" name="living_with" value="{{ old('living_with', $visit->living_with) }}" placeholder="เช่น บิดา มารดา">
                </div>

                <div class="field">
                    <label for="travel_method">วิธีเดินทาง</label>
                    <input id="travel_method" name="travel_method" value="{{ old('travel_method', $visit->travel_method) }}" placeholder="เช่น รถจักรยานยนต์">
                </div>
            </div>
        </div>

        <div class="card">
            <h2 class="section-title">ครอบครัวและการสนับสนุน</h2>
            <div class="form-grid">
                <div class="field">
                    <label for="guardian_occupation">อาชีพผู้ปกครอง</label>
                    <input id="guardian_occupation" name="guardian_occupation" value="{{ old('guardian_occupation', $visit->guardian_occupation) }}" placeholder="เช่น เกษตรกร">
                </div>

                <div class="field">
                    <label for="family_income">รายได้ครอบครัว</label>
                    <input id="family_income" type="number" min="0" name="family_income" value="{{ old('family_income', $visit->family_income) }}" placeholder="เช่น 9000">
                </div>

                <div class="field">
                    <label for="income_sufficient">รายได้เพียงพอต่อการใช้จ่าย</label>
                    <input id="income_sufficient" name="income_sufficient" value="{{ old('income_sufficient', $visit->income_sufficient) }}" placeholder="เช่น เพียงพอ / ไม่เพียงพอ">
                </div>

                <div class="field">
                    <label for="daily_allowance">นักเรียนได้รับค่าใช้จ่ายวันละ</label>
                    <input id="daily_allowance" type="number" min="0" name="daily_allowance" value="{{ old('daily_allowance', $visit->daily_allowance) }}" placeholder="เช่น 40">
                </div>

                <div class="field full">
                    <label for="assistance_received">ความช่วยเหลือที่เคยได้รับจากหน่วยงาน</label>
                    <input id="assistance_received" name="assistance_received" value="{{ old('assistance_received', $visit->assistance_received) }}" placeholder="ถ้าไม่มีให้เว้นว่าง">
                </div>

                <div class="field full">
                    <label for="student_income">นักเรียนทำงานหารายได้</label>
                    <input id="student_income" name="student_income" value="{{ old('student_income', $visit->student_income) }}" placeholder="เช่น ไม่มี / ช่วยงานครอบครัว">
                </div>
            </div>
        </div>

        <div class="card">
            <h2 class="section-title">รูปภาพ</h2>
            <div class="form-grid">
                <div class="field">
                    <label for="photo1">รูปภาพ 1</label>
                    <div class="photo-preview">
                        @if ($visit->photo1_path)
                            <img src="{{ asset($visit->photo1_path) }}" alt="รูปภาพ 1">
                        @endif
                        <input id="photo1" type="file" name="photo1" accept="image/*">
                    </div>
                </div>

                <div class="field">
                    <label for="photo2">รูปภาพ 2</label>
                    <div class="photo-preview">
                        @if ($visit->photo2_path)
                            <img src="{{ asset($visit->photo2_path) }}" alt="รูปภาพ 2">
                        @endif
                        <input id="photo2" type="file" name="photo2" accept="image/*">
                    </div>
                </div>
            </div>
        </div>

        <div class="form-actions no-print">
            <a class="btn secondary" href="{{ route('home-visits.index', ['academic_year_id' => $classroom->academic_year_id, 'classroom_id' => $classroom->id]) }}">กลับรายชื่อ</a>
            <button class="btn" type="submit">บันทึกข้อมูล</button>
        </div>
    </form>
@endsection