{% extends "base.html" %}
{% block title %}Detail · net-alpha{% endblock %}
{% block content %}
  <h1 class="text-2xl mb-4">Violation detail</h1>

  <form method="get" class="kpi-card mb-4 flex gap-3 flex-wrap items-end">
    <div>
      <label class="block text-xs text-slate-500 uppercase">Ticker</label>
      <input type="text" name="ticker" value="{{ filter_ticker }}" list="ticker-list" class="border border-slate-300 rounded px-2 py-1 font-mono text-sm w-32"/>
      <datalist id="ticker-list">
        {% for t in tickers %}<option value="{{ t }}">{% endfor %}
      </datalist>
    </div>
    <div>
      <label class="block text-xs text-slate-500 uppercase">Account</label>
      <input type="text" name="account" value="{{ filter_account }}" list="account-list" class="border border-slate-300 rounded px-2 py-1 text-sm w-40"/>
      <datalist id="account-list">
        {% for a in accounts %}<option value="{{ a }}">{% endfor %}
      </datalist>
    </div>
    <div>
      <label class="block text-xs text-slate-500 uppercase">Year</label>
      <input type="number" name="year" value="{{ filter_year }}" class="border border-slate-300 rounded px-2 py-1 font-mono text-sm w-24"/>
    </div>
    <div>
      <label class="block text-xs text-slate-500 uppercase">Confidence</label>
      <select name="confidence" class="border border-slate-300 rounded px-2 py-1 text-sm">
        <option value="">All</option>
        <option value="confirmed" {% if filter_confidence=='confirmed' %}selected{% endif %}>Confirmed</option>
        <option value="probable" {% if filter_confidence=='probable' %}selected{% endif %}>Probable</option>
        <option value="unclear" {% if filter_confidence=='unclear' %}selected{% endif %}>Unclear</option>
      </select>
    </div>
    <button type="submit" class="btn">Apply</button>
    <a href="/detail" class="btn-ghost">Reset</a>
  </form>

  {% include "_detail_table.html" %}
{% endblock %}