{% extends "base.html" %}
{% block title %}Ask{% endblock %}
{% block content %}
<h1>Fai una domanda</h1>
<p style="color:var(--muted);margin-bottom:1.2rem;font-family:system-ui,sans-serif;font-size:0.92rem;">
  Fai una domanda sulla knowledge base e ricevi una risposta con citazioni.
</p>

<div class="card">
  <form action="/ask" method="get">
    <div class="row">
      <div>
        <label>Domanda</label>
        <input type="text" name="q" value="{{ query }}" placeholder="es. Che cos'e una serie di Fourier?" required>
      </div>
      <div>
        <label>Modalita</label>
        <select name="mode">
          <option value="hybrid" {{ 'selected' if mode == 'hybrid' }}>Hybrid</option>
          <option value="lexical" {{ 'selected' if mode == 'lexical' }}>Lexical</option>
          <option value="semantic" {{ 'selected' if mode == 'semantic' }}>Semantic</option>
        </select>
      </div>
      <div>
        <label>Corso</label>
        <input type="text" name="course" value="{{ course }}" placeholder="opzionale">
      </div>
    </div>
    <div style="margin-top:1rem;">
      <button type="submit">Chiedi</button>
    </div>
  </form>
</div>

{% if error %}
<div class="empty-state" style="border-left:3px solid var(--red);padding:1rem;">
  {{ error }}
</div>
{% elif answer %}
<div class="card" style="border-left:3px solid {% if answer.answer_type == 'no_answer' %}var(--gray){% else %}var(--green){% endif %};">
  <div style="font-family:system-ui,sans-serif;font-size:0.78rem;color:var(--muted);margin-bottom:0.5rem;">
    {% if not is_dry %}
    <span style="background:var(--green);color:#fff;padding:0.1rem 0.4rem;border-radius:3px;font-size:0.7rem;margin-right:0.3rem;">LLM reale</span>
    {% endif %}
    Tipo: <strong>{{ answer.answer_type }}</strong>
    {% if answer.confidence is defined %}
    &middot; Confidenza: {{ '%.2f'|format(answer.confidence) }}
    {% endif %}
  </div>
  <p style="white-space:pre-wrap;line-height:1.7;">{{ answer.answer }}</p>

  {% if answer.sources %}
  <div style="margin-top:1rem;border-top:1px solid var(--border);padding-top:0.8rem;">
    <h3 style="font-size:0.95rem;color:var(--accent);font-weight:normal;margin-bottom:0.4rem;">Fonti</h3>
    {% for s in answer.sources %}
    <div class="card" style="padding:0.6rem 0.8rem;margin-bottom:0.4rem;">
      <strong style="color:var(--text);">[{{ s.citation_id }}] {{ s.filename }}</strong>
      <span style="font-family:system-ui,sans-serif;font-size:0.8rem;color:var(--muted);">
        &middot; {{ s.course }} &middot; {{ s.topic }}
      </span>
    </div>
    {% endfor %}
  </div>
  {% endif %}

  {% if answer.citation_check and not answer.citation_check.valid %}
  <div style="margin-top:0.6rem;color:var(--red);font-size:0.85rem;">
    Attenzione: citazioni invalide trovate nella risposta.
  </div>
  {% endif %}
</div>
{% elif query %}
<div class="empty-state">Nessuna risposta disponibile.</div>
{% endif %}
{% endblock %}