{# <!--
    use to render Default template
--> #}
{# <link href="https://fonts.googleapis.com/css2?family=Lora:ital,wght@0,400;0,700;1,400;1,700&display=swap" rel="stylesheet"> #}
<style>
	.valign-top {
		vertical-align: top !important;
	}
	.primary-table table {
		border-collapse: collapse !important;
		page-break-inside: auto;
	}
	.primary-table th {
		text-align: center;
		padding: 2mm !important;
		background: none !important;
		vertical-align: middle !important;
		font-family: 'Lora', serif;
        border: 1px solid #000;
        border-bottom:1px solid #000!important;
	}
	.primary-table td {
		padding: 2mm !important;
		line-height: 18px !important;
		border: 1px solid #000;
		text-align: center;
		vertical-align: middle !important;
		page-break-inside: avoid !important;
        border-bottom:1px solid #000!important;
		/* font-family: 'Lora', serif; */
	}
	.primary-table td.valign-top {
		vertical-align: top !important;
	}
	.primary-table tr {
		height: 5mm !important;
	}
	.print-border-0 th {
		border: 1px solid #fff !important;
		background-color: #fff !important;
		height: 5mm !important;
		/* font-family: 'Lora', serif; */
	}
    .print-border-1 th {
		border-top: 1px solid #fff !important;
        border-left: 1px solid #fff !important;
        border-right: 1px solid #fff !important;
		background-color: #fff !important;
        height: 5mm !important;
		/* font-family: 'Lora', serif; */
	}
	.text-left {
		text-align: left !important;
	}
	.text-ceneter {
		text-align: center !important;
	}
	.text-right{
		text-align: right !important;
	}
	.m-t-20 {
		margin-top: 20px !important;
	}
	.m-b-50 {
		margin-bottom: 50px !important;
	}

</style>

<div class="text-center" style="margin:10px">
	<div class="text-center m-t-20">
        <table style="width:100% !important; page-break-inside:avoid;" class="table table-bordered primary-table" id="exam-tally-report" data-cols-width="10,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20,20">
        <thead>
            <tr class="print-border-1 mt-2">
                <th colspan="25" data-f-bold='true' data-a-h='center' style="border-bottom: 1px solid #fff !important; font-weight:normal!important;">
                    <div style = 'width:100%; text-align:center; padding:0 !important'>
                        <img style = 'width: auto; height: 90px;' src = '{{data.collegeData.collegeHeader}}'>
                    </div>
                </th>
            </tr>
            <tr class="print-border-1 mt-2">
                <th colspan='25' data-f-bold='true' style="text-align:left; font-size:16px!important; border-bottom: 1px solid #fff !important; font-weight:normal!important;">
                    Report taken on : <b>{{additionalInfo.currentDateTime}} </b>
                </th>
            </tr>
            <tr class="print-border-1 mt-2">
                <th colspan='25' data-f-bold='true' data-a-h='center' style="font-size:16px!important; border-bottom: 1px solid #fff !important; font-weight:normal!important;">
                    Collected fees tally report from <b>{{additionalInfo.fromDate}} - {{additionalInfo.toDate}}</b>
                </th>
            </tr>
			<tr class="print-border-1 mt-2">
                <th colspan='25' data-f-bold='true' data-a-h='center' style="font-size:16px!important; border-bottom: 1px solid #fff !important; font-weight:normal!important;">
                    Departments : <b>{{additionalInfo.departmentName}} </b>
                </th>
            </tr>
            <tr class="print-border-1 mt-2">
                <th colspan='25' data-f-bold='true' data-a-h='center' style="font-size:16px!important;  font-weight:normal!important;">
                    Semester : <b>{{additionalInfo.semesterName}} </b>
                </th>
            </tr>
            <tr>
                <th data-f-bold='true' data-a-h='center' class='bold'>SL NO</th>
                <th data-f-bold='true' data-a-h='center' class='bold'>DATE</th>
                <th data-f-bold='true' data-a-h='center' class='bold'>ACADEMIC YEAR </th>
                <th data-f-bold='true' data-a-h='center' class='bold'>FEE ACCOUNT</th>
                {% if additionalInfo.showFeeReceipt is same as true %}
                <th data-f-bold='true' data-a-h='center' class='bold'>FEES RECEIPT NUMBER</th>
                {% endif %}
                <th data-f-bold='true' data-a-h='center' class='bold'>ROLL NUMBER</th>
                <th data-f-bold='true' data-a-h='center' class='bold'>ADMISSION NO</th>
                <th data-f-bold='true' data-a-h='center' class='bold'>REGISTER NO.</th>
                <th data-f-bold='true' data-a-h='center' class='bold'>STUDENT NAME </th>
                <th data-f-bold='true' data-a-h='center' class='bold'>CLASS</th>
                <th data-f-bold='true' data-a-h='center' class='bold'>PROGRAM NAME</th>
                <th data-f-bold='true' data-a-h='center' class='bold'>FEE AMOUNT</th>
                <th data-f-bold='true' data-a-h='center' class='bold'>FINE AMOUNT</th>
                <th data-f-bold='true' data-a-h='center' class='bold'>TOTAL FEE AMOUNT</th>
                <th data-f-bold='true' data-a-h='center' class='bold'>PAYMENT MODE</th>
                <th data-f-bold='true' data-a-h='center' class='bold'>PAYMENT GATWAY TRANSACTION ID</th>
                <th data-f-bold='true' data-a-h='center' class='bold'>TRANSACTION ID </th>
                <th data-f-bold='true' data-a-h='center' class='bold'>PAYMENT MODE</th>
                <th data-f-bold='true' data-a-h='center' class='bold'>DATE OF PAYMENT</th>
                <th data-f-bold='true' data-a-h='center' class='bold'>DEBIT AMOUNT </th>
                <th data-f-bold='true' data-a-h='center' class='bold'>PAYMENT COMPLETION DATE</th>
                <th data-f-bold='true' data-a-h='center' class='bold'>CREDIT AMOUNT</th>
                <th data-f-bold='true' data-a-h='center' class='bold'>REGISTRATION NAME</th>
                <th data-f-bold='true' data-a-h='center' class='bold'>SEMESTER</th>
                <th data-f-bold='true' data-a-h='center' class='bold'>REMARKS</th>
            </tr>
        </thead>
        {% set index = 0 %}
        {% set totalFee = 0 %}
        {% set totalFine = 0 %} 
        {% for student in students %}
        {% set totalFee =  totalFee + student.totalFee %}
        {% set totalFine =  totalFine + student.fineamount %}
        {% set index = index + 1 %}
            <tr>
                <td data-a-h='center'>{{ index }}</td>
                <td style="text-align:center;" data-a-h='center'>{{student.transactionDate}} </td>
                <td style="text-align:center;" data-a-h='center'>{{student.examAcademicYear}} </td>
                <td style="text-align:center;" data-a-h='center'> </td>
                {% if additionalInfo.showFeeReceipt is same as true %}
                <td style="text-align:center;" data-a-h='center'> {{student.examRegistrationUniqueId}} </td>
                {% endif %}
                <td style="text-align:center;" data-a-h='center'>{{student.rollNo}} </td>
                <td style="text-align:center;" data-a-h='center'>{{student.admissionNo}} </td>
                <td style="text-align:center;" data-a-h='center'>{{student.registerNo}} </td>
                <td style="text-align:center;" data-a-h='center'>{{student.studentName}} </td>
                <td style="text-align:center;" data-a-h='center'>{{student.groupName}} </td>
                <td style="text-align:center;" data-a-h='center'>{{student.programName}} </td>
                <td style="text-align:center;" data-a-h='center'>{{student.feeAmount}} </td>
                <td style="text-align:center;" data-a-h='center'>{{student.fineamount ? student.fineamount~ ' (' ~ student.finetypename|join(', ') ~ ')' : "-"}} </td>
                <td style="text-align:center;" data-a-h='center'>{{student.totalPaidAmount}} </td>
                <td style="text-align:center;" data-a-h='center'>{{student.paymentMode}}  </td>
                <td style="text-align:center;" data-a-h='center'>{{student.paymentGatewayID}} </td>
                <td style="text-align:center;" data-a-h='center'>{{student.txnID}} </td>
                <td style="text-align:center;" data-a-h='center'>{{student.paymentMode}} </td>
                <td style="text-align:center;" data-a-h='center'>{{student.dateOfPayment ? student.dateOfPayment|date("d-m-Y") : "-"}} </td>
                <td style="text-align:center;" data-a-h='center'>{{student.totalFee}} </td>
                <td style="text-align:center;" data-a-h='center'>{{student.paymentCompletionDate ? student.paymentCompletionDate|date("d-m-Y") : "-"}} </td>
                <td style="text-align:center;" data-a-h='center'>{{student.totalFee}} </td>
                <td style="text-align:center;" data-a-h='center'>{{student.examRegistrationName}} </td>
                <td style="text-align:center;" data-a-h='center'>{{student.semesterName}} </td>
                <td style="text-align:center;" data-a-h='center'>Examination Fee</td>
            </tr>
        {% endfor %}
		<tr>
			<th colspan='12' data-f-bold='true' style="text-align:left" class='bold'>Total </th>
            <th data-f-bold='true' data-a-h='center' style="text-align:left">{{ totalFine }}</th>
            <th colspan='6' data-f-bold='true' data-a-h='center' style="text-align:left"></th>
			<th data-f-bold='true' data-a-h='center' style="text-align:left">{{ totalFee }}</th>
            <th data-f-bold='true' data-a-h='center' style="text-align:left"></th>
            <th data-f-bold='true' data-a-h='center' style="text-align:left">{{ totalFee }}</th>
            <th colspan='3' data-f-bold='true' data-a-h='center' style="text-align:left"></th>
		</tr>
	    </table>
    <div>
</div>


