{% extends "base.html" %}
{% block head %}<meta http-equiv="refresh" content="60">{% endblock %}
{% block content %}
<h1>Maçlar</h1>
<p class="sub">Canlı takip, fikstür ve sonuçlar · satıra tıklayınca olay akışı ve thread açılır</p>

<div class="pill-row" style="margin-bottom:16px">
  <a href="/matches" class="pill {% if not lig %}on{% endif %}">Tüm ligler</a>
  {% for l in leagues %}
  <a href="/matches?lig={{ l.key }}" class="pill {% if lig==l.key %}on{% endif %}">{{ l.name }}</a>
  {% endfor %}
</div>

<!-- Canlı -->
<div class="card" style="margin-bottom:14px">
  <div class="card-h">
    <h2><span style="color:var(--critical)">●</span> Canlı ({{ live|length }})</h2>
  </div>
  <div class="card-b" style="padding:6px 18px 14px">
    {% if live %}
    <table>
      <thead><tr><th>Lig</th><th>Maç</th><th class="num">Skor</th><th class="num">Durum</th></tr></thead>
      <tbody>
      {% for m in live %}
      <tr>
        <td class="muted xs">{{ m.league.name if m.league else '—' }}</td>
        <td><a href="/match/{{ m.id }}" style="font-weight:600">{{ m.home_team }} - {{ m.away_team }}</a></td>
        <td class="num" style="font-weight:650">{{ m.home_score }}-{{ m.away_score }}</td>
        <td class="num">
          {% if m.status=='ht' %}<span class="tag t-warn">devre</span>
          {% else %}<span class="tag t-good">canlı</span>{% endif %}
        </td>
      </tr>
      {% endfor %}
      </tbody>
    </table>
    {% else %}<p class="empty">Şu an canlı maç yok.</p>{% endif %}
  </div>
</div>

<!-- Yaklaşan -->
<div class="card" style="margin-bottom:14px">
  <div class="card-h"><h2>Yaklaşan maçlar</h2><span class="xs muted">{{ upcoming|length }}</span></div>
  <div class="card-b" style="padding:6px 18px 14px">
    {% if upcoming %}
    <table>
      <thead><tr><th>Tarih (TR)</th><th>Lig</th><th>Maç</th><th class="num">Anlatım</th></tr></thead>
      <tbody>
      {% for m in upcoming %}
      <tr>
        <td class="muted" style="white-space:nowrap">{{ m.kickoff|tr }}</td>
        <td class="muted xs">{{ m.league.name if m.league else '—' }}</td>
        <td><a href="/match/{{ m.id }}">{{ m.home_team }} - {{ m.away_team }}</a></td>
        <td class="num xs muted">
          {% if m.league_id in tiers %}{{ labels[tiers[m.league_id]].split('—')[0] }}{% endif %}
        </td>
      </tr>
      {% endfor %}
      </tbody>
    </table>
    {% else %}<p class="empty">Fikstür henüz senkronlanmadı.</p>{% endif %}
  </div>
</div>

<!-- Sonuçlar -->
<div class="card">
  <div class="card-h"><h2>Son sonuçlar</h2></div>
  <div class="card-b" style="padding:6px 18px 14px">
    {% if recent %}
    <table>
      <thead><tr><th>Tarih</th><th>Lig</th><th>Maç</th><th class="num">Skor</th></tr></thead>
      <tbody>
      {% for m in recent %}
      <tr>
        <td class="muted" style="white-space:nowrap">{{ m.kickoff|tr('%d.%m') }}</td>
        <td class="muted xs">{{ m.league.name if m.league else '—' }}</td>
        <td><a href="/match/{{ m.id }}">{{ m.home_team }} - {{ m.away_team }}</a></td>
        <td class="num" style="font-weight:600">{{ m.home_score }}-{{ m.away_score }}</td>
      </tr>
      {% endfor %}
      </tbody>
    </table>
    {% else %}<p class="empty">Henüz sonuç yok.</p>{% endif %}
  </div>
</div>
{% endblock %}