{% extends "base.html" %}
{% block title %}Search - Illustrations DB{% endblock %}
{% block content %}
  <div class="panel">
    <h1>Search</h1>
    {% if ran_search %}
      {% if result_count and result_count > 0 %}
        <div class="flash">Found <strong>{{ result_count }}</strong> matching entries. Opening the first match…</div>
      {% else %}
        <div class="flash">No results found for <code>{{ q }}</code> in the selected fields.</div>
      {% endif %}
    {% endif %}
    <p class="small"><strong>How to search:</strong> Type words or phrases (quotes for exact), use wildcards, and choose which fields to search.</p>
    <form method="get" action="/search/">
      <div class="row">
        <div>
          <label>Search terms</label>
          <input type="text" name="q" value="{{ q|default:'' }}" placeholder="Type words, phrases, or wildcards…" />
        </div>
        <div>
          <label>Fields to search</label>
          <div class="chips">
            {% for opt in field_options %}
              <label class="badge"><input type="checkbox" name="{{ opt.name }}" {% if opt.checked %}checked{% endif %}/> {{ opt.label }}</label>
            {% endfor %}
          </div>
        </div>
      </div>
      <div style="margin-top:16px; display:flex; gap:10px; justify-content:flex-end;">
        <button class="btn primary" type="submit">Search</button>
      </div>
    </form>
  </div>
  <div class="spacer"></div>
  <div class="small">Total entries in database: <strong>{{ total }}</strong></div>
{% endblock %}