@extends('layouts.app')
@section('title', 'Impor Data Siswa')

@section('content')
<div class="row justify-content-center">
    <div class="col-lg-9">
        <div class="card">
            <div class="card-header"><i class="bi bi-upload text-hijau"></i> Impor Massal Data Siswa</div>
            <div class="card-body">
                <div class="alert bg-biru-soft border-0 rounded-soft small">
                    <b>Urutan kolom:</b>
                    <div class="mt-1"><code>No Induk &nbsp;|&nbsp; Nama &nbsp;|&nbsp; Kelas &nbsp;|&nbsp; Status &nbsp;|&nbsp; Tunggakan Awal &nbsp;|&nbsp; No WA Ortu</code></div>
                    No Induk yang sudah ada akan diperbarui (tidak duplikat). Baris judul otomatis dilewati.
                </div>

                <form method="POST" action="{{ route('students.import') }}" enctype="multipart/form-data">
                    @csrf
                    <label class="form-label fw-semibold"><i class="bi bi-file-earmark-excel text-hijau"></i> Cara 1 — Unggah file Excel/CSV</label>
                    <input type="file" name="file" class="form-control mb-2" accept=".xlsx,.xls,.csv">
                    <small class="text-muted d-block mb-3">Format .xlsx, .xls, atau .csv (maks 4 MB).</small>

                    <label class="form-label fw-semibold"><i class="bi bi-clipboard text-hijau"></i> Cara 2 — Tempel dari Excel (Ctrl+V)</label>
                    <textarea name="data" class="form-control font-monospace" rows="8" placeholder="2025007	Gilang Ramadhan	7A	Umum	200000	6281200000007&#10;2025008	Hana Salsabila	7B	Yayasan	0	6281200000008">{{ old('data') }}</textarea>
                    <div class="d-flex gap-2 mt-3">
                        <button class="btn btn-primary"><i class="bi bi-check2-circle"></i> Proses Impor</button>
                        <a href="{{ route('students.index') }}" class="btn btn-outline-primary">Kembali</a>
                    </div>
                    <small class="text-muted d-block mt-2">Isi salah satu: file <b>atau</b> tempel data. Jika keduanya diisi, file yang diproses.</small>
                </form>
            </div>
        </div>
    </div>
</div>
@endsection