{# ===========================================================================
   jobs/_row.html  —  compact (collapsed) job row
   ===========================================================================

   PORT NOTE (load-bearing — the expand/collapse interaction depends on ALL of
   these EXACTLY; keep attribute names + the placeholder-row pattern intact):
     • data-dedup-key, data-expand-url, data-collapse-url
     • hx-push-url="false"
     • the inline onclick that runs htmx.ajax(GET, expand|collapse url,
       {target: nextElementSibling, swap:'outerHTML'}) and flips
       this.dataset.expanded.
     • The hidden placeholder <tr data-expand-slot="..."> that FOLLOWS this row
       is emitted by jobs/_table.html and restored by jobs/_row_collapse_response.html.
   The compact row is rendered for both the full page and the /jobs/table partial.

   DESIGN DECISION #4 — "dense table, no card conversion":
     This stays a real <table> row. No card/list reflow. We only re-weighted the
     hierarchy WITHIN the row so a triager's eye lands Score → Title → meta:
       · Title  = secondary anchor: slate-100 medium, now preceded by a chevron
                  that rotates 90° when the row is expanded (the affordance the
                  old row lacked).
       · Company/Location/Salary/Posted = de-emphasised meta (slate-400/500, 13px).
       · Row hover = slate-800/40; expanded row = slate-800/60 (via data-expanded).
     Row vertical padding bumped (py-1.5 → py-2.5) ONLY because the score chip is
     44px tall and sets the row height; text density is otherwise unchanged.
#}

{# Salary formatting — UNCHANGED from original. #}
{% if job.salary_min and job.salary_max %}
  {% set salary = "$%dk–$%dk" | format((job.salary_min // 1000), (job.salary_max // 1000)) %}
{% elif job.salary_max %}
  {% set salary = "up to $%dk" | format(job.salary_max // 1000) %}
{% elif job.salary_min %}
  {% set salary = "$%dk+" | format(job.salary_min // 1000) %}
{% else %}
  {% set salary = "N/A" %}
{% endif %}

{# Recency display (#365): best-known posting date, honestly labeled.
   No posted_date → fall back to first_seen and say "seen"; an
   approximate/proxy date (relative-string parse, alert-email header)
   gets a "~" so the UI never overclaims "posted X ago". #}
{% set posted = job.posted_date if job.posted_date else job.first_seen %}
{% if not job.posted_date %}
  {% set posted_marker = 'seen ' %}
  {% set posted_title_label = 'first seen ' %}
{% elif job.posted_date_precision in ('approximate', 'proxy') %}
  {% set posted_marker = '~' %}
  {% set posted_title_label = 'posted (approximate) ' %}
{% else %}
  {% set posted_marker = '' %}
  {% set posted_title_label = 'posted ' %}
{% endif %}

{# Review-needed flag — UNCHANGED logic from original (Phase 47.06). #}
{% set _review_reasons = job.unresolved_reasons | from_json %}
{% set _review_locs = job.locations_structured | from_json %}
{% set _loc_unresolved = false %}
{% if _review_locs and _review_locs is not mapping and _review_locs is not string %}
  {% set _loc_unresolved = (_review_locs | selectattr('unresolved') | list | length) > 0 %}
{% endif %}
{% set _needs_review = (_review_reasons | length > 0) or _loc_unresolved %}
{% set _review_labels = _review_reasons + (['unresolved location'] if _loc_unresolved else []) %}

<tr class="border-b border-slate-700/60 hover:bg-slate-800/40 data-[expanded=true]:bg-slate-800/60 cursor-pointer transition-colors {% if job.is_stale %}opacity-50{% endif %}"
    data-dedup-key="{{ job.dedup_key }}"
    data-expand-url="{{ url_for('jobs.expand', dedup_key=job.dedup_key) }}"
    data-collapse-url="{{ url_for('jobs.collapse', dedup_key=job.dedup_key) }}"
    hx-push-url="false"
    onclick="
      var compactRow = this;
      var nextTr = this.nextElementSibling;
      var url = this.dataset.expanded === 'true' ? this.dataset.collapseUrl : this.dataset.expandUrl;
      var isExpanding = this.dataset.expanded !== 'true';
      this.dataset.expanded = isExpanding ? 'true' : 'false';
      htmx.ajax('GET', url, {target: nextTr, swap: 'outerHTML'}).then(function() {
        if (isExpanding) {
          setTimeout(function() {
            var row = compactRow.nextElementSibling;
            if (row && !row.classList.contains('hidden')) {
              row.scrollIntoView({behavior: 'smooth', block: 'start'});
            }
          }, 100);
        }
      });
    ">

  {# SCORE — the grade chip. Primary anchor. #}
  {% with oob=false %}{% include "jobs/_score_cell.html" %}{% endwith %}

  {# TITLE — secondary anchor, with the expand chevron. #}
  <td class="px-2 py-2.5">
    <div class="flex items-center gap-2 min-w-0">
      {# Chevron rotates via the [data-expanded=true] rule on the <tr> (see the
         <style> block in jobs/index.html). aria-hidden — it's decorative. #}
      <svg class="jc-row-chevron w-3.5 h-3.5 flex-none text-slate-500 transition-transform" viewBox="0 0 24 24"
           fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true">
        <path d="M9 5l7 7-7 7" />
      </svg>
      <span class="text-[15px] font-medium text-slate-100 truncate">{{ job.title }}</span>
      {% if job.is_stale %}
        <span class="flex-none text-[11px] text-amber-500 border border-amber-500/50 rounded px-1">Stale</span>
      {% endif %}
      {% if _needs_review %}
        <a href="{{ url_for('admin.review') }}#job-{{ job.dedup_key | urlencode | replace('%', '') }}"
           hx-on:click="event.stopPropagation()"
           title="Flagged for review: {{ _review_labels | join(', ') }}"
           class="flex-none text-[11px] text-amber-400 border border-amber-500/60 bg-amber-500/10 rounded px-1 hover:bg-amber-500/20">review</a>
      {% endif %}
    </div>
  </td>

  {# COMPANY — meta. #}
  <td class="px-2 py-2.5 text-[13px] text-slate-400 truncate">{{ job.company }}</td>

  {# LOCATION — meta (canonical preferred). #}
  {% set canonical = job.locations_structured | format_canonical_location %}
  <td class="px-2 py-2.5 text-[13px] text-slate-500 truncate" title="{{ job.location }}">
    {{ canonical if canonical else job.location }}
  </td>

  {# SALARY — meta, tabular; "N/A" goes faint (slate-600). #}
  <td class="px-1 py-2.5 text-[13px] tabular-nums whitespace-nowrap {{ 'text-slate-600' if salary == 'N/A' else 'text-slate-400' }}">{{ salary }}</td>

  {# POSTED — meta. NOTE: design mockup shows a dual "Jun 7 · 1d ago" format;
     we keep the existing `relative_date` filter as the visible value (and
     `local_date` in the title tooltip) because the combined format would need a
     new/extended date filter. ⚑ See PORT-MANIFEST: optional date-format follow-up. #}
  <td class="px-2 py-2.5 text-[13px] text-slate-500 whitespace-nowrap overflow-hidden" title="{{ posted_title_label }}{{ posted | local_date }}">{{ posted_marker }}{{ posted | relative_date }}</td>

  {# STATUS — inline select. id kept for the archive OOB target. #}
  <td class="px-1 py-2.5" id="status-cell-{{ job.dedup_key | urlencode | replace('%', '') }}">
    {% include "jobs/_status_cell.html" %}
  </td>
</tr>