{% extends 'base.html' %}
{% block content %}
<section class="hero evidence-board dossier-grid">
  <div class="card evidence-card">
    <div class="case-legend">
      <span class="section-label">Course board</span>
      <span class="pill">Records Intake</span>
    </div>
    <h2>Overview</h2>
    <div class="stat-grid" id="summary-stats">
      <div><strong>Courses</strong><span id="stat-courses">—</span></div>
      <div><strong>Assignments</strong><span id="stat-assignments">—</span></div>
      <div><strong>Submissions</strong><span id="stat-submissions">—</span></div>
      <div><strong>Recordings</strong><span id="stat-recordings">—</span></div>
    </div>
    <p class="muted dossier-note" id="backend-note">Loading backend…</p>
    <button id="sync-button" type="button">Refresh from D2L</button>
    <p class="muted" id="sync-status">No sync run loaded yet.</p>
  </div>
  <div class="card evidence-card">
    <div class="case-legend">
      <span class="section-label">Operator notes</span>
      <span class="pill">Course board</span>
    </div>
    <h2>What this app currently does</h2>
    <ul class="case-list">
      <li>Reads current D2L scrape data</li>
      <li>Caches course and assignment rows</li>
      <li>Stores assignment upload intake records</li>
      <li>Stores recording upload intake records</li>
      <li>Builds Paperless/n8n handoff payloads</li>
    </ul>
  </div>
</section>

<section class="three-up dossier-grid">
  <div class="card evidence-board">
    <div class="case-legend"><span class="section-label">Assignments</span><span class="pill">Open files</span></div>
    <h2>Recent assignments</h2>
    <div id="recent-assignments" class="list-block muted">Loading…</div>
  </div>
  <div class="card evidence-board">
    <div class="case-legend"><span class="section-label">Submissions</span><span class="pill">Chain status</span></div>
    <h2>Recent submissions</h2>
    <div id="recent-submissions" class="list-block muted">Loading…</div>
  </div>
  <div class="card evidence-board">
    <div class="case-legend"><span class="section-label">Recordings</span><span class="pill">Audio evidence</span></div>
    <h2>Recent recordings</h2>
    <div id="recent-recordings" class="list-block muted">Loading…</div>
  </div>
</section>
{% endblock %}