@extends("frontend.mainlayout")

@section("title", "Refer A Student - RERF Group of Institutions")

@section("banner")

    <section class="font-1 text-center" style="padding:0;">

        <style>
            .sticky-top {
                z-index: 125;
            }

            .form-group {
                display: grid;
                margin-bottom: 1rem;
                text-align: left;
                margin-inline: 0px;
            }

            .refer-from {
                box-sizing: border-box;
                display: grid;
                gap: 0 12px;
                grid-template-columns: repeat(auto-fit, minmax(300px, 1fr))
            }

            select.form-control:not([size]):not([multiple]) {
                height: calc(2.25rem + 10px);
            }

            .hidden {
                display: none;
            }

            .error-message {
                font-size: small;
                font-weight: 600;
                color: red;
                font-family: "Montserrat", sans-serif;
            }

            .is-invalid {
                background: #ff3b300f;
                color: #ff3b30;
                border-color: #ff3b30
            }

            .pointer {
                cursor: pointer;
            }
        </style>

        <div class="container">

            <div class="row justify-content-center d-flex align-items-center py-sm-2"
                style="min-height: calc(100vh - 100px);">

                @if (Session::has("success"))
                    <div class="alert alert-success col-md-12">

                        {{ Session::get("success") }}

                        @php

                            Session::forget("success");

                        @endphp

                    </div>
                @endif

                <div class="col-lg-8">

                    <div style="height:90px;width: 90px; display: inline-block; justify-content: center">

                        <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 80 80">

                            <path
                                d="M31.726563 9C26.886719 9 22.535156 11.648438 19.378906 14.222656C16.222656 16.800781 14.210938 19.386719 14.210938 19.386719L13.308594 20.542969L14.71875 20.957031C14.71875 20.957031 15.265625 21.109375 15.921875 21.78125C16.574219 22.449219 17.273438 23.589844 17.273438 25.75C17.273438 28.550781 17.703125 30.8125 17.917969 31.769531C17.359375 32.277344 17 32.996094 17 33.800781C17 34.449219 17.195313 35.003906 17.355469 35.546875C17.433594 35.820313 17.511719 36.074219 17.5625 36.265625C17.613281 36.457031 17.625 36.644531 17.625 36.5C17.625 37.859375 18.765625 38.917969 20.105469 38.96875C20.289063 42.84375 22.15625 46.265625 25 48.519531L25 52.25C23.558594 52.6875 20.097656 53.804688 16.574219 55.46875C14.273438 56.554688 11.960938 57.863281 10.160156 59.414063C8.359375 60.964844 7 62.820313 7 65L7 71L59 71L59 65C59 63.921875 58.664063 62.921875 58.109375 62L73 62L73 58.199219C73 56.441406 71.910156 54.976563 70.515625 53.773438C69.121094 52.570313 67.347656 51.570313 65.589844 50.738281C62.402344 49.238281 59.566406 48.410156 59 48.25L59 48L69.34375 48L69.519531 47.21875C69.519531 47.21875 71 40.691406 71 33.183594C71 28.449219 69.785156 24.457031 67.808594 21.597656C65.925781 18.886719 63.296875 17.230469 60.445313 17.0625C60 16.511719 57.878906 14 54 14C51.40625 14 48.683594 14.625 46.277344 15.660156C46.132813 15.515625 45.992188 15.367188 45.84375 15.234375C44.214844 13.804688 42.300781 13.230469 40.605469 13.109375C40.332031 12.675781 39.847656 11.996094 38.84375 11.210938C37.402344 10.089844 35.089844 9 31.726563 9 Z M 31.726563 11C34.664063 11 36.488281 11.910156 37.609375 12.789063C38.734375 13.667969 39.105469 14.441406 39.105469 14.441406L39.378906 15L40 15C41.332031 15 43.125 15.507813 44.519531 16.738281C45.917969 17.96875 47 19.890625 47 23C47 25.789063 46.335938 29.859375 46.140625 31C46.136719 31 46.132813 31 46.125 31C46.039063 31 46.054688 31.019531 46 31.027344L46 28C46 24.578125 44.601563 22.277344 43.195313 20.914063C41.789063 19.550781 40.316406 19.050781 40.316406 19.050781L39.746094 18.859375L39.308594 19.277344C39.308594 19.277344 38.679688 19.894531 37.160156 20.589844C35.640625 21.285156 33.289063 22 30 22C28.199219 22 25.828125 22.636719 23.769531 24.074219C21.71875 25.507813 20.011719 27.851563 20.003906 31.03125C19.949219 31.023438 19.960938 31 19.875 31C19.851563 31 19.828125 31.007813 19.804688 31.007813C19.601563 30.042969 19.273438 28.160156 19.273438 25.75C19.273438 23.132813 18.335938 21.394531 17.355469 20.386719C16.9375 19.957031 16.84375 20.03125 16.480469 19.816406C17.171875 19.003906 18.457031 17.5625 20.644531 15.777344C23.617188 13.351563 27.632813 11 31.726563 11 Z M 54 16C57.253906 16 59.195313 18.59375 59.195313 18.59375L59.496094 19L60 19C62.265625 19 64.464844 20.285156 66.160156 22.738281C67.859375 25.191406 69 28.792969 69 33.183594C69 39.738281 67.929688 44.949219 67.707031 46L59.054688 46C61.574219 44.253906 63 41.1875 63 37.8125L63 33.183594C63 30.675781 62.179688 28.960938 61.316406 27.914063C60.453125 26.867188 59.480469 26.441406 59.480469 26.441406L58.78125 26.148438L58.308594 26.738281C58.308594 26.738281 57.738281 27.472656 56.421875 28.175781C55.109375 28.878906 53.121094 29.503906 50.320313 29.089844L50.027344 31.066406C53.261719 31.546875 55.734375 30.816406 57.367188 29.9375C58.484375 29.339844 58.714844 28.980469 59.082031 28.605469C59.273438 28.714844 59.394531 28.722656 59.777344 29.1875C60.367188 29.902344 61 31.097656 61 33.183594L61 37.8125C61 41.738281 58.960938 44.769531 55.363281 45.410156L55.078125 45.464844L54.867188 45.65625C54.628906 45.871094 54.335938 46 54 46C53.664063 46 53.371094 45.875 53.132813 45.65625L52.921875 45.464844L52.636719 45.410156C49.300781 44.816406 47.328125 42.152344 47.054688 38.640625C47.597656 38.347656 48.019531 37.871094 48.226563 37.289063C48.5 37.730469 48.980469 38 49.5 38C50.328125 38 51 37.328125 51 36.5C51 35.671875 50.328125 35 49.5 35C49.234375 35 48.972656 35.070313 48.742188 35.207031C48.871094 34.769531 49 34.316406 49 33.800781C49 32.980469 48.628906 32.257813 48.058594 31.746094C48.242188 30.691406 49 26.175781 49 23C49 20.675781 48.433594 18.785156 47.546875 17.300781C49.601563 16.488281 51.894531 16 54 16 Z M 40 21.15625C40.242188 21.25 40.875 21.449219 41.804688 22.347656C42.898438 23.410156 44 25.105469 44 28L44 34.304688L45.503906 33.421875C45.761719 33.273438 46 33.140625 46.167969 33.054688C46.1875 33.042969 46.195313 33.042969 46.214844 33.03125C46.671875 33.078125 47 33.398438 47 33.796875L47 33.800781C47 33.875 46.878906 34.460938 46.726563 34.984375C46.648438 35.242188 46.570313 35.503906 46.503906 35.742188C46.441406 35.980469 46.375 36.148438 46.375 36.5C46.375 36.765625 46.15625 37 45.8125 37L44 37L44 38.367188C44 43.789063 40.089844 48.269531 34.941406 49.1875L34.65625 49.234375L34.441406 49.433594C34.050781 49.789063 33.558594 50 33 50C32.441406 50 31.949219 49.785156 31.554688 49.429688L31.34375 49.234375L31.058594 49.1875C25.910156 48.269531 22 43.789063 22 38.367188L22 37L20.1875 37C19.84375 37 19.625 36.765625 19.625 36.5C19.625 36.148438 19.558594 35.980469 19.492188 35.742188C19.425781 35.503906 19.347656 35.242188 19.269531 34.984375C19.117188 34.460938 19 33.875 19 33.800781C19 33.398438 19.328125 33.078125 19.785156 33.03125C19.804688 33.042969 19.8125 33.042969 19.832031 33.054688C20 33.140625 20.238281 33.273438 20.496094 33.421875L22 34.304688L22 31.050781C22 28.558594 23.242188 26.882813 24.914063 25.714844C26.585938 24.546875 28.710938 24 30 24C33.582031 24 36.230469 23.214844 37.992188 22.410156C39.300781 21.8125 39.644531 21.445313 40 21.15625 Z M 27.5 33C26.671875 33 26 33.671875 26 34.5C26 35.328125 26.671875 36 27.5 36C28.328125 36 29 35.328125 29 34.5C29 33.671875 28.328125 33 27.5 33 Z M 38.5 33C37.671875 33 37 33.671875 37 34.5C37 35.328125 37.671875 36 38.5 36C39.328125 36 40 35.328125 40 34.5C40 33.671875 39.328125 33 38.5 33 Z M 57.5 35C56.671875 35 56 35.671875 56 36.5C56 37.328125 56.671875 38 57.5 38C58.328125 38 59 37.328125 59 36.5C59 35.671875 58.328125 35 57.5 35 Z M 45.550781 41.308594C46.1875 43.257813 47.363281 44.925781 49 46.042969L49 48.242188C48.101563 48.507813 44.355469 49.65625 41 51.3125L41 48.523438C43.25 46.734375 44.875 44.207031 45.550781 41.308594 Z M 57 47.03125L57 50C56.882813 50.230469 56.144531 51.597656 54 51.597656C51.855469 51.597656 51.117188 50.230469 51 50L51 47.035156C51.335938 47.148438 51.675781 47.25 52.035156 47.324219C52.582031 47.734375 53.257813 48 54 48C54.742188 48 55.421875 47.734375 55.96875 47.324219C56.324219 47.246094 56.667969 47.148438 57 47.03125 Z M 27 49.824219C28.066406 50.382813 29.21875 50.8125 30.441406 51.058594C31.148438 51.621094 32.023438 52 33 52C33.972656 52 34.84375 51.621094 35.546875 51.0625C36.773438 50.820313 37.929688 50.390625 39 49.828125L39 55.6875C38.878906 55.929688 37.296875 59 33 59C28.703125 59 27.121094 55.929688 27 55.6875 Z M 49 50.332031L49 50.550781L49.105469 50.761719C49.105469 50.761719 50.609375 53.597656 54 53.597656C57.390625 53.597656 58.894531 50.761719 58.894531 50.761719L59 50.550781L59 50.34375C60.039063 50.660156 62.160156 51.335938 64.734375 52.546875C66.394531 53.332031 68.042969 54.28125 69.210938 55.289063C70.378906 56.296875 71 57.296875 71 58.199219L71 60L56.484375 60C56.277344 59.800781 56.0625 59.605469 55.839844 59.414063C55.167969 58.835938 54.40625 58.300781 53.617188 57.785156C53.859375 57.597656 54 57.308594 54 57C54 56.449219 53.550781 56 53 56C52.519531 56 52.105469 56.34375 52.015625 56.816406C51.167969 56.339844 50.300781 55.882813 49.425781 55.46875C46.859375 54.257813 44.347656 53.347656 42.601563 52.765625C45.007813 51.65625 47.632813 50.769531 49 50.332031 Z M 25 54.355469L25 56.234375L25.105469 56.449219C25.105469 56.449219 27.464844 61 33 61C38.535156 61 40.894531 56.449219 40.894531 56.449219L41 56.234375L41 54.355469C42.605469 54.859375 45.546875 55.851563 48.574219 57.28125C50.773438 58.320313 52.960938 59.574219 54.535156 60.929688C56.109375 62.285156 57 63.679688 57 65L57 69L9 69L9 65C9 63.679688 9.890625 62.285156 11.464844 60.929688C13.039063 59.574219 15.226563 58.320313 17.425781 57.28125C20.453125 55.851563 23.394531 54.859375 25 54.355469 Z M 57 56C56.449219 56 56 56.449219 56 57C56 57.550781 56.449219 58 57 58C57.550781 58 58 57.550781 58 57C58 56.449219 57.550781 56 57 56 Z M 61 56C60.449219 56 60 56.449219 60 57C60 57.550781 60.449219 58 61 58C61.550781 58 62 57.550781 62 57C62 56.449219 61.550781 56 61 56 Z M 65 56C64.449219 56 64 56.449219 64 57C64 57.550781 64.449219 58 65 58C65.550781 58 66 57.550781 66 57C66 56.449219 65.550781 56 65 56 Z M 13 65C12.449219 65 12 65.449219 12 66C12 66.550781 12.449219 67 13 67C13.550781 67 14 66.550781 14 66C14 65.449219 13.550781 65 13 65 Z M 17 65C16.449219 65 16 65.449219 16 66C16 66.550781 16.449219 67 17 67C17.550781 67 18 66.550781 18 66C18 65.449219 17.550781 65 17 65 Z M 21 65C20.449219 65 20 65.449219 20 66C20 66.550781 20.449219 67 21 67C21.550781 67 22 66.550781 22 66C22 65.449219 21.550781 65 21 65 Z M 25 65C24.449219 65 24 65.449219 24 66C24 66.550781 24.449219 67 25 67C25.550781 67 26 66.550781 26 66C26 65.449219 25.550781 65 25 65 Z M 29 65C28.449219 65 28 65.449219 28 66C28 66.550781 28.449219 67 29 67C29.550781 67 30 66.550781 30 66C30 65.449219 29.550781 65 29 65 Z M 33 65C32.449219 65 32 65.449219 32 66C32 66.550781 32.449219 67 33 67C33.550781 67 34 66.550781 34 66C34 65.449219 33.550781 65 33 65 Z M 37 65C36.449219 65 36 65.449219 36 66C36 66.550781 36.449219 67 37 67C37.550781 67 38 66.550781 38 66C38 65.449219 37.550781 65 37 65 Z M 41 65C40.449219 65 40 65.449219 40 66C40 66.550781 40.449219 67 41 67C41.550781 67 42 66.550781 42 66C42 65.449219 41.550781 65 41 65 Z M 45 65C44.449219 65 44 65.449219 44 66C44 66.550781 44.449219 67 45 67C45.550781 67 46 66.550781 46 66C46 65.449219 45.550781 65 45 65 Z M 49 65C48.449219 65 48 65.449219 48 66C48 66.550781 48.449219 67 49 67C49.550781 67 50 66.550781 50 66C50 65.449219 49.550781 65 49 65 Z M 53 65C52.449219 65 52 65.449219 52 66C52 66.550781 52.449219 67 53 67C53.550781 67 54 66.550781 54 66C54 65.449219 53.550781 65 53 65Z"
                                fill="#5B5B5B" />

                        </svg>

                    </div>

                    <h4 class="fw-700">Refer A Student</h4>

                    <p class="lead color-5 fw-500 mb-5">The best certificate of credibility is word of mouth. We are one of

                        the best colleges in West Bengal providing academic excellence, innovation, and holistic development

                        through quality education and research initiatives. The trust and confidence that our students place

                        in us is our biggest compliment. When you refer someone, you give one more student an exposure to

                        the opportunities RERF opens its gates to.

                    </p>

                    <a data-refer-modal-button data-remodal-target="student"
                        class="btn btn-lg btn-primary text-uppercase ls" href="javascript:void(0)">Refer Now</a>

                </div>

            </div>

            <!--/.row-->

        </div>

        <div class="remodal" data-remodal-id="student">

            <button class="remodal-close" data-remodal-action="close"></button>

            <form id="refer-form" class="zform" method="post" action="{{ route("refer.submit") }}">

                @csrf

                <div data-referrer-details class="font-1">

                    <h4>

                        Referrer details

                        <p class="color-6 fs--1">(Your details)</p>

                    </h4>

                    <div class="refer-from">

                        <div class="form-group row"> <label class="">Name:</label>

                            <div class=""> <input value="" class="form-control" type="text" name="name"
                                    required>

                            </div>

                        </div>

                        <div class="form-group row"> <label class="">Phone no:</label>

                            <div class=""> <input value="" class="form-control" type="text" name="phone"
                                    required>

                            </div>

                        </div>

                        {{-- <div class="form-group row"> <label class="">Email:</label>

                            <div class=""> <input value="" class="form-control" type="email" name="email"

                                    required>

                            </div>

                        </div> --}}

                        <div class="form-group row"> <label class="">Are you a? </label>

                            <div class=""> <select class="form-control" name="department" required>

                                    <option selected disabled value="">Select</option>

                                    <option>Student</option>

                                    {{-- <option>Ex-Student</option> --}}

                                    <option>Alumni</option>

                                    <option>Parent</option>

                                    <option>Others</option>

                                </select> </div>

                        </div>

                        <div class="form-group row"> <label class="">College:</label>

                            <div class=""> <select class="form-control" name="college">

                                    <option value="">Select College</option>

                                    <option>Regent Education & Research Foundation</option>

                                    <option>Regent Institute of Science & Technology </option>

                                    <option>Swami Vivekananda Institute of Modern Studies</option>

                                </select> </div>

                        </div>

                        {{-- <div class="form-group row"> <label class="">Department: </label>

                            <div class=""> <select class="form-control" type="email" name="department" required>

                                    <option value="">Select Department</option>

                                    <option>Civil Engineering</option>

                                    <option>Computer Science & Engineering</option>

                                    <option>Electronics & Communication Engineering</option>

                                    <option>Electrical & Electronics Engineering</option>

                                    <option>Electrical Engineering</option>

                                    <option>Mechanical Engineering</option>

                        <option>Master of Computer Application</option>

                        <option>Master of Business Administration</option>

                        </select>

                    </div>

                </div> --}}

                    </div>

                </div>

                <div data-referral-details class="hidden">

                    <h4>Referral details

                        <p class="color-6 fs--1">(of the person you are referring)</p>

                    </h4>

                    <div class="refer-from">

                        <div class="form-group row">

                            <label class="">Name: </label>

                            <div class="">

                                <input value="" class="form-control" type="text" name="referral_name" required>

                            </div>

                        </div>

                        <div class="form-group row">

                            <label class="">Phone no: </label>

                            <div class="">

                                <input value="" class="form-control" type="text" name="referral_phone" required>

                            </div>

                        </div>

                        {{-- <div class="form-group row">

                            <label class="">Email: </label>

                            <div class="">

                                <input value="" class="form-control" type="email" name="referral_email" required>

                            </div>

                        </div> --}}

                        <div class="form-group row">

                            <label class="">College: </label>

                            <div class="">

                                <select class="form-control" type="email" name="referral_college" required>

                                    <option value="">Select College</option>

                                    <option>Regent Education & Research Foundation</option>

                                    <option>Regent Institute of Science & Technology </option>

                                    <option>Swami Vivekananda Institute of Modern Studies</option>

                                </select>

                            </div>

                        </div>

                        <div class="form-group row">

                            <label class="">Department: </label>

                            <div class="">

                                <select class="form-control" type="email" name="referral_department" required>

                                    <option value="">Select Department</option>

                                    <option>Civil Engineering</option>

                                    <option>Computer Science & Engineering</option>

                                    <option>Electronics & Communication Engineering</option>

                                    <option>Electrical & Electronics Engineering</option>

                                    <option>Electrical Engineering</option>

                                    <option>Mechanical Engineering</option>

                                    {{-- <option>Basic Science</option> --}}

                                    <option>Master of Computer Application</option>

                                    <option>Master of Business Administration</option>

                                </select>

                            </div>

                        </div>

                        <div class="form-group row">

                            <label class="">Admission for: </label>

                            <div class="">

                                <select class="form-control" type="email" name="referral_admission" required>

                                    <option value="">Select Year</option>

                                    <option>First Year</option>

                                    <option>2nd Year (Lateral Entry)</option>

                                </select>

                            </div>

                        </div>

                    </div>

                </div>

                <div class="form-group row">

                    <div class="d-flex justify-content-between align-items-center">

                        <div> <span class="error-message" data-status-message></span> </div>

                        <div>

                            <button class="btn btn-sm btn-outline-danger pointer mr-3"
                                data-remodal-action="cancel">close</button>

                            <button data-next-button class="btn btn-sm btn-primary pointer">Next</button>

                            <button type="submit" data-form-submit-button
                                class="btn btn-sm btn-primary pointer hidden">Submit</button>

                        </div>

                    </div>

                </div>

                <div class="zform-feedback"></div>

            </form>

        </div>

        <script defer src="/frontend/assets/js/custom/refer-script-Its-Satyajit.js"></script>

        <!--/.container-->

    </section>

@endsection