{% extends 'base.html' %}
{% block content %}
<section class="hero-grid evidence-board dossier-grid">
  <article class="card spotlight evidence-card">
    <div class="case-legend">
      <span class="section-label">Kitchen queue board</span>
      <span class="pill">Case focus: approvals</span>
    </div>
    <h2>Leanne picks. Doris learns.</h2>
    <p class="muted">Queue up web recipes, teach the household profile with yes/no decisions, and keep KitchenOwl for the final recipes worth keeping.</p>
    <div class="action-row">
      <button type="button" id="seed-button">Seed suggestion queue</button>
      <a class="button-link" href="/search">Search a recipe idea</a>
    </div>
  </article>
  <article class="card stats-card evidence-card">
    <div class="case-legend">
      <span class="section-label">Case counts</span>
      <span class="pill">Pantry Evidence</span>
    </div>
    <div class="stats-grid">
      <div><span>Suggested</span><strong id="count-suggested">0</strong></div>
      <div><span>Approved</span><strong id="count-approved">0</strong></div>
      <div><span>Saved</span><strong id="count-saved">0</strong></div>
      <div><span>Rejected</span><strong id="count-rejected">0</strong></div>
      <div><span>Plans</span><strong id="count-plans">0</strong></div>
      <div><span>Failures</span><strong id="count-failed-searches">0</strong></div>
      <div><span>Import flags</span><strong id="count-import-flags">0</strong></div>
    </div>
    <p class="muted dossier-note" id="backend-note">Loading state…</p>
  </article>
</section>

<section class="split-grid dossier-grid">
  <article class="card evidence-card">
    <div class="section-heading">
      <div>
        <p class="section-label">Soft blacklist</p>
        <h2>Terms to push down</h2>
      </div>
      <span class="pill">Lead filter</span>
    </div>
    <p class="muted case-legend">Mark ingredients, cuisines, or phrases Doris should treat like weak leads.</p>
    <form id="blacklist-form" class="inline-form">
      <input type="text" id="blacklist-name" placeholder="Add ingredient or term">
      <button type="submit">Add / enable</button>
    </form>
    <div id="blacklist-items" class="chip-list muted">Loading…</div>
  </article>

  <article class="card evidence-card">
    <div class="section-heading">
      <div>
        <p class="section-label">Preference notes</p>
        <h2>Household guidance</h2>
      </div>
      <span class="pill">Witness notes</span>
    </div>
    <form id="settings-form" class="stack-form">
      <label>Notes
        <textarea id="profile-notes" rows="4" placeholder="Budget, texture issues, favourite cuisines, or anything else useful."></textarea>
      </label>
      <label>Auto-import threshold
        <input type="number" id="auto-import-threshold" min="50" max="100">
      </label>
      <label class="checkbox-row">
        <input type="checkbox" id="auto-import-enabled">
        <span>Allow auto-import when Doris is extremely confident</span>
      </label>
      <button type="submit">Save settings</button>
    </form>
  </article>
</section>

<section class="card evidence-board">
  <div class="section-heading">
    <div>
      <p class="section-label">Queue</p>
      <h2>Recent recipe suggestions</h2>
    </div>
    <span class="pill">Kitchen queue board</span>
  </div>
  <p class="muted case-legend">Review the current stack like pinned case cards: promote the good leads, bury the junk.</p>
  <div id="suggestion-list" class="suggestion-grid muted dossier-grid">Loading…</div>
</section>

<section class="card evidence-board">
  <div class="section-heading">
    <div>
      <p class="section-label">Import repair queue</p>
      <h2>Flag recipe import problems</h2>
    </div>
    <a class="button-link" href="/imports">Open import review</a>
  </div>
  <p class="muted case-legend">Bad imports get tagged like busted evidence bags so Doris can come back and repair them later.</p>
  <form id="import-flag-form" class="stack-form intake-docket">
    <label>Recipe URL or KitchenOwl link
      <input type="url" id="import-flag-url" placeholder="https://...">
    </label>
    <label>Recipe title (optional)
      <input type="text" id="import-flag-title" placeholder="Halal Guys Chicken over Rice But Better">
    </label>
    <label>Issue type
      <select id="import-flag-type">
        <option value="formatting">Formatting</option>
        <option value="ingredients">Ingredients</option>
        <option value="timings">Timings</option>
        <option value="duplicate">Duplicate</option>
        <option value="other">Other</option>
      </select>
    </label>
    <label>What went wrong
      <textarea id="import-flag-notes" rows="4" placeholder="Steps merged together, ingredients split badly, wrong yield, duplicate recipe, or whatever else looks off."></textarea>
    </label>
    <button type="submit">Flag for Doris review</button>
  </form>
  <div id="import-flag-preview" class="failure-list muted dossier-grid">Loading flagged imports…</div>
</section>

<section class="card evidence-board">
  <div class="section-heading">
    <div>
      <p class="section-label">Troubleshooting</p>
      <h2>Recent failed searches</h2>
    </div>
    <a class="button-link" href="/failures">Open failure review</a>
  </div>
  <p class="muted case-legend">Search misses stay pinned on the board until Doris can turn them into usable dinner intelligence.</p>
  <div id="failed-search-preview" class="failure-list muted dossier-grid">Loading…</div>
</section>
{% endblock %}