{% extends 'base.html.twig' %}

{% block title %}Live Racing - {{ event.management.name }} Results{% endblock %}

{% block body %}
<div class="container page-container" style="padding-top: 16px; padding-bottom: 100px;">

    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <h2 class="mb-1">{{ event.management.name }}</h2>
            <p class="text-muted mb-0">{{ event.eventDate|date('l, F j, Y') }}</p>
        </div>
        <a href="{{ path('app_play_live_racing_results') }}" class="btn btn-outline-secondary" data-testid="link-back-to-results">
            ← Race Results
        </a>
    </div>

    {% if myTickets|length > 0 %}
        <h3 class="wfbo-card-title mb-2" style="font-size: 16px;">Your Bets</h3>
        <div class="card bg-white mb-4" data-bs-theme="light">
            <div class="table-responsive">
                <table class="table table-hover mb-0 stack-table" data-testid="player-my-tickets-table">
                    <thead>
                        <tr>
                            <th>Bet Type</th>
                            <th>Race #</th>
                            <th>Selection</th>
                            <th>Reference</th>
                            <th>Amount</th>
                            <th>Status</th>
                            <th>Payout</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for ticket in myTickets %}
                            <tr data-testid="player-my-ticket-row-{{ ticket.id }}">
                                <td>{{ ticket.betTypeKey|replace({'_': ' '})|title }}</td>
                                <td data-testid="race-number-{{ ticket.id }}">{{ ticket.raceNumbersLabel }}</td>
                                <td>{{ ticket.selectionsSummary }}</td>
                                <td>
                                    <small>{{ ticket.baseReference }}</small>
                                    {% if ticket.comboCount > 1 %}
                                        <span data-testid="combo-count-{{ ticket.id }}">×{{ ticket.comboCount }}</span>
                                    {% endif %}
                                </td>
                                <td data-label="Amount">₱{{ ticket.amount|number_format(2) }}</td>
                                <td data-label="Status">
                                    {% if ticket.status == 'pending' %}
                                        <span class="badge bg-warning text-dark">Pending</span>
                                    {% elseif ticket.status == 'won' %}
                                        <span class="badge bg-success">Won</span>
                                    {% elseif ticket.status == 'void' %}
                                        <span class="badge bg-dark">Void</span>
                                    {% elseif ticket.status == 'mixed' %}
                                        <span class="badge" style="background:#4c1d95; color:#ddd6fe;">{{ ticket.statusLabel }}</span>
                                    {% else %}
                                        <span class="badge bg-secondary">Lost</span>
                                    {% endif %}
                                </td>
                                <td data-label="Payout">
                                    {% if ticket.payout %}
                                        ₱{{ ticket.payout|number_format(2) }}
                                    {% else %}
                                        -
                                    {% endif %}
                                </td>
                            </tr>
                        {% endfor %}
                    </tbody>
                </table>
            </div>
        </div>
    {% endif %}

    <h3 class="wfbo-card-title mb-2" style="font-size: 16px;">Race Results</h3>

    {% for entry in raceResults %}
        {% set race = entry.race %}
        {% set horses = entry.horses %}
        {% set dividendRows = entry.dividendRows %}

        <div class="card bg-white mb-3" data-bs-theme="light" data-testid="player-race-result-{{ race.id }}">
            <div class="card-body">
                <div class="d-flex justify-content-between align-items-center mb-3">
                    <h4 class="mb-0" style="font-size: 15px;">Race {{ race.raceNumber }}</h4>
                    {% if race.settled %}
                        <span class="badge bg-success">Settled</span>
                    {% elseif race.closed %}
                        <span class="badge bg-warning text-dark">Closed</span>
                    {% else %}
                        <span class="badge bg-secondary">Open</span>
                    {% endif %}
                </div>

                {% if race.settled %}
                    <div class="detail-grid mb-0">
                        <div class="detail-item">
                            <div class="detail-label">Finishing Order</div>
                            <div class="detail-value" data-testid="player-race-result-text-{{ race.id }}">
                                {% set position = 0 %}
                                {% for finisher in race.result %}
                                    {% set isContinuation = loop.index0 > 0 and finisher.deadHeat is defined and finisher.deadHeat and race.result[loop.index0 - 1].deadHeat is defined and race.result[loop.index0 - 1].deadHeat %}
                                    {% if isContinuation %}
                                        = Horse #{{ finisher.horseNumber }}
                                    {% else %}
                                        {% set position = position + 1 %}
                                        {{ not loop.first ? ', ' : '' }}{{ position }}. Horse #{{ finisher.horseNumber }}
                                    {% endif %}
                                {% endfor %}
                            </div>
                        </div>
                        <div class="detail-item">
                            <div class="detail-label">Result Set At</div>
                            <div class="detail-value">{{ race.resultSetAt|date('Y-m-d H:i') }}</div>
                        </div>
                        {% set scratchedAfterClose = horses|filter(h => h.scratchedAfterClose) %}
                        {% if scratchedAfterClose is not empty %}
                            <div class="detail-item">
                                <div class="detail-label">Scratched After Close</div>
                                <div class="detail-value" data-testid="player-scratched-after-close-{{ race.id }}">
                                    {% for horse in scratchedAfterClose %}
                                        {{ not loop.first ? ', ' : '' }}Horse #{{ horse.horseNumber }}{% if horse.substituteHorse %} (substitute: Horse #{{ horse.substituteHorse.horseNumber }}){% endif %}
                                    {% endfor %}
                                </div>
                            </div>
                        {% endif %}
                        {% if dividendRows is not empty %}
                            <div class="detail-item">
                                <div class="detail-label">Dividends</div>
                                <div class="detail-value" data-testid="player-dividends-summary-{{ race.id }}">
                                    {% for row in dividendRows %}
                                        <div data-testid="player-dividend-row-{{ row.id }}">
                                            {{ row.label }}{% if row.kind == 'multi' %} (whole combo){% endif %}:
                                            {% if row.refund %}
                                                Refunded
                                            {% elseif row.deadHeatDividendA is not null or row.deadHeatDividendB is not null %}
                                                Dead Heat {{ row.deadHeatDividendA }} / {{ row.deadHeatDividendB }}
                                            {% else %}
                                                {% set winnerNumber = race.result[0].horseNumber ?? null %}
                                                {% if row.kind == 'multi' and row.legPrefix is not empty and winnerNumber %}
                                                    Dividend ({{ row.legPrefix }}{{ winnerNumber }}): {{ row.dividend }}
                                                {% else %}
                                                    {{ row.dividend }}
                                                {% endif %}
                                                {%- if row.substituteDividend is not null %} (Substitute: {{ row.substituteDividend }}){% endif %}
                                                {%- if row.scratchDividends is not null and row.scratchDividends is not empty %}
                                                    {% for horseId, div in row.scratchDividends %}
                                                        {% set scratchHorse = horses|filter(h => h.id == horseId)|first %}
                                                        {% set scratchNumber = scratchHorse ? scratchHorse.horseNumber : ('#' ~ horseId) %}
                                                        {% if row.legPrefix is not empty %}
                                                            Scratch ({{ row.legPrefix }}{{ scratchNumber }}): {{ div }}
                                                        {% else %}
                                                            Scratch Horse #{{ horseId }}: {{ div }}
                                                        {% endif %}
                                                        {% if not loop.last %}, {% endif %}
                                                    {% endfor %}
                                                {% endif %}
                                            {% endif %}
                                        </div>
                                    {% endfor %}
                                </div>
                            </div>
                        {% endif %}
                    </div>
                {% else %}
                    <p class="text-body-secondary mb-0" data-testid="player-race-result-pending-{{ race.id }}">Result pending.</p>
                {% endif %}
            </div>
        </div>
    {% endfor %}

</div>

{# Wallet Bar #}
<div class="wallet-bar" data-testid="wallet-bar">
    <div class="wallet-bar__balance"
         data-controller="balance-counter"
         data-balance-counter-amount-value="{{ app.user.walletBalance }}">
        <p class="wallet-bar__label">Balance</p>
        <p class="wallet-bar__amount" data-testid="wallet-bar-amount"
           data-balance-counter-target="display">₱{{ app.user.walletBalance|number_format(2) }}</p>
    </div>
    <div class="wallet-bar__actions">
        <a href="{{ path('app_deposit') }}"
           class="pill-link--ghost"
           style="font-size: 12px; padding: 7px 14px;"
           data-testid="wallet-bar-add-funds">+ Add Funds</a>
    </div>
</div>

{% endblock %}