{% extends 'base.html' %}
{% block title %}Explore Algos · Quantzy{% endblock %}
{% block content %}
<div class="algo-app">
  <section class="collection-hero"><div><p class="eyebrow">THE QUANTZY COLLECTION</p><h1>Explore Algos</h1><p>A considered approach.<br><span>A clearer trading routine.</span></p><div class="hero-tags"><span>Fixed strategy logic</span><span>You choose when to start</span></div></div><div class="collection-aside"><span class="collection-number">{{ total }}</span><span>published {{ 'algo' if total == 1 else 'algos' }}</span><a href="/account/help#choosing">Your guide to choosing →</a></div></section>
  <div class="collection-intro"><p>Compare the approach, capital and operating limits before you activate.</p><span>Early access · subscriptions are free</span></div>
  <div class="algo-explore-layout">
    <details class="responsive-filters" open><summary>Search & filter algos <span aria-hidden="true">+</span></summary>
    <form method="get" action="{{ url_for('marketplace') }}" class="algo-filters panel" aria-label="Filter algos">
      <div class="filter-title"><h2>Find your algo</h2><a href="{{ url_for('marketplace') }}">Reset</a></div>
      <label>Search<input type="search" name="q" value="{{ query }}" placeholder="Name or trading style" maxlength="120"></label>
      <label>Trading style<select name="category"><option value="">All styles</option>{% for category in categories %}<option {% if category == selected_category %}selected{% endif %}>{{ category }}</option>{% endfor %}</select></label>
      <label>Risk classification<select name="risk"><option value="">All risk levels</option>{% for risk in ['Not classified','Low','Moderate','High','Very high'] %}<option {% if risk == selected_risk %}selected{% endif %}>{{ risk }}</option>{% endfor %}</select></label>
      <button class="button full" type="submit">Apply filters <span aria-hidden="true">→</span></button>
      <div class="filter-explainer"><span class="algo-mark" aria-hidden="true">Q</span><h3>Logic stays private.<br>Control stays yours.</h3><p>Review each algo’s operating limits before you activate it. Adding an algo never starts trading.</p></div>
    </form></details>
    <section class="algo-results" aria-label="Available algos">
      <div class="results-toolbar"><h2>{{ 'Search results' if query or selected_category or selected_risk else 'All algos' }} <span>{{ cards|length }}</span></h2><span>Fixed logic · Managed versions</span></div>
      {% if cards %}<div class="algo-table">
        <div class="algo-table-head" aria-hidden="true"><span>Algo / trading style</span><span>Capital guidance</span><span>Risk</span><span>Access</span><span></span></div>
        {% for item in cards %}<article class="algo-result-row">
          <div class="algo-identity"><span class="algo-avatar avatar-{{ loop.index % 3 }}" aria-hidden="true">{{ item.title[0] }}</span><div><h3><a href="{{ url_for('strategy_detail',sid=item.strategy_id) }}">{{ item.title }}</a></h3><p>{{ item.category }}</p><span class="mode-label">{{ 'Paper trading · simulated fills' if item.mode == 'paper' else ('Signals only · no orders' if item.mode == 'signals' else 'Live execution') }}</span></div></div>
          <div class="algo-cell capital-cell"><span class="mobile-label">Capital guidance</span>{{ item.capital }}</div>
          <div class="algo-cell"><span class="mobile-label">Risk</span><span class="risk-pill">{{ item.risk_level }}</span></div>
          <div class="algo-cell"><span class="mobile-label">Access</span><strong>Free</strong><small>Early access</small></div>
          <div class="algo-row-actions"><a class="row-action" href="{{ url_for('strategy_detail',sid=item.strategy_id) }}" aria-label="View {{ item.title }}">View algo <span aria-hidden="true">↗</span></a><label class="compare-choice"><input type="checkbox" name="id" value="{{ item.strategy_id }}" form="compare-form">Compare<span class="sr-only"> {{ item.title }}</span></label></div>
        </article>{% endfor %}
      </div>{% else %}<div class="algo-empty panel"><span class="algo-mark" aria-hidden="true">⌕</span><h2>{{ 'No matching algos' if total else 'The collection is being prepared' }}</h2><p>{{ 'Try a different name or clear your filters.' if total else 'Reviewed algos will appear here when published. There is nothing to deploy yet.' }}</p>{% if total %}<a class="button secondary" href="{{ url_for('marketplace') }}">Clear filters</a>{% elif user and is_portal_admin(user) %}<a class="button" href="{{ url_for('admin_strategy') }}">Add an algo</a>{% endif %}</div>{% endif %}
      <div class="algo-footnote"><span aria-hidden="true">ⓘ</span><p>Capital guidance is not a maximum-loss guarantee. Signal-only examples do not place orders. Review the full risk notes for each algo.</p></div>
      <form id="compare-form" method="get" action="{{ url_for('compare_algos') }}" class="compare-bar"><span id="compare-feedback" role="status">Select up to 3 algos for a side-by-side view.</span><button class="button secondary small">Compare selected →</button></form>
    </section>
  </div>
</div>
{% endblock %}