{% extends "base.html" %}
{% block title %}{{ member.display_name }} — Concord{% endblock %}
{% block content %}
<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">
    {% if member.photo_url %}
      <img
        src="{{ member.photo_url }}"
        alt=""
        class="w-full rounded border border-stone-200"
      >
    {% endif %}
    {% if current_term %}
      <div>
        <div class="uppercase text-xs tracking-wide text-stone-400">Currently serving</div>
        <div>
          {{ "Senator" if current_term.chamber == "senate" else "Representative" }}
          for {{ current_term.state }}{% if current_term.district %}-{{ "%02d"|format(current_term.district) }}{% endif %}
        </div>
        {% if current_term.party %}<div>{{ current_term.party }}</div>{% endif %}
      </div>
    {% else %}
      <div class="text-stone-500">Not currently serving.</div>
    {% endif %}
    {% if member.birth_year %}
      <div>
        <div class="uppercase text-xs tracking-wide text-stone-400">Born</div>
        <div>{{ member.birth_year }}{% if member.death_year %} – {{ member.death_year }}{% endif %}</div>
      </div>
    {% endif %}
    <div class="text-xs text-stone-400">
      Bioguide: <span class="font-mono">{{ member.bioguide_id }}</span>
    </div>
    <div class="text-xs text-stone-400">
      Snapshot: {{ member.fetched_at }}
    </div>
  </aside>

  <div class="md:col-span-3 space-y-8">
    <h1 class="text-2xl font-serif font-semibold">{{ member.display_name }}</h1>

    {% if member.biography %}
      <section>
        <h2 class="text-sm uppercase tracking-wide text-stone-500 mb-2">Biography</h2>
        {% if member.biography|length > 300 %}
          <details>
            <summary class="cursor-pointer text-stone-700">
              {{ member.biography[:300] }}…
              <span class="text-stone-500 text-xs ml-1">(expand)</span>
            </summary>
            <p class="mt-2 leading-relaxed text-stone-800">{{ member.biography }}</p>
          </details>
        {% else %}
          <p class="leading-relaxed text-stone-800">{{ member.biography }}</p>
        {% endif %}
      </section>
    {% endif %}

    <section>
      <h2 class="text-sm uppercase tracking-wide text-stone-500 mb-2">Term history</h2>
      {% if terms %}
        <table class="w-full text-sm">
          <thead class="text-left text-xs uppercase tracking-wide text-stone-500">
            <tr>
              <th class="py-1 pr-3">Congress</th>
              <th class="py-1 pr-3">Chamber</th>
              <th class="py-1 pr-3">State</th>
              <th class="py-1 pr-3">District</th>
              <th class="py-1 pr-3">Party</th>
              <th class="py-1 pr-3">Years</th>
            </tr>
          </thead>
          <tbody>
            {% for t in terms %}
              <tr class="border-t border-stone-100">
                <td class="py-1 pr-3">{{ t.congress }}</td>
                <td class="py-1 pr-3">{{ t.chamber|capitalize }}</td>
                <td class="py-1 pr-3">{{ t.state }}</td>
                <td class="py-1 pr-3">{% if t.district %}{{ "%02d"|format(t.district) }}{% else %}—{% endif %}</td>
                <td class="py-1 pr-3">{{ t.party or "—" }}</td>
                <td class="py-1 pr-3 text-stone-500">
                  {{ t.start_date[:4] if t.start_date else "?" }} –
                  {{ t.end_date[:4] if t.end_date else "present" }}
                </td>
              </tr>
            {% endfor %}
          </tbody>
        </table>
      {% else %}
        <p class="text-stone-500">No term history recorded.</p>
      {% endif %}
    </section>

    <section>
      <h2 class="text-sm uppercase tracking-wide text-stone-500 mb-2">Sponsored bills</h2>
      {% if sponsored_bills %}
        <ul class="space-y-2">
          {% for b in sponsored_bills %}
            <li class="border border-stone-200 rounded p-3 bg-white">
              <div class="flex items-baseline gap-2 mb-1">
                <a
                  href="/bills/{{ b.congress }}/{{ b.bill_type }}/{{ b.bill_number }}"
                  class="font-mono text-sm font-medium text-stone-900 hover:text-stone-700"
                >{{ b.bill_type|upper }} {{ b.bill_number }}</a>
                <span class="text-xs text-stone-400">· {{ b.congress }}th</span>
              </div>
              <a
                href="/bills/{{ b.congress }}/{{ b.bill_type }}/{{ b.bill_number }}"
                class="block text-sm text-stone-800 hover:text-stone-600"
              >{{ b.title|truncate(120) }}</a>
            </li>
          {% endfor %}
        </ul>
        {% if sponsored_bills_total > sponsored_bills|length %}
          <p class="mt-2 text-sm">
            <a href="/bills?sponsor={{ member.bioguide_id }}" class="text-stone-600 hover:text-stone-900 underline">
              View all {{ sponsored_bills_total }} &rarr;
            </a>
          </p>
        {% endif %}
      {% else %}
        <p class="text-stone-500 text-sm">No sponsored bills indexed for this Member.</p>
      {% endif %}
    </section>

    <section>
      <h2 class="text-sm uppercase tracking-wide text-stone-500 mb-2">Cosponsored bills</h2>
      {% if cosponsored_bills %}
        <ul class="space-y-2">
          {% for b in cosponsored_bills %}
            <li class="border border-stone-200 rounded p-3 bg-white">
              <div class="flex items-baseline gap-2 mb-1">
                <a
                  href="/bills/{{ b.congress }}/{{ b.bill_type }}/{{ b.bill_number }}"
                  class="font-mono text-sm font-medium text-stone-900 hover:text-stone-700"
                >{{ b.bill_type|upper }} {{ b.bill_number }}</a>
                <span class="text-xs text-stone-400">· {{ b.congress }}th</span>
              </div>
              <a
                href="/bills/{{ b.congress }}/{{ b.bill_type }}/{{ b.bill_number }}"
                class="block text-sm text-stone-800 hover:text-stone-600"
              >{{ b.title|truncate(120) }}</a>
            </li>
          {% endfor %}
        </ul>
        {% if cosponsored_bills_total > cosponsored_bills|length %}
          <p class="mt-2 text-sm text-stone-500">
            Showing {{ cosponsored_bills|length }} of {{ cosponsored_bills_total }}.
          </p>
        {% endif %}
      {% else %}
        <p class="text-stone-500 text-sm">
          No cosponsored bills indexed for this Member yet. Run
          <code class="font-mono text-stone-700">concord scrape bills enrich --db data/proceedings.db --limit 100</code>
          to populate.
        </p>
      {% endif %}
    </section>

    {# -- Recent votes ------------------------------------------------- #}
    <section>
      <h2 class="text-sm uppercase tracking-wide text-stone-500 mb-2">Recent votes</h2>
      {% if recent_votes %}
        <ul class="space-y-2">
          {% for v in recent_votes %}
            {% with member_position=v.member_position, member_party=v.member_party %}
              {% include "_vote_row.html" %}
            {% endwith %}
          {% endfor %}
        </ul>
      {% else %}
        <p class="text-stone-500 text-sm">No vote positions recorded for this Member yet.</p>
      {% endif %}
    </section>

    {# -- Party-unity score (chamber-scoped) -------------------------- #}
    <section>
      <h2 class="text-sm uppercase tracking-wide text-stone-500 mb-2 flex items-center gap-2">
        <span>Party Unity Score</span>
        <a href="/about/methodology#party-unity"
           class="text-xs text-stone-400 hover:text-stone-700"
           title="What does this number mean?">(?)</a>
      </h2>
      {% if modal_vote_party == 'I' %}
        <p class="text-stone-500 text-sm">
          No party-unity score (Independent — no party majority to score against).
        </p>
      {% elif party_unity_rows %}
        {% set current_congress = party_unity_rows[0].congress %}
        {% set current_rows = party_unity_rows|selectattr("congress", "equalto", current_congress)|list %}
        <div class="space-y-2">
          {% for current in current_rows %}
            {% set chamber_label = "Senate" if current.chamber == "senate" else "House" %}
            {% if current.party_unity_votes_cast < party_unity_min_votes %}
              <p class="text-stone-700">
                <span class="text-xs uppercase tracking-wide text-stone-500">{{ chamber_label }}:</span>
                Voted on {{ current.party_unity_votes_cast }} party-unity vote{{ "" if current.party_unity_votes_cast == 1 else "s" }}
                in the {{ current.congress }}th Congress —
                <span class="text-stone-500">not enough for a stable score yet.</span>
              </p>
            {% else %}
              {% set pct = (current.party_line_votes * 100 // current.party_unity_votes_cast) %}
              {% set party_label = "Republican" if current.party == "R" else "Democratic" %}
              <p class="text-stone-800">
                <span class="text-xs uppercase tracking-wide text-stone-500">{{ chamber_label }}:</span>
                Voted with {{ party_label }} majority on
                <span class="font-semibold">{{ pct }}%</span>
                of party-unity votes
                ({{ current.party_line_votes }}/{{ current.party_unity_votes_cast }}
                in the {{ current.congress }}th Congress).
              </p>
            {% endif %}
          {% endfor %}
        </div>
        {% set older_rows = party_unity_rows|rejectattr("congress", "equalto", current_congress)|list %}
        {% if older_rows %}
          <div class="mt-3 text-xs text-stone-500 space-x-3">
            {% for r in older_rows %}
              {% set chamber_short = "S" if r.chamber == "senate" else "H" %}
              {% if r.party_unity_votes_cast >= party_unity_min_votes %}
                {% set rp = (r.party_line_votes * 100 // r.party_unity_votes_cast) %}
                <span>{{ r.congress }}th ({{ chamber_short }}): {{ rp }}%
                  <span class="text-stone-400">({{ r.party_line_votes }}/{{ r.party_unity_votes_cast }})</span>
                </span>
              {% else %}
                <span class="text-stone-400">{{ r.congress }}th ({{ chamber_short }}): {{ r.party_unity_votes_cast }} votes</span>
              {% endif %}
            {% endfor %}
          </div>
        {% endif %}
      {% elif recent_votes %}
        <p class="text-stone-500 text-sm">Party-unity score not yet computed.</p>
      {% else %}
        <p class="text-stone-500 text-sm">No vote positions recorded for this Member 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">Mentioned in proceedings (Phase 6)</div>
        <div class="text-xs">Floor statements that name this Member will appear here.</div>
      </div>
    </section>
  </div>
</article>
{% endblock %}