{% extends "base.html" %}

{% block title %}Результат классификации{% endblock %}

{% block content %}
<section class="card result-card">
    <p class="eyebrow">Результат классификации</p>
    <h2>{{ result.predicted_genre }}</h2>
    <p class="confidence">
        Оценка уверенности: <strong>{{ "%.2f"|format(result.confidence * 100) }}%</strong>
    </p>
</section>

<section class="grid-layout">
    <div class="card">
        <h2>Введенная аннотация</h2>
        <p class="annotation-text">{{ result.input_text }}</p>
        <a href="{{ url_for('index') }}" class="secondary-link">Проверить другую аннотацию</a>
    </div>

    <aside class="side-column">
        <div class="card">
            <h2>Распределение по жанрам</h2>
            <div class="probability-list">
                {% for item in result.top_genres %}
                <div class="probability-item">
                    <div class="probability-heading">
                        <span>{{ item.genre }}</span>
                        <strong>{{ "%.2f"|format(item.confidence * 100) }}%</strong>
                    </div>
                    <div class="probability-bar">
                        <div class="probability-fill" style="width: {{ item.confidence * 100 }}%;"></div>
                    </div>
                </div>
                {% endfor %}
            </div>
        </div>

        {% if metrics %}
        <div class="card">
            <h2>Справка по модели</h2>
            <div class="metrics-list">
                {% for metric in metrics %}
                <div class="metric-item">
                    <span>{{ metric.name }}</span>
                    <strong>{{ metric.value }}</strong>
                </div>
                {% endfor %}
            </div>
        </div>
        {% endif %}
    </aside>
</section>
{% endblock %}