{# basic template for exam application form #}

{# <!--
    use to render template KIMS application form
--> #}
<link href='https://fonts.googleapis.com/css2?family=Times New Roman:ital,wght@0,400;0,700;1,400;1,700&display=swap' rel='stylesheet'>
<style>

.text-left,.text-left td {
	text-align: left !important;
}
.text-center,.text-center th,.text-center td {
	text-align: center !important;
}
.text-right{
	text-align: right !important;
}



.details div,td{
    padding-left:3px!important;
    padding-right:10px!important;
    padding-top:3px!important;
}
.bold{
    font-weight:bold;
}
.
.pa-l-60{
    padding-left:5px!important; 
    width:350px!important;
}

.primary-table table {
    border-collapse: collapse !important;
    page-break-inside: auto;
}
.primary-table th {
    text-align: center;
    background: none !important;
    vertical-align: middle;
    padding: 2mm !important;
    border: 1px solid #000;
}
.primary-table td {
    padding: 2mm !important;
    line-height: 18px !important;
    border: 1px solid #000;
    text-align: center;
    vertical-align: middle;
    page-break-inside: avoid !important; 
}
.u-line{
    text-decoration: underline;
}
.m-t-10{
    margin-top:10px!important;
}
.border-t{
    border-top: 1px solid #000;
}
.border-b{
    border-bottom: 1px solid #000;
}
.border-l{
    border-left: 1px solid #000;
}
.border-r{
    border-right: 1px solid #000;
}
.header-table {
    border: none;
    border-collapse: collapse !important;
    margin-top: 5mm;
    width: 100% !important;
    color: #000 !important;
}

.header-table td {
    border: none;
    padding: 1mm 1mm;
    color: #000 !important;
}
.office {
    border: 1px solid black;
    /* border-spacing: 15px 50px; */
    width: 200px !important;
    /* height: 100px; */
    padding-left: 2px;
    padding-top: 5px;
    margin: 0px;
}
.college-header{
    width:90%!important;
    height:auto!important;
}
.appln-div{
    font-family: "Times New Roman", Times, serif;
}

</style>
<div class="text-center1 appln-div">
	<div class="text-center1 m-10" style="min-height: 82vh!important;">
        <section class="container full-width">
            <div class="">
                <div class="details">
                    <div style="font-weight:bold;" class="text-center">
                         <div><img src="{{college.collegeHeader}}" class="college-header"></div>
                    </div>
                    <div style="font-size:18px;font-weight:bold;" class="text-left">
                        EXAMINATION FEE RECEIPT
                    </div>
                    <div style="font-weight:bold;font-size:17px;" class="text-center">
                        {{data.examMonthYear}}
                    </div>
                    <table style="width:100%" class="text-left primary-table">
                        <tr>
                            <td style='width:20%' class="bold pa-l-60">Receipt No.</td>
                            <td style='width:30%' class="">{{data.transactionDate|date('Y')}}/{{data.FeesReceiptNumber}}</td>
                            <td style='width:20%' class="bold pa-l-60">Payment Date</td>
                            <td style='width:30%' class="">{{ data.transactionDate|date('d/m/Y') }}</td>
                        </tr>
                        <tr>
                            <td style='width:20%' class="bold pa-l-60">Transaction ID</td>
                            <td style='width:30%' class="">{{data.linwaysTxnId}}</td>
                            <td style='width:20%' class="bold pa-l-60">Payment Method</td>
                            <td class="">{{data.paymentMethod|upper}}</td>
                        </tr>
                        <tr>
                            <td style='width:20%' class="bold pa-l-60">Name</td>
                            <td style='width:30%' class="">{{data.name |upper }}</td>
                            <td style='width:20%' class="bold pa-l-60">Register No.</td>
                            <td style='width:30%' class="">{{data.registerNo}}</td>
                        </tr>
                        <tr>
                            <td style='width:20%' class="bold pa-l-60">Programme</td>
                            <td style='width:30%' class="">{{data.programName |upper }}</td>
                            <td style='width:20%' class="bold pa-l-60">Semester</td>
                            <td style='width:30%' class="">{{data.academicTermOrderNo}}</td>  
                        </tr>
                    </table>
                    {# FEE DETAILS #}
                        <div class="bold text-left" style="margin-top:30px;">Fee Details</div>

                        <table style="width:100%" class="primary-table">
                            <tr>
                                <th style="width:65%;" class="text-left">Particulars</th>
                                <th style="width:35%;" class="text-left">Amount</th>
                            </tr>

                            {% for name,fee in data.appliedFeeDetails.classTypeSubjectFees %}
                                {% if data.appliedFeeDetails.classTypeSubjectFeeCalc[name].subjectFee > 0 %}
                                    <tr>
                                        <td class="text-left">
                                            {{ name }}
                                        </td>
                                        <td class="text-left">
                                            {{ fee }}
                                        </td>
                                    </tr>
                                {% endif %}
                            {% endfor %}

                            {% for key,fee in data.appliedFeeDetails.commonFees %}
                                {% if fee.value > 0 %}
                                    <tr>
                                        <td class="text-left">
                                            {{ fee.feeName | upper }}
                                        </td>
                                        <td class="text-left">
                                            {{ fee.value }}
                                        </td>
                                    </tr>
                                {% endif %}
                            {% endfor %}

                            {% if data.appliedFeeDetails.totalCommonFines > 0 %}
                                <tr>
                                    <td class="text-left">
                                        FINE
                                    </td>
                                    <td class="text-left">
                                        {{ data.appliedFeeDetails.totalCommonFines }}
                                    </td>
                                </tr>
                            {% endif %}

                            <tr>
                                <td class="text-left bold">
                                    Total Paid
                                </td>
                                <td class="text-left bold">
                                    {{ data.examRegistrationPaidAmount }}
                                </td>
                            </tr>
                        </table>
                    </div>
                        <div class='bold m-t-10 text-left' style="margin-top: 30px !important">Courses Registered</div>
                        <table style="width:100%" class="primary-table">
                            <tr>
                                <th style="width:20%;" class="text-left">Code</th>
                                <th style="width:55%;" class="text-left">Course Title</th>
                            </tr>
                            {% for subject in data.subjects %}
                            <tr>
                                <td class="text-left">{{subject.code}}</td>
                                <td class="text-left">{{subject.name}}</td>
                            </tr>
                            {% endfor %}
                        </table>
                            <table style="width:100%;margin-top: 70px !important" class="m-t-10" > 
                            <tr>
                                <td>Payment Method : {{ data.paymentMethod|upper }}</td>
                            </tr>
                            <tr>
                                <td></td>
                            </tr>
                            <tr>
                                <td></td>
                            </tr>
                            <tr>
                                <td>Generated By : {{ data.userType == 'STUDENT' ? data.name : data.staffName }}</td>
                                <td style='float:right;text-align:right!important' class='bold'>Authorized Signature</td>
                            </tr>
                        </table>
                </div>
            </div>
        </section>
    <div>
</div>