@extends('layouts.app')

@section('title', 'Student Chapters | AICDS')

@section('content')

<x-breadcrumb title="Student Chapters" :breadcrumbs="['Student Chapters' => route('student-chapter.index')]" />

<div class="sp_top_100 sp_bottom_100">
    <div class="container">
        <div class="row align-items-center mb-5 pb-5 border-bottom">
            <div class="col-lg-7" data-aos="fade-up">
                <span class="badge bg-primary text-white text-uppercase px-3 py-2 fw-semibold mb-3">Campus Innovation Hubs</span>
                <h2 class="fw-bold mb-3">Nurturing AI &amp; Data Science Leaders on Every Campus</h2>
                <p class="text-muted fs-5 mb-4">An AICDS Student Chapter transforms your institution into an active node of the national computing community. Students organize hackathons, invite distinguished keynote lecturers, execute capstone projects, and connect with prospective employers.</p>

                <div class="d-flex flex-wrap gap-3">
                    <a href="{{ route('student-chapter.apply') }}" class="default__button">Apply to Establish Chapter</a>
                    <a href="{{ route('student-chapter.directory') }}" class="default__button default__button--2">Browse Approved Chapters</a>
                </div>
            </div>

            <div class="col-lg-5 mt-4 mt-lg-0" data-aos="fade-up">
                <div class="p-4 p-md-5 bg-light rounded-4 border shadow-sm">
                    <h5 class="fw-bold mb-3 text-dark"><i class="icofont-institution text-primary me-2"></i> Statutory Chapter Benchmarks</h5>
                    <ul class="list-unstyled mb-0 small">
                        <li class="py-2 border-bottom d-flex justify-content-between"><span>Polytechnic:</span> <strong>50 Student Members</strong></li>
                        <li class="py-2 border-bottom d-flex justify-content-between"><span>Arts &amp; Science College:</span> <strong>50 Student Members</strong></li>
                        <li class="py-2 border-bottom d-flex justify-content-between"><span>Affiliated Engineering College:</span> <strong>50 Student Members</strong></li>
                        <li class="py-2 border-bottom d-flex justify-content-between"><span>Autonomous Institution:</span> <strong>100 Student Members</strong></li>
                        <li class="py-2 d-flex justify-content-between"><span>University:</span> <strong>100 Student Members</strong></li>
                    </ul>
                </div>
            </div>
        </div>

        <!-- Chapter Navigation Tiles -->
        <div class="row g-4 mb-5">
            <div class="col-md-4" data-aos="fade-up">
                <div class="card p-4 h-100 border rounded-4 shadow-sm">
                    <i class="icofont-check-circled fs-1 text-primary mb-3"></i>
                    <h5 class="fw-bold">Eligibility Criteria</h5>
                    <p class="text-muted small mb-3">Understand minimum student member thresholds, faculty coordinator qualifications, and institutional prerequisites.</p>
                    <a href="{{ route('student-chapter.eligibility') }}" class="fw-semibold text-primary text-decoration-none mt-auto">Read Eligibility Rules <i class="icofont-arrow-right"></i></a>
                </div>
            </div>

            <div class="col-md-4" data-aos="fade-up">
                <div class="card p-4 h-100 border rounded-4 shadow-sm">
                    <i class="icofont-users-alt-5 fs-1 text-success mb-3"></i>
                    <h5 class="fw-bold">Governance Structure</h5>
                    <p class="text-muted small mb-3">Learn the leadership hierarchy comprising the Faculty Coordinator, Student Chairperson, Vice Chair, Secretary, and Technical Leads.</p>
                    <a href="{{ route('student-chapter.structure') }}" class="fw-semibold text-primary text-decoration-none mt-auto">View Chapter Structure <i class="icofont-arrow-right"></i></a>
                </div>
            </div>

            <div class="col-md-4" data-aos="fade-up">
                <div class="card p-4 h-100 border rounded-4 shadow-sm">
                    <i class="icofont-listing-box fs-1 text-warning mb-3"></i>
                    <h5 class="fw-bold">Approved Chapters Directory</h5>
                    <p class="text-muted small mb-3">Browse all officially chartered AICDS collegiate chapters with contact information and member counts.</p>
                    <a href="{{ route('student-chapter.directory') }}" class="fw-semibold text-primary text-decoration-none mt-auto">Explore Directory <i class="icofont-arrow-right"></i></a>
                </div>
            </div>
        </div>

        <!-- Featured Approved Chapters -->
        @if($approvedChapters->count() > 0)
            <div class="row pt-4 border-top">
                <div class="col-12 mb-4">
                    <h3 class="fw-bold">Featured Approved Collegiate Chapters</h3>
                </div>
                @foreach($approvedChapters as $chapter)
                    <div class="col-lg-4 col-md-6 mb-4" data-aos="fade-up">
                        <div class="card p-4 h-100 border rounded-4 shadow-sm">
                            <div class="d-flex justify-content-between align-items-center mb-3">
                                <span class="badge bg-success-subtle text-success text-uppercase px-2 py-1">{{ $chapter->chapter_code }}</span>
                                <span class="badge bg-light text-muted border">{{ $chapter->institution_type }}</span>
                            </div>
                            <h5 class="fw-bold mb-2">{{ $chapter->institution_name }}</h5>
                            <p class="text-muted small mb-3"><i class="icofont-location-pin text-primary me-1"></i> {{ $chapter->city }}, {{ $chapter->state }}</p>
                            <div class="small text-muted border-top pt-2">
                                <div><strong>Faculty Coordinator:</strong> {{ $chapter->faculty_coordinator_name }}</div>
                                <div><strong>Chairperson:</strong> {{ $chapter->student_chairperson_name }}</div>
                                <div class="text-primary mt-1"><strong>Active Members:</strong> {{ $chapter->proposed_student_count }} Students</div>
                            </div>
                        </div>
                    </div>
                @endforeach
            </div>
        @endif
    </div>
</div>

@endsection