{% extends 'eval/base.html' %}
{% load static %}
{% block title %}{{ version.label }} | Prompt Library | Eval Admin{% endblock %}

{% block action_bar %}
<c-detail-nav
  back_url="{% url 'Eval:prompt_library' %}{% if subagent_key %}?subagent={{ subagent_key }}{% endif %}"
  back_label="Prompt Library"
  title="{{ version.label }}"
/>
{% endblock %}

{% block content %}
<div class="max-w-4xl space-y-4">

    <c-card>
        <c-card-content class="pt-4 pb-4 space-y-3">
            <div class="flex items-start justify-between gap-3">
                <div class="min-w-0">
                    <h1 class="text-lg font-semibold">{{ version.label }}</h1>
                    <p class="text-[11px] text-muted-foreground mt-0.5">
                        {{ subagent_display_name }}
                        <span class="font-mono ml-2">({{ subagent_key }})</span>
                    </p>
                </div>
                <div class="flex items-center gap-2">
                    {% if version.version > 1 %}
                    <span class="text-[11px] text-muted-foreground font-mono">v{{ version.version }}</span>
                    {% endif %}
                    {% if in_use %}
                    <c-status-pill variant="in-use" label="In use" />
                    {% endif %}
                </div>
            </div>

            <div class="flex flex-wrap items-center gap-3 text-[11px] text-muted-foreground">
                <span>Created {{ version.created_at|date:"Y-m-d" }}</span>
                {% if version.edited_at %}
                <span>&middot;</span>
                <span>Edited {{ version.edited_at|date:"Y-m-d H:i" }}</span>
                {% endif %}
                <span>&middot;</span>
                <span>Used by {{ referenced_count }} config{{ referenced_count|pluralize }}</span>
                <span>&middot;</span>
                <span>{{ prompt_length }} characters</span>
            </div>

            <div class="flex items-center justify-between">
                <span class="text-xs text-muted-foreground">Read-only snapshot</span>
                <div class="flex items-center gap-2">
                    <a href="/admin/eval/prompts/{{ version.id }}/edit/"
                       class="pm-secondary-btn pm-secondary-btn--green">Edit</a>
                    <a href="/admin/eval/prompts/new/?from={{ version.id }}"
                       class="pm-secondary-btn pm-secondary-btn--blue">Clone</a>
                </div>
            </div>
        </c-card-content>
    </c-card>

    <c-card>
        <c-card-content class="pt-4 pb-4 space-y-2">
            <label class="block text-xs font-semibold text-muted-foreground">Prompt</label>
            <div class="pm-copy-wrapper">
                <pre class="pm-prompt-preview">{{ prompt_text }}</pre>
                <c-copy-btn />
            </div>
        </c-card-content>
    </c-card>

</div>
{% endblock %}