{% extends 'layout/base.html' %}
{% block title %}Активные сессии{% endblock %}
{% block body %}
<div class="content" style="max-width:880px">
  {% include 'admin/_flash.html' %}
  <div class="card">
    <div class="card-head" style="display:flex;align-items:center">
      <div class="card-title">Активные сессии ({{ items|length }})</div>
      <span style="flex:1"></span>
      {% if items|length > 1 %}
      <form method="post" onsubmit="return confirm('Завершить все остальные сессии?')">
        <input type="hidden" name="action" value="revoke_others">
        <button class="btn" type="submit">Завершить все остальные</button>
      </form>
      {% endif %}
    </div>
    <div class="card-body" style="padding:0">
      <table class="tbl">
        <thead><tr><th>Создана</th><th>Активность</th><th>IP</th><th>Браузер</th><th style="width:1%"></th></tr></thead>
        <tbody>
          {% for s in items %}
          <tr>
            <td style="font-size:12px">{{ s.created_at.strftime('%d.%m %H:%M') }}</td>
            <td style="font-size:12px">{{ s.last_seen_at.strftime('%d.%m %H:%M') }}{% if s.token == current %} <span style="color:#2e7d32;font-weight:500">· текущая</span>{% endif %}</td>
            <td style="font-size:12px;font-family:monospace">{{ s.ip or '—' }}</td>
            <td style="font-size:11px;color:var(--color-text-secondary);max-width:380px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap" title="{{ s.user_agent }}">{{ s.user_agent[:80] }}</td>
            <td style="white-space:nowrap">
              {% if s.token != current %}
              <form method="post" onsubmit="return confirm('Завершить эту сессию?')">
                <input type="hidden" name="action" value="revoke">
                <input type="hidden" name="token" value="{{ s.token }}">
                <button class="btn" type="submit" style="font-size:12px;color:var(--color-text-danger)">Завершить</button>
              </form>
              {% endif %}
            </td>
          </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
  </div>
</div>
{% endblock %}