@extends('layouts.app')

@section('title', 'Apply to Establish Student Chapter | AICDS')

@section('content')

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

<div class="sp_top_100 sp_bottom_100">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-xl-9 col-lg-10">
                <div class="card border-0 shadow-lg rounded-5 overflow-hidden">
                    <div class="bg-primary text-white p-4 p-md-5">
                        <span class="badge bg-white text-primary text-uppercase px-3 py-2 fw-bold mb-3">Institutional Petition</span>
                        <h2 class="text-white fw-bold mb-2">Student Chapter Charter Application</h2>
                        <p class="text-white-50 mb-0">Institutions intending to establish an official collegiate chapter must ensure they satisfy the statutory minimum student membership requirements prior to submitting this petition.</p>
                    </div>

                    <div class="p-4 p-md-5 bg-white">
                        <form action="{{ route('student-chapter.apply.submit') }}" method="POST">
                            @csrf

                            <h5 class="fw-bold text-dark mb-4 border-bottom pb-2">1. Institution Credentials</h5>
                            <div class="row g-3">
                                <div class="col-md-8">
                                    <label class="form-label fw-semibold small">Institution Name <span class="text-danger">*</span></label>
                                    <input type="text" name="institution_name" value="{{ old('institution_name') }}" required class="form-control" placeholder="e.g. Apex Institute of Technology">
                                </div>

                                <div class="col-md-4">
                                    <label class="form-label fw-semibold small">Institution Category <span class="text-danger">*</span></label>
                                    <select name="institution_type" id="institution_type" required class="form-select" onchange="updateMinThreshold()">
                                        <option value="">-- Select Type --</option>
                                        <option value="Polytechnic" {{ old('institution_type') === 'Polytechnic' ? 'selected' : '' }}>Polytechnic (Min 50)</option>
                                        <option value="Arts and Science College" {{ old('institution_type') === 'Arts and Science College' ? 'selected' : '' }}>Arts &amp; Science (Min 50)</option>
                                        <option value="Affiliated Engineering College" {{ old('institution_type') === 'Affiliated Engineering College' ? 'selected' : '' }}>Affiliated Engineering (Min 50)</option>
                                        <option value="Autonomous Institution" {{ old('institution_type') === 'Autonomous Institution' ? 'selected' : '' }}>Autonomous Institution (Min 100)</option>
                                        <option value="University" {{ old('institution_type') === 'University' ? 'selected' : '' }}>University (Min 100)</option>
                                    </select>
                                </div>

                                <div class="col-12">
                                    <label class="form-label fw-semibold small">Official Website</label>
                                    <input type="url" name="website" value="{{ old('website') }}" class="form-control" placeholder="https://www.collegename.edu.in">
                                </div>

                                <div class="col-12">
                                    <label class="form-label fw-semibold small">Campus Address <span class="text-danger">*</span></label>
                                    <input type="text" name="address" value="{{ old('address') }}" required class="form-control" placeholder="Complete campus physical address">
                                </div>

                                <div class="col-md-4">
                                    <label class="form-label fw-semibold small">City <span class="text-danger">*</span></label>
                                    <input type="text" name="city" value="{{ old('city') }}" required class="form-control" placeholder="City">
                                </div>

                                <div class="col-md-4">
                                    <label class="form-label fw-semibold small">State <span class="text-danger">*</span></label>
                                    <input type="text" name="state" value="{{ old('state') }}" required class="form-control" placeholder="State">
                                </div>

                                <div class="col-md-4">
                                    <label class="form-label fw-semibold small">Pincode</label>
                                    <input type="text" name="pincode" value="{{ old('pincode') }}" class="form-control" placeholder="Pincode">
                                </div>
                            </div>

                            <h5 class="fw-bold text-dark mb-4 border-bottom pb-2 mt-5">2. Chapter Leadership &amp; Membership Count</h5>
                            <div class="row g-3">
                                <div class="col-md-6">
                                    <label class="form-label fw-semibold small">Faculty Coordinator Name <span class="text-danger">*</span></label>
                                    <input type="text" name="faculty_coordinator_name" value="{{ old('faculty_coordinator_name') }}" required class="form-control" placeholder="e.g. Dr. Ramesh Kumar">
                                </div>

                                <div class="col-md-6">
                                    <label class="form-label fw-semibold small">Coordinator's Official Email <span class="text-danger">*</span></label>
                                    <input type="email" name="faculty_coordinator_email" value="{{ old('faculty_coordinator_email') }}" required class="form-control" placeholder="ramesh@college.edu.in">
                                </div>

                                <div class="col-md-6">
                                    <label class="form-label fw-semibold small">Coordinator's Mobile Contact <span class="text-danger">*</span></label>
                                    <input type="text" name="faculty_coordinator_phone" value="{{ old('faculty_coordinator_phone') }}" required class="form-control" placeholder="+91 98765 12345">
                                </div>

                                <div class="col-md-6">
                                    <label class="form-label fw-semibold small">Proposed Student Chairperson <span class="text-danger">*</span></label>
                                    <input type="text" name="student_chairperson_name" value="{{ old('student_chairperson_name') }}" required class="form-control" placeholder="e.g. Kiran Varma (Final Year AI &amp; DS)">
                                </div>

                                <div class="col-12">
                                    <label class="form-label fw-semibold small">Proposed Student Membership Count <span class="text-danger">*</span></label>
                                    <input type="number" name="proposed_student_count" id="proposed_student_count" value="{{ old('proposed_student_count', 50) }}" min="1" required class="form-control" placeholder="e.g. 65">
                                    <div class="form-text text-muted" id="threshold_notice">Minimum required: 50 for Polytechnic/Colleges, 100 for Autonomous Institutions/Universities.</div>
                                </div>
                            </div>

                            <h5 class="fw-bold text-dark mb-3 border-bottom pb-2 mt-5">3. Institutional Declaration</h5>
                            <div class="form-check p-3 bg-light rounded-3 border mb-4">
                                <input class="form-check-input ms-0 me-3" type="checkbox" name="declaration" value="1" id="declaration" required {{ old('declaration') ? 'checked' : '' }}>
                                <label class="form-check-label small text-muted" for="declaration">
                                    The institution agrees to designate suitable faculty coordination and provide logistical support for AICDS student activities on campus. We commit to maintaining the statutory minimum active student members and adhere to all guidelines of the Association for Intelligent Computing and Data Science.
                                </label>
                            </div>

                            <div class="text-end">
                                <button type="submit" class="default__button px-5 py-3">Submit Chapter Application</button>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
function updateMinThreshold() {
    const type = document.getElementById('institution_type').value;
    const countInput = document.getElementById('proposed_student_count');
    const notice = document.getElementById('threshold_notice');

    let min = 50;
    if (type === 'Autonomous Institution' || type === 'University') {
        min = 100;
    }

    countInput.min = min;
    notice.innerHTML = `<span class="text-primary fw-semibold">Selected ${type || 'category'}: Minimum required student members is ${min}.</span>`;
}
</script>

@endsection