{# <!--
    GATE PASS
    QR codes reuse the already-implemented getQr Twig function (wraps
    com\linways\core\ams\professional\service\QrCodeGenerator via
    TwigCustomFunctions::getQr) and the `url` verification link, both already
    registered/passed by GeneralService::renderStudentApplicationPrint - same
    mechanism already used by printPreview18-27.twig. Unlike the barcode this
    template used to render, a QR code doesn't need any rotation handling for
    the vertical guardian stubs, since it reads correctly at any orientation.
--> #}
<html>
    <head>
    <meta charset="UTF-8">
        <style>
            @page {
                margin: 0;
            }
            body {
                margin: 0;
                padding: 0;
                font-family: Arial, Helvetica, sans-serif;
            }
            .gate-pass {
                width: 19cm;
                margin: 1cm auto;
                border: 2px solid #000;
                box-sizing: border-box;
                line-height: normal;
            }
            .gate-pass div, .gate-pass td, .gate-pass tr {
                /* the shared print_preview_form_ug.css sets a `font: 13px/14px ...`
                   shorthand on div,td,tr which fixes line-height at 14px for any
                   of them that don't declare their own line-height - override that
                   here so larger fonts below (college name etc) don't clip/overlap */
                line-height: normal;
            }

            /* Top card */
            .top-card {
                width: 100%;
                border-collapse: collapse;
                border-bottom: 2px solid #000;
            }
            .top-card td {
                vertical-align: middle;
                padding: 10px;
            }
            .photo-box {
                width: 15%;
                height: 90px;
                border-right: 1px solid #000;
                text-align: center;
            }
            .photo-box img {
                width: 75px;
                height: 75px;
            }
            .college-info {
                width: 85%;
                text-align: center;
            }
            .college-name {
                font-size: 20px;
                font-weight: bold;
            }
            .college-address {
                font-size: 12px;
                font-style: italic;
            }

            /* Details table */
            .details-table {
                width: 100%;
                border-collapse: collapse;
            }
            .details-table td {
                border-bottom: 1px solid #000;
                padding: 6px 10px;
                font-size: 13px;
            }
            .details-table td.label {
                width: 30%;
                font-weight: bold;
                border-right: 1px solid #000;
            }

            /* Venue / date / reporting time pill */
            .venue-box {
                margin: 14px auto;
                width: 70%;
                border: 2px dashed #000;
                border-radius: 40px;
                text-align: center;
                padding: 10px;
                font-size: 13px;
            }
            .venue-box em {
                font-style: italic;
            }
            .venue-box .reporting-time {
                font-weight: bold;
            }

            /* Guardian entry pass stubs */
            .stub-row {
                width: 100%;
                border-collapse: collapse;
                border-top: 2px solid #000;
            }
            .stub-col {
                width: 50%;
                vertical-align: top;
                padding: 10px;
            }
            .stub-divider {
                width: 0;
                border-left: 2px solid #000;
            }
            .stub-title {
                text-align: center;
                border: 1px solid #000;
                border-radius: 20px;
                padding: 6px;
                font-size: 13px;
                margin-bottom: 10px;
            }
            .stub-inner {
                width: 100%;
                border-collapse: collapse;
            }
            .stub-inner td {
                vertical-align: top;
                padding: 4px;
                font-size: 11px;
                line-height: 1.5;
            }
            .stub-info {
                width: 68%;
            }
            .stub-info .stub-venue-line {
                margin-top: 8px;
                font-style: italic;
            }
            .stub-qr {
                width: 32%;
                text-align: center;
                border-left: 1px dashed #000;
            }
            .stub-qr img {
                width: 90px;
                height: 90px;
            }
        </style>
    </head>
    <body>
        <div class="gate-pass">

            {# ============ Top card ============ #}
            <table class="top-card">
                <tr>
                    <td class="photo-box">
                        <img src="{{ getQr(student.academicsRegNo, 150, 0, 'L') }}" />
                    </td>
                    <td class="college-info">
                        <div class="college-name">{{college.collegeName|upper}}</div>
                        <div class="college-address">{{college.collegeAddress}} {{college.collegeAddress1}} {{college.collegeAddress2}}</div>
                    </td>
                </tr>
            </table>

            <!-- <table class="top-card">
                <tr>
                    <td class="college-info">
                        <div class="college-name">{{form.name}}</div>
                    </td>
                </tr>
            </table> -->

            <table class="details-table">
                <tr>
                    <td class="label">Name:</td>
                    <td>{{student.studentFirstName|upper}}</td>
                </tr>
                <tr>
                    <td class="label">Register No:</td>
                    <td>{{student.academicsRegNo}}</td>
                </tr>
                <tr>
                    <td class="label">Application No:</td>
                    <td>{{student.applicationNo}}</td>
                </tr>
                <tr>
                    <td class="label">Mobile:</td>
                    <td>{{student.studentMobile}}</td>
                </tr>
                <tr>
                    <td class="label">Email:</td>
                    <td>{{student.studentEmail}}</td>
                </tr>
            </table>

            {% if form.id == 2 %}
            <div class="venue-box">
                <div><em>Venue :  Palocaren Square, St Thomas College (Autonomous), Thrissur</em></div>
                <div><em>Date : 13/06/2026</em></div>
                <div class="reporting-time">Reporting Time : 07.30 am to 08.30 am</div>
            </div>
            {% endif %}
            {% if form.id == 1 %}
            <div class="venue-box">
                <div><em>Venue : Palocaren Square, St Thomas College (Autonomous), Thrissur</em></div>
                <div><em>Date : 14/06/2026</em></div>
                <div class="reporting-time">Reporting Time : 07.30 am to 08.30 am</div>
            </div>
            {% endif %}
            {# ============ Guardian entry pass stubs ============ #}
            {# Each stub (including its QR code) only renders when that
               guardian's name/address field actually has a value. If only
               one guardian has data, that stub takes the full width instead
               of leaving an empty half + orphaned divider. #}
            {% set hasGuardian1 = student.nameAndAddressOfThe1stParticipantParentGuardianRelative is not empty %}
            {% set hasGuardian2 = student.nameAndAddressOfThe2ndParticipantParentGuardianRelative is not empty %}
            {% if hasGuardian1 or hasGuardian2 %}
            <table class="stub-row">
                <tr>
                    {% if hasGuardian1 %}
                    {# ---- Guardian A / 1st Participant ---- #}
                    <td class="stub-col" {% if not hasGuardian2 %}style="width:100%;"{% endif %}>
                        <div class="stub-title">Entry Pass: Guardian A</div>
                        <table class="stub-inner">
                            <tr>
                                <td class="stub-info">
                                    <b>{{college.collegeName}}</b><br>
                                    {{college.collegeAddress}} {{college.collegeAddress1}} {{college.collegeAddress2}}<br><br>
                                    <b>Guardian 1:</b> {{student.nameAndAddressOfThe1stParticipantParentGuardianRelative}}<br><br>
                                    <b>Student:</b> {{student.studentFirstName|upper}}<br>
                                    <b>Age:</b> {{student.age}}
                                    <div class="stub-venue-line">
                                        Venue : {{staticValues.venue}}, Date : {{staticValues.date}}<br>
                                        <b>Reporting Time : {{staticValues.reportingTime}}</b>
                                    </div>
                                </td>
                                <td class="stub-qr">
                                    <img src="{{ getQr(student.academicsRegNo ~ '-1', 150, 0, 'L') }}" />
                                    <span>{{student.academicsRegNo}}-1</span>
                                </td>
                            </tr>
                        </table>
                    </td>
                    {% endif %}

                    {% if hasGuardian1 and hasGuardian2 %}
                    <td class="stub-divider"></td>
                    {% endif %}

                    {% if hasGuardian2 %}
                    {# ---- Guardian B / 2nd Participant ---- #}
                    <td class="stub-col" {% if not hasGuardian1 %}style="width:100%;"{% endif %}>
                        <div class="stub-title">Entry Pass: Guardian B</div>
                        <table class="stub-inner">
                            <tr>
                                <td class="stub-info">
                                    <b>{{college.collegeName}}</b><br>
                                    {{college.collegeAddress}} {{college.collegeAddress1}} {{college.collegeAddress2}}<br><br>
                                    <b>Guardian 2:</b> {{student.nameAndAddressOfThe2ndParticipantParentGuardianRelative}}<br><br>
                                    <b>Student Name:</b> {{student.studentFirstName|upper}}<br>
                                    <b>Age:</b> {{student.age}}
                                    <div class="stub-venue-line">
                                        Venue : {{staticValues.venue}}, Date : {{staticValues.date}}<br>
                                        <b>Reporting Time : {{staticValues.reportingTime}}</b>
                                    </div>
                                </td>
                                <td class="stub-qr">
                                    <img src="{{ getQr(student.academicsRegNo ~ '-2', 150, 0, 'L') }}" />
                                    <span>{{student.academicsRegNo}}-2</span>
                                </td>
                            </tr>
                        </table>
                    </td>
                    {% endif %}
                </tr>
            </table>
            {% endif %}

        </div>
    </body>
</html>
