{{!
    @template local_kid/comparateur_results

    Results area only (toolbar + student cards) — shared between the full
    page render (comparateur.mustache, wrapped in its <main> region) and the
    live-filter AJAX endpoint (local_kid_get_comparateur_results), which
    re-renders exactly this fragment and swaps it into that same region.

    * hasselection - bool
    * emptymessage - string
    * studentcards - [{ studentname, cardstats, groupheaders: [{label,span}],
      sourceheaders: [{label,url}], hasrows, rows: [{competencycode, competencylabel, studentname,
      cells: [{outofscope, niveaulabel, niveauclass, hascomment, commentshort, commentfull,
      commentislong, saisieurl, sourcelabel, sourcetypelabel}]}] }]
    * hasstudentcards - bool
    * stats - string
    * canexport - bool
    * csvurl - string
    * xlsxurl - string
}}
<div class="kid-comparateur__toolbar">
    <div class="fr-text--sm">{{stats}}</div>
    {{#canexport}}
    <div class="kid-comparateur__exportbtns">
        <a class="fr-btn fr-btn--secondary fr-btn--sm" href="{{csvurl}}">{{#str}}comparateur_export_csv, local_kid{{/str}}</a>
        <a class="fr-btn fr-btn--sm" href="{{xlsxurl}}">{{#str}}comparateur_export_xlsx, local_kid{{/str}}</a>
    </div>
    {{/canexport}}
</div>

{{^hasselection}}
<div class="kid-empty">
    <h3>{{#str}}comparateur_empty_title, local_kid{{/str}}</h3>
    <p>{{emptymessage}}</p>
</div>
{{/hasselection}}

{{#hasselection}}
{{#studentcards}}
<div class="kid-comparateur__card">
    <div class="kid-comparateur__cardhead">
        <span class="kid-comparateur__name">{{studentname}}</span>
        <span class="fr-text--sm">{{cardstats}}</span>
    </div>
    {{^hasrows}}
    <div class="kid-empty">{{#str}}comparateur_nomatch, local_kid{{/str}}</div>
    {{/hasrows}}
    {{#hasrows}}
    <div class="kid-comparateur__scroll">
        <table class="kid-comparateur__matrix">
            <caption class="fr-sr-only">{{studentname}}</caption>
            <thead>
                <tr>
                    <th class="kid-comparateur__corner"></th>
                    {{#groupheaders}}
                    <th colspan="{{span}}" class="kid-comparateur__typehead">{{label}}</th>
                    {{/groupheaders}}
                </tr>
                <tr>
                    <th class="kid-comparateur__corner kid-comparateur__corner--2">{{#str}}comparateur_col_competence, local_kid{{/str}}</th>
                    {{#sourceheaders}}
                    <th><a class="kid-comparateur__srclink" href="{{url}}">{{label}}</a></th>
                    {{/sourceheaders}}
                </tr>
            </thead>
            <tbody>
                {{#rows}}
                <tr>
                    <td class="kid-comparateur__comp">{{competencylabel}}</td>
                    {{#cells}}
                    {{#outofscope}}
                    <td class="kid-comparateur__cell"><span class="kid-comparateur__dash" title="{{#str}}comparateur_outofscope, local_kid{{/str}}">—</span></td>
                    {{/outofscope}}
                    {{^outofscope}}
                    <td class="kid-comparateur__cell kid-comparateur__cell--clickable"
                        data-drawer-student="{{studentname}}"
                        data-drawer-competency="{{competencycode}} · {{competencylabel}}"
                        data-drawer-source="{{sourcelabel}}"
                        data-drawer-sourcetype="{{sourcetypelabel}}"
                        data-drawer-niveau="{{niveaulabel}}"
                        data-drawer-niveauclass="{{niveauclass}}"
                        data-drawer-comment="{{commentfull}}"
                        data-drawer-saisieurl="{{saisieurl}}">
                        <span class="fr-badge kid-level-badge {{niveauclass}}">{{niveaulabel}}</span>
                        {{#hascomment}}
                        <span class="kid-comparateur__comment">{{commentshort}}{{#commentislong}} <span class="kid-comparateur__more">{{#str}}comparateur_seemore, local_kid{{/str}}</span>{{/commentislong}}</span>
                        {{/hascomment}}
                    </td>
                    {{/outofscope}}
                    {{/cells}}
                </tr>
                {{/rows}}
            </tbody>
        </table>
    </div>
    {{/hasrows}}
</div>
{{/studentcards}}
{{/hasselection}}
