{% extends "setup/_base.html" %}
{% block step_content %}
<h1>Step 3 — Extraction</h1>
<p>LLM provider, model, and tuning per mode. Stored at <code>config/extraction.yaml</code>.</p>
<p class="muted">Only the seven fields below are managed here; other per-mode keys (pass strategy, chunk sizes, OCR, etc.) are preserved unchanged.</p>

<form class="setup-form"
  hx-post="/setup/api/extraction"
  hx-target="#result"
  hx-swap="innerHTML">
  {% for mode, vals in modes %}
  <details {% if loop.first %}open{% endif %}>
    <summary><strong>{{ mode }}</strong> — {{ vals.model or "no model set" }}</summary>
    <fieldset>
      <label>provider
        <select name="{{ mode }}__provider">
          <option value="ollama" {% if vals.provider == "ollama" %}selected{% endif %}>ollama</option>
          <option value="litellm" {% if vals.provider == "litellm" %}selected{% endif %}>litellm</option>
        </select>
      </label>
      <label>ollama_host
        <div class="input-row">
          <input type="text" name="{{ mode }}__ollama_host" value="{{ vals.ollama_host }}"
            id="{{ mode }}__ollama_host">
          <button type="button" class="button"
            hx-get="/setup/api/ollama-test"
            hx-vals='js:{host: document.getElementById("{{ mode }}__ollama_host").value}'
            hx-target="#{{ mode }}__ollama_test_result"
            hx-swap="innerHTML">
            Test
          </button>
          <span id="{{ mode }}__ollama_test_result"></span>
        </div>
      </label>
      <label>model
        <input type="text" name="{{ mode }}__model" value="{{ vals.model }}">
      </label>
      <label>litellm_model <span class="muted">(only if provider=litellm)</span>
        <input type="text" name="{{ mode }}__litellm_model" value="{{ vals.litellm_model }}">
      </label>
      <label>temperature <span class="muted">(0.0 – 1.0)</span>
        <input type="number" step="0.05" min="0" max="1" name="{{ mode }}__temperature" value="{{ vals.temperature }}">
      </label>
      <label>timeout <span class="muted">(seconds)</span>
        <input type="number" min="1" name="{{ mode }}__timeout" value="{{ vals.timeout }}">
      </label>
      <label class="checkbox-row">
        <input type="checkbox" name="{{ mode }}__think" {% if vals.think %}checked{% endif %}>
        think <span class="muted">(reasoning mode — only set true for qwen3:*, deepseek-r1:*, phi4-mini:reasoning)</span>
      </label>
    </fieldset>
  </details>
  {% endfor %}

  <button type="submit" class="button">Save</button>
</form>

<div id="result"></div>

<p><a href="/setup">← Back to setup overview</a></p>
{% endblock %}