{% extends "base.html" %}
{% block title %}포트폴리오 · ARGOS{% endblock %}
{# Widen the wrap on desktop so the Keep grid can run multi-column instead of
   one full-width column of oversized covers. #}
{% block page_class %}page--portfolio{% endblock %}
{% block content %}
<header class="page-head">
  <h1 class="large-title">포트폴리오</h1>
  <nav class="portfolio-sort segmented{% if sort == 'trust' %} segmented--second{% endif %}" aria-label="정렬" data-instant-nav hx-boost="true" hx-target="#main" hx-select="#main" hx-swap="outerHTML show:window:top">
    <span class="segmented__thumb" aria-hidden="true"></span>
    <a class="chip{% if sort == 'recency' %} is-active{% endif %}"
       href="/portfolio?sort=recency{% if category %}&category={{ category }}{% endif %}"
       {% if sort == 'recency' %}aria-current="true"{% endif %}>최근</a>
    <a class="chip{% if sort == 'trust' %} is-active{% endif %}"
       href="/portfolio?sort=trust{% if category %}&category={{ category }}{% endif %}"
       {% if sort == 'trust' %}aria-current="true"{% endif %}>신뢰도</a>
  </nav>
</header>
<nav class="portfolio-filter" aria-label="카테고리 필터" data-instant-nav hx-boost="true" hx-target="#main" hx-select="#main" hx-swap="outerHTML show:window:top">
  <a class="chip{% if not category %} is-active{% endif %}"
     href="/portfolio{% if sort != 'recency' %}?sort={{ sort }}{% endif %}"
     {% if not category %}aria-current="true"{% endif %}>전체</a>
  <a class="chip chip--main{% if category == 'Mainstream' %} is-active{% endif %}"
     href="/portfolio?category=Mainstream{% if sort != 'recency' %}&sort={{ sort }}{% endif %}"
     {% if category == 'Mainstream' %}aria-current="true"{% endif %}>Mainstream</a>
  <a class="chip chip--alpha{% if category == 'Alpha' %} is-active{% endif %}"
     href="/portfolio?category=Alpha{% if sort != 'recency' %}&sort={{ sort }}{% endif %}"
     {% if category == 'Alpha' %}aria-current="true"{% endif %}>Alpha</a>
</nav>

{# Floating refresh action — desktop(≥768px) only; mobile relies on the
   pull-to-refresh gesture. #}
<button type="button" class="refresh-btn" data-refresh="portfolio" aria-label="새로고침">
  <span class="ic" aria-hidden="true"><svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8"/><path d="M21 3v5h-5"/></svg></span>
</button>

<div id="portfolio-list">
{% if not view.active and not view.quiet %}
<p class="portfolio-empty">아직 Keep한 자산이 없습니다. 관측 피드에서 마음에 드는 항목을 Keep 해보세요.</p>
{% else %}
{% include "_portfolio_items.html" %}
{% endif %}
</div>
{% endblock %}