{# @var teams \App\Dto\MatchLiveTeamRow[] #}
{# cotes_visible: bool — défaut true (page live = match démarré) #}
{# viewer_pronostic: array|null — prono du joueur connecté (team_id) #}
{# show_team_prono_detail: bool — ligne dépliable par équipe (défaut true) #}
{% set cotes_visible = cotes_visible|default(true) %}
{% set viewer_pronostic = viewer_pronostic|default(null) %}
{% set show_team_prono_detail = show_team_prono_detail is defined ? show_team_prono_detail : true %}
{% set connected_team_id = connected_team_id() %}
{% set teams_table_colspan = show_team_prono_detail ? 9 : 8 %}
<div class="match-live-teams-wrap match-live-teams-wrap--jokers{{ show_team_prono_detail ? '' : ' match-live-teams-wrap--no-detail' }}" id="match-live-teams" data-cotes-visible="{{ cotes_visible ? '1' : '0' }}">
    <table class="table ta-table table-sm match-live-compact-table">
        <thead>
            <tr>
                <th class="match-live-compact-th-jokers" aria-label="Jokers"></th>
                <th class="ta-num match-live-compact-th-rank" title="Classement simulé après ce score">#</th>
                <th class="match-live-compact-th-team">Équipe</th>
                <th class="ta-num" title="Total général simulé (classement + points de ce match)">Total</th>
                <th class="ta-num" title="Points pronos + buteurs sur ce match">Match</th>
                <th class="ta-num match-live-compact-th-prono">Prono 1</th>
                <th class="ta-num match-live-compact-th-prono">Prono 2</th>
                <th class="ta-num" title="Points buteurs marqueurs sur ce match">Buteurs</th>
                {% if show_team_prono_detail %}
                    <th class="match-live-compact-th-toggle" aria-label="Détail"></th>
                {% endif %}
            </tr>
        </thead>
        {% for team in teams %}
            {% set detail_id = 'match-live-detail-' ~ team.teamId %}
            {% set prono1 = team.pronostics[0]|default(null) %}
            {% set prono2 = team.pronostics[1]|default(null) %}
            {% set is_viewer_team = (viewer_pronostic and team.teamId == viewer_pronostic.team_id) or (connected_team_id and team.teamId == connected_team_id) %}
            {% set exact_prono_count = team.exactPronosticCount() %}
            {% set team_prono_outcomes = team.pronosticOutcomes() %}
            <tbody class="match-live-row-group" data-team-id="{{ team.teamId }}" data-prono-outcomes="{{ team_prono_outcomes|join(',') }}">
                <tr class="match-live-row{{ team.jokerBadges is not empty ? ' match-live-row--has-joker' : '' }}{{ is_viewer_team ? ' match-live-row--viewer' : '' }}{{ exact_prono_count >= 2 ? ' match-live-row--prono-both' : (exact_prono_count == 1 ? ' match-live-row--prono-one' : '') }}">
                    <td class="match-live-row-jokers-cell">
                        <div class="match-live-team-jokers-wrap" data-team-joker-badges-inline{% if team.jokerBadges is empty %} hidden{% endif %}>
                            {% include 'competition/_match_live_team_jokers.html.twig' with { badges: team.jokerBadges, variant: 'row' } only %}
                        </div>
                    </td>
                    <td class="match-live-compact-rank ta-num">
                        <span class="match-live-team-position match-live-team-position--simulated" data-simulated-position>#{{ team.simulatedRankingPosition }}</span>
                        {% if team.rankingPosition < 9999 %}
                            <span class="match-live-team-position match-live-team-position--before" title="Rang avant ce match">({{ team.rankingPosition }})</span>
                        {% endif %}
                    </td>
                    <td class="match-live-compact-team">
                        <div class="match-live-compact-team-cell">
                            {% if team.teamLogo %}
                                {% set team_logo_src = (team.teamLogo starts with 'http://' or team.teamLogo starts with 'https://') ? team.teamLogo : asset(team.teamLogo) %}
                                {% include 'shared/_lpf_lightbox_trigger.html.twig' with {
                                    src: team_logo_src,
                                    title: team.teamName,
                                    alt: team.teamName,
                                    img_class: 'match-live-team-logo',
                                    btn_class: 'lpf-lightbox-trigger match-live-team-logo-btn',
                                } only %}
                            {% else %}
                                <span class="match-live-team-logo-placeholder" aria-hidden="true">{{ team.teamName|first|upper }}</span>
                            {% endif %}
                            <a href="{{ path('app_team_show', { id: team.teamId }) }}" class="match-live-team-name">{{ team.teamName }}</a>
                        </div>
                    </td>
                    <td class="ta-num match-live-compact-pts" data-team-total-general title="Total général simulé">{{ team.simulatedTotalPoints|number_format(0, ',', ' ') }}</td>
                    <td class="ta-num match-live-compact-pts match-live-compact-pts--match" data-team-match-total title="Points sur ce match">{{ team.matchPointsTotal|number_format(0, ',', ' ') }}</td>
                    <td class="ta-num match-live-compact-prono-cell">
                        {% if prono1 %}
                            <span class="match-live-prono-cell" data-pronostic-id="{{ prono1.pronosticId }}">
                                <span class="match-live-prono-invert match-live-prono-invert--icon" title="Score inversé" aria-label="Score inversé"{% if not prono1.scoreInverted|default(false) %} hidden{% endif %}><i class="ti ti-arrows-left-right" aria-hidden="true"></i></span><span data-prono-score-value>{{ prono1.predHome }}-{{ prono1.predAway }}</span><span class="match-live-prono-cell__sep">·</span><strong data-prono-points>{{ prono1.teamPoints|number_format(0, ',', ' ') }}</strong>
                            </span>
                        {% else %}
                            <span class="match-live-prono-empty">—</span>
                        {% endif %}
                    </td>
                    <td class="ta-num match-live-compact-prono-cell">
                        {% if prono2 %}
                            <span class="match-live-prono-cell" data-pronostic-id="{{ prono2.pronosticId }}">
                                <span class="match-live-prono-invert match-live-prono-invert--icon" title="Score inversé" aria-label="Score inversé"{% if not prono2.scoreInverted|default(false) %} hidden{% endif %}><i class="ti ti-arrows-left-right" aria-hidden="true"></i></span><span data-prono-score-value>{{ prono2.predHome }}-{{ prono2.predAway }}</span><span class="match-live-prono-cell__sep">·</span><strong data-prono-points>{{ prono2.teamPoints|number_format(0, ',', ' ') }}</strong>
                            </span>
                        {% else %}
                            <span class="match-live-prono-empty">—</span>
                        {% endif %}
                    </td>
                    <td class="ta-num match-live-compact-pts" data-team-buteur-points title="Points buteurs sur ce match">{{ team.buteurMatchPoints|number_format(0, ',', ' ') }}</td>
                    {% if show_team_prono_detail %}
                        <td class="match-live-compact-toggle ta-num">
                            <button
                                type="button"
                                class="btn btn-primary btn-sm match-live-expand-btn"
                                data-match-live-expand
                                aria-expanded="false"
                                aria-controls="{{ detail_id }}"
                                title="Afficher le détail"
                            >
                                <i class="ti ti-chevron-down match-live-expand-btn__icon" aria-hidden="true"></i>
                                <span class="sr-only">Détail {{ team.teamName }}</span>
                            </button>
                        </td>
                    {% endif %}
                </tr>
                {% if show_team_prono_detail %}
                <tr class="match-live-detail-row" id="{{ detail_id }}" data-match-live-detail hidden>
                    <td colspan="{{ teams_table_colspan }}" class="match-live-detail-row__cell">
                        <div class="match-live-detail-panel">
                            <div class="match-live-detail-panel__row{{ team.jokerBadges is not empty ? ' match-live-detail-panel__row--has-jokers' : '' }}">
                                <div class="match-live-detail-jokers" data-team-joker-badges{% if team.jokerBadges is empty %} hidden{% endif %}>
                                    {% include 'competition/_match_live_team_jokers.html.twig' with { badges: team.jokerBadges, variant: 'detail' } only %}
                                </div>
                                <p class="match-live-detail-meta">
                                    Pronos : <strong data-team-prono-points>{{ team.pronosticMatchPoints|number_format(0, ',', ' ') }}</strong> pts
                                </p>
                                {% if team.pronostics is not empty %}
                                    <ul class="match-live-pronos-detail-list">
                                        {% for prono in team.pronostics %}
                                            <li class="match-live-prono-detail{{ viewer_pronostic and prono.pronosticId == viewer_pronostic.pronostic_id ? ' match-live-prono-detail--viewer' : '' }}" data-pronostic-id="{{ prono.pronosticId }}">
                                                <span class="match-live-prono-detail__player">{{ prono.playerLabel }}</span>
                                                <span class="match-live-prono-detail__score ta-num" data-prono-score>
                                                    <span class="match-live-prono-invert match-live-prono-invert--icon" title="Score inversé" aria-label="Score inversé"{% if not prono.scoreInverted|default(false) %} hidden{% endif %}><i class="ti ti-arrows-left-right" aria-hidden="true"></i></span><span data-prono-score-value>{{ prono.predHome }}-{{ prono.predAway }}</span>
                                                </span>
                                                {% include 'competition/_match_live_prono_calc.html.twig' with {
                                                    prono: prono,
                                                    cotes_visible: cotes_visible,
                                                } only %}
                                                <span class="match-live-prono-detail__pts ta-num">
                                                    <span class="match-live-prono-points ta-badge ta-badge-success" data-prono-points>{{ prono.teamPoints|number_format(0, ',', ' ') }}</span>
                                                </span>
                                            </li>
                                        {% endfor %}
                                    </ul>
                                {% endif %}
                                {% if team.buteurs is not empty %}
                                    <div class="match-live-buteurs-picks">
                                        <span class="match-live-buteurs-picks__label">Buteurs</span>
                                        <div class="match-live-buteurs-picks__list">
                                            {% for buteur in team.buteurs %}
                                                <span class="match-live-buteur-pick">
                                                    {% include 'buteur/_photo_lightbox.html.twig' with {
                                                        photo: buteur.photo|default(null),
                                                        name: buteur.name,
                                                        initials: buteur_initials(buteur.name),
                                                        img_class: 'match-live-buteur-pick__photo',
                                                        width: 28,
                                                        height: 28,
                                                    } only %}
                                                    <span class="match-live-buteur-pick__name">{{ buteur.name }}</span>
                                                </span>
                                            {% endfor %}
                                        </div>
                                    </div>
                                {% endif %}
                            </div>
                        </div>
                    </td>
                </tr>
                {% endif %}
            </tbody>
        {% else %}
            <tbody>
                <tr>
                    <td colspan="{{ teams_table_colspan }}" class="match-live-prono-empty">Aucune équipe enregistrée.</td>
                </tr>
            </tbody>
        {% endfor %}
    </table>
    <p class="match-live-teams-filter-empty ta-card-text" id="match-live-teams-filter-empty" hidden>
        Aucune équipe n'a au moins un prono sur ce résultat.
    </p>
</div>