@extends('layouts.app')

@section('title', 'Admission Procedure - ' . $siteContext->name)

@section('content')
    <!-- breadcrumb -->
    <div class="site-breadcrumb" style="background-image: url('{{ asset('assets/img/breadcrumb/breadcrumb.jpg') }}'); background-size: cover; background-position: center; padding: 80px 0;">
        <div class="container text-center text-white">
            <h2 class="breadcrumb-title text-white">Admission Procedure</h2>
            <ul class="breadcrumb-menu d-flex justify-content-center list-unstyled gap-2 mt-2">
                <li><a href="{{ route('home') }}" class="text-white">Home</a></li>
                <li class="text-white">/</li>
                <li class="text-white">Admissions</li>
                <li class="text-white">/</li>
                <li class="active text-white">Procedure</li>
            </ul>
        </div>
    </div>
    <!-- breadcrumb end -->

    <!-- admission procedure section -->
    <div class="admission-procedure py-120">
        <div class="container">
            <div class="row align-items-center g-5 mb-5">
                <div class="col-lg-7">
                    <div class="admission-intro">
                        <span class="site-title-tagline"><i class="far fa-book-open-reader"></i> Join Our Family</span>
                        <h2 class="site-title mb-4">How to Apply for <span>Admission</span></h2>
                        <p class="text-justify mb-3">
                            Admission at <strong>{{ $siteContext->name }}</strong> is open to all qualified students without distinction of religion, race, caste, or place of birth. We align our processes with the regulations of the local government and the Ministry of Education, Science, and Technology.
                        </p>
                        <p class="text-justify mb-0">
                            Generally, applications are open for Montessori/Nursery through Grade IX, and for Plus Two (+2) Grade XI. Notice of admissions is widely published in local daily newspapers, on our website, and on our official social media handles near the end of each academic session.
                        </p>
                    </div>
                </div>
                <div class="col-lg-5">
                    <div class="card border-0 shadow-sm p-4 bg-primary text-white text-center rounded position-relative overflow-hidden">
                        <div class="card-body">
                            <h4 class="fw-bold mb-3 text-white">Admissions Are Open!</h4>
                            <p class="text-white opacity-75 small mb-4">
                                Secure your seat by applying online or visiting our administration desk today.
                            </p>
                            <a href="{{ route('contact') }}" class="theme-btn btn-white w-100 py-3 text-primary fw-bold" style="background-color: #fff; border-color: #fff;">Apply Now <i class="fas fa-arrow-right-long text-primary"></i></a>
                        </div>
                    </div>
                </div>
            </div>

            <!-- Steps & Eligibility -->
            <div class="row g-5 mt-5">
                <!-- Eligibility Streams -->
                <div class="col-lg-6">
                    <div class="card border-0 shadow-sm p-4 h-100 rounded">
                        <h4 class="fw-bold mb-4 text-primary"><i class="fal fa-file-check me-2"></i> Grade XI Eligibility & Streams</h4>
                        
                        <div class="stream-box mb-4 pb-3 border-bottom">
                            <div class="d-flex justify-content-between align-items-center mb-2">
                                <h5 class="fw-bold text-dark mb-0">Science Stream</h5>
                                <span class="badge bg-success text-white">GPA 3.2+ Required</span>
                            </div>
                            <p class="text-muted small">
                                Prospective students must complete the entrance test. The evaluation focuses on **English, Compulsory Mathematics, Optional Mathematics, and Science**.
                            </p>
                        </div>

                        <div class="stream-box">
                            <div class="d-flex justify-content-between align-items-center mb-2">
                                <h5 class="fw-bold text-dark mb-0">Management / Hotel Management</h5>
                                <span class="badge bg-success text-white">GPA 2.8+ Required</span>
                            </div>
                            <p class="text-muted small mb-0">
                                Prospective students must complete the entrance test. The evaluation focuses on **English and Mathematics**.
                            </p>
                        </div>
                    </div>
                </div>

                <!-- Documents Checklist -->
                <div class="col-lg-6">
                    <div class="card border-0 shadow-sm p-4 h-100 rounded">
                        <h4 class="fw-bold mb-4 text-primary"><i class="fal fa-folders me-2"></i> Required Documents</h4>
                        <p class="text-muted mb-4">Please submit the following original photocopies along with your application form:</p>
                        
                        <ul class="list-unstyled d-flex flex-column gap-3 mb-0">
                            <li class="d-flex align-items-start gap-3">
                                <i class="far fa-circle-check text-primary fs-5 mt-1"></i>
                                <div>
                                    <h6 class="fw-bold mb-0">Passport-Size Photographs</h6>
                                    <small class="text-muted">Two copies of recent passport-size color photographs.</small>
                                </div>
                            </li>
                            <li class="d-flex align-items-start gap-3">
                                <i class="far fa-circle-check text-primary fs-5 mt-1"></i>
                                <div>
                                    <h6 class="fw-bold mb-0">Academic Certifications</h6>
                                    <small class="text-muted">Photocopy of grade sheets and character/transfer certificates from the previous class. (Not required for Nursery candidates).</small>
                                </div>
                            </li>
                            <li class="d-flex align-items-start gap-3">
                                <i class="far fa-circle-check text-primary fs-5 mt-1"></i>
                                <div>
                                    <h6 class="fw-bold mb-0">Birth Registration Certificate</h6>
                                    <small class="text-muted">A clear photocopy of the municipal Birth Registration.</small>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>

            <!-- The Process Map -->
            <div class="row mt-5 pt-5 border-top">
                <div class="col-12 text-center mb-5">
                    <h3 class="fw-bold">Step-by-Step Admission Process</h3>
                </div>
                
                <div class="col-lg-3 col-md-6">
                    <div class="step-card text-center mb-4">
                        <div class="step-number bg-light-primary text-primary mx-auto rounded-circle d-flex align-items-center justify-content-center mb-3" style="width: 60px; height: 60px; font-weight: bold; font-size: 1.5rem;">
                            1
                        </div>
                        <h5 class="fw-bold">Inquiry & Form</h5>
                        <p class="text-muted small">Collect the application form from the campus desk or download it from our website portal.</p>
                    </div>
                </div>

                <div class="col-lg-3 col-md-6">
                    <div class="step-card text-center mb-4">
                        <div class="step-number bg-light-primary text-primary mx-auto rounded-circle d-flex align-items-center justify-content-center mb-3" style="width: 60px; height: 60px; font-weight: bold; font-size: 1.5rem;">
                            2
                        </div>
                        <h5 class="fw-bold">Document Audit</h5>
                        <p class="text-muted small">Submit the completed form along with required photos, character certificates, and birth papers.</p>
                    </div>
                </div>

                <div class="col-lg-3 col-md-6">
                    <div class="step-card text-center mb-4">
                        <div class="step-number bg-light-primary text-primary mx-auto rounded-circle d-flex align-items-center justify-content-center mb-3" style="width: 60px; height: 60px; font-weight: bold; font-size: 1.5rem;">
                            3
                        </div>
                        <h5 class="fw-bold">Entrance Evaluation</h5>
                        <p class="text-muted small">Complete the objective pattern entrance examination based on mathematics, science, and English.</p>
                    </div>
                </div>

                <div class="col-lg-3 col-md-6">
                    <div class="step-card text-center mb-4">
                        <div class="step-number bg-light-primary text-primary mx-auto rounded-circle d-flex align-items-center justify-content-center mb-3" style="width: 60px; height: 60px; font-weight: bold; font-size: 1.5rem;">
                            4
                        </div>
                        <h5 class="fw-bold">Merit Admission</h5>
                        <p class="text-muted small">Once results are published, secure enrollment according to the merit list criteria within the deadlines.</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- admission procedure section end -->
@endsection