{% from "partials/guidance_block.html" import render_guidance_block %}

{% if cxp_guidance %}
{# ===== Run results playbook mode ===== #}
<div class="flex items-center justify-between mb-4">
    <h3 class="text-sm font-semibold uppercase tracking-wider text-base-content/50">
        CXP — Deployment Playbook
    </h3>
</div>

{% for block in cxp_guidance.blocks %}
    {% if block.kind == "trigger_prompts" %}
    {# CXP trigger prompt with editable override #}
    <div class="divider"></div>
    <section class="guidance-block mb-6">
        <h4 class="text-sm font-semibold uppercase tracking-wider text-base-content/60 mb-3">{{ block.label }}</h4>
        {% for item in block.items %}
        <p class="text-sm mb-2">{{ item }}</p>
        {% endfor %}

        {% set effective_prompt = block.metadata.override if block.metadata.override else block.metadata.default %}
        <div class="relative mb-2">
            <pre class="text-xs whitespace-pre-wrap break-words bg-base-300/30 p-3 rounded copy-target">{{ effective_prompt }}</pre>
            <button class="btn btn-xs btn-ghost absolute top-1 right-1"
                    onclick="navigator.clipboard.writeText(this.parentElement.querySelector('.copy-target').textContent)">Copy</button>
        </div>

        <details class="collapse collapse-arrow bg-base-200/50 mt-2">
            <summary class="collapse-title text-xs font-medium">Edit trigger prompt</summary>
            <div class="collapse-content">
                <textarea id="cxp-trigger-override"
                          class="textarea textarea-bordered w-full text-xs mt-2"
                          rows="3"
                          placeholder="Enter custom trigger prompt...">{{ effective_prompt }}</textarea>
                <button class="btn btn-xs btn-primary mt-2"
                        onclick="(async()=>{const ta=document.getElementById('cxp-trigger-override');const r=await fetch('/api/cxp/{{ cxp_run_id }}/trigger-override',{method:'POST',headers:{'Content-Type':'application/json'},body:JSON.stringify({prompt:ta.value})});if(r.ok){const ct=document.querySelector('.copy-target');if(ct)ct.textContent=ta.value;this.textContent='Saved!';setTimeout(()=>{this.textContent='Save Override'},1500)}})()">Save Override</button>
            </div>
        </details>
    </section>
    {% else %}
    {{ render_guidance_block(block) }}
    {% endif %}
{% endfor %}

{% elif results is defined %}
{# ===== Standalone results mode ===== #}
<div class="flex items-center justify-between mb-4">
    <h3 class="text-sm font-semibold uppercase tracking-wider text-base-content/50">
        CXP — Context File Poisoning
    </h3>
    <button class="btn btn-xs btn-outline btn-secondary"
            hx-get="/api/cxp/results"
            hx-target="#tab-cxp"
            hx-swap="innerHTML">Refresh</button>
</div>

<div class="stats stats-horizontal shadow mb-4">
    <div class="stat">
        <div class="stat-title">Total Tests</div>
        <div class="stat-value text-lg">{{ total_tests }}</div>
    </div>
    <div class="stat">
        <div class="stat-title">Hits</div>
        <div class="stat-value text-lg text-error">{{ hit_count }}</div>
    </div>
    <div class="stat">
        <div class="stat-title">Partial</div>
        <div class="stat-value text-lg text-warning">{{ partial_count }}</div>
    </div>
    <div class="stat">
        <div class="stat-title">Miss</div>
        <div class="stat-value text-lg text-success">{{ miss_count }}</div>
    </div>
</div>

{% if results %}
<table class="table table-xs">
    <thead>
        <tr>
            <th>Technique</th>
            <th>Assistant</th>
            <th>Format</th>
            <th>Result</th>
            <th>Created</th>
        </tr>
    </thead>
    <tbody>
    {% for r in results %}
        <tr>
            <td><span class="badge badge-sm badge-outline">{{ r.technique_id }}</span></td>
            <td>{{ r.assistant }}</td>
            <td><span class="badge badge-sm">{{ r.format_id or '-' }}</span></td>
            <td>
                {% if r.validation_result == 'hit' %}
                <span class="badge badge-sm badge-error">hit</span>
                {% elif r.validation_result == 'partial' %}
                <span class="badge badge-sm badge-warning">partial</span>
                {% elif r.validation_result == 'miss' %}
                <span class="badge badge-sm badge-success">miss</span>
                {% else %}
                <span class="badge badge-sm badge-ghost">{{ r.validation_result }}</span>
                {% endif %}
            </td>
            <td class="text-xs opacity-50">{{ r.created_at }}</td>
        </tr>
    {% endfor %}
    </tbody>
</table>
{% else %}
<p class="text-sm opacity-50">No CXP test results. Run <code>qai cxp generate</code> to create poisoned repos.</p>
{% endif %}

{% elif no_guidance_available is defined and no_guidance_available %}
{# ===== Legacy run with no guidance ===== #}
<div class="flex items-center justify-between mb-4">
    <h3 class="text-sm font-semibold uppercase tracking-wider text-base-content/50">
        CXP — Context File Poisoning
    </h3>
</div>
<p class="text-sm opacity-40 italic">No deployment guidance available (generated before this version).</p>

{% else %}
{# ===== Loading state ===== #}
<div class="flex items-center justify-between mb-4">
    <h3 class="text-sm font-semibold uppercase tracking-wider text-base-content/50">
        CXP — Context File Poisoning
    </h3>
    <button class="btn btn-xs btn-outline btn-secondary"
            hx-get="/api/cxp/results"
            hx-target="#tab-cxp"
            hx-swap="innerHTML">Load</button>
</div>
<p class="text-sm opacity-50">Click Load to view CXP test results and stats.</p>
{% endif %}