{% extends "base.html" %}
{% block title %}Report preview — session {{ session.id }}{% endblock %}
{% block nav_extra %}
  <a href="/session/{{ session.id }}">Back to checklist</a>
  <a href="/session/{{ session.id }}/report.pdf">Download PDF</a>
{% endblock %}

{% block content %}
<section class="panel">
  <h2>Acceptance report preview</h2>
  <p class="muted" style="font-size: 13px;">
    What's about to land in the PDF, rendered as HTML for a sanity check.
  </p>
  <table>
    <tbody>
      <tr><th>VIN</th><td><code>{{ session.vin or "(not provided)" }}</code></td></tr>
      <tr><th>Location</th><td>{{ session.location or "(not provided)" }}</td></tr>
      <tr><th>Started</th><td>{{ session.created_at.strftime("%Y-%m-%d %H:%M") }} UTC</td></tr>
      <tr><th>Signed</th><td>
        {% if session.signed_at %}{{ session.signed_at.strftime("%Y-%m-%d %H:%M") }} UTC{% else %}(unsigned){% endif %}
      </td></tr>
      <tr><th>Steps</th><td>{{ total }} total</td></tr>
    </tbody>
  </table>
</section>

{% for cat in categories %}
  {% set rows = by_category[cat] %}
  {% if rows %}
    <section class="panel">
      <h2>{{ cat }}</h2>
      {% for step, result in rows %}
        <div class="step" id="step-{{ step.id }}">
          {% if result %}
            <span class="pill {{ result.status | lower }}">{{ result.status }}</span>
          {% else %}
            <span class="pill pending">PENDING</span>
          {% endif %}
          <span class="title">{{ step.title }}</span>
          <div class="desc">{{ step.description }}</div>
          {% if result and result.note %}
            <div class="meta">Note: {{ result.note }}</div>
          {% endif %}
        </div>
      {% endfor %}
    </section>
  {% endif %}
{% endfor %}
{% endblock %}