{{-- resources/views/public/ppdb/index.blade.php --}}
@extends('layouts.public')
@section('title', 'Informasi PPDB')

@section('content')
<section class="position-relative d-flex align-items-center justify-content-center overflow-hidden" style="min-height: 45vh; padding-top: 140px; padding-bottom: 120px; background: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary-emerald) 100%);">
    <div class="position-absolute top-0 start-0 w-100 h-100" style="background-image: radial-gradient(rgba(255,255,255,0.1) 1px, transparent 1px); background-size: 20px 20px; opacity: 0.3;"></div>
    
    <div class="container position-relative text-center text-white" style="z-index: 2;">
        <span class="badge px-4 py-2 rounded-pill mb-3" style="background: var(--accent-gold); color: var(--primary-dark); font-size: 0.95rem; font-weight: 700; box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);">
            <i class="bi bi-megaphone-fill me-1"></i> Informasi Pendaftaran
        </span>
        <h1 class="fw-bold mx-auto mb-3" style="font-size: 3rem; font-family: 'Cairo', sans-serif; text-shadow: 0 2px 10px rgba(0,0,0,0.3);">
            Penerimaan Peserta Didik Baru
        </h1>
        <p class="lead mx-auto" style="max-width: 750px; color: rgba(255,255,255,0.9); font-weight: 400; font-size: 1.1rem;">
            Bergabunglah bersama kami di <strong>{{ $profil->nama_madrasah ?? 'Madrasah' }}</strong> untuk meraih masa depan yang cerah, cerdas akademik, dan berakhlak mulia.
        </p>
    </div>
</section>

<section class="section-spacing section-bg-light" style="padding-top: 0; padding-bottom: 100px;">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-lg-8">
                
                @if(session('error'))
                    <div class="alert alert-danger shadow-sm border-0 mb-4" style="margin-top: -20px; position: relative; z-index: 4;">
                        <i class="bi bi-x-circle-fill me-2"></i> {{ session('error') }}
                    </div>
                @endif

                <div class="card border-0 shadow-lg rounded-4 overflow-hidden bg-white" style="margin-top: -60px; z-index: 3; position: relative;">
                    <div class="card-header text-white p-4 text-center border-bottom-0" style="background: linear-gradient(135deg, var(--primary-emerald) 0%, var(--primary-light) 100%);">
                        <h4 class="mb-0 fw-bold d-flex justify-content-center align-items-center gap-2">
                            Status Pendaftaran: 
                            @if($taAktif)
                                <span class="badge bg-success border border-white px-3 py-2 rounded-pill shadow-sm" style="font-size: 1rem;"><i class="bi bi-door-open-fill me-1"></i> BUKA</span>
                            @else
                                <span class="badge bg-danger border border-white px-3 py-2 rounded-pill shadow-sm" style="font-size: 1rem;"><i class="bi bi-door-closed-fill me-1"></i> DITUTUP</span>
                            @endif
                        </h4>
                    </div>
                    <div class="card-body p-4 p-md-5">
                        <h5 class="fw-bold text-dark mb-4" style="font-family: 'Cairo', sans-serif;"><i class="bi bi-list-check text-primary me-2"></i>Persyaratan Umum Pendaftaran:</h5>
                        
                        <ul class="list-group list-group-flush mb-5 text-muted" style="font-size: 1.05rem;">
                            <li class="list-group-item px-0 py-3 border-bottom border-light"><i class="bi bi-check-circle-fill text-success me-3 fs-5"></i> Mengisi formulir pendaftaran secara online.</li>
                            <li class="list-group-item px-0 py-3 border-bottom border-light"><i class="bi bi-check-circle-fill text-success me-3 fs-5"></i> Fotokopi Akta Kelahiran dan Kartu Keluarga (KK).</li>
                            <li class="list-group-item px-0 py-3 border-bottom border-light"><i class="bi bi-check-circle-fill text-success me-3 fs-5"></i> Memiliki NISN yang valid dari sekolah asal.</li>
                            <li class="list-group-item px-0 py-3 border-bottom border-light"><i class="bi bi-check-circle-fill text-success me-3 fs-5"></i> Pas foto terbaru berlatar belakang merah.</li>
                        </ul>

                        <div class="d-grid gap-3 d-sm-flex justify-content-sm-center text-center">
                            @if($taAktif)
                                <a href="{{ route('public.ppdb.create') }}" class="btn-daftar text-decoration-none d-inline-flex align-items-center justify-content-center w-100 py-3 fs-5">
                                    <i class="bi bi-pencil-square me-2"></i> Daftar PPDB Online Sekarang
                                </a>
                            @else
                                <button class="btn btn-secondary btn-lg px-5 py-3 fw-bold rounded-pill w-100" disabled style="opacity: 0.7;">
                                    <i class="bi bi-lock-fill me-2"></i> Gelombang Pendaftaran Ditutup
                                </button>
                            @endif
                        </div>
                    </div>
                </div>
                
            </div>
        </div>
    </div>
</section>
@endsection