{% load math_tags %}

<style>
    table.rank-table {
        width: 100%;
        border-collapse: collapse;
        font-size: 10px;
    }
    table.rank-table th,
    table.rank-table td {
        border: 1px solid #222;
        padding: 3px;
        text-align: center;
    }
    .header {
        background: #CFEAFB;
        font-weight: bold;
        font-size: 15px;
        text-align: center;
    }
    .subheader {
        background: #E2F7FD;
        font-weight: bold;
    }
    .bold { font-weight: bold; }
</style>


<table class="rank-table">

    <!-- TOP HEADER -->
    <tr>
        <th colspan="26" class="header">
            OFISI YA RAIS – TAMISEMI<br>
            MATOKEO YA DARASA LA NNE – {{ year }}
        </th>
    </tr>

    <tr><th colspan="26"></th></tr>

    <tr class="subheader">
        <th colspan="3" style="text-align:left;">MKOA:</th>
        <th colspan="23" style="text-align:left;">{{ region.name }}</th>
    </tr>



    <!-- COLUMN HEADERS -->
    <tr class="subheader">
        <th rowspan="2">NO</th>
        <th rowspan="2" style="text-align:left;">JINA</th>

        <th colspan="3">A</th>
        <th colspan="3">B</th>
        <th colspan="3">C</th>
        <th colspan="3">D</th>
        <th colspan="3">E</th>

        <th rowspan="2">TOTAL<br>STD</th>
        <th rowspan="2">SCH</th>

        <th colspan="3">PASS (A–C)</th>
        <th colspan="3">% PASS (A–C)</th>

        <th rowspan="2">AVG</th>
    </tr>

    <tr class="subheader">
        <th>F</th><th>M</th><th>T</th>
        <th>F</th><th>M</th><th>T</th>
        <th>F</th><th>M</th><th>T</th>
        <th>F</th><th>M</th><th>T</th>
        <th>F</th><th>M</th><th>T</th>

        <th>F</th><th>M</th><th>T</th>
        <th>F%</th><th>M%</th><th>T%</th>
    </tr>

    <!-- DATA ROWS -->
    {% for r in districts %}
    <tr>
        <td>{{ r.rank }}</td>
        <td class="bold" style="text-align:left;">
    {{ r.district }}
</td>


        <!-- GRADE A -->
        <td>{{ r.af }}</td>
        <td>{{ r.am }}</td>
        <td>{{ r.a }}</td>

        <!-- GRADE B -->
        <td>{{ r.bf }}</td>
        <td>{{ r.bm }}</td>
        <td>{{ r.b }}</td>

        <!-- GRADE C -->
        <td>{{ r.cf }}</td>
        <td>{{ r.cm }}</td>
        <td>{{ r.c }}</td>

        <!-- GRADE D -->
        <td>{{ r.df }}</td>
        <td>{{ r.dm }}</td>
        <td>{{ r.d }}</td>

        <!-- GRADE E -->
        <td>{{ r.ef }}</td>
        <td>{{ r.em }}</td>
        <td>{{ r.e }}</td>

        <!-- TOTAL STD & SCHOOLS -->
        <td>{{ r.total_std }}</td>
        <td>{{ r.total_schools }}</td>

        <!-- PASS A–C -->
        <td>{{ r.pass_f }}</td>
        <td>{{ r.pass_m }}</td>
        <td>{{ r.pass_t }}</td>

        <!-- PASS % -->
        <td>{{ r.pass_f|safe_pct:r.total_std }}</td>
        <td>{{ r.pass_m|safe_pct:r.total_std }}</td>
        <td>{{ r.pass_t|safe_pct:r.total_std }}</td>

        <!-- AVERAGE SCORE -->
        <td>{{ r.avg_score }}</td>
    </tr>
    {% endfor %}

    <!-- GRAND TOTAL ROW -->
    <tr class="bold">

        <td colspan="2">TOTAL</td>

        <td>{{ totals.af }}</td>
        <td>{{ totals.am }}</td>
        <td>{{ totals.a }}</td>

        <td>{{ totals.bf }}</td>
        <td>{{ totals.bm }}</td>
        <td>{{ totals.b }}</td>

        <td>{{ totals.cf }}</td>
        <td>{{ totals.cm }}</td>
        <td>{{ totals.c }}</td>

        <td>{{ totals.df }}</td>
        <td>{{ totals.dm }}</td>
        <td>{{ totals.d }}</td>

        <td>{{ totals.ef }}</td>
        <td>{{ totals.em }}</td>
        <td>{{ totals.e }}</td>

        <td>{{ totals.total_std }}</td>
        <td>{{ totals.total_schools }}</td>

        <td>{{ totals.pass_f }}</td>
        <td>{{ totals.pass_m }}</td>
        <td>{{ totals.pass_t }}</td>

        <td>{{ totals.pass_f|safe_pct:totals.total_std }}</td>
        <td>{{ totals.pass_m|safe_pct:totals.total_std }}</td>
        <td>{{ totals.pass_t|safe_pct:totals.total_std }}</td>

        <td>{{ totals.avg_score }}</td>
    </tr>

</table>