{% extends "base.html" %}
{% block title %}deliveryday-companion — sessions{% endblock %}

{% block content %}
<section class="panel">
  <h2>Start a new inspection</h2>
  <form method="post" action="/sessions" style="display: grid; gap: 0.6rem; grid-template-columns: 1fr 1fr max-content; align-items: end;">
    <div>
      <label for="vin">VIN (optional)</label>
      <input id="vin" name="vin" type="text" placeholder="5YJ...">
    </div>
    <div>
      <label for="location">Delivery center / location</label>
      <input id="location" name="location" type="text" placeholder="e.g. Fremont DC">
    </div>
    <div>
      <input type="submit" value="Start inspection">
    </div>
  </form>
  <p class="muted" style="margin-top: 0.75rem; font-size: 13px;">
    No internet needed once you're inside the session — every step saves locally and you can produce the PDF report on-device.
  </p>
</section>

<section class="panel">
  <h2>Recent sessions</h2>
  {% if sessions %}
    <table>
      <thead>
        <tr><th>Session</th><th>VIN</th><th>Location</th><th>Started</th><th>Status</th><th></th></tr>
      </thead>
      <tbody>
        {% for s in sessions %}
          <tr>
            <td><code>{{ s.id }}</code></td>
            <td>{{ s.vin or "—" }}</td>
            <td>{{ s.location or "—" }}</td>
            <td class="muted">{{ s.created_at.strftime("%Y-%m-%d %H:%M") }} UTC</td>
            <td>
              {% if s.signed_at %}
                <span class="pill pass">signed</span>
              {% else %}
                <span class="pill pending">in progress</span>
              {% endif %}
            </td>
            <td><a href="/session/{{ s.id }}">open &rarr;</a></td>
          </tr>
        {% endfor %}
      </tbody>
    </table>
  {% else %}
    <p class="muted">No sessions yet. Fill in the VIN above and start one when the car arrives.</p>
  {% endif %}
</section>

<p class="muted" style="text-align: center; font-size: 12px;">v{{ version }}</p>
{% endblock %}