<?php
require_once '../includes/header.php';
require_once '../includes/navbar.php';

// Ambil ID siswa dari URL
$id_siswa = $_GET['id'] ?? 0;

// Ambil data siswa (TANPA tahun ajaran dari bind_siswa)
$query_siswa = "SELECT s.* FROM bind_siswa s WHERE s.id_siswa = ?";
$stmt_siswa = $conn->prepare($query_siswa);
$stmt_siswa->bind_param("i", $id_siswa);
$stmt_siswa->execute();
$result_siswa = $stmt_siswa->get_result();
$siswa = $result_siswa->fetch_assoc();
$stmt_siswa->close();

if (!$siswa) {
    echo "<script>
        Swal.fire({
            icon: 'error',
            title: 'Error',
            text: 'Data siswa tidak ditemukan'
        }).then(() => {
            window.location.href = 'index.php';
        });
    </script>";
    exit;
}

// Ambil data tahun ajaran dari bind_datasiswa
$query_tahun_siswa = "SELECT ds.id_tahunajaran, t.tahun_ajaran 
                      FROM bind_datasiswa ds 
                      JOIN bind_tahunajaran t ON ds.id_tahunajaran = t.id_tahunajaran 
                      WHERE ds.id_siswa = ?";
$stmt_tahun_siswa = $conn->prepare($query_tahun_siswa);
$stmt_tahun_siswa->bind_param("i", $id_siswa);
$stmt_tahun_siswa->execute();
$result_tahun_siswa = $stmt_tahun_siswa->get_result();
$tahun_siswa = $result_tahun_siswa->fetch_assoc();
$stmt_tahun_siswa->close();

// Ambil data orang tua
$query_ortu = "SELECT * FROM bind_orang_tua WHERE id_siswa = ?";
$stmt_ortu = $conn->prepare($query_ortu);
$stmt_ortu->bind_param("i", $id_siswa);
$stmt_ortu->execute();
$result_ortu = $stmt_ortu->get_result();
$orang_tua = [];
while ($row = $result_ortu->fetch_assoc()) {
    $orang_tua[] = $row;
}
$stmt_ortu->close();

// Ambil data tahun ajaran untuk dropdown
$query_tahun = "SELECT * FROM bind_tahunajaran ORDER BY tahun_ajaran DESC";
$result_tahun = mysqli_query($conn, $query_tahun);
$tahun_ajaran = [];
while ($row = mysqli_fetch_assoc($result_tahun)) {
    $tahun_ajaran[] = $row;
}

if ($_SERVER['REQUEST_METHOD'] == 'POST') {
    // Ambil data dari form dengan isset() untuk menghindari error
    $id_tahunajaran = mysqli_real_escape_string($conn, $_POST['id_tahunajaran']);
    $nisn = mysqli_real_escape_string($conn, $_POST['nisn']);
    $nis = mysqli_real_escape_string($conn, $_POST['nis']);
    $nama_lengkap = mysqli_real_escape_string($conn, $_POST['nama_lengkap']);
    $nama_panggilan = isset($_POST['nama_panggilan']) ? mysqli_real_escape_string($conn, $_POST['nama_panggilan']) : '';
    $jenis_kelamin = isset($_POST['jenis_kelamin']) ? mysqli_real_escape_string($conn, $_POST['jenis_kelamin']) : '';
    $tempat_lahir = isset($_POST['tempat_lahir']) ? mysqli_real_escape_string($conn, $_POST['tempat_lahir']) : '';
    //$tanggal_lahir = isset($_POST['tanggal_lahir']) ? $_POST['tanggal_lahir'] : '';
    $tanggal_lahir = isset($_POST['tanggal_lahir']) && !empty($_POST['tanggal_lahir']) ? $_POST['tanggal_lahir'] : null;
    $agama = isset($_POST['agama']) ? mysqli_real_escape_string($conn, $_POST['agama']) : '';
    $kewarganegaraan = isset($_POST['kewarganegaraan']) ? mysqli_real_escape_string($conn, $_POST['kewarganegaraan']) : 'Indonesia';
    $anak_ke = isset($_POST['anak_ke']) ? (int)$_POST['anak_ke'] : 1;
    $jumlah_saudara_kandung = isset($_POST['jumlah_saudara_kandung']) ? (int)$_POST['jumlah_saudara_kandung'] : 0;
    $jumlah_saudara_tiri = isset($_POST['jumlah_saudara_tiri']) ? (int)$_POST['jumlah_saudara_tiri'] : 0;
    $jumlah_saudara_angkat = isset($_POST['jumlah_saudara_angkat']) ? (int)$_POST['jumlah_saudara_angkat'] : 0;
    $status_anak = isset($_POST['status_anak']) ? mysqli_real_escape_string($conn, $_POST['status_anak']) : 'Kandung';
    $bahasa_sehari_hari = isset($_POST['bahasa_sehari_hari']) ? mysqli_real_escape_string($conn, $_POST['bahasa_sehari_hari']) : 'Indonesia';
    $alamat = isset($_POST['alamat']) ? mysqli_real_escape_string($conn, $_POST['alamat']) : '';
    $no_hp = isset($_POST['no_hp']) ? mysqli_real_escape_string($conn, $_POST['no_hp']) : '';
    $tinggal_dengan = isset($_POST['tinggal_dengan']) ? mysqli_real_escape_string($conn, $_POST['tinggal_dengan']) : 'Orang Tua';
    $jarak_ke_sekolah = isset($_POST['jarak_ke_sekolah']) ? mysqli_real_escape_string($conn, $_POST['jarak_ke_sekolah']) : '';
    $golongan_darah = isset($_POST['golongan_darah']) ? mysqli_real_escape_string($conn, $_POST['golongan_darah']) : '';
    $riwayat_penyakit = isset($_POST['riwayat_penyakit']) ? mysqli_real_escape_string($conn, $_POST['riwayat_penyakit']) : '';
    $kelainan_jasmani = isset($_POST['kelainan_jasmani']) ? mysqli_real_escape_string($conn, $_POST['kelainan_jasmani']) : '';
    $tinggi_cm = isset($_POST['tinggi_cm']) ? (int)$_POST['tinggi_cm'] : 0;
    $berat_kg = isset($_POST['berat_kg']) ? (float)$_POST['berat_kg'] : 0;
    //$tanggal_diterima = isset($_POST['tanggal_diterima']) ? $_POST['tanggal_diterima'] : date('Y-m-d');
    $tanggal_diterima = isset($_POST['tanggal_diterima']) && !empty($_POST['tanggal_diterima']) ? $_POST['tanggal_diterima'] : date('Y-m-d');
    
    // Validasi jenis_kelamin
    if (!in_array($jenis_kelamin, ['L', 'P'])) {
        echo "<script>
            Swal.fire({
                icon: 'error',
                title: 'Gagal',
                text: 'Jenis kelamin harus L atau P'
            });
        </script>";
        exit;
    }
    
    // Upload foto jika ada file baru
    $foto_masuk = $siswa['foto_masuk']; // Default ke foto lama
    if ($_FILES['foto_masuk']['name']) {
        $target_dir = "../uploads/foto-siswa/";
        if (!is_dir($target_dir)) {
            mkdir($target_dir, 0777, true);
        }
        
        $file_extension = pathinfo($_FILES['foto_masuk']['name'], PATHINFO_EXTENSION);
        $foto_masuk = "siswa_" . time() . "." . $file_extension;
        $target_file = $target_dir . $foto_masuk;
        
        if (move_uploaded_file($_FILES['foto_masuk']['tmp_name'], $target_file)) {
            // Hapus foto lama jika ada
            if ($siswa['foto_masuk'] && file_exists($target_dir . $siswa['foto_masuk'])) {
                unlink($target_dir . $siswa['foto_masuk']);
            }
        } else {
            $foto_masuk = $siswa['foto_masuk']; // Tetap pakai foto lama jika upload gagal
        }
    }
    
    // Query update bind_siswa menggunakan prepared statement
    // $sql = "UPDATE bind_siswa SET 
    //         nisn = ?, nis = ?, nama_lengkap = ?, nama_panggilan = ?, jenis_kelamin = ?,
    //         tempat_lahir = ?, tanggal_lahir = ?, agama = ?, kewarganegaraan = ?, anak_ke = ?,
    //         jumlah_saudara_kandung = ?, jumlah_saudara_tiri = ?, jumlah_saudara_angkat = ?, status_anak = ?,
    //         bahasa_sehari_hari = ?, alamat = ?, no_hp = ?, tinggal_dengan = ?, jarak_ke_sekolah = ?,
    //         golongan_darah = ?, riwayat_penyakit = ?, kelainan_jasmani = ?, tinggi_cm = ?, berat_kg = ?,
    //         foto_masuk = ?, tanggal_diterima = ?
    //         WHERE id_siswa = ?";
    
    // $stmt = $conn->prepare($sql);
    // if ($stmt) {
    //     $stmt->bind_param("sssssssssiiiisssssssssiissi", 
    //         $nisn, $nis, $nama_lengkap, $nama_panggilan, $jenis_kelamin,
    //         $tempat_lahir, $tanggal_lahir, $agama, $kewarganegaraan, $anak_ke,
    //         $jumlah_saudara_kandung, $jumlah_saudara_tiri, $jumlah_saudara_angkat, $status_anak,
    //         $bahasa_sehari_hari, $alamat, $no_hp, $tinggal_dengan, $jarak_ke_sekolah,
    //         $golongan_darah, $riwayat_penyakit, $kelainan_jasmani, $tinggi_cm, $berat_kg,
    //         $foto_masuk, $tanggal_diterima, $id_siswa
    //     );
    // Query update bind_siswa menggunakan prepared statement
        $sql = "UPDATE bind_siswa SET 
                nisn = ?, nis = ?, nama_lengkap = ?, nama_panggilan = ?, jenis_kelamin = ?,
                tempat_lahir = ?, tanggal_lahir = ?, agama = ?, kewarganegaraan = ?, anak_ke = ?,
                jumlah_saudara_kandung = ?, jumlah_saudara_tiri = ?, jumlah_saudara_angkat = ?, status_anak = ?,
                bahasa_sehari_hari = ?, alamat = ?, no_hp = ?, tinggal_dengan = ?, jarak_ke_sekolah = ?,
                golongan_darah = ?, riwayat_penyakit = ?, kelainan_jasmani = ?, tinggi_cm = ?, berat_kg = ?,
                foto_masuk = ?, tanggal_diterima = ?
                WHERE id_siswa = ?";

        $stmt = $conn->prepare($sql);
        if ($stmt) {
            // Ubah tipe parameter untuk tanggal_lahir dan tanggal_diterima menjadi "ss" (string)
            $stmt->bind_param("sssssssssiiiisssssssssiissi", 
                $nisn, $nis, $nama_lengkap, $nama_panggilan, $jenis_kelamin,
                $tempat_lahir, $tanggal_lahir, $agama, $kewarganegaraan, $anak_ke,
                $jumlah_saudara_kandung, $jumlah_saudara_tiri, $jumlah_saudara_angkat, $status_anak,
                $bahasa_sehari_hari, $alamat, $no_hp, $tinggal_dengan, $jarak_ke_sekolah,
                $golongan_darah, $riwayat_penyakit, $kelainan_jasmani, $tinggi_cm, $berat_kg,
                $foto_masuk, $tanggal_diterima, $id_siswa
            );
        
        if ($stmt->execute()) {
            // Update bind_datasiswa
            $sql_datasiswa = "UPDATE bind_datasiswa SET id_tahunajaran = ? WHERE id_siswa = ?";
            $stmt_datasiswa = $conn->prepare($sql_datasiswa);
            $stmt_datasiswa->bind_param("ii", $id_tahunajaran, $id_siswa);
            $stmt_datasiswa->execute();
            $stmt_datasiswa->close();
            
            // Hapus data orang tua lama
            $sql_delete_ortu = "DELETE FROM bind_orang_tua WHERE id_siswa = ?";
            $stmt_delete_ortu = $conn->prepare($sql_delete_ortu);
            $stmt_delete_ortu->bind_param("i", $id_siswa);
            $stmt_delete_ortu->execute();
            $stmt_delete_ortu->close();
            
            // Simpan data orang tua baru
            // Simpan data orang tua baru
            if (isset($_POST['nama_orangtua'])) {
                foreach ($_POST['nama_orangtua'] as $index => $nama) {
                    if (!empty($nama)) {
                        $hubungan = $_POST['hubungan'][$index];
                        $tempat_lahir_ortu = $_POST['tempat_lahir_ortu'][$index] ?? '';
                        
                        // Perbaikan untuk tanggal lahir orang tua
                        $tanggal_lahir_ortu = isset($_POST['tanggal_lahir_ortu'][$index]) && !empty($_POST['tanggal_lahir_ortu'][$index]) 
                            ? $_POST['tanggal_lahir_ortu'][$index] 
                            : null;
                        
                        $agama_ortu = $_POST['agama_ortu'][$index] ?? '';
                        $kewarganegaraan_ortu = $_POST['kewarganegaraan_ortu'][$index] ?? '';
                        $pendidikan_terakhir = $_POST['pendidikan_terakhir'][$index] ?? '';
                        $pekerjaan = $_POST['pekerjaan'][$index] ?? '';
                        $penghasilan_bulanan = $_POST['penghasilan_bulanan'][$index] ?? 0;
                        $alamat_ortu = $_POST['alamat_ortu'][$index] ?? '';
                        $no_hp_ortu = $_POST['no_hp_ortu'][$index] ?? '';
                        $status_hidup = $_POST['status_hidup'][$index] ?? 'Hidup';
                        
                        $sql_ortu = "INSERT INTO bind_orang_tua (id_siswa, hubungan, nama, tempat_lahir, tanggal_lahir, 
                                    agama, kewarganegaraan, pendidikan_terakhir, pekerjaan, penghasilan_bulanan, 
                                    alamat, no_hp, status_hidup) 
                                    VALUES (?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?, ?)";
                        $stmt_ortu = $conn->prepare($sql_ortu);
                        
                        // Ubah parameter untuk tanggal_lahir menjadi "s" (bisa menerima string atau null)
                        $stmt_ortu->bind_param("issssssssdsss", 
                            $id_siswa, $hubungan, $nama, $tempat_lahir_ortu, $tanggal_lahir_ortu,
                            $agama_ortu, $kewarganegaraan_ortu, $pendidikan_terakhir, $pekerjaan, $penghasilan_bulanan,
                            $alamat_ortu, $no_hp_ortu, $status_hidup
                        );
                        $stmt_ortu->execute();
                        $stmt_ortu->close();
                    }
                }
            }
            
            echo "<script>
                Swal.fire({
                    icon: 'success',
                    title: 'Berhasil',
                    text: 'Data siswa berhasil diperbarui'
                }).then(() => {
                    window.location.href = 'index.php';
                });
            </script>";
        } else {
            echo "<script>
                Swal.fire({
                    icon: 'error',
                    title: 'Gagal',
                    text: 'Terjadi kesalahan: " . addslashes($stmt->error) . "'
                });
            </script>";
        }
        $stmt->close();
    } else {
        echo "<script>
            Swal.fire({
                icon: 'error',
                title: 'Gagal',
                text: 'Terjadi kesalahan: " . addslashes($conn->error) . "'
            });
        </script>";
    }
}
?>

<div class="container mt-4">
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h2><i class="fas fa-user-edit me-2"></i>Edit Data Siswa</h2>
        <a href="index.php" class="btn btn-secondary">
            <i class="fas fa-arrow-left me-1"></i> Kembali
        </a>
    </div>
    
    <div class="card border-0 shadow-lg">
        <div class="card-header bg-primary text-white py-3">
            <h5 class="card-title mb-0"><i class="fas fa-info-circle me-2"></i>Formulir Edit Data Siswa</h5>
        </div>
        <div class="card-body p-4">
            <form method="POST" enctype="multipart/form-data" id="formEditSiswa">
                <!-- Progress Bar -->
                <div class="row mb-4">
                    <div class="col-12">
                        <div class="progress-steps">
                            <div class="step active" data-step="1">
                                <span class="step-number">1</span>
                                <span class="step-text">Data Pribadi</span>
                            </div>
                            <div class="step" data-step="2">
                                <span class="step-number">2</span>
                                <span class="step-text">Data Keluarga</span>
                            </div>
                            <div class="step" data-step="3">
                                <span class="step-number">3</span>
                                <span class="step-text">Data Lainnya</span>
                            </div>
                        </div>
                    </div>
                </div>
                
                <!-- Step 1: Data Pribadi -->
                <div class="step-content" id="step1">
                    <h4 class="text-primary mb-4"><i class="fas fa-user me-2"></i>Data Pribadi</h4>
                    
                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label for="id_tahunajaran" class="form-label">Tahun Ajaran <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-calendar-alt"></i></span>
                                    <select class="form-select" id="id_tahunajaran" name="id_tahunajaran" required>
                                        <option value="">Pilih Tahun Ajaran</option>
                                        <?php foreach ($tahun_ajaran as $tahun): ?>
                                        <option value="<?= $tahun['id_tahunajaran'] ?>" <?= $tahun_siswa && $tahun['id_tahunajaran'] == $tahun_siswa['id_tahunajaran'] ? 'selected' : '' ?>>
                                            <?= $tahun['tahun_ajaran'] ?>
                                        </option>
                                        <?php endforeach; ?>
                                    </select>
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="nisn" class="form-label">NISN <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-id-card"></i></span>
                                    <input type="text" class="form-control" id="nisn" name="nisn" required 
                                           value="<?= htmlspecialchars($siswa['nisn']) ?>" placeholder="Masukkan NISN">
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="nis" class="form-label">NIS <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-id-card-alt"></i></span>
                                    <input type="text" class="form-control" id="nis" name="nis" required 
                                           value="<?= htmlspecialchars($siswa['nis']) ?>" placeholder="Masukkan NIS">
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="nama_lengkap" class="form-label">Nama Lengkap <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-user"></i></span>
                                    <input type="text" class="form-control" id="nama_lengkap" name="nama_lengkap" required 
                                           value="<?= htmlspecialchars($siswa['nama_lengkap']) ?>" placeholder="Masukkan nama lengkap">
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="nama_panggilan" class="form-label">Nama Panggilan</label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-signature"></i></span>
                                    <input type="text" class="form-control" id="nama_panggilan" name="nama_panggilan" 
                                           value="<?= htmlspecialchars($siswa['nama_panggilan']) ?>" placeholder="Masukkan nama panggilan">
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="jenis_kelamin" class="form-label">Jenis Kelamin <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-venus-mars"></i></span>
                                    <select class="form-select" id="jenis_kelamin" name="jenis_kelamin" required>
                                        <option value="">Pilih Jenis Kelamin</option>
                                        <option value="L" <?= $siswa['jenis_kelamin'] == 'L' ? 'selected' : '' ?>>Laki-laki</option>
                                        <option value="P" <?= $siswa['jenis_kelamin'] == 'P' ? 'selected' : '' ?>>Perempuan</option>
                                    </select>
                                </div>
                            </div>
                        </div>
                        
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label for="tempat_lahir" class="form-label">Tempat Lahir <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-map-marker-alt"></i></span>
                                    <input type="text" class="form-control" id="tempat_lahir" name="tempat_lahir" 
                                           value="<?= htmlspecialchars($siswa['tempat_lahir']) ?>" required placeholder="Masukkan tempat lahir">
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="tanggal_lahir" class="form-label">Tanggal Lahir <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-calendar"></i></span>
                                    <input type="date" class="form-control" id="tanggal_lahir" name="tanggal_lahir" 
                                           value="<?= $siswa['tanggal_lahir'] ?>" required>
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="agama" class="form-label">Agama <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-pray"></i></span>
                                    <select class="form-select" id="agama" name="agama" required>
                                        <option value="">Pilih Agama</option>
                                        <option value="Islam" <?= $siswa['agama'] == 'Islam' ? 'selected' : '' ?>>Islam</option>
                                        <option value="Kristen" <?= $siswa['agama'] == 'Kristen' ? 'selected' : '' ?>>Kristen</option>
                                        <option value="Katolik" <?= $siswa['agama'] == 'Katolik' ? 'selected' : '' ?>>Katolik</option>
                                        <option value="Hindu" <?= $siswa['agama'] == 'Hindu' ? 'selected' : '' ?>>Hindu</option>
                                        <option value="Buddha" <?= $siswa['agama'] == 'Buddha' ? 'selected' : '' ?>>Buddha</option>
                                        <option value="Konghucu" <?= $siswa['agama'] == 'Konghucu' ? 'selected' : '' ?>>Konghucu</option>
                                    </select>
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="kewarganegaraan" class="form-label">Kewarganegaraan <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-globe"></i></span>
                                    <input type="text" class="form-control" id="kewarganegaraan" name="kewarganegaraan" 
                                           value="<?= htmlspecialchars($siswa['kewarganegaraan']) ?>" required>
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="no_hp" class="form-label">No. HP</label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-phone"></i></span>
                                    <input type="text" class="form-control" id="no_hp" name="no_hp" 
                                           value="<?= htmlspecialchars($siswa['no_hp']) ?>" placeholder="Masukkan nomor handphone">
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="alamat" class="form-label">Alamat <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-home"></i></span>
                                    <textarea class="form-control" id="alamat" name="alamat" rows="3" required 
                                              placeholder="Masukkan alamat lengkap"><?= htmlspecialchars($siswa['alamat']) ?></textarea>
                                </div>
                            </div>
                        </div>
                    </div>
                    
                    <div class="d-flex justify-content-between mt-4">
                        <div></div> <!-- Spacer -->
                        <button type="button" class="btn btn-primary next-step" data-next="2">
                            Selanjutnya <i class="fas fa-arrow-right ms-1"></i>
                        </button>
                    </div>
                </div>
                
                <!-- Step 2: Data Keluarga -->
                <div class="step-content d-none" id="step2">
                    <h4 class="text-primary mb-4"><i class="fas fa-users me-2"></i>Data Keluarga</h4>
                    
                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label for="anak_ke" class="form-label">Anak Ke- <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-child"></i></span>
                                    <input type="number" class="form-control" id="anak_ke" name="anak_ke" min="1"
                                           value="<?= $siswa['anak_ke'] ?>" required placeholder="Contoh: 2">
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="jumlah_saudara_kandung" class="form-label">Jumlah Saudara Kandung <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-user-friends"></i></span>
                                    <input type="number" class="form-control" id="jumlah_saudara_kandung" name="jumlah_saudara_kandung" min="0" 
                                           value="<?= $siswa['jumlah_saudara_kandung'] ?>" required placeholder="Jumlah saudara kandung">
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="jumlah_saudara_tiri" class="form-label">Jumlah Saudara Tiri <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-user-friends"></i></span>
                                    <input type="number" class="form-control" id="jumlah_saudara_tiri" name="jumlah_saudara_tiri" min="0" 
                                           value="<?= $siswa['jumlah_saudara_tiri'] ?>" required placeholder="Jumlah saudara tiri">
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="jumlah_saudara_angkat" class="form-label">Jumlah Saudara Angkat <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-user-friends"></i></span>
                                    <input type="number" class="form-control" id="jumlah_saudara_angkat" name="jumlah_saudara_angkat" min="0" 
                                           value="<?= $siswa['jumlah_saudara_angkat'] ?>" required placeholder="Jumlah saudara angkat">
                                </div>
                            </div>
                        </div>
                        
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label for="status_anak" class="form-label">Status Anak <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-heart"></i></span>
                                    <select class="form-select" id="status_anak" name="status_anak" required>
                                        <option value="">Pilih Status</option>
                                        <option value="Kandung" <?= $siswa['status_anak'] == 'Kandung' ? 'selected' : '' ?>>Kandung</option>
                                        <option value="Tiri" <?= $siswa['status_anak'] == 'Tiri' ? 'selected' : '' ?>>Tiri</option>
                                        <option value="Angkat" <?= $siswa['status_anak'] == 'Angkat' ? 'selected' : '' ?>>Angkat</option>
                                    </select>
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="bahasa_sehari_hari" class="form-label">Bahasa Sehari-hari <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-language"></i></span>
                                    <input type="text" class="form-control" id="bahasa_sehari_hari" name="bahasa_sehari_hari" 
                                           value="<?= htmlspecialchars($siswa['bahasa_sehari_hari']) ?>" required placeholder="Bahasa yang digunakan sehari-hari">
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="tinggal_dengan" class="form-label">Tinggal Dengan <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-house-user"></i></span>
                                    <select class="form-select" id="tinggal_dengan" name="tinggal_dengan" required>
                                        <option value="">Pilih</option>
                                        <option value="Orang Tua" <?= $siswa['tinggal_dengan'] == 'Orang Tua' ? 'selected' : '' ?>>Orang Tua</option>
                                        <option value="Saudara" <?= $siswa['tinggal_dengan'] == 'Saudara' ? 'selected' : '' ?>>Saudara</option>
                                        <option value="Asrama" <?= $siswa['tinggal_dengan'] == 'Asrama' ? 'selected' : '' ?>>Asrama</option>
                                        <option value="Kos" <?= $siswa['tinggal_dengan'] == 'Kos' ? 'selected' : '' ?>>Kos</option>
                                    </select>
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="jarak_ke_sekolah" class="form-label">Jarak ke Sekolah <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-road"></i></span>
                                    <input type="text" class="form-control" id="jarak_ke_sekolah" name="jarak_ke_sekolah" 
                                           value="<?= htmlspecialchars($siswa['jarak_ke_sekolah']) ?>" required placeholder="Contoh: 5 km">
                                    <span class="input-group-text">km</span>
                                </div>
                            </div>
                        </div>
                    </div>
                    
                    <!-- Data Orang Tua -->
                    <h5 class="mt-4 mb-3 text-primary"><i class="fas fa-users me-2"></i>Data Orang Tua/Wali</h5>
                    <div id="orangtua-container">
                        <?php if (count($orang_tua) > 0): ?>
                            <?php foreach ($orang_tua as $index => $ortu): ?>
                            <div class="card mb-3 orangtua-item">
                                <div class="card-header d-flex justify-content-between align-items-center">
                                    <span>Data <?= $ortu['hubungan'] ?></span>
                                    <button type="button" class="btn btn-sm btn-danger hapus-orangtua" <?= count($orang_tua) <= 1 ? 'disabled' : '' ?>>
                                        <i class="fas fa-trash"></i>
                                    </button>
                                </div>
                                <div class="card-body">
                                    <div class="row">
                                        <div class="col-md-6">
                                            <input type="hidden" name="id_orangtua[]" value="<?= $ortu['id_orangtua'] ?>">
                                            <div class="mb-3">
                                                <label class="form-label">Hubungan <span class="text-danger">*</span></label>
                                                <select class="form-select" name="hubungan[]" required>
                                                    <option value="">Pilih Hubungan</option>
                                                    <option value="Ayah" <?= $ortu['hubungan'] == 'Ayah' ? 'selected' : '' ?>>Ayah</option>
                                                    <option value="Ibu" <?= $ortu['hubungan'] == 'Ibu' ? 'selected' : '' ?>>Ibu</option>
                                                    <option value="Wali" <?= $ortu['hubungan'] == 'Wali' ? 'selected' : '' ?>>Wali</option>
                                                </select>
                                            </div>
                                            
                                            <div class="mb-3">
                                                <label class="form-label">Nama Lengkap <span class="text-danger">*</span></label>
                                                <input type="text" class="form-control" name="nama_orangtua[]" 
                                                       value="<?= htmlspecialchars($ortu['nama']) ?>" required placeholder="Nama lengkap">
                                            </div>
                                            
                                            <div class="mb-3">
                                                <label class="form-label">Tempat Lahir</label>
                                                <input type="text" class="form-control" name="tempat_lahir_ortu[]" 
                                                       value="<?= htmlspecialchars($ortu['tempat_lahir']) ?>" placeholder="Tempat lahir">
                                            </div>
                                            
                                            <div class="mb-3">
                                                <label class="form-label">Tanggal Lahir</label>
                                                <input type="date" class="form-control" name="tanggal_lahir_ortu[]" 
                                                       value="<?= $ortu['tanggal_lahir'] ?>">
                                            </div>
                                            
                                            <div class="mb-3">
                                                <label class="form-label">Agama</label>
                                                <select class="form-select" name="agama_ortu[]">
                                                    <option value="">Pilih Agama</option>
                                                    <option value="Islam" <?= $ortu['agama'] == 'Islam' ? 'selected' : '' ?>>Islam</option>
                                                    <option value="Kristen" <?= $ortu['agama'] == 'Kristen' ? 'selected' : '' ?>>Kristen</option>
                                                    <option value="Katolik" <?= $ortu['agama'] == 'Katolik' ? 'selected' : '' ?>>Katolik</option>
                                                    <option value="Hindu" <?= $ortu['agama'] == 'Hindu' ? 'selected' : '' ?>>Hindu</option>
                                                    <option value="Buddha" <?= $ortu['agama'] == 'Buddha' ? 'selected' : '' ?>>Buddha</option>
                                                    <option value="Konghucu" <?= $ortu['agama'] == 'Konghucu' ? 'selected' : '' ?>>Konghucu</option>
                                                </select>
                                            </div>
                                            <div class="mb-3">
                                                <label class="form-label">Kewarganegaraan</label>
                                                <input type="text" class="form-control" name="kewarganegaraan_ortu[]" 
                                                       value="<?= htmlspecialchars($ortu['kewarganegaraan']) ?>" placeholder="Kewarganegaraan">
                                            </div>
                                        </div>
                                        
                                        <div class="col-md-6">
                                            <div class="mb-3">
                                                <label class="form-label">Pendidikan Terakhir</label>
                                                <input type="text" class="form-control" name="pendidikan_terakhir[]" 
                                                       value="<?= htmlspecialchars($ortu['pendidikan_terakhir']) ?>" placeholder="Pendidikan terakhir">
                                            </div>
                                            
                                            <div class="mb-3">
                                                <label class="form-label">Pekerjaan</label>
                                                <input type="text" class="form-control" name="pekerjaan[]" 
                                                       value="<?= htmlspecialchars($ortu['pekerjaan']) ?>" placeholder="Pekerjaan">
                                            </div>
                                            
                                            <div class="mb-3">
                                                <label class="form-label">Penghasilan Bulanan</label>
                                                <input type="number" class="form-control" name="penghasilan_bulanan[]" 
                                                       value="<?= $ortu['penghasilan_bulanan'] ?>" step="0.01" placeholder="Penghasilan bulanan">
                                            </div>
                                            
                                            <div class="mb-3">
                                                <label class="form-label">No. HP</label>
                                                <input type="text" class="form-control" name="no_hp_ortu[]" 
                                                       value="<?= htmlspecialchars($ortu['no_hp']) ?>" placeholder="Nomor handphone">
                                            </div>
                                            
                                            <div class="mb-3">
                                                <label class="form-label">Status</label>
                                                <select class="form-select" name="status_hidup[]">
                                                    <option value="Hidup" <?= $ortu['status_hidup'] == 'Hidup' ? 'selected' : '' ?>>Hidup</option>
                                                    <option value="Meninggal" <?= $ortu['status_hidup'] == 'Meninggal' ? 'selected' : '' ?>>Meninggal</option>
                                                </select>
                                            </div>
                                            
                                            <div class="mb-3">
                                                <label class="form-label">Alamat</label>
                                                <textarea class="form-control" name="alamat_ortu[]" rows="2" 
                                                          placeholder="Alamat lengkap"><?= htmlspecialchars($ortu['alamat']) ?></textarea>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <?php endforeach; ?>
                        <?php else: ?>
                            <div class="card mb-3 orangtua-item">
                                <div class="card-header d-flex justify-content-between align-items-center">
                                    <span>Data Orang Tua/Wali</span>
                                    <button type="button" class="btn btn-sm btn-danger hapus-orangtua" disabled>
                                        <i class="fas fa-trash"></i>
                                    </button>
                                </div>
                                <div class="card-body">
                                    <div class="row">
                                        <div class="col-md-6">
                                            <div class="mb-3">
                                                <label class="form-label">Hubungan <span class="text-danger">*</span></label>
                                                <select class="form-select" name="hubungan[]" required>
                                                    <option value="">Pilih Hubungan</option>
                                                    <option value="Ayah">Ayah</option>
                                                    <option value="Ibu">Ibu</option>
                                                    <option value="Wali">Wali</option>
                                                </select>
                                            </div>
                                            
                                            <div class="mb-3">
                                                <label class="form-label">Nama Lengkap <span class="text-danger">*</span></label>
                                                <input type="text" class="form-control" name="nama_orangtua[]" required placeholder="Nama lengkap">
                                            </div>
                                            
                                            <div class="mb-3">
                                                <label class="form-label">Tempat Lahir</label>
                                                <input type="text" class="form-control" name="tempat_lahir_ortu[]" placeholder="Tempat lahir">
                                            </div>
                                            
                                            <div class="mb-3">
                                                <label class="form-label">Tanggal Lahir</label>
                                                <input type="date" class="form-control" name="tanggal_lahir_ortu[]">
                                            </div>
                                            
                                            <div class="mb-3">
                                                <label class="form-label">Agama</label>
                                                <select class="form-select" name="agama_ortu[]">
                                                    <option value="">Pilih Agama</option>
                                                    <option value="Islam">Islam</option>
                                                    <option value="Kristen">Kristen</option>
                                                    <option value="Katolik">Katolik</option>
                                                    <option value="Hindu">Hindu</option>
                                                    <option value="Buddha">Buddha</option>
                                                    <option value="Konghucu">Konghucu</option>
                                                </select>
                                            </div>
                                             <div class="mb-3">
                                                <label class="form-label">Kewarganegaraan</label>
                                                <input type="text" class="form-control" name="kewarganegaraan_ortu[]" placeholder="Kewarganegaraan">
                                            </div>
                                        </div>
                                        
                                        <div class="col-md-6">
                                            
                                            <div class="mb-3">
                                                <label class="form-label">Pendidikan Terakhir</label>
                                                <input type="text" class="form-control" name="pendidikan_terakhir[]" placeholder="Pendidikan terakhir">
                                            </div>
                                            
                                            <div class="mb-3">
                                                <label class="form-label">Pekerjaan</label>
                                                <input type="text" class="form-control" name="pekerjaan[]" placeholder="Pekerjaan">
                                            </div>
                                            
                                            <div class="mb-3">
                                                <label class="form-label">Penghasilan Bulanan</label>
                                                <input type="number" class="form-control" name="penghasilan_bulanan[]" step="0.01" placeholder="Penghasilan bulanan">
                                            </div>
                                            
                                            <div class="mb-3">
                                                <label class="form-label">No. HP</label>
                                                <input type="text" class="form-control" name="no_hp_ortu[]" placeholder="Nomor handphone">
                                            </div>
                                            
                                            <div class="mb-3">
                                                <label class="form-label">Status</label>
                                                <select class="form-select" name="status_hidup[]">
                                                    <option value="Hidup">Hidup</option>
                                                    <option value="Meninggal">Meninggal</option>
                                                </select>
                                            </div>
                                            
                                            <div class="mb-3">
                                                <label class="form-label">Alamat</label>
                                                <textarea class="form-control" name="alamat_ortu[]" rows="2" placeholder="Alamat lengkap"></textarea>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        <?php endif; ?>
                    </div>
                    
                    <div class="d-flex justify-content-between mt-4">
                        <button type="button" class="btn btn-secondary prev-step" data-prev="1">
                            <i class="fas fa-arrow-left me-1"></i> Sebelumnya
                        </button>
                        <div>
                            <button type="button" class="btn btn-info me-2" id="tambah-orangtua">
                                <i class="fas fa-plus me-1"></i> Tambah Orang Tua/Wali
                            </button>
                            <button type="button" class="btn btn-primary next-step" data-next="3">
                                Selanjutnya <i class="fas fa-arrow-right ms-1"></i>
                            </button>
                        </div>
                    </div>
                </div>
                
                <!-- Step 3: Data Lainnya -->
                <div class="step-content d-none" id="step3">
                    <h4 class="text-primary mb-4"><i class="fas fa-info-circle me-2"></i>Data Lainnya</h4>
                    
                    <div class="row">
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label for="golongan_darah" class="form-label">Golongan Darah</label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-tint"></i></span>
                                    <select class="form-select" id="golongan_darah" name="golongan_darah">
                                        <option value="">Pilih Golongan Darah</option>
                                        <option value="A" <?= $siswa['golongan_darah'] == 'A' ? 'selected' : '' ?>>A</option>
                                        <option value="B" <?= $siswa['golongan_darah'] == 'B' ? 'selected' : '' ?>>B</option>
                                        <option value="AB" <?= $siswa['golongan_darah'] == 'AB' ? 'selected' : '' ?>>AB</option>
                                        <option value="O" <?= $siswa['golongan_darah'] == 'O' ? 'selected' : '' ?>>O</option>
                                    </select>
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="tinggi_cm" class="form-label">Tinggi Badan</label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-ruler-vertical"></i></span>
                                    <input type="number" class="form-control" id="tinggi_cm" name="tinggi_cm" min="0" 
                                           value="<?= $siswa['tinggi_cm'] ?>" placeholder="Tinggi badan dalam cm">
                                    <span class="input-group-text">cm</span>
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="berat_kg" class="form-label">Berat Badan</label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-weight"></i></span>
                                    <input type="number" class="form-control" id="berat_kg" name="berat_kg" min="0" step="0.1" 
                                           value="<?= $siswa['berat_kg'] ?>" placeholder="Berat badan dalam kg">
                                    <span class="input-group-text">kg</span>
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="riwayat_penyakit" class="form-label">Riwayat Penyakit</label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-heartbeat"></i></span>
                                    <textarea class="form-control" id="riwayat_penyakit" name="riwayat_penyakit" rows="3" 
                                              placeholder="Riwayat penyakit yang pernah diderita"><?= htmlspecialchars($siswa['riwayat_penyakit']) ?></textarea>
                                </div>
                            </div>
                        </div>
                        
                        <div class="col-md-6">
                            <div class="mb-3">
                                <label for="kelainan_jasmani" class="form-label">Kelainan Jasmani</label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-wheelchair"></i></span>
                                    <textarea class="form-control" id="kelainan_jasmani" name="kelainan_jasmani" rows="3" 
                                              placeholder="Kelainan jasmani/cacat tubuh"><?= htmlspecialchars($siswa['kelainan_jasmani']) ?></textarea>
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="tanggal_diterima" class="form-label">Tanggal Diterima <span class="text-danger">*</span></label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-calendar-check"></i></span>
                                    <input type="date" class="form-control" id="tanggal_diterima" name="tanggal_diterima" 
                                           value="<?= $siswa['tanggal_diterima'] ?>" required>
                                </div>
                            </div>
                            
                            <div class="mb-3">
                                <label for="foto_masuk" class="form-label">Foto</label>
                                <div class="input-group">
                                    <span class="input-group-text"><i class="fas fa-camera"></i></span>
                                    <input type="file" class="form-control" id="foto_masuk" name="foto_masuk" accept="image/*">
                                </div>
                                <div class="form-text">Maksimal ukuran file: 2MB. Format: JPG, PNG, JPEG</div>
                                
                                <?php if ($siswa['foto_masuk']): ?>
                                <div class="mt-2">
                                    <img src="../uploads/foto-siswa/<?= $siswa['foto_masuk'] ?>" alt="Foto Siswa" 
                                         class="img-thumbnail" style="max-height: 150px;">
                                    <div class="form-text">Foto saat ini</div>
                                </div>
                                <?php endif; ?>
                            </div>
                        </div>
                    </div>
                    
                    <div class="d-flex justify-content-between mt-4">
                        <button type="button" class="btn btn-secondary prev-step" data-prev="2">
                            <i class="fas fa-arrow-left me-1"></i> Sebelumnya
                        </button>
                        <button type="submit" class="btn btn-success">
                            <i class="fas fa-save me-1"></i> Simpan Perubahan
                        </button>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

<!-- Template untuk orang tua baru -->
<template id="orangtua-template">
    <div class="card mb-3 orangtua-item">
        <div class="card-header d-flex justify-content-between align-items-center">
            <span>Data Orang Tua/Wali Baru</span>
            <button type="button" class="btn btn-sm btn-danger hapus-orangtua">
                <i class="fas fa-trash"></i>
            </button>
        </div>
        <div class="card-body">
            <div class="row">
                <div class="col-md-6">
                    <div class="mb-3">
                        <label class="form-label">Hubungan <span class="text-danger">*</span></label>
                        <select class="form-select" name="hubungan[]" required>
                            <option value="">Pilih Hubungan</option>
                            <option value="Ayah">Ayah</option>
                            <option value="Ibu">Ibu</option>
                            <option value="Wali">Wali</option>
                        </select>
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label">Nama Lengkap <span class="text-danger">*</span></label>
                        <input type="text" class="form-control" name="nama_orangtua[]" required placeholder="Nama lengkap">
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label">Tempat Lahir</label>
                        <input type="text" class="form-control" name="tempat_lahir_ortu[]" placeholder="Tempat lahir">
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label">Tanggal Lahir</label>
                        <input type="date" class="form-control" name="tanggal_lahir_ortu[]">
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label">Agama</label>
                        <select class="form-select" name="agama_ortu[]">
                            <option value="">Pilih Agama</option>
                            <option value="Islam">Islam</option>
                            <option value="Kristen">Kristen</option>
                            <option value="Katolik">Katolik</option>
                            <option value="Hindu">Hindu</option>
                            <option value="Buddha">Buddha</option>
                            <option value="Konghucu">Konghucu</option>
                        </select>
                    </div>
                    <div class="mb-3">
                        <label class="form-label">Kewarganegaraan</label>
                        <input type="text" class="form-control" name="kewarganegaraan_ortu[]" placeholder="Kewarganegaraan">
                    </div>
                </div>
                
                <div class="col-md-6">
                    <div class="mb-3">
                        <label class="form-label">Pendidikan Terakhir</label>
                        <input type="text" class="form-control" name="pendidikan_terakhir[]" placeholder="Pendidikan terakhir">
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label">Pekerjaan</label>
                        <input type="text" class="form-control" name="pekerjaan[]" placeholder="Pekerjaan">
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label">Penghasilan Bulanan</label>
                        <input type="number" class="form-control" name="penghasilan_bulanan[]" step="0.01" placeholder="Penghasilan bulanan">
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label">No. HP</label>
                        <input type="text" class="form-control" name="no_hp_ortu[]" placeholder="Nomor handphone">
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label">Status</label>
                        <select class="form-select" name="status_hidup[]">
                            <option value="Hidup">Hidup</option>
                            <option value="Meninggal">Meninggal</option>
                        </select>
                    </div>
                    
                    <div class="mb-3">
                        <label class="form-label">Alamat</label>
                        <textarea class="form-control" name="alamat_ortu[]" rows="2" placeholder="Alamat lengkap"></textarea>
                    </div>
                </div>
            </div>
        </div>
    </div>
</template>

<style>
.progress-steps {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
    position: relative;
}

.progress-steps::before {
    content: '';
    position: absolute;
    top: 20px;
    left: 0;
    right: 0;
    height: 2px;
    background-color: #dee2e6;
    z-index: 1;
}

.step {
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
    z-index: 2;
}

.step-number {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #dee2e6;
    color: #6c757d;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    margin-bottom: 8px;
    transition: all 0.3s ease;
}

.step.active .step-number {
    background-color: #0d6efd;
    color: white;
}

.step-text {
    font-size: 0.9rem;
    color: #6c757d;
    transition: all 0.3s ease;
}

.step.active .step-text {
    color: #0d6efd;
    font-weight: bold;
}

.step-content {
    transition: opacity 0.3s ease;
}

.orangtua-item {
    transition: all 0.3s ease;
}

.is-invalid {
    border-color: #dc3545;
}

.invalid-feedback {
    display: block;
    width: 100%;
    margin-top: 0.25rem;
    font-size: 0.875em;
    color: #dc3545;
}
</style>

<script>
document.addEventListener('DOMContentLoaded', function() {
    // Navigation between steps
    const steps = document.querySelectorAll('.step');
    const stepContents = document.querySelectorAll('.step-content');
    
    // Next step buttons
    document.querySelectorAll('.next-step').forEach(button => {
        button.addEventListener('click', function() {
            const currentStep = this.closest('.step-content').id.replace('step', '');
            const nextStep = this.dataset.next;
            
            // Validate current step before proceeding
            if (validateStep(currentStep)) {
                // Hide current step
                document.getElementById(`step${currentStep}`).classList.add('d-none');
                
                // Show next step
                document.getElementById(`step${nextStep}`).classList.remove('d-none');
                
                // Update progress
                steps.forEach(step => step.classList.remove('active'));
                document.querySelector(`.step[data-step="${nextStep}"]`).classList.add('active');
                
                // Scroll to top of the form
                document.querySelector('.card-body').scrollIntoView({ behavior: 'smooth', block: 'start' });
            }
        });
    });
    
    // Previous step buttons
    document.querySelectorAll('.prev-step').forEach(button => {
        button.addEventListener('click', function() {
            const currentStep = this.closest('.step-content').id.replace('step', '');
            const prevStep = this.dataset.prev;
            
            // Hide current step
            document.getElementById(`step${currentStep}`).classList.add('d-none');
            
            // Show previous step
            document.getElementById(`step${prevStep}`).classList.remove('d-none');
            
            // Update progress
            steps.forEach(step => step.classList.remove('active'));
            document.querySelector(`.step[data-step="${prevStep}"]`).classList.add('active');
            
            // Scroll to top of the form
            document.querySelector('.card-body').scrollIntoView({ behavior: 'smooth', block: 'start' });
        });
    });
    
    // Add new orang tua form
    document.getElementById('tambah-orangtua').addEventListener('click', function() {
        const template = document.getElementById('orangtua-template');
        const clone = template.content.cloneNode(true);
        const container = document.getElementById('orangtua-container');
        container.appendChild(clone);
        
        // Enable delete buttons if there are multiple items
        updateDeleteButtons();
    });
    
    // Delete orang tua form
    document.addEventListener('click', function(e) {
        if (e.target.classList.contains('hapus-orangtua') || 
            e.target.closest('.hapus-orangtua')) {
            const button = e.target.classList.contains('hapus-orangtua') ? 
                e.target : e.target.closest('.hapus-orangtua');
            const item = button.closest('.orangtua-item');
            
            if (document.querySelectorAll('.orangtua-item').length > 1) {
                // Confirmation before deletion
                Swal.fire({
                    title: 'Hapus Data?',
                    text: 'Apakah Anda yakin ingin menghapus data orang tua/wali ini?',
                    icon: 'warning',
                    showCancelButton: true,
                    confirmButtonColor: '#d33',
                    cancelButtonColor: '#3085d6',
                    confirmButtonText: 'Ya, Hapus!',
                    cancelButtonText: 'Batal'
                }).then((result) => {
                    if (result.isConfirmed) {
                        item.remove();
                        updateDeleteButtons();
                        
                        Swal.fire({
                            icon: 'success',
                            title: 'Dihapus!',
                            text: 'Data orang tua/wali berhasil dihapus',
                            timer: 1500,
                            showConfirmButton: false
                        });
                    }
                });
            }
        }
    });
    
    function updateDeleteButtons() {
        const items = document.querySelectorAll('.orangtua-item');
        const buttons = document.querySelectorAll('.hapus-orangtua');
        
        if (items.length <= 1) {
            buttons.forEach(btn => btn.disabled = true);
        } else {
            buttons.forEach(btn => btn.disabled = false);
        }
    }
    
    function validateStep(step) {
        const currentStepElement = document.getElementById(`step${step}`);
        const requiredFields = currentStepElement.querySelectorAll('[required]');
        let isValid = true;
        
        // Hapus semua error state sebelumnya
        currentStepElement.querySelectorAll('.is-invalid').forEach(field => {
            field.classList.remove('is-invalid');
        });
        currentStepElement.querySelectorAll('.invalid-feedback').forEach(error => {
            error.remove();
        });
        
        // Validasi setiap field required
        requiredFields.forEach(field => {
            if (!field.value.trim()) {
                isValid = false;
                field.classList.add('is-invalid');
                
                // Tambahkan pesan error
                const errorDiv = document.createElement('div');
                errorDiv.className = 'invalid-feedback';
                errorDiv.textContent = 'Field ini wajib diisi';
                field.parentNode.appendChild(errorDiv);
            }
        });
        
        // Validasi khusus untuk step 2 (orang tua)
        if (step === '2') {
            const orangTuaItems = document.querySelectorAll('.orangtua-item');
            let orangTuaValid = true;
            let firstErrorField = null;

            orangTuaItems.forEach((item, index) => {
                const namaField = item.querySelector('input[name="nama_orangtua[]"]');
                const hubunganField = item.querySelector('select[name="hubungan[]"]');
                const anakKeField = document.querySelector('#anak_ke');

                // Validasi nama orang tua
                if (!namaField.value.trim()) {
                    orangTuaValid = false;
                    namaField.classList.add('is-invalid');
                    if (!namaField.nextElementSibling || !namaField.nextElementSibling.classList.contains('invalid-feedback')) {
                        const errorDiv = document.createElement('div');
                        errorDiv.className = 'invalid-feedback';
                        errorDiv.textContent = 'Nama orang tua wajib diisi';
                        namaField.parentNode.appendChild(errorDiv);
                    }
                    if (!firstErrorField) firstErrorField = namaField;
                }

                // Validasi hubungan
                if (!hubunganField.value) {
                    orangTuaValid = false;
                    hubunganField.classList.add('is-invalid');
                    if (!hubunganField.nextElementSibling || !hubunganField.nextElementSibling.classList.contains('invalid-feedback')) {
                        const errorDiv = document.createElement('div');
                        errorDiv.className = 'invalid-feedback';
                        errorDiv.textContent = 'Hubungan wajib dipilih';
                        hubunganField.parentNode.appendChild(errorDiv);
                    }
                    if (!firstErrorField) firstErrorField = hubunganField;
                }

                // Validasi anak_ke < 1
                if (anakKeField && parseInt(anakKeField.value) < 1) {
                    orangTuaValid = false;
                    anakKeField.classList.add('is-invalid');
                    if (!anakKeField.nextElementSibling || !anakKeField.nextElementSibling.classList.contains('invalid-feedback')) {
                        const errorDiv = document.createElement('div');
                        errorDiv.className = 'invalid-feedback';
                        errorDiv.textContent = 'Nomor anak minimal 1';
                        anakKeField.parentNode.appendChild(errorDiv);
                    }
                    if (!firstErrorField) firstErrorField = anakKeField;
                }
            });

            if (!orangTuaValid) {
                isValid = false;
                // Scroll ke field error pertama
                if (firstErrorField) {
                    firstErrorField.scrollIntoView({ behavior: 'smooth', block: 'center' });
                    firstErrorField.focus();
                }
            }
        }
        
        if (!isValid) {
            // Scroll ke error pertama
            const firstError = currentStepElement.querySelector('.is-invalid');
            if (firstError) {
                firstError.scrollIntoView({ behavior: 'smooth', block: 'center' });
            }
            
            // Tampilkan pesan error
            Swal.fire({
                icon: 'error',
                title: 'Data Belum Lengkap',
                text: 'Harap lengkapi semua field yang wajib diisi',
                timer: 3000,
                showConfirmButton: true
            });
        }
        
        return isValid;
    }
    
    // Form submission handler
    document.getElementById('formEditSiswa').addEventListener('submit', function(e) {
        // Validasi semua step sebelum submit
        let allValid = true;
        
        for (let i = 1; i <= 3; i++) {
            if (!validateStep(i.toString())) {
                allValid = false;
                // Switch to the step that has error
                document.querySelectorAll('.step-content').forEach(content => {
                    content.classList.add('d-none');
                });
                document.getElementById(`step${i}`).classList.remove('d-none');
                
                // Update progress
                steps.forEach(step => step.classList.remove('active'));
                document.querySelector(`.step[data-step="${i}"]`).classList.add('active');
                break;
            }
        }
        
        if (!allValid) {
            e.preventDefault();
            Swal.fire({
                icon: 'error',
                title: 'Data Belum Valid',
                text: 'Harap periksa kembali data yang Anda masukkan',
                timer: 3000,
                showConfirmButton: true
            });
        } else {
            // Tampilkan loading indicator
            const submitButton = this.querySelector('button[type="submit"]');
            const originalText = submitButton.innerHTML;
            submitButton.innerHTML = '<i class="fas fa-spinner fa-spin me-1"></i> Menyimpan...';
            submitButton.disabled = true;
        }
    });
    
    // Real-time validation untuk field required
    document.querySelectorAll('[required]').forEach(field => {
        field.addEventListener('blur', function() {
            if (!this.value.trim()) {
                this.classList.add('is-invalid');
                if (!this.nextElementSibling || !this.nextElementSibling.classList.contains('invalid-feedback')) {
                    const errorDiv = document.createElement('div');
                    errorDiv.className = 'invalid-feedback';
                    errorDiv.textContent = 'Field ini wajib diisi';
                    this.parentNode.appendChild(errorDiv);
                }
            } else {
                this.classList.remove('is-invalid');
                if (this.nextElementSibling && this.nextElementSibling.classList.contains('invalid-feedback')) {
                    this.nextElementSibling.remove();
                }
            }
        });
        
        field.addEventListener('input', function() {
            if (this.value.trim()) {
                this.classList.remove('is-invalid');
                if (this.nextElementSibling && this.nextElementSibling.classList.contains('invalid-feedback')) {
                    this.nextElementSibling.remove();
                }
            }
        });
    });
    
    // Initialize delete buttons state
    updateDeleteButtons();
});
</script>

<?php
require_once '../includes/footer.php';
?>