@include('frontend.header')
<style>
    /* ===== AWARDS REGISTRATION SECTION ===== */

.awards-section {
    background: #f4f8fb;
}

.awards-section h2 {
    font-size: 28px;
    letter-spacing: 1px;
}

.awards-section .card,
.awards-section .border {
    transition: all 0.3s ease;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
}

.awards-section .card:hover,
.awards-section .border:hover {
    transform: translateY(-5px);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08);
}

.awards-section h5 {
    font-size: 18px;
    color: #333;
}

.awards-section .btn {
    min-width: 220px;
    transition: 0.3s ease;
}

.awards-section .btn-outline-primary:hover {
    background-color: #0d6efd;
    color: #fff;
}

.awards-section .btn-outline-secondary:hover {
    background-color: #6c757d;
    color: #fff;
}

/* ===== Responsive Styling ===== */

@media (max-width: 768px) {
    .awards-section h2 {
        font-size: 22px;
    }

    .awards-section h5 {
        font-size: 16px;
    }

    .awards-section .btn {
        width: 100%;
        text-align: center;
    }
}
</style>
<section class="awards-section py-5">
    <div class="container">

        <!-- Title -->
        <div class="text-center mb-4">
            <h2 class="fw-bold text-primary">AWARDS REGISTRATION</h2>
        </div>

        <div class="row g-4">

            <!-- Award 1 -->
            <div class="col-12">
                <div class="border rounded p-4 shadow-sm bg-white h-100">
                    <h5 class="fw-semibold">1. BEST TEACHER AWARD</h5>
                    <div class="mt-3 d-flex flex-column flex-md-row gap-2">
                        <a href="{{ asset('assets/documents/awards/teachers.pdf') }}" target="_blank" class="btn btn-outline-primary btn-sm">
                            <i class="fas fa-download me-1"></i> Click Here to Download Form
                        </a>
                        <a href="{{ asset('assets/documents/awards/EVALTEACHERS.pdf') }}" target="_blank" class="btn btn-outline-secondary btn-sm">
                            <i class="fas fa-download me-1"></i> Click Here to Download Evaluation Criteria
                        </a>
                    </div>
                </div>
            </div>

            <!-- Award 2 -->
            <div class="col-12">
                <div class="border rounded p-4 shadow-sm bg-white h-100">
                    <h5 class="fw-semibold">2. BEST NCC CADET AWARD</h5>
                    <div class="mt-3 d-flex flex-column flex-md-row gap-2">
                        <a href="{{ asset('assets/documents/awards/BESTNCC.pdf') }}" target="_blank" class="btn btn-outline-primary btn-sm">
                            <i class="fas fa-download me-1"></i> Click Here to Download Form
                        </a>
                        <a href="{{ asset('assets/documents/awards/EVALNCC.pdf') }}" target="_blank" class="btn btn-outline-secondary btn-sm">
                            <i class="fas fa-download me-1"></i> Click Here to Download Evaluation Criteria
                        </a>
                    </div>
                </div>
            </div>

            <!-- Award 3 -->
            <div class="col-12 col-md-6">
                <div class="border rounded p-4 shadow-sm bg-white h-100">
                    <h5 class="fw-semibold">3. BEST STUDENT AWARD</h5>
                    <div class="mt-3">
                        <a href="{{ asset('assets/documents/awards/student.pdf') }}" target="_blank" class="btn btn-outline-primary btn-sm">
                            <i class="fas fa-download me-1"></i> Click Here to Download Form
                        </a>
                    </div>
                </div>
            </div>

            <!-- Award 4 -->
            <div class="col-12 col-md-6">
                <div class="border rounded p-4 shadow-sm bg-white h-100">
                    <h5 class="fw-semibold">4. BEST SPORTS PERSON AWARD</h5>
                    <div class="mt-3">
                        <a href="{{ asset('assets/documents/awards/SPORTS.pdf') }}" target="_blank" class="btn btn-outline-primary btn-sm">
                            <i class="fas fa-download me-1"></i> Click Here to Download Form
                        </a>
                    </div>
                </div>
            </div>

            <!-- Award 5 -->
            <div class="col-12 col-md-6">
                <div class="border rounded p-4 shadow-sm bg-white h-100">
                    <h5 class="fw-semibold">5. BEST NSS VOLUNTEER AWARD</h5>
                    <div class="mt-3">
                        <a href="{{ asset('assets/documents/awards/nssvol.pdf') }}" target="_blank" class="btn btn-outline-primary btn-sm">
                            <i class="fas fa-download me-1"></i> Click Here to Download Form
                        </a>
                    </div>
                </div>
            </div>

        </div>

    </div>
</section>
@include('frontend.footer')