<div class="row">
    <div class="col-lg-7">
        <div class="row">
            <div class="col-md-12">
                <div class="card mb-6">
                    <div class="card-body">
                        <div class="row">
                            <div class="col-md-12">
                                <small class="card-text text-uppercase text-muted small">Informasi</small>
                                <table class="mt-2">
                                    <tr class="mb-2">
                                        <td style="width: 5%;vertical-align: top;"><i class="ti ti-category-minus ti-lg"></i></td>
                                        <td style="width: 30%;vertical-align: top;"><span class="fw-medium mx-2">NIS</span></td>
                                        <td style="width: 5%;vertical-align: top;"><span class="fw-medium mx-2">:</span></td>
                                        <td style="width: 60;vertical-align: top;"><span class="info-nis"></span></td>
                                    </tr>
                                    <tr class="mb-2">
                                        <td style="vertical-align: top;"><i class="ti ti-box ti-lg"></i></td>
                                        <td style="vertical-align: top;"><span class="fw-medium mx-2">Nama Lengkap Siswa</span></td>
                                        <td style="vertical-align: top;"><span class="fw-medium mx-2">:</span></td>
                                        <td style="vertical-align: top;"><span class="info-name"></span></td>
                                    </tr>
                                    <tr class="mb-2">
                                        <td style="vertical-align: top;"><i class="ti ti-box ti-lg"></i></td>
                                        <td style="vertical-align: top;"><span class="fw-medium mx-2">NISN</span></td>
                                        <td style="vertical-align: top;"><span class="fw-medium mx-2">:</span></td>
                                        <td style="vertical-align: top;"><span class="info-nisn"></span></td>
                                    </tr>
                                    <tr class="mb-2">
                                        <td style="vertical-align: top;"><i class="ti ti-box ti-lg"></i></td>
                                        <td style="vertical-align: top;"><span class="fw-medium mx-2">KELAS</span></td>
                                        <td style="vertical-align: top;"><span class="fw-medium mx-2">:</span></td>
                                        <td style="vertical-align: top;"><span class="info-kelas_name"></span></td>
                                    </tr>
                                    <tr class="mb-2">
                                        <td style="vertical-align: top;"><i class="ti ti-tags ti-lg"></i></td>
                                        <td style="vertical-align: top;"><span class="fw-medium mx-2">PROGRAM KEAHLIAN</span></td>
                                        <td style="vertical-align: top;"><span class="fw-medium mx-2">:</span></td>
                                        <td style="vertical-align: top;"><span class="info-program_keahlian"></span></td>
                                    </tr>
                                    <tr class="mb-2">
                                        <td style="vertical-align: top;"><i class="ti ti-tags ti-lg"></i></td>
                                        <td style="vertical-align: top;"><span class="fw-medium mx-2">KONESTRASI KEAHLIAN</span></td>
                                        <td style="vertical-align: top;"><span class="fw-medium mx-2">:</span></td>
                                        <td style="vertical-align: top;"><span class="info-kompt_keahlian"></span></td>
                                    </tr>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-md-5 d-none">
                <div class="row">
                    <!-- Card Border Shadow -->
                    <div class="col-lg-12">
                        <div class="card card-border-shadow-primary h-100">
                            <div class="card-body">
                                <div class="d-flex align-items-center mb-2">
                                    <div class="avatar me-4">
                                        <span class="avatar-initial rounded bg-label-primary"><i class="ti ti-truck ti-28px"></i></span>
                                    </div>
                                    <h4 class="mb-0">42</h4>
                                </div>
                                <p class="mb-1">On route vehicles</p>
                                <p class="mb-0">
                                    <span class="text-heading fw-medium me-2">+18.2%</span>
                                    <small class="text-muted">than last week</small>
                                </p>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-12 mt-2">
                        <div class="card card-border-shadow-warning h-100">
                            <div class="card-body">
                                <div class="d-flex align-items-center mb-2">
                                    <div class="avatar me-4">
                                        <span class="avatar-initial rounded bg-label-warning"><i class="ti ti-alert-triangle ti-28px"></i></span>
                                    </div>
                                    <h4 class="mb-0">8</h4>
                                </div>
                                <p class="mb-1">Vehicles with errors</p>
                                <p class="mb-0">
                                    <span class="text-heading fw-medium me-2">-8.7%</span>
                                    <small class="text-muted">than last week</small>
                                </p>
                            </div>
                        </div>
                    </div>
                    <!--/ Card Border Shadow -->
                </div>
            </div>
        </div>
    </div>
    <div class="col-lg-5">
        <div class="card mb-4 shadow-sm">
            <div class="row g-0">
                <div class="col-md-3 d-flex align-items-center justify-content-center p-3">
                    <img src="<?php echo e(asset('images/logo.png')); ?>" alt="Logo Sekolah" class="img-fluid" style="max-height: 100px;">
                </div>
                <div class="col-md-9">
                    <div class="card-body">
                        <h5 class="card-title mb-1 info-sekolah_name">SMA Negeri Contoh</h5>
                        <p class="card-text text-muted mb-2 info-sekolah_alamat">Jl. Pendidikan No. 123, Kecamatan Belajar, Kota Ilmu, 12345</p>
                        <p class="card-text"><small class="text-muted">Email: <span class="info-sekolah_email">info@smancontoh.sch.id</span> | Telp: <span class="info-sekolah_tlpn">(021) 12345678</span></small></p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="row my-4">
    <div class="col-md-12">
        <div class="card shadow-sm" id="pengumuman-card">
            <div class="row g-0">
                <div class="col-12">
                    <div class="card-body text-center">
                        <h5 class="card-title mb-3 fw-bold" style="font-size: 1.5rem">
                            Pengumuman Kelulusan
                        </h5>

                        <div id="countdown-section">
                            <p class="card-text text-muted">Akan dimulai dalam:</p>

                            <div class="d-flex justify-content-center gap-3 flex-wrap" id="countdown">
                                <?php $__currentLoopData = ['days' => 'Hari', 'hours' => 'Jam', 'minutes' => 'Menit', 'seconds' => 'Detik']; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $id => $label): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                <div class="text-center border rounded px-3 py-2 shadow-sm" style="min-width: 70px;">
                                    <h2 class="fw-bold text-dark mb-0" id="<?php echo e($id); ?>">00</h2>
                                    <small class="text-muted"><?php echo e($label); ?></small>
                                </div>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                            </div>

                            <p class="mt-4 text-muted fst-italic">
                                Terima kasih telah menjadi bagian dari perjalanan sekolah ini. Kami mendoakan yang terbaik untuk masa depan Anda.
                            </p>
                        </div>

                        <div id="status-message" class="mt-3"></div>
                    </div>
                </div>
            </div>
        </div>


        <div id="ucapan"></div>

    </div>
</div><?php /**PATH /var/www/html/apis/resources/views/admin/dashboard/siswa/default.blade.php ENDPATH**/ ?>