{% extends "base.html" %}
{% block title %}{{ bill.bill_type|upper }} {{ bill.bill_number }} — Concord{% endblock %}
{% block content %}
{# Compute the most recent fetched_at across tier-1 + tier-2 sections. #}
{%- set tier2_stamps = [bill.cosponsors_fetched_at, bill.actions_fetched_at,
                        bill.subjects_fetched_at, bill.titles_fetched_at,
                        bill.summaries_fetched_at] -%}
{%- set updated_at = bill.fetched_at -%}
{%- for stamp in tier2_stamps -%}
  {%- if stamp and stamp > updated_at -%}{%- set updated_at = stamp -%}{%- endif -%}
{%- endfor -%}
<article class="grid grid-cols-1 md:grid-cols-4 gap-6">
  <aside class="md:col-span-1 text-sm text-stone-600 space-y-3">
    <div>
      <div class="uppercase text-xs tracking-wide text-stone-400">Chamber</div>
      <div>{{ bill.origin_chamber }}</div>
    </div>
    <div>
      <div class="uppercase text-xs tracking-wide text-stone-400">Congress</div>
      <div>{{ bill.congress }}th</div>
    </div>
    {% if bill.introduced_date %}
      <div>
        <div class="uppercase text-xs tracking-wide text-stone-400">Introduced</div>
        <div>{{ bill.introduced_date }}</div>
      </div>
    {% endif %}
    {% if bill.policy_area %}
      <div>
        <div class="uppercase text-xs tracking-wide text-stone-400">Policy area</div>
        <div>{{ bill.policy_area }}</div>
      </div>
    {% endif %}
    <div class="text-xs text-stone-400">
      Updated {{ updated_at|humanize_age }}
    </div>
  </aside>

  <div class="md:col-span-3 space-y-8">
    <header>
      <div class="font-mono text-sm text-stone-500 mb-1">
        {{ bill.bill_type|upper }} {{ bill.bill_number }} · {{ bill.congress }}th Congress
      </div>
      <h1 class="text-2xl font-serif font-semibold leading-snug">{{ bill.title }}</h1>
    </header>

    {% if bill.latest_action_date or bill.latest_action_text %}
      <section>
        <h2 class="text-sm uppercase tracking-wide text-stone-500 mb-2">Latest action</h2>
        <p class="text-stone-800">
          {% if bill.latest_action_date %}
            <span class="font-medium">{{ bill.latest_action_date }}</span> —
          {% endif %}
          {{ bill.latest_action_text or "—" }}
        </p>
      </section>
    {% endif %}

    <section>
      <h2 class="text-sm uppercase tracking-wide text-stone-500 mb-2">Sponsor</h2>
      {% if bill.sponsor_bioguide_id %}
        {% if bill.sponsor_display_name %}
          <a
            href="/members/{{ bill.sponsor_bioguide_id }}"
            class="text-stone-900 hover:text-stone-700 underline"
          >{{ bill.sponsor_display_name }}</a>
        {% else %}
          <span class="text-stone-700">
            Bioguide
            <span class="font-mono">{{ bill.sponsor_bioguide_id }}</span>
            <span class="text-stone-400 text-xs">(not indexed)</span>
          </span>
        {% endif %}
      {% else %}
        <span class="text-stone-500">No sponsor recorded.</span>
      {% endif %}
    </section>

    {# -- Cosponsors --------------------------------------------------- #}
    <section>
      <h2 class="text-sm uppercase tracking-wide text-stone-500 mb-2">Cosponsors</h2>
      {% if bill.cosponsors_fetched_at is none %}
        <div class="border border-dashed border-stone-300 rounded p-4 text-stone-500 text-sm">
          Cosponsors not yet fetched. Run
          <code class="font-mono text-stone-700">concord scrape bills enrich --bill-ids {{ bill.bill_id }}</code>
          to populate.
        </div>
      {% elif cosponsors %}
        <ul class="space-y-1">
          {% for c in cosponsors %}
            <li class="text-sm">
              {% if c.sponsorship_withdrawn_date %}
                <del class="text-stone-500">
                  {% if c.display_name %}
                    <a href="/members/{{ c.bioguide_id }}" class="hover:text-stone-700">{{ c.display_name }}</a>
                  {% else %}
                    <span class="font-mono">{{ c.bioguide_id }}</span>
                  {% endif %}
                </del>
                <span class="text-xs text-stone-400 ml-1">(withdrawn {{ c.sponsorship_withdrawn_date }})</span>
              {% else %}
                {% if c.display_name %}
                  <a href="/members/{{ c.bioguide_id }}" class="text-stone-800 hover:text-stone-600">{{ c.display_name }}</a>
                {% else %}
                  <span class="font-mono text-stone-700">{{ c.bioguide_id }}</span>
                  <span class="text-xs text-stone-400">(not indexed)</span>
                {% endif %}
                {% if c.is_original_cosponsor %}
                  <span class="text-xs text-stone-400 ml-1">· original</span>
                {% elif c.sponsorship_date %}
                  <span class="text-xs text-stone-400 ml-1">· joined {{ c.sponsorship_date }}</span>
                {% endif %}
              {% endif %}
            </li>
          {% endfor %}
        </ul>
        <p class="mt-2 text-xs text-stone-400">Fetched {{ bill.cosponsors_fetched_at|humanize_age }}.</p>
      {% else %}
        <p class="text-stone-500 text-sm">No cosponsors recorded.</p>
        <p class="mt-2 text-xs text-stone-400">Fetched {{ bill.cosponsors_fetched_at|humanize_age }}.</p>
      {% endif %}
    </section>

    {# -- Action history ----------------------------------------------- #}
    <section>
      <h2 class="text-sm uppercase tracking-wide text-stone-500 mb-2">Action history</h2>
      {% if bill.actions_fetched_at is none %}
        <div class="border border-dashed border-stone-300 rounded p-4 text-stone-500 text-sm">
          Action history not yet fetched. Run
          <code class="font-mono text-stone-700">concord scrape bills enrich --bill-ids {{ bill.bill_id }}</code>
          to populate.
        </div>
      {% elif actions %}
        <ul>
          {% for action in actions %}
            {% include "bills/_action_row.html" %}
          {% endfor %}
        </ul>
        <p class="mt-2 text-xs text-stone-400">Fetched {{ bill.actions_fetched_at|humanize_age }}.</p>
      {% else %}
        <p class="text-stone-500 text-sm">No actions recorded.</p>
        <p class="mt-2 text-xs text-stone-400">Fetched {{ bill.actions_fetched_at|humanize_age }}.</p>
      {% endif %}
    </section>

    {# -- Subjects ----------------------------------------------------- #}
    <section>
      <h2 class="text-sm uppercase tracking-wide text-stone-500 mb-2">Subjects</h2>
      {% if bill.subjects_fetched_at is none %}
        <div class="border border-dashed border-stone-300 rounded p-4 text-stone-500 text-sm">
          Subjects not yet fetched. Run
          <code class="font-mono text-stone-700">concord scrape bills enrich --bill-ids {{ bill.bill_id }}</code>
          to populate.
        </div>
      {% elif subjects %}
        <div class="flex flex-wrap gap-1">
          {% for s in subjects %}
            <span class="inline-block px-2 py-0.5 rounded bg-stone-100 text-stone-700 text-xs">{{ s }}</span>
          {% endfor %}
        </div>
        <p class="mt-2 text-xs text-stone-400">Fetched {{ bill.subjects_fetched_at|humanize_age }}.</p>
      {% else %}
        <p class="text-stone-500 text-sm">No subjects assigned.</p>
        <p class="mt-2 text-xs text-stone-400">Fetched {{ bill.subjects_fetched_at|humanize_age }}.</p>
      {% endif %}
    </section>

    {# -- Titles ------------------------------------------------------- #}
    <section>
      <h2 class="text-sm uppercase tracking-wide text-stone-500 mb-2">Titles</h2>
      {% if bill.titles_fetched_at is none %}
        <div class="border border-dashed border-stone-300 rounded p-4 text-stone-500 text-sm">
          Titles not yet fetched. Run
          <code class="font-mono text-stone-700">concord scrape bills enrich --bill-ids {{ bill.bill_id }}</code>
          to populate.
        </div>
      {% elif titles %}
        <ul class="space-y-2">
          {% for t in titles %}
            <li class="text-sm">
              <div class="text-xs uppercase tracking-wide text-stone-400">{{ t.title_type }}{% if t.chamber %} · {{ t.chamber }}{% endif %}</div>
              <div class="text-stone-800">{{ t.title_text }}</div>
            </li>
          {% endfor %}
        </ul>
        <p class="mt-2 text-xs text-stone-400">Fetched {{ bill.titles_fetched_at|humanize_age }}.</p>
      {% else %}
        <p class="text-stone-500 text-sm">No titles recorded.</p>
        <p class="mt-2 text-xs text-stone-400">Fetched {{ bill.titles_fetched_at|humanize_age }}.</p>
      {% endif %}
    </section>

    {# -- Summaries ---------------------------------------------------- #}
    <section>
      <h2 class="text-sm uppercase tracking-wide text-stone-500 mb-2">Summaries</h2>
      {% if bill.summaries_fetched_at is none %}
        <div class="border border-dashed border-stone-300 rounded p-4 text-stone-500 text-sm">
          Summaries not yet fetched. Run
          <code class="font-mono text-stone-700">concord scrape bills enrich --bill-ids {{ bill.bill_id }}</code>
          to populate.
        </div>
      {% elif summaries %}
        {% set latest_index = summaries|length - 1 %}
        <div class="space-y-2">
          {% for s in summaries %}
            <details {% if loop.index0 == latest_index %}open{% endif %} class="border border-stone-200 rounded p-3 bg-white">
              <summary class="cursor-pointer text-sm font-medium text-stone-800">
                {{ s.action_desc or s.version_code }}
                {% if s.action_date %}<span class="text-xs text-stone-400 ml-1">· {{ s.action_date }}</span>{% endif %}
              </summary>
              <div class="prose prose-sm mt-2 text-stone-800">{{ s.summary_text|safe }}</div>
            </details>
          {% endfor %}
        </div>
        <p class="mt-2 text-xs text-stone-400">Fetched {{ bill.summaries_fetched_at|humanize_age }}.</p>
      {% else %}
        <p class="text-stone-500 text-sm">No summaries published.</p>
        <p class="mt-2 text-xs text-stone-400">Fetched {{ bill.summaries_fetched_at|humanize_age }}.</p>
      {% endif %}
    </section>

    {# -- Vote history -------------------------------------------------- #}
    <section>
      <h2 class="text-sm uppercase tracking-wide text-stone-500 mb-2">Vote history</h2>
      {% if vote_history %}
        <ul class="space-y-2">
          {% for v in vote_history %}
            {% include "_vote_row.html" %}
          {% endfor %}
        </ul>
      {% else %}
        <p class="text-stone-500 text-sm">No votes recorded for this bill yet.</p>
      {% endif %}
    </section>

    <section class="space-y-3">
      <h2 class="text-sm uppercase tracking-wide text-stone-500">Coming in later phases</h2>
      <div class="border border-dashed border-stone-300 rounded p-4 text-stone-500 text-sm">
        <div class="font-medium text-stone-600">Committee path (Phase 4)</div>
        <div class="text-xs">Committee referrals and reports will appear here.</div>
      </div>
      <div class="border border-dashed border-stone-300 rounded p-4 text-stone-500 text-sm">
        <div class="font-medium text-stone-600">Search within this bill (Phase 5)</div>
        <div class="text-xs">Bill text will become searchable here.</div>
      </div>
    </section>
  </div>
</article>
{% endblock %}