<style>
    * {
        
    }
    .report-wrapper { width: 100%; 
    font-family: 'Times New Roman', Times, serif;
    font-size: 10px; }
    .no-border td { border: none !important; }
    .college-header-table { width: 100%; border-collapse: collapse; }
    .college-header-table td { border: none !important; padding: 2px; }
    .report-title-table { width: 100%; border-collapse: collapse; margin-bottom: 4px; }
    .report-title-table td { border: none !important; text-align: center; padding: 1px 2px; }
    .updated-on { text-align: right; font-style: italic; font-size: 9px; padding-right: 4px; }
    .main-table { width: 100%; border-collapse: collapse; margin-top: 4px; }
    .main-table th, .main-table td {
        border: 1px solid #000;
        padding: 2px 3px;
        text-align: center;
        vertical-align: middle;
    }
    .main-table th { font-weight: bold; background: none; }
    .text-left { text-align: left !important; }
    .summary-topper-table { width: 100%; border-collapse: collapse; margin-top: 6px; }
    .summary-topper-table td { padding: 2px 4px; vertical-align: top; border: none !important; }
    .summary-table { border-collapse: collapse; width: 100%; }
    .summary-table td { border: 1px solid #000 !important; padding: 2px 5px; }
    .topper-table { border-collapse: collapse; width: 100%; }
    .topper-table th { border: 1px solid #000; padding: 2px 5px; text-align: center; font-weight: bold; }
    .topper-table td { border: 1px solid #000 !important; padding: 2px 5px; text-align: center; }
    .signature-table { width: 100%; border-collapse: collapse; margin-top: 18px; }
    .signature-table td { border: none !important; padding: 2px 4px; vertical-align: top; width: 33%; }
    .batch-result-section { margin-top: 16px; width: 100%; }
    .batch-result-inner { width: 100%; border-collapse: collapse; }
    .batch-result-inner td { padding: 2px 4px; vertical-align: top; border: none !important; }
    .batch-stat-table { border-collapse: collapse; width: 100%; }
    .batch-stat-table th { border: 1px solid #000; padding: 2px 5px; text-align: center; font-weight: bold; }
    .batch-stat-table td { border: 1px solid #000; padding: 2px 5px; }
    .bold { font-weight: bold; }
    .t-center { text-align: center; }
    .underline { text-decoration: underline; }
</style>

<div class="report-wrapper">

    {# College Header #}
    <table style="width:100%;border-collapse:collapse;border:0!important;">
        <tr>
            <td style="border:0!important;padding-top:5px;text-align:center;">
                <img src="{{ resultAnalysis.collegeData.collegeHeader }}" alt="College Header" style="width:100%;max-width:680px;height:auto;">
            </td>
        </tr>
        <tr>
            <td style="border:0!important;text-align:right;font-style:italic;font-size:13px;padding-right:4px;">Updated on {{ resultAnalysis.publishingStartDate }}</td>
        </tr>
    </table>

    {# Report Title #}
    <table style="width:100%;border-collapse:collapse;border:0!important;margin-bottom:1px;">
         <tr>
            <td style="border:0!important;text-align:center;padding:1px 2px; font-size:15px;">
                <span class="bold">DETAILED COURSE WISE REPORT</span>
            </td>
        </tr>
        <tr>
            <td style="border:0!important;text-align:center;padding:1px 2px; font-size:15px;">
                <span class="bold">DEPARTMENT OF </span>
                <span class=" bold">{{ resultAnalysis.departmentDesc }}</span>
            </td>
        </tr>
        <tr>
            <td style="border:0!important;text-align:center;padding:1px 2px; font-size:15px;">
                <span class="bold ">{{ resultAnalysis.semesterRoman }} SEM B.TECH RESULT ANALYSIS
                ( {{ resultAnalysis.batchStartYear }} - {{ resultAnalysis.batchEndYear }} Batch)</span>
            </td>
        </tr>
        <tr>
            <td style="border:0!important;text-align:center;padding:1px 2px; font-size:15px;"><span class="bold">({{ resultAnalysis.examRegistrationName }})</span></td>
        </tr>
    </table>

    {# Subject-wise Grade Distribution Table #}
    <table class="main-table">
        <thead>
            <tr>
                <th style="width:28%">Subject Code &amp; Subject Name</th>
                <th style="width:15%">Faculty</th>
                <th style="width:4%">Pass %</th>
                <th style="width:4%">Pass</th>
                <th style="width:4%">Fail</th>
                {% for grade in resultAnalysis.gradeColumns %}
                <th style="width:4%">{{ grade }}</th>
                {% endfor %}
                <th style="width:5%">WH/<br>AB/<br>DB/<br>FE</th>
                <th style="width:4%">Total</th>
            </tr>
        </thead>
        <tbody>
        {% for subject in resultAnalysis.subjectStats %}
            <tr>
                <td class="text-left">{{ subject.code }} - {{ subject.name }}</td>
                <td class="text-left">{{ subject.faculty }}</td>
                <td>{{ subject.passPercentage }}</td>
                <td>{{ subject.pass }}</td>
                <td>{{ subject.fail }}</td>
                {% for grade in resultAnalysis.gradeColumns %}
                <td>{{ subject.grades[grade] is defined ? subject.grades[grade] : 0 }}</td>
                {% endfor %}
                <td>{{ subject.whAbDbFe }}</td>
                <td>{{ subject.total }}</td>
            </tr>
        {% endfor %}
        </tbody>
    </table>

    {# Summary + Toppers SGPA as two separate tables inside a borderless wrapper #}
    {% set toppersSgpa = resultAnalysis.toppersSgpa %}
    <table style="width:100%; border-collapse:separate!important; border-spacing:0; border:0!important; margin-top:6px;">
        <tr>
            <td style="width:55%; vertical-align:top; border:0!important; padding-right:6px;">
                <table style="width:100%; border-collapse:collapse; border:0!important;">
                    <tr>
                        <td style="border:1px solid #000; padding:2px 5px; font-weight:bold; text-align:left;">Total Students</td>
                        <td style="border:1px solid #000; padding:2px 5px; text-align:right;">{{ resultAnalysis.summary.totalStudents }}</td>
                    </tr>
                    <tr>
                        <td style="border:1px solid #000; padding:2px 5px; font-weight:bold; text-align:left;">Total Passed (students having no arrears)</td>
                        <td style="border:1px solid #000; padding:2px 5px; text-align:right;">{{ resultAnalysis.summary.totalPassed }}</td>
                    </tr>
                    <tr>
                        <td style="border:1px solid #000; padding:2px 5px; font-weight:bold; text-align:left;">Students having one arrear</td>
                        <td style="border:1px solid #000; padding:2px 5px; text-align:right;">{{ resultAnalysis.summary.oneArrear }}</td>
                    </tr>
                    <tr>
                        <td style="border:1px solid #000; padding:2px 5px; font-weight:bold; text-align:left;">Students having more than one arrears</td>
                        <td style="border:1px solid #000; padding:2px 5px; text-align:right;">{{ resultAnalysis.summary.moreThanOneArrear }}</td>
                    </tr>
                    <tr>
                        <td style="border:1px solid #000; padding:2px 5px; font-weight:bold; text-align:left;">Pass Percentage (REGULAR)</td>
                        <td style="border:1px solid #000; padding:2px 5px; text-align:right;">{{ resultAnalysis.summary.passPercentage }}</td>
                    </tr>
                </table>
            </td>
            <td style="width:45%; vertical-align:top; border:0!important;">
                <table style="width:100%; border-collapse:collapse; border:0!important;">
                    <tr>
                        <th colspan="2" style="border:1px solid #000; padding:2px 5px; text-align:center;">TOPPERS (SGPA)</th>
                    </tr>
                    {% for topper in toppersSgpa %}
                    <tr>
                        <td style="border:1px solid #000; padding:2px 5px; text-align:left;">{{ topper.registerNo }} {{ topper.name }}</td>
                        <td style="border:1px solid #000; padding:2px 5px; text-align:center; width:20%;">{{ topper.sgpa }}</td>
                    </tr>
                    {% endfor %}
                </table>
            </td>
        </tr>
    </table>

    {# Signatures #}
    <table style="width:100%;border-collapse:collapse;margin-top:40px; border:0!important;">
        <tr>
            <td style="border:0!important;padding:2px 4px;vertical-align:top;width:33%;">
                <div class="bold">CLASS TUTOR</div>
                <div>NAME &amp; SIGNATURE</div>
                <div>(With Date)</div>
            </td>
            <td style="border:0!important;padding:2px 4px;vertical-align:top;width:33%;text-align:center;">
                <div class="bold">HoD</div>
                <div>NAME &amp; SIGNATURE</div>
                <div>(With Date)</div>
            </td>
            <td style="border:0!important;padding:2px 4px;vertical-align:top;width:33%;text-align:right;">
                <div class="bold">PRINCIPAL</div>
            </td>
        </tr>
    </table>

    {% if resultAnalysis.isFinalSemester %}
    {# Batch Results + Toppers CGPA as two separate tables inside a borderless wrapper #}
    {% set toppersCgpa = resultAnalysis.toppersCgpa %}
    <div class="batch-result-section">
        <table style="width:100%; border-collapse:separate!important; border-spacing:0; border:0!important;">
            <tr>
                <td style="width:55%; vertical-align:top; border:0!important; padding-right:6px;">
                    <table style="width:100%; border-collapse:collapse; border:0!important;">
                        <tr>
                            <th colspan="2" style="border:1px solid #000; padding:2px 5px; text-align:center;">
                                {{ resultAnalysis.batchStartYear }}-{{ resultAnalysis.batchEndYear }} Results After S{{ resultAnalysis.lastSemesterNo }}
                            </th>
                        </tr>
                        <tr>
                            <td style="border:1px solid #000; padding:2px 5px; font-weight:bold; text-align:left;">Total Students</td>
                            <td style="border:1px solid #000; padding:2px 5px; text-align:right;">{{ resultAnalysis.batchStats.totalStudents }}</td>
                        </tr>
                        <tr>
                            <td style="border:1px solid #000; padding:2px 5px; font-weight:bold; text-align:left;">Total Students Graduated</td>
                            <td style="border:1px solid #000; padding:2px 5px; text-align:right;">{{ resultAnalysis.batchStats.graduated }}</td>
                        </tr>
                        <tr>
                            <td style="border:1px solid #000; padding:2px 5px; font-weight:bold; text-align:left;">Total Students having supplementary</td>
                            <td style="border:1px solid #000; padding:2px 5px; text-align:right;">{{ resultAnalysis.batchStats.hasSupplementary }}</td>
                        </tr>
                        <tr>
                            <td style="border:1px solid #000; padding:2px 5px; font-weight:bold; text-align:left;">Percentage of Graduation</td>
                            <td style="border:1px solid #000; padding:2px 5px; text-align:right;">{{ resultAnalysis.batchStats.graduationPercentage }} %</td>
                        </tr>
                    </table>
                </td>
                <td style="width:45%; vertical-align:top; border:0!important;">
                    <table style="width:100%; border-collapse:collapse; border:0!important;">
                        <tr>
                            <th colspan="2" style="border:1px solid #000; padding:2px 5px; text-align:center;">TOPPERS (CGPA)</th>
                        </tr>
                        {% for topper in toppersCgpa %}
                        <tr>
                            <td style="border:1px solid #000; padding:2px 5px; text-align:left;">{{ topper.registerNo }} {{ topper.name }}</td>
                            <td style="border:1px solid #000; padding:2px 5px; text-align:center; width:20%;">{{ topper.cgpa }}</td>
                        </tr>
                        {% endfor %}
                    </table>
                </td>
            </tr>
        </table>
    </div>
    {% endif %}

</div>
