{% extends 'wfbo/_layout.html.twig' %}

{% block title %}Pusoy Dos Results — WFBO{% endblock %}
{% block wfbo_title %}Pusoy Dos Results{% endblock %}

{% block wfbo_content %}
    {% set presets = [
        {key: 'this_month', label: 'This Month'},
        {key: 'last_month', label: 'Last Month'},
        {key: 'this_year',  label: 'This Year'},
        {key: 'last_year',  label: 'Last Year'},
    ] %}
    <div class="period-filter-bar mb-3">
        {% for p in presets %}
            <a href="{{ path('app_wfbo_pusoy_results', {period: p.key, mode: mode}) }}"
               class="period-pill {% if period.period == p.key %}is-active{% endif %}"
               data-testid="period-{{ p.key }}">
                {{ p.label }}
            </a>
        {% endfor %}
    </div>

    <div class="row g-3 mb-4">
        <div class="col-12 col-sm-6 col-xl-3">
            <div class="card h-100">
                <div class="card-body">
                    <p class="stat-label">Paid Hands</p>
                    <p class="stat-value--lg" data-testid="pd-results-hands">{{ overall.hands }}</p>
                    <p class="stat-sub">Player entries: {{ overall.total }}</p>
                </div>
            </div>
        </div>
        <div class="col-12 col-sm-6 col-xl-3">
            <div class="card h-100">
                <div class="card-body">
                    <p class="stat-label">Entries Paid Out</p>
                    <p class="stat-value--lg" style="color:#059669;">{{ overall.wins }}</p>
                    <p class="stat-sub">Losses: {{ overall.losses }}</p>
                </div>
            </div>
        </div>
        <div class="col-12 col-sm-6 col-xl-3">
            <div class="card h-100">
                <div class="card-body">
                    <p class="stat-label">Net Revenue</p>
                    <p class="stat-value--lg" style="color:{{ overall.revenue >= 0 ? '#059669' : '#dc2626' }};">₱{{ overall.revenue|number_format(2) }}</p>
                    <p class="stat-sub">Bets: ₱{{ overall.bet_amount|number_format(2) }} &middot; Paid out: ₱{{ overall.win_amount|number_format(2) }}</p>
                </div>
            </div>
        </div>
        <div class="col-12 col-sm-6 col-xl-3">
            <div class="card h-100">
                <div class="card-body">
                    <p class="stat-label">Payout Rate</p>
                    <p class="stat-value--lg" style="color:#2563eb;">{{ overall.payout_rate|number_format(2) }}%</p>
                    <p class="stat-sub">Revenue Rate: {{ overall.bet_amount > 0 ? ((overall.revenue / overall.bet_amount) * 100)|number_format(2) : '0.00' }}%</p>
                </div>
            </div>
        </div>
    </div>

    {% if byMode is not empty %}
    <div class="card table-card mb-4">
        <div class="table-scroll">
            <table class="data-table">
                <thead>
                    <tr class="thead-row--light">
                        <th class="th-white">Table Mode</th>
                        <th class="th-white">Entries</th>
                        <th class="th-white">Paid</th>
                        <th class="th-white">Not Paid</th>
                        <th class="th-white">Entry Amount</th>
                        <th class="th-white">Paid Out</th>
                        <th class="th-white">Revenue</th>
                    </tr>
                </thead>
                <tbody>
                    {% for row in byMode %}
                        <tr class="table-row">
                            <td class="td-cell fw-semibold">{{ row.mode == 'solo' ? '1 player + 3 bots' : '2+ players' }}</td>
                            <td class="td-cell">{{ row.total }}</td>
                            <td class="td-cell" style="color:#059669;">{{ row.wins }}</td>
                            <td class="td-cell" style="color:#dc2626;">{{ row.losses }}</td>
                            <td class="td-cell">₱{{ row.bet_amount|number_format(2) }}</td>
                            <td class="td-cell">₱{{ row.win_amount|number_format(2) }}</td>
                            <td class="td-cell" style="color:{{ row.revenue >= 0 ? '#059669' : '#dc2626' }}; font-weight:600;">₱{{ row.revenue|number_format(2) }}</td>
                        </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>
    {% endif %}

    <div class="d-flex align-items-center gap-3 mb-3" style="flex-wrap: wrap;">
        <span class="stat-label--sm" style="color:#6b7280;">Filter by mode:</span>
        {% for m in [{key: null, label: 'All'}, {key: 'solo', label: '1 player'}, {key: 'pot', label: '2+ players'}] %}
            <a href="{{ path('app_wfbo_pusoy_results', {mode: m.key, period: period.period}) }}"
               class="badge-status {{ mode == m.key ? 'badge-status--approved' : '' }}"
               style="{{ mode == m.key ? '' : 'background:#f3f4f6; color:#374151;' }} text-decoration:none; cursor:pointer;">
                {{ m.label }}
            </a>
        {% endfor %}
    </div>

    <div class="card table-card" data-testid="pd-results-table-card">
        <div class="table-scroll">
            <table class="data-table">
                <thead>
                    <tr class="thead-row--light">
                        <th class="th-white">Time</th>
                        <th class="th-white">Table</th>
                        <th class="th-white">Players (finish · payout)</th>
                        <th class="th-white th-white--right">Entries</th>
                        <th class="th-white th-white--right">Paid Out</th>
                        <th class="th-white">Hand</th>
                    </tr>
                </thead>
                <tbody>
                    {% for h in hands %}
                    <tr class="table-row">
                        <td class="td-cell td-cell--nowrap">
                            <p class="date-primary td-cell--dark">{{ h.created_at|date('M d, Y') }}</p>
                            <p class="date-secondary">{{ h.created_at|date('h:i A') }}</p>
                        </td>
                        <td class="td-cell td-cell--dark">
                            {{ h.tier|capitalize }} · ₱{{ h.stake|number_format(2) }}
                            {% if h.table_code %}<span class="badge bg-secondary" data-testid="pd-hand-private">Private · {{ h.table_code }}</span>{% endif %}
                            <p class="td-sub">{{ h.humans }} player{{ h.humans == 1 ? '' : 's' }} · {{ h.seats - h.humans }} bot{{ h.seats - h.humans == 1 ? '' : 's' }}</p>
                        </td>
                        <td class="td-cell td-cell--dark" style="font-size:12px;">{{ h.players }}</td>
                        <td class="td-cell td-cell--dark text-end font-mono-sm">₱{{ h.bet_amount|number_format(2) }}</td>
                        <td class="td-cell text-end font-mono-sm fw-semibold" style="color:{{ h.win_amount > 0 ? '#059669' : '#6b7280' }};">
                            {% if h.win_amount > 0 %}₱{{ h.win_amount|number_format(2) }}{% else %}—{% endif %}
                        </td>
                        <td class="td-cell">
                            <a href="{{ path('app_wfbo_pusoy_hand', {id: h.id}) }}" class="td-link" data-testid="pd-hand-link">#{{ h.id }}{{ h.status == 'playing' ? ' (live)' : '' }}</a>
                        </td>
                    </tr>
                    {% else %}
                    <tr>
                        <td colspan="6" class="td-cell text-center" style="color:#6b7280; padding:40px 16px;">No paid hands for this period.</td>
                    </tr>
                    {% endfor %}
                </tbody>
            </table>
        </div>
    </div>

    {% if totalPages > 1 %}
    <div class="d-flex align-items-center justify-content-between mt-4">
        <p class="mb-0" style="font-size:13px;color:#6b7280;">Page {{ currentPage }} of {{ totalPages }} ({{ total }} total)</p>
        <div class="d-flex gap-2">
            {% if currentPage > 1 %}
                <a href="{{ path('app_wfbo_pusoy_results', {page: currentPage - 1, period: period.period, mode: mode}) }}" class="btn btn-outline-secondary btn-sm">Previous</a>
            {% endif %}
            {% if currentPage < totalPages %}
                <a href="{{ path('app_wfbo_pusoy_results', {page: currentPage + 1, period: period.period, mode: mode}) }}" class="btn btn-outline-secondary btn-sm">Next</a>
            {% endif %}
        </div>
    </div>
    {% endif %}
{% endblock %}