{% extends "base.html" %}
{% block content %}
<section class="run-summary-header">
  <div class="run-summary-topline">
    <div class="run-summary-title">
      <p class="eyebrow">{{ 'Run in progress' if run.is_active else 'Completed run' }}</p>
      <h1>Run: {{ run.name }}</h1>
      {% if run.notes %}<p class="muted">{{ run.notes }}</p>{% endif %}
    </div>
    <div class="run-summary-side">
      <div class="detail-meta">
        <span>Started <strong><time class="local-time" datetime="{{ run.started_at | utc_iso }}" data-local-time="full">{{ run.started_at | utc_fallback }}</time></strong></span>
        <span>Ended <strong>{% if run.ended_at %}<time class="local-time" datetime="{{ run.ended_at | utc_iso }}" data-local-time="full">{{ run.ended_at | utc_fallback }}</time>{% else %}active{% endif %}</strong></span>
      </div>
      {% if run.is_active %}
      <form class="run-summary-action" method="post" action="/admin/runs/end">
        <button class="button danger" type="submit">End run</button>
      </form>
      {% endif %}
    </div>
  </div>
  <div class="run-stat-strip">
    <span><small>Requests</small><strong>{{ stats.request_count | compact_number }}</strong></span>
    <span><small>LLM wall time</small><strong>{{ stats.llm_wall_time_ms | duration_ms }}</strong></span>
    <span><small>Run open</small><strong>{{ stats.run_open_duration_ms | duration_ms }}</strong></span>
    <span><small>Request duration</small><strong>{{ stats.total_request_duration_ms | duration_ms }}</strong></span>
    <span><small>Input tokens</small><strong>{{ stats.tokens.input | compact_number }}</strong></span>
    <span><small>Output tokens</small><strong>{{ stats.tokens.output | compact_number }}</strong></span>
    <span><small>Total tokens</small><strong>{{ stats.tokens.total | compact_number }}</strong></span>
    <span><small>Estimated cost</small><strong>{{ stats.cost_usd | usd }}</strong></span>
    <span><small>Output tok/s</small><strong>{{ stats.throughput.output_observed | compact_rate }}</strong></span>
  </div>
</section>

<section class="panel what-if-panel">
  <header>
    <h2>What-if cost</h2>
    <span>{{ what_if.scenarios | length }} compared</span>
  </header>
  <form class="what-if-form" method="get" action="/admin/runs/{{ run.id }}">
    <div class="what-if-options">
      {% for option in what_if.options %}
      <label class="what-if-option">
        <input type="checkbox" name="what_if" value="{{ option.key }}" {% if option.checked %}checked{% endif %}>
        <span><strong>{{ option.label }}</strong><small>{{ option.provider_name }}</small></span>
      </label>
      {% else %}
      <p class="muted">No active model prices configured.</p>
      {% endfor %}
    </div>
    {% if what_if.options %}
    <button class="button primary compact-button" type="submit">Compare</button>
    {% endif %}
  </form>
  {% if what_if.message %}
  <p class="muted">{{ what_if.message }}</p>
  {% endif %}
  {% if what_if.scenarios %}
  <div class="table-shell compact-table">
    <table class="model-routes-table what-if-table">
      <thead>
        <tr>
          <th>Scenario</th>
          <th>Input Tokens</th>
          <th>Cached Input</th>
          <th>Output Tokens</th>
          <th>Input / 1M</th>
          <th>Cached / 1M</th>
          <th>Output / 1M</th>
          <th>Input Cost</th>
          <th>Output Cost</th>
          <th>Total Cost</th>
          <th>Included</th>
          <th>Missing Usage</th>
        </tr>
      </thead>
      <tbody>
        {% for scenario in what_if.scenarios %}
        <tr>
          <td>
            <strong>{{ scenario.label }}</strong>
            <span class="muted">{{ scenario.provider_name }} / {{ scenario.model }}</span>
          </td>
          <td>{{ scenario.input_tokens | compact_number }}</td>
          <td>{{ scenario.cached_input_tokens | compact_number }}</td>
          <td>{{ scenario.output_tokens | compact_number }}</td>
          <td>{{ scenario.input_usd_per_million | usd }}</td>
          <td>{{ scenario.cached_input_usd_per_million | usd }}</td>
          <td>{{ scenario.output_usd_per_million | usd }}</td>
          <td>{{ scenario.input_cost_usd | usd }}</td>
          <td>{{ scenario.output_cost_usd | usd }}</td>
          <td><strong>{{ scenario.total_cost_usd | usd }}</strong></td>
          <td>{{ scenario.included_request_count | compact_number }}</td>
          <td>{{ scenario.missing_usage_request_count | compact_number }}</td>
        </tr>
        {% endfor %}
      </tbody>
    </table>
  </div>
  {% endif %}
</section>

<section class="split">
  <article class="panel">
    <header><h2>Models</h2></header>
    <div class="breakdown-list">
      {% for item in stats.models %}
      <span><strong>{{ item.count | compact_number }}</strong>{{ item.label }}</span>
      {% else %}
      <p class="muted">No model usage yet.</p>
      {% endfor %}
    </div>
  </article>
  <article class="panel">
    <header><h2>Endpoints</h2></header>
    <div class="breakdown-list">
      {% for item in stats.endpoints %}
      <span><strong>{{ item.count | compact_number }}</strong>{{ item.label }}</span>
      {% else %}
      <p class="muted">No endpoint usage yet.</p>
      {% endfor %}
    </div>
  </article>
</section>

<section class="split">
  <article class="panel">
    <header><h2>Status Codes</h2></header>
    <div class="breakdown-list">
      {% for item in stats.statuses %}
      <span><strong>{{ item.count | compact_number }}</strong>{{ item.label }}</span>
      {% else %}
      <p class="muted">No status codes yet.</p>
      {% endfor %}
    </div>
  </article>
  <article class="panel">
    <header><h2>Signals</h2></header>
    <div class="breakdown-list">
      <span><strong>{{ stats.signals.streams | compact_number }}</strong>Streams</span>
      <span><strong>{{ stats.signals.images | compact_number }}</strong>Images</span>
      <span><strong>{{ stats.signals.tools | compact_number }}</strong>Tools</span>
      <span><strong>{{ stats.signals.errors | compact_number }}</strong>Errors</span>
    </div>
  </article>
</section>

<section class="page-heading compact-heading">
  <div>
    <p class="eyebrow">Requests</p>
    <h2>Run traffic</h2>
  </div>
  <a class="button ghost" href="/admin?run={{ run.id }}">Open in browser</a>
</section>

{% set show_run = false %}
{% include "_requests_table.html" %}
{% endblock %}