{% extends "base.html" %}
{% block title %}{{ ui.quick_form.title }} · {{ agg.assessment_name or agg.assessment_id }}{% endblock %}

{% set band_color = {'strong': '#16a34a', 'acceptable': '#2563eb', 'material': '#d97706', 'high': '#ea580c', 'critical': '#dc2626', 'unknown': '#8a93a5'} %}
{% set overall_key = band_key(agg.overall_score) %}

{% block content %}
<div class="results-head">
  <div class="container">
    <div class="title-row">
      <div>
        <h1>{{ agg.assessment_name or ui.quick_form.title }}</h1>
        <div class="sub">
          <span class="badge">{{ report.application_assessment }}</span>
          <span class="badge">{{ report.application_governance_risk }}</span>
          {{ agg.framework_name }} &middot; {{ agg.created_at }}
        </div>
      </div>
      <a href="{{ url_for('main.assessment') }}" class="btn btn-secondary">{{ ui.common.new_assessment }}</a>
    </div>
  </div>
</div>

<div class="container">
  <div class="overview">
    <div class="score-panel">
      <div class="gauge">
        <svg viewBox="0 0 176 176" width="176" height="176">
          <circle cx="88" cy="88" r="74" fill="none" stroke="#e8ebf1" stroke-width="12"></circle>
          <circle cx="88" cy="88" r="74" fill="none" stroke-width="12"
                  stroke="{{ band_color.get(overall_key, '#8a93a5') }}" stroke-linecap="round"
                  transform="rotate(-90 88 88)" data-score="{{ agg.overall_score }}"></circle>
        </svg>
        <div class="gauge-value">
          <div class="num">{{ '%.0f'|format(agg.overall_score) }}</div>
          <div class="lbl">/ 100</div>
        </div>
      </div>
      <div>
        {% if agg.risk_level %}
        <span class="badge badge--{{ overall_key }}"><span class="dot dot--{{ overall_key }}"></span>{{ agg.risk_level }}</span>
        {% endif %}
      </div>
      <div class="small faint" style="margin-top:10px;">
        {{ report.evaluation_framework }} {{ agg.framework_name }} &middot;
        {{ report.framework_version }} {{ agg.framework_version }} &middot;
        {{ report.rubric_version }} {{ agg.rubric_version }}
      </div>
    </div>

    <div class="dims-panel">
      {% for dim in framework.dimensions %}
        {% set s = agg.dimension_scores.get(dim.id) %}
        {% set k = band_key(s) %}
        <div class="dim-row">
          <div class="dim-row-head">
            <span class="name">{{ dim.name }}</span>
            <span class="score">{{ ('%.0f'|format(s)) if s is not none else ui.common.n_a }}</span>
          </div>
          <div class="bar"><span class="{{ k }}" data-score="{{ s if s is not none else 0 }}"></span></div>
          <div class="small faint" style="margin-top:6px;">{{ agg.dimension_notes.get(dim.id, '') }}</div>
        </div>
      {% endfor %}
    </div>
  </div>

  <div class="detail-grid">
    <div class="detail-main">
      <div class="block">
        <h3>{{ report.application_context }}</h3>
        <p style="margin:0;">{{ agg.description or report.no_description }}</p>
        <div class="small faint" style="margin-top:10px;">
          {{ report.detected_context }}:
          {% for d in agg.context.detected_domains %}<span class="badge" style="margin-right:6px;">{{ d.name }}</span>{% endfor %}
          {% if not agg.context.detected_domains %}<span class="badge">{{ agg.context.domain.name }}</span>{% endif %}
        </div>
      </div>

      <div class="block">
        <h3>{{ report.actor_map }}</h3>
        <table class="case-table">
          <thead><tr><th>Actor</th><th>Role</th></tr></thead>
          <tbody>
            {% for a in agg.actor_map %}
            <tr><td><strong>{{ a.name }}</strong></td><td class="muted">{{ a.role }}</td></tr>
            {% endfor %}
          </tbody>
        </table>
      </div>

      <div class="block">
        <h3>{{ report.relationship_map }}</h3>
        {% for r in agg.relation_map %}
        <div class="finding"><p>{{ r }}</p></div>
        {% endfor %}
      </div>

      <div class="block">
        <h3>{{ report.applicable_dimensions }}</h3>
        {% for dim_id in agg.applicable_dimensions %}
        <div class="small" style="padding:7px 0;border-bottom:1px solid var(--border);">
          <strong>{{ DIMENSION_MAP[dim_id].name }}</strong>
          <span class="faint">{{ ' %.0f'|format(agg.dimension_scores.get(dim_id, 0)) }}</span>
        </div>
        {% endfor %}
      </div>

      <div class="block">
        <h3>{{ report.responsibility_risks }}</h3>
        {% for r in agg.responsibility_risks %}
        <div class="finding">
          <span class="case-ref" style="background:var(--high-soft);color:var(--high);">{{ r.severity }}</span>
          <div>
            <div class="small faint" style="margin-bottom:2px;">{{ DIMENSION_MAP[r.dimension].name if r.dimension in DIMENSION_MAP else r.dimension }}</div>
            <p>{{ r.text }}</p>
          </div>
        </div>
        {% endfor %}
      </div>

      <div class="block">
        <h3>{{ report.affected_parties }}</h3>
        <div class="meta" style="display:flex;flex-wrap:wrap;gap:8px;">
          {% for p in agg.affected_parties %}<span class="badge">{{ p }}</span>{% endfor %}
        </div>
      </div>

      <div class="block">
        <h3>{{ report.governance_recommendations }}</h3>
        {% for r in agg.governance_recommendations %}
        <div class="finding"><p>{{ r.text }}</p></div>
        {% endfor %}
        {% if not agg.governance_recommendations %}<div class="empty">{{ report.no_recommendations }}</div>{% endif %}
      </div>
    </div>

    <aside class="detail-side">
      <div class="block">
        <h3>{{ report.cases_reviewed }}</h3>
        <p class="small muted">{{ report.cases_reviewed_hint }}</p>
        {% for sc in agg.selected_cases %}
        <div class="small" style="padding:7px 0;border-bottom:1px solid var(--border);">
          <span class="mono faint">{{ sc.case_id }}</span> {{ sc.title }}
        </div>
        {% endfor %}
      </div>
    </aside>
  </div>
</div>
{% endblock %}