@extends('layouts.app')

@section('title', 'Pendaftaran Berhasil')

@section('content')
<main class="public-spmb min-h-screen bg-slate-50 px-4 py-5 sm:px-6 sm:py-8">
    <div class="mx-auto max-w-3xl space-y-5">
        <div class="flex items-center justify-between gap-4 rounded-2xl border border-blue-100 bg-white px-4 py-3 shadow-sm sm:px-5">
            <div class="flex min-w-0 items-center gap-3">
                <span class="grid size-11 shrink-0 place-items-center overflow-hidden rounded-xl border border-slate-100 bg-white">
                    <img src="{{ asset('images/logo.png') }}" alt="" class="size-full object-contain p-1">
                </span>
                <div class="min-w-0">
                    <p class="truncate text-sm font-extrabold tracking-wide text-[#173b67]">SMARTPenF</p>
                    <p class="mt-0.5 truncate text-[11px] text-slate-500">Manajemen pendidikan nonformal</p>
                </div>
            </div>
            <span class="inline-flex shrink-0 items-center gap-2 rounded-full border border-blue-100 bg-blue-50 px-3 py-1.5 text-xs font-semibold text-blue-700"><i class="bi bi-globe2" aria-hidden="true"></i><span class="hidden sm:inline">Portal pendaftaran</span><span class="sm:hidden">SPMB</span></span>
        </div>

        <header class="public-spmb__hero rounded-2xl px-5 py-5 text-white shadow-md sm:px-7 sm:py-6">
            <p class="flex items-center gap-2 text-xs font-semibold text-blue-100"><span>SPMB</span><i class="bi bi-chevron-right text-[9px]" aria-hidden="true"></i><span>Pendaftaran peserta didik baru</span></p>
            <h1 class="mt-2 text-xl font-bold tracking-tight sm:text-2xl">{{ $school->nama_pkbm }}</h1>
        </header>

        <section class="sp-card p-6 text-center sm:p-10">
            <span class="mx-auto grid size-12 place-items-center rounded-xl bg-emerald-50 text-xl text-emerald-600"><i class="bi bi-check2-circle" aria-hidden="true"></i></span>
            <p class="mt-4 text-xs font-bold uppercase tracking-wide text-emerald-700">Pendaftaran terkirim</p>
            <h2 class="sp-section-title mt-2">Terima kasih telah mendaftar</h2>
            <p class="mx-auto mt-2 max-w-xl text-sm leading-6 text-slate-600">Data pendaftaran Anda sudah diterima oleh <strong>{{ $school->nama_pkbm }}</strong> dan akan diverifikasi oleh pihak lembaga.</p>
            <div class="mx-auto mt-6 max-w-xl rounded-xl border border-blue-100 bg-blue-50/70 p-4 text-left text-sm leading-6 text-slate-700">
                <p class="font-semibold text-blue-900"><i class="bi bi-info-circle mr-1" aria-hidden="true"></i>Langkah selanjutnya</p>
                <p class="mt-1">Simpan nomor HP yang dicantumkan dan tunggu informasi tindak lanjut dari lembaga. Status pendaftaran dapat ditanyakan langsung kepada {{ $school->nama_pkbm }}.</p>
            </div>
            <a href="{{ route('public.spmb.show', $slug) }}" class="sp-btn-secondary mt-6"><i class="bi bi-arrow-left" aria-hidden="true"></i>Kembali ke halaman pendaftaran</a>
        </section>
    </div>
</main>
@endsection