{% if error %}
  <div class="banner banner-error">
    <strong>{{ error }}</strong>
    {% if detail %}<p>{{ detail }}</p>{% endif %}
  </div>
{% else %}
  <div class="stat-strip">
    <span class="stat stat-neutral">
      <span class="stat-num">{{ query_results|length }}</span>
      <span class="stat-label">quer{% if query_results|length == 1 %}y{% else %}ies{% endif %}</span>
    </span>
    {% set passed = query_results | selectattr('is_valid') | list | length %}
    {% set failed = query_results | rejectattr('is_valid') | list | length %}
    <span class="stat stat-ok">
      <span class="stat-num">{{ passed }}</span>
      <span class="stat-label">passed</span>
    </span>
    <span class="stat stat-bad">
      <span class="stat-num">{{ failed }}</span>
      <span class="stat-label">failed</span>
    </span>
    {% if warning_count %}
      <span class="stat stat-warn">
        <span class="stat-num">{{ warning_count }}</span>
        <span class="stat-label">warning{{ warning_count|pluralize }}</span>
      </span>
    {% endif %}
    <span class="stat stat-neutral stat-time">
      <span class="stat-num">{{ duration_ms }}</span>
      <span class="stat-label">ms · {{ dialect }}</span>
    </span>
    {% if full_report_json %}
      <button type="button"
              class="download-btn"
              data-action="download"
              data-text="{{ full_report_json }}"
              data-filename="fastssv-report.json"
              title="Download full report as JSON"
              aria-label="Download full report as JSON">
        <svg viewBox="0 0 24 24" width="14" height="14" fill="none"
             stroke="currentColor" stroke-width="2"
             stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
          <path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4"></path>
          <polyline points="7 10 12 15 17 10"></polyline>
          <line x1="12" y1="15" x2="12" y2="3"></line>
        </svg>
        <span>JSON</span>
      </button>
    {% endif %}
  </div>

  {% if query_results %}
    <ol class="query-results">
      {% for q in query_results %}
        <li class="query-block {% if q.is_valid %}block-ok{% else %}block-bad{% endif %}" data-view="formatted">
          <header class="query-block-head">
            <span class="query-tag">Query {{ q.query_index }}</span>
            {% if q.is_valid %}
              <span class="status-pill status-ok">Valid</span>
            {% else %}
              <span class="status-pill status-bad">{{ q.error_count }} error{{ q.error_count|pluralize }}</span>
            {% endif %}
            {% if q.warning_count %}
              <span class="status-pill status-warn">{{ q.warning_count }} warning{{ q.warning_count|pluralize }}</span>
            {% endif %}
            <button type="button"
                    class="view-toggle"
                    data-action="toggle-view"
                    aria-label="Toggle JSON view for query {{ q.query_index }}">
              <span class="view-label-formatted">JSON</span>
              <span class="view-label-json">Formatted</span>
            </button>
          </header>

          <div class="query-view query-view-formatted">
            <pre class="query-sql"><code class="language-sql">{{ q.sql_pretty }}</code></pre>
            {% if q.violations %}
              <ul class="violations">
                {% for v in q.violations %}
                  <li class="violation sev-{{ v.severity }}">
                    <header>
                      <span class="sev sev-{{ v.severity }}">{{ v.severity }}</span>
                      <code class="rule-id">{{ v.rule_id }}</code>
                    </header>
                    <p class="issue">{{ v.issue }}</p>
                    {% if v.fix is mapping %}
                      <p class="fix">
                        <strong>Fix ({{ v.fix.action }}):</strong>
                        {% if v.fix.action == 'REPLACE' %}
                          replace span [{{ v.fix.span[0] }}, {{ v.fix.span[1] }}) with <code>{{ v.fix.text }}</code>
                        {% elif v.fix.action == 'ADD' %}
                          insert <code>{{ v.fix.text }}</code> at offset {{ v.fix.at }}
                        {% elif v.fix.action == 'REMOVE' %}
                          remove span [{{ v.fix.span[0] }}, {{ v.fix.span[1] }})
                        {% else %}
                          {{ v.fix.text or v.fix }}
                        {% endif %}
                      </p>
                    {% elif v.fix %}
                      <p class="fix"><strong>Fix:</strong> {{ v.fix }}</p>
                    {% endif %}
                  </li>
                {% endfor %}
              </ul>
            {% endif %}
          </div>

          <div class="query-view query-view-json">
            <pre class="query-json"><code class="language-json">{{ q.json_str }}</code></pre>
            <button type="button"
                    class="editor-copy-btn"
                    data-action="copy"
                    data-text="{{ q.json_str }}"
                    title="Copy JSON to clipboard"
                    aria-label="Copy JSON for query {{ q.query_index }}">
              <svg viewBox="0 0 24 24" width="14" height="14" fill="none"
                   stroke="currentColor" stroke-width="2"
                   stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
                <rect x="9" y="9" width="13" height="13" rx="2" ry="2"></rect>
                <path d="M5 15H4a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2h9a2 2 0 0 1 2 2v1"></path>
              </svg>
            </button>
          </div>
        </li>
      {% endfor %}
    </ol>
  {% endif %}
{% endif %}