{#- A date field. It is text, not <input type="date">, so it reads in the date
    format chosen in Settings (the native one follows the browser's language);
    static/dates.js adds a calendar button. `value` is an ISO date, a date, or
    whatever the person typed (kept as typed after an error). -#}
{% macro date_input(name, value='', id='', label='', title='') -%}
<input type="text" class="date-input" name="{{ name }}"{% if id %} id="{{ id }}"{% endif %} value="{{ ui_date(value) }}" placeholder="{{ date_hint() }}" inputmode="numeric" autocomplete="off" size="11"{% if label %} aria-label="{{ label }}"{% endif %}{% if title %} title="{{ title }}"{% endif %}>
{%- endmacro %}
{% macro datetime_input(name, value='') -%}
<input type="text" class="date-input" data-time name="{{ name }}" value="{{ ui_datetime(value) }}" placeholder="{{ date_hint_datetime() }}" autocomplete="off" size="17">
{%- endmacro %}

{# Shared form fragments. #}

{% macro err(errors, name) %}
  {%- if errors and name in errors %}<span class="error">{{ errors[name] }}</span>{% endif -%}
{% endmacro %}

{% macro errors_box(errors) %}
  {%- if errors %}
  <div class="errors">
    <strong>Could not save:</strong>
    <ul>{% for field, message in errors.items() %}<li>{{ field }}: {{ message }}</li>{% endfor %}</ul>
  </div>
  {%- endif %}
{% endmacro %}

{% macro filter_control(col, active, form_id) %}
  {%- if col.kind == 'enum' -%}
  <select name="f_{{ col.key }}" form="{{ form_id }}" multiple size="{{ [col.options | length, 4] | min }}" class="filter" title="select one or more (cmd-click)">
    {% for o in col.options %}<option value="{{ o }}"{% if o in active.get(col.key, []) %} selected{% endif %}>{{ o }}</option>{% endfor %}
  </select>
  {%- else -%}
  <input name="f_{{ col.key }}" form="{{ form_id }}" value="{{ active.get(col.key, '') }}" class="filter" placeholder="{{ ('>' ~ date_hint() ~ ', <…, -, *') if col.kind == 'date' else ('>5, <5, =5, -, *' if col.kind == 'number' else 'text, !text, =text, -, *') }}">
  {%- endif -%}
{% endmacro %}

{% macro sort_links(col, sort, dir, sort_url) %}
  <span class="sort">
    <a href="{{ sort_url(col.key, 'asc') }}" class="{% if sort == col.key and dir == 'asc' %}on{% endif %}" title="sort A to Z (small to large, old to new)">&#9650;</a><a href="{{ sort_url(col.key, 'desc') }}" class="{% if sort == col.key and dir == 'desc' %}on{% endif %}" title="sort Z to A (large to small, new to old)">&#9660;</a>
  </span>
{%- endmacro %}

{% macro filter_help() %}
<span class="help" tabindex="0" role="button" aria-label="how filters and sorting work"><span class="help-dot">?</span><span class="help-label">what does !text mean?</span>
  <span class="tip">
    <strong>Filters</strong> (one box per column, combined with AND)
    <table>
      <tr><td><code>text</code></td><td>contains</td></tr>
      <tr><td><code>!text</code></td><td>does not contain</td></tr>
      <tr><td><code>=text</code></td><td>equals</td></tr>
      <tr><td><code>&gt;5</code> <code>&lt;5</code></td><td>larger / smaller (numbers, dates as <code>{{ date_hint() }}</code>, otherwise text order)</td></tr>
      <tr><td><code>-</code></td><td>empty</td></tr>
      <tr><td><code>*</code></td><td>not empty</td></tr>
    </table>
    Lists: cmd-click (ctrl-click) to select several.
    <strong>Sorting</strong>: &#9650; A to Z, &#9660; Z to A next to each heading; empty values sort last. Filters, sorting and search stay in the URL, so a view can be bookmarked.
  </span>
</span>
{%- endmacro %}

{# A "?" that explains on hover, focus or tap: the detail a page needs once, so the
   line next to it can stay short. `id` is unique on the page (the "?" is described
   by it); `label` names the "?" for a screen reader. The text is the call block:
   {% call hint('some-id', 'What this means') %}Text, links and <b>bold</b>.{% endcall %}
   Keep it out of a .table-scroll, which would clip the tip. #}
{% macro hint(id, label='More detail') %}
<span class="help hint" tabindex="0" role="button" aria-label="{{ label }}" aria-describedby="{{ id }}"><span class="help-dot" aria-hidden="true">?</span><span class="tip" role="tooltip" id="{{ id }}">{{ caller() }}</span></span>
{%- endmacro %}

{% macro filter_form(form_id, action, active, q=None, sort='', dir='asc') %}
<form method="get" action="{{ action }}" id="{{ form_id }}" class="filter-form">
  {% if q is not none %}<input type="hidden" name="q" value="{{ q }}">{% endif %}
  {% if sort %}<input type="hidden" name="sort" value="{{ sort }}"><input type="hidden" name="dir" value="{{ dir }}">{% endif %}
  <button type="submit">Filter</button>
  {{ filter_help() }}
  {% if active or sort %}<a href="{{ action }}{% if q %}?q={{ q | urlencode }}{% endif %}">clear filters and sorting</a>{% endif %}
</form>
{% endmacro %}

{# An interaction is with a person. With `contact` (the contact page)
   the person is fixed; elsewhere you pick one. A note has no direction and may
   be about the whole company instead (contact left empty). #}
{% macro interaction_form(action, company, values, errors=None, submit='Log interaction', contact=None) %}
<form method="post" action="{{ action }}" class="interaction-form{% if values.channel == 'note' %} is-note{% endif %}">
  {{ errors_box(errors) }}
  <div class="row">
    <label>channel
      <select name="channel" onchange="this.form.classList.toggle('is-note', this.value === 'note'); var c = this.form.elements.contact; if (c && c.options && c.options[0].value === '') c.options[0].text = this.value === 'note' ? 'whole company (no one in particular)' : 'pick a contact'">
        {% for ch in channels %}
        <option value="{{ ch }}"{% if values.channel == ch %} selected{% endif %}>{{ ch }}</option>
        {% endfor %}
      </select>
    </label>
    <span class="radios directions">
      {% for d in directions %}
      <label><input type="radio" name="direction" value="{{ d }}"{% if values.direction == d or (not values.direction and loop.first) %} checked{% endif %}> {{ d }}</label>
      {% endfor %}
    </span>
    {% if contact %}
    <input type="hidden" name="contact" value="{{ contact.slug }}">
    {% else %}
    <label>contact
      <select name="contact">
        <option value=""{% if not values.contact %} selected{% endif %}>{{ 'whole company (no one in particular)' if values.channel == 'note' else 'pick a contact' }}</option>
        {% for slug, person in company.contacts.items() %}
        <option value="{{ slug }}"{% if values.contact == slug %} selected{% endif %}>{{ person.name }}</option>
        {% endfor %}
      </select>
      {{ err(errors, 'contact') }}
    </label>
    {% endif %}
    <label>date {{ datetime_input('date', values.date) }}</label>
  </div>
  <div class="row">
    <label class="grow">subject <input name="subject" value="{{ values.subject }}"></label>
    <label class="outcome-field">outcome
      <select name="outcome">
        <option value=""{% if not values.outcome %} selected{% endif %}>not yet known</option>
        {% for o in outcomes %}<option value="{{ o }}"{% if values.outcome == o %} selected{% endif %}>{{ o }}</option>{% endfor %}
        {# A value outside the list (older data, or config changed) stays selectable so saving does not lose it. #}
        {% if values.outcome and values.outcome not in outcomes %}<option value="{{ values.outcome }}" selected>{{ values.outcome }}</option>{% endif %}
      </select>
    </label>
  </div>
  {{ custom_fields(custom_fields_for('interaction'), values, errors) }}
  {# The body is the record. Custom fields sit beside it and never touch it. #}
  <label>body <textarea name="body" rows="6">{{ values.body }}</textarea></label>
  <button type="submit">{{ submit }}</button>
</form>
{% endmacro %}

{# The labels of the user's own fields. `grid`: they sit in a .form-grid (the
   company form), three columns each, instead of in a .row of their own. #}
{% macro custom_labels(defs, values, errors, grid=false) %}
    {% for f in defs %}
    <label{% if grid %} class="span-3"{% elif f.type != 'select' %} class="grow"{% endif %}>{{ f.label }}
      {%- if f.type == 'select' %}
      <select name="custom_{{ f.key }}">
        <option value=""></option>
        {% for o in f.options %}<option value="{{ o }}"{% if values.get('custom_' ~ f.key)|string == o %} selected{% endif %}>{{ o }}</option>{% endfor %}
      </select>
      {%- elif f.type == 'date' %}
      {{ date_input('custom_' ~ f.key, values.get('custom_' ~ f.key, '')) }}
      {%- elif f.type == 'number' %}
      <input name="custom_{{ f.key }}" value="{{ values.get('custom_' ~ f.key, '') }}" inputmode="decimal" size="6">
      {%- else %}
      <input name="custom_{{ f.key }}" value="{{ values.get('custom_' ~ f.key, '') }}">
      {%- endif %}
      {{ err(errors, 'custom_' ~ f.key) }}
      {%- if f.help %} <span class="small faint">{{ f.help }}</span>{% endif %}
    </label>
    {% endfor %}
{% endmacro %}

{% macro custom_fields(defs, values, errors) %}
{%- if defs %}
  <div class="row custom-fields">
    {{ custom_labels(defs, values, errors) }}
  </div>
{%- endif %}
{% endmacro %}

{# `hide`: the fields layout.toml hides on the record page. A form leaves them
   out entirely, so saving keeps their values (web.submitted_only). #}
{# The company form: groups of fields on a 12-column grid (.form-grid, the
   span-N classes in style.css). `hide` is what layout.toml hides: such a field
   is left out, and a group with nothing left in it is left out with it. The
   reason and requalify fields only show for a stage that keeps them, or when
   they already hold something; they are hidden, not removed, so they still
   submit. #}
{#- `first_note`: the new-company form, where one box becomes the company's first note.
    The edit form has none: company text lives in dated notes on the page (#company-notes). #}
{% macro company_fields(values, errors, first_note=false) %}
  {%- set hide = layout_hidden('company', errors) %}
  {%- set custom = custom_fields_for('company') | rejectattr('key', 'in', hide) | list %}
  {%- set keeps = stage_keeps(values.stage) %}
  {#- which stages keep a reason (and a date to requalify on), for the script below #}
  {%- set keeps_by_stage = {} %}
  {%- for s in stages if stage_keeps(s) %}{% set _ = keeps_by_stage.update({s: stage_keeps(s)}) %}{% endfor %}
  {%- set show_type = type_names() and 'next_step_type' not in hide %}
  <fieldset class="form-group">
    <div class="form-grid">
      {#- The name is not a login: tell password managers to leave it alone. #}
      <label class="span-6">name <input name="name" value="{{ values.name }}" required autocomplete="off" data-lpignore="true" data-1p-ignore data-bwignore="true"> {{ err(errors, 'name') }}</label>
      {% if 'source' not in hide %}<label class="span-3">source
        <select name="source">
          {% for s in sources %}<option value="{{ s }}"{% if values.source == s %} selected{% endif %}>{{ s }}</option>{% endfor %}
        </select>
      </label>{% endif %}
      <label class="span-3">stage
        <select name="stage" id="stage" data-keeps='{{ keeps_by_stage | tojson }}'>
          {% if values.stage and values.stage not in stages %}<option value="{{ values.stage }}" selected>{{ values.stage }} (not in Settings)</option>{% endif %}
          {% for s in stages %}<option value="{{ s }}"{% if values.stage == s %} selected{% endif %}>{{ s }}</option>{% endfor %}
        </select>
      </label>
      {% if 'website' not in hide %}<label class="span-5">website <input name="website" value="{{ values.website }}"></label>{% endif %}
      {% if 'linkedin' not in hide %}<label class="span-5">linkedin <input name="linkedin" value="{{ values.linkedin }}"></label>{% endif %}
      {% if 'country' not in hide %}<label class="span-2">country
        <input name="country" value="{{ values.country }}" list="country-codes" size="4" maxlength="3" placeholder="DE" title="ISO 3166-1 alpha-2 code">
        <datalist id="country-codes">{% for c in countries %}<option value="{{ c }}">{% endfor %}</datalist>
      </label>{% endif %}
    </div>
  </fieldset>
  {% if 'lost_reason' not in hide or 'requalify_on' not in hide %}
  {%- set reason_shown = 'lost_reason' not in hide and (keeps or values.lost_reason or errors.lost_reason) %}
  {%- set when_shown = 'requalify_on' not in hide and ('requalify' in keeps or values.requalify_on or errors.requalify_on) %}
  <fieldset class="form-group" id="closing-fields"{% if not (reason_shown or when_shown) %} hidden{% endif %}>
    <legend>Closing details</legend>
    <div class="form-grid">
      {% if 'lost_reason' not in hide %}<label class="span-6" id="lost_reason-label"{% if not reason_shown %} hidden{% endif %}>reason (lost / disqualified) <input name="lost_reason" id="lost_reason" value="{{ values.lost_reason }}"> {{ err(errors, 'lost_reason') }}</label>{% endif %}
      {% if 'requalify_on' not in hide %}<label class="span-3" id="requalify_on-label"{% if not when_shown %} hidden{% endif %}>requalify on (temp disqualified) {{ date_input('requalify_on', values.requalify_on, id='requalify_on') }} {{ err(errors, 'requalify_on') }}</label>{% endif %}
    </div>
  </fieldset>
  {% endif %}
  {% if 'product_oneliner' not in hide or 'value_eur_month' not in hide or custom %}
  <fieldset class="form-group">
    <legend>Profile</legend>
    <div class="form-grid">
      {% if 'product_oneliner' not in hide %}<label class="span-{{ 12 if 'value_eur_month' in hide else 9 }}">product oneliner <input name="product_oneliner" value="{{ values.product_oneliner }}"></label>{% endif %}
      {% if 'value_eur_month' not in hide %}<label class="span-{{ 12 if 'product_oneliner' in hide else 3 }}">value EUR/month <input name="value_eur_month" value="{{ values.value_eur_month }}"> {{ err(errors, 'value_eur_month') }}</label>{% endif %}
      {{ custom_labels(custom, values, errors, grid=true) }}
    </div>
  </fieldset>
  {% endif %}
  {% if 'next_step' not in hide or 'next_step_due' not in hide or 'next_step_status' not in hide or show_type %}
  <fieldset class="form-group">
    <legend>Next step</legend>
    <div class="form-grid">
      {% if 'next_step' not in hide %}<label class="span-12">next step <input name="next_step" value="{{ values.next_step }}"></label>{% endif %}
      {% if 'next_step_due' not in hide %}<label class="span-4">due {{ date_input('next_step_due', values.next_step_due) }} {{ err(errors, 'next_step_due') }}</label>{% endif %}
      {% if 'next_step_status' not in hide %}<label class="span-4">status
        <select name="next_step_status">
          {% for t in task_statuses %}<option value="{{ t }}"{% if values.next_step_status == t %} selected{% endif %}>{{ t }}</option>{% endfor %}
        </select>
      </label>{% endif %}
      {% if show_type %}<label class="span-4">type {{ type_select(values.next_step_type, name='next_step_type') }}</label>{% endif %}
    </div>
  </fieldset>
  {% endif %}
  {% if 'tags' not in hide or first_note %}
  <fieldset class="form-group">
    <legend>{{ 'Tags and first note' if first_note and 'tags' not in hide else ('First note' if first_note else 'Tags') }}</legend>
    <div class="form-grid">
      {% if 'tags' not in hide %}<label class="span-12">tags (comma separated) <input name="tags" value="{{ values.tags }}"></label>{% endif %}
      {% if first_note %}<label class="span-12">first note <span class="small">(optional; saved as a dated company note)</span> <textarea name="notes" rows="6">{{ values.notes }}</textarea></label>{% endif %}
      {% if not first_note %}<p class="span-12 small">Free text about the company goes in <a href="#company-notes">Company notes</a>, as dated notes.</p>{% endif %}
    </div>
  </fieldset>
  {% endif %}
  <script>
  (function () {
    var stage = document.getElementById('stage'), box = document.getElementById('closing-fields');
    if (!stage || !box) { return; }
    var why = document.getElementById('lost_reason'), when = document.getElementById('requalify_on');
    var whyLabel = document.getElementById('lost_reason-label'), whenLabel = document.getElementById('requalify_on-label');
    function sync() {
      var keeps = JSON.parse(stage.getAttribute('data-keeps') || '{}')[stage.value] || '';
      var showWhy = !!(keeps || (why && why.value));
      var showWhen = keeps.indexOf('requalify') > -1 || !!(when && when.value);
      if (whyLabel) { whyLabel.hidden = !showWhy; }
      if (whenLabel) { whenLabel.hidden = !showWhen; }
      box.hidden = !((whyLabel && showWhy) || (whenLabel && showWhen));
    }
    stage.addEventListener('change', sync);
    sync();
  })();
  </script>
{% endmacro %}

{% macro contact_fields(values, errors) %}
  {%- set hide = layout_hidden('contact', errors) %}
  <div class="row">
    <label class="grow">first name <input name="first_name" value="{{ values.first_name }}"> {{ err(errors, 'first_name') }}</label>
    <label class="grow">last name <input name="last_name" value="{{ values.last_name }}"></label>
    {% if 'title' not in hide %}<label class="grow">title <input name="title" value="{{ values.title }}"></label>{% endif %}
    {% if 'role' not in hide %}<label>role
      <select name="role">
        <option value=""{% if not values.role %} selected{% endif %}>-</option>
        {% for r in roles %}<option value="{{ r }}"{% if values.role == r %} selected{% endif %}>{{ r }}</option>{% endfor %}
      </select>
    </label>{% endif %}
    {% set lang = (values.language or '') | trim | lower %}
    {% if 'language' not in hide %}<label>draft language
      <select name="language">
        <option value=""{% if not lang %} selected{% endif %}>from country</option>
        {% for code, name in language_names.items() %}<option value="{{ code }}"{% if lang == code %} selected{% endif %}>{{ name }}</option>{% endfor %}
        {# A hand-typed code without templates stays selected, so saving the form keeps it. #}
        {% if lang and lang not in language_names %}<option value="{{ lang }}" selected>{{ lang }} (no templates)</option>{% endif %}
      </select>
    </label>{% endif %}
  </div>
  {% if 'email' not in hide or 'phone' not in hide or 'linkedin' not in hide %}<div class="row">
    {% if 'email' not in hide %}<label class="grow">email <input name="email" value="{{ values.email }}"> {{ err(errors, 'email') }}</label>{% endif %}
    {% if 'phone' not in hide %}<label class="grow">phone <input name="phone" value="{{ values.phone }}"></label>{% endif %}
    {% if 'linkedin' not in hide %}<label class="grow">linkedin <input name="linkedin" value="{{ values.linkedin }}"></label>{% endif %}
  </div>{% endif %}
  {{ custom_fields(custom_fields_for('contact') | rejectattr('key', 'in', hide) | list, values, errors) }}
{% endmacro %}

{# `contact_page`: every entry is with the same person, so no name; the
   direction is an arrow, a missing subject says nothing, and a message shows
   its first line with the rest behind "more". #}
{% macro timeline(company, interactions, contact_page=false) %}
<ul class="timeline">
  {% for i in interactions %}
  <li class="interaction{% if i.is_note %} note{% endif %}" id="i-{{ i.id }}">
    <div class="meta">
      <span class="when">{{ fmt_datetime(i.date) }}</span>
      <span class="tag">{{ i.channel }}</span>
      {% if i.direction and contact_page %}<span class="tag" title="{{ i.direction }}"><span aria-hidden="true">{{ '→' if i.direction == 'out' else '←' }}</span><span class="visually-hidden">{{ i.direction }}</span></span>
      {% elif i.direction %}<span class="tag">{{ i.direction }}</span>{% endif %}
      {% if not contact_page %}<span class="who">{{ contact_label(company, i.contact) }}</span>{% endif %}
      <a class="edit" href="/companies/{{ company.slug }}/interactions/{{ i.id }}/edit">edit</a>
      <form method="post" action="/companies/{{ company.slug }}/interactions/{{ i.id }}/delete" class="inline delete">
        <button type="submit" onclick="return confirm('Delete this interaction?')">delete</button>
      </form>
    </div>
    {% if i.subject or not (i.is_note or contact_page) %}<div class="subject{% if not i.subject %} empty{% endif %}">{{ i.subject or '(no subject)' }}</div>{% endif %}
    {% if i.outcome %}<div class="outcome">outcome: {{ i.outcome }}</div>{% endif %}
    {% if i.body and i.is_note %}<pre>{{ i.body }}</pre>
    {% elif i.body and contact_page %}<details class="body-preview"><summary><span class="first-line">{{ preview(i.body) }}</span> <span class="small">more</span></summary><pre>{{ i.body }}</pre></details>
    {% elif i.body %}<details><summary>body</summary><pre>{{ i.body }}</pre></details>{% endif %}
  </li>
  {% else %}
  <li class="empty">No interactions yet.</li>
  {% endfor %}
</ul>
{% endmacro %}


{# One group of someone else's notes on a contact page: a one-line summary
   (who, how many, the newest note's first line) that opens to the newest ones.
   `group.total` can exceed what is listed; `href` is where all of them are,
   `where` what its link calls that place (default: the label). #}
{% macro note_group(label, group, href='', where='') %}
{% set notes = group.notes %}
<details class="note-group">
  <summary><strong>{{ label }}</strong> ({{ group.total }}) <span class="first-line">{{ preview(notes[0].body) }}</span> <span class="small">more</span></summary>
  <ul class="timeline">
    {% for n in notes %}
    <li class="interaction note"><div class="meta"><span class="when">{{ fmt_datetime(n.date) }}</span></div><pre>{{ n.body }}</pre></li>
    {% endfor %}
  </ul>
  {% if group.total > notes | length %}<p class="small">Showing the newest {{ notes | length }} of {{ group.total }}.</p>{% endif %}
  {% if href %}<p class="small"><a href="{{ href }}">{{ 'Open ' ~ (where or label) ~ (' to see all' if group.total > notes | length else '') }}</a></p>{% endif %}
</details>
{% endmacro %}

{% macro type_select(current='', autosubmit=false, name='type') -%}
{%- set options = type_names() -%}
{%- if options -%}
<select name="{{ name }}" aria-label="type"{% if autosubmit %} onchange="this.form.submit()"{% endif %}>
  <option value="">{{ '(no type)' if autosubmit else '' }}</option>
  {% for n in options %}<option value="{{ n }}"{% if n == current %} selected{% endif %}>{{ n }}</option>{% endfor %}
</select>
{%- endif -%}
{%- endmacro %}

{% macro type_cell(company, t, index, contact='') -%}
<td>{% if type_names() and not t.done %}<form method="post" action="/companies/{{ company.slug }}/todo-type" class="inline">
  <input type="hidden" name="index" value="{{ '' if index is none else index }}">
  <input type="hidden" name="contact" value="{{ contact }}">
  <input type="hidden" name="text" value="{{ t.text }}">
  {{ type_select(t.type, autosubmit=true) }}</form>{% else %}{{ type_chip(t.type) }}{% endif %}</td>
{%- endmacro %}

{% macro type_chip(name) -%}
{%- if name -%}
{%- set colour = type_colour(name) -%}
<span class="type-chip type-{{ colour or 'grey' }}{% if not colour %} unknown{% endif %}"{% if not colour %} title="not in Settings"{% endif %}>{{ name }}</span>
{%- endif -%}
{%- endmacro %}

{% macro todo_actions(company, todo, back='', delete=false) -%}
{%- if todo.is_field -%}
<form method="post" action="/companies/{{ company.slug }}/next-step" class="inline">
  {% if back %}<input type="hidden" name="back" value="{{ back }}">{% endif %}
  <input type="hidden" name="status" value="{{ 'open' if todo.done else 'done' }}"><button type="submit">{{ 'Reopen' if todo.done else 'Done' }}</button>
</form>
{%- if delete %}
<form method="post" action="/companies/{{ company.slug }}/next-step/delete" class="inline">
  {% if back %}<input type="hidden" name="back" value="{{ back }}">{% endif %}
  <button type="submit" title="Remove this task">Delete</button>
</form>
{%- endif %}
{%- else -%}
<form method="post" action="/companies/{{ company.slug }}/tasks/{{ todo.index }}/done" class="inline">
  {% if back %}<input type="hidden" name="back" value="{{ back }}">{% endif %}
  <input type="hidden" name="contact" value="{{ todo.contact.slug if todo.contact else '' }}">
  <input type="hidden" name="text" value="{{ todo.text }}">
  <input type="hidden" name="done" value="{{ '' if todo.done else '1' }}">
  <button type="submit">{{ 'Reopen' if todo.done else 'Done' }}</button>
</form>
{%- if delete %}
<form method="post" action="/companies/{{ company.slug }}/tasks/{{ todo.index }}/delete" class="inline">
  {% if back %}<input type="hidden" name="back" value="{{ back }}">{% endif %}
  <input type="hidden" name="contact" value="{{ todo.contact.slug if todo.contact else '' }}">
  <input type="hidden" name="text" value="{{ todo.text }}">
  <button type="submit" title="Remove this task">Delete</button>
</form>
{%- endif %}
{%- endif -%}
{%- endmacro %}

{# Edit the text and due date of one open to-do. `index` is None for the
   company's next-step fields; `contact` is the person's slug or ''. #}
{% macro todo_edit(company, t, index, contact='', back='') -%}
{%- if not t.done -%}
<details class="inline-edit todo-edit">
  <summary class="button">Edit</summary>
  <form method="post" action="/companies/{{ company.slug }}/todo-edit" class="inline-form">
    {% if back %}<input type="hidden" name="back" value="{{ back }}">{% endif %}
    <input type="hidden" name="index" value="{{ '' if index is none else index }}">
    <input type="hidden" name="contact" value="{{ contact }}">
    <input type="hidden" name="text" value="{{ t.text }}">
    <input name="new_text" value="{{ t.text }}" aria-label="task" required>
    {{ date_input('due', t.due, label='due') }}
    <button type="submit">Save</button>
  </form>
</details>
{%- endif -%}
{%- endmacro %}

{% macro task_section(company, today) -%}
{% set first = company.next_todo() %}
<section id="tasks">
  <h2>Tasks</h2>
  <p class="small">For the company and its people.
    {%- call hint('company-next-step-help', 'What the next step is') %} The <b>next step</b> is the open task due first. Change a due date to change what is next.{% endcall %}
    <a href="/tasks?f_company_name={{ ('=' ~ company.name) | urlencode }}">This company on the Tasks page</a></p>
  <div class="table-scroll"><table class="tasks">
    <tr><th>task</th>{% if type_names() %}<th>type</th>{% endif %}<th>for</th><th>due</th><th>status</th><th></th></tr>
    {% for t in company.open_todos() + (company.todos() | selectattr('done') | list) %}
    {% set is_next = first and not first.done and not t.done and t.key == first.key %}
    <tr class="{% if t.overdue(today) %}overdue{% endif %}{% if t.done %} done{% endif %}{% if is_next %} next{% endif %}">
      <td>{{ t.text or '(no text)' }}{% if is_next %} <span class="tag next-step">next step</span>{% endif %}{% if not type_names() %} {{ type_chip(t.type) }}{% endif %}</td>
      {% if type_names() %}{{ type_cell(company, t, t.index, t.contact.slug if t.contact else '') }}{% endif %}
      <td>{% if t.contact %}<a href="/companies/{{ company.slug }}/contacts/{{ t.contact.slug }}">{{ t.contact.name }}</a>{% else %}<span class="small">company</span>{% endif %}</td>
      <td class="due{% if t.overdue(today) %} overdue{% endif %}">{{ fmt_date(t.due) if t.due else 'no date' }}</td>
      <td>{% if t.done %}<span class="tag status-done">done</span>{% if t.done_on %} <span class="small">{{ fmt_date(t.done_on) }}</span>{% endif %}{% else %}<span class="tag status-open">open</span>{% endif %}</td>
      <td class="actions">
        {{ todo_edit(company, t, t.index, t.contact.slug if t.contact else '') }}
        {{ todo_actions(company, t, delete=true) }}
        {% if is_next and t.due %}<a class="calendar" target="_blank" rel="noopener" href="{{ calendar_link(company, t) }}">Add to Google Calendar</a>{% endif %}
      </td>
    </tr>
    {% else %}
    <tr><td colspan="{{ 6 if type_names() else 5 }}" class="empty">No tasks yet.</td></tr>
    {% endfor %}
  </table></div>
  <form method="post" action="/companies/{{ company.slug }}/tasks" class="inline-row">
    <label class="grow">task <input name="text" placeholder="e.g. send the pricing page" required></label>
    <label>for
      <select name="contact">
        <option value="">{{ company.name }}</option>
        {% for c in company.contacts.values() %}<option value="{{ c.slug }}">{{ c.name }}</option>{% endfor %}
      </select>
    </label>
    <label>due {{ date_input('due') }}</label>
    {% if type_names() %}<label>type {{ type_select() }}</label>{% endif %}
    <button type="submit">Add task</button>
  </form>
</section>
{%- endmacro %}

{% macro task_list(company, tasks, today, contact='', adding=true) -%}
<div class="table-scroll"><table class="tasks">
  {% for t in tasks %}
  <tr class="{% if t.overdue(today) %}overdue{% endif %}{% if t.done %} done{% endif %}">
    <td>{{ t.text }}{% if not type_names() %} {{ type_chip(t.type) }}{% endif %}</td>
    {% if type_names() %}{{ type_cell(company, t, loop.index0, contact) }}{% endif %}
    <td class="{% if t.overdue(today) %}overdue{% endif %}">{{ fmt_date(t.due) if t.due else '' }}</td>
    <td>{% if t.done %}done{% if t.done_on %} {{ fmt_date(t.done_on) }}{% endif %}{% endif %}</td>
    <td class="actions">
      {{ todo_edit(company, t, loop.index0, contact) }}
      <form method="post" action="/companies/{{ company.slug }}/tasks/{{ loop.index0 }}/done" class="inline">
        <input type="hidden" name="contact" value="{{ contact }}">
        <input type="hidden" name="text" value="{{ t.text }}">
        <input type="hidden" name="done" value="{{ '' if t.done else '1' }}">
        <button type="submit">{{ 'Reopen' if t.done else 'Done' }}</button>
      </form>
      <form method="post" action="/companies/{{ company.slug }}/tasks/{{ loop.index0 }}/delete" class="inline">
        <input type="hidden" name="contact" value="{{ contact }}">
        <input type="hidden" name="text" value="{{ t.text }}">
        <button type="submit" title="Remove this task">Delete</button>
      </form>
    </td>
  </tr>
  {% else %}
  <tr><td colspan="{{ 5 if type_names() else 4 }}" class="empty">Nothing on the list.</td></tr>
  {% endfor %}
</table></div>
{% if adding %}
<form method="post" action="/companies/{{ company.slug }}/tasks" class="inline-row">
  <input type="hidden" name="contact" value="{{ contact }}">
  <label class="grow">task <input name="text" placeholder="e.g. send the pricing page" required></label>
  <label>due {{ date_input('due') }}</label>
  {% if type_names() %}<label>type {{ type_select() }}</label>{% endif %}
  <button type="submit">Add task</button>
</form>
{% endif %}
{%- endmacro %}

{# The handoff to the user's own agent (Make it yours): a request box and the
   buttons for the agent config.toml names. static/adjust.js builds the prompt,
   the link and the command from these data attributes as the user types, the
   same way adjust.handoff() does; the hint lines below say what each one does. #}
{% macro handoff(h, id, page_title='', path='', label='Describe a change', text='', more=false) %}
<div class="handoff" data-agent="{{ h.agent }}" data-folder="{{ h.folder }}" data-page-title="{{ page_title }}" data-path="{{ path }}" data-limit="{{ h.limit }}">
  <label class="small" for="{{ id }}">{{ label }}</label>
  <textarea id="{{ id }}" class="request" data-request rows="3" placeholder="e.g. a list of everyone I met in September who has no next step">{{ text }}</textarea>
  <div class="ask-actions wrap">
    {% if h.how == 'link' %}<a class="button primary" data-open href="#" aria-disabled="true">{{ h.button }}</a>{% endif %}
    {% if h.how == 'command' %}<button type="button" class="primary" data-copy="command">{{ h.button }}</button>{% endif %}
    <button type="button" data-copy="prompt"{% if h.how == 'copy' %} class="primary"{% endif %}>Copy prompt</button>
    <span class="small" data-copied role="status"></span>
    {% if more %}<a class="small more-ideas" href="/yours">More ideas</a>{% endif %}
  </div>
  {% if h.how == 'link' %}<p class="small warning" data-too-long hidden>Too long for a link: over {{ h.limit }} bytes, and longer links fail without a word on macOS. Copy the prompt and paste it into {{ h.label }} instead.</p>{% endif %}
  {% if h.agent == 'claude' %}<p class="small" data-link-hint>Opens a terminal in your data folder with the request typed in. Nothing runs until you press Enter. Nothing opened? Run <code>claude</code> once in a terminal, then try again.</p>
  {% elif h.agent == 'cursor' %}<p class="small" data-link-hint>Open your data folder (<code>{{ h.folder_shown }}</code>) in Cursor first: the request goes to the Cursor window in front. Nothing runs until you press Enter.</p>
  {% elif h.how == 'command' %}<p class="small">Paste the command in a terminal and press Enter: {{ h.label }} starts in your data folder with the request.</p>
  {% else %}<p class="small">Paste the prompt into your AI agent, started in your data folder (<code>{{ h.folder_shown }}</code>). <a href="/settings#enrichment">Name your agent</a> to get a one-click button.</p>{% endif %}
  <details class="sent-as-box"><summary class="small">What your agent receives</summary><p class="sent-as" data-sent-as></p></details>
</div>
{% endmacro %}

{#- Under a filter problem: opens Ask · Adjust on the Adjust tab with `request`
    filled in (adjust.js). Hidden until adjust.js has wired it, so it never
    shows as a button that does nothing. -#}
{% macro fix_with_ai(request) -%}
<button type="button" class="fix-with-ai" data-fix="{{ request }}" hidden>Explain and fix with AI</button>
{%- endmacro %}

{#- The one-click upgrade button (upgrade.js follows it; without JavaScript it posts to
    /upgrade, a plain page). `up` is upgrade_banner(): kind 'available' or 'restart'. -#}
{% macro upgrade_form(up) -%}
<form method="post" action="{{ '/upgrade/restart' if up.kind == 'restart' else '/upgrade' }}" class="inline" data-upgrade>
  <input type="hidden" name="csrf_token" value="{{ upgrade_csrf() }}">
  <button type="submit" class="primary">{{ 'Restart now' if up.kind == 'restart' else 'Upgrade to v' ~ up.version }}</button>
</form>
{%- endmacro %}

{# A closed overflow for the rare actions of a card or row: a plain <details>, so it
   works without a script. Use as {% call more() %}<forms and buttons>{% endcall %}. #}
{% macro more(label='More') %}<details class="row-more"><summary>{{ label }}</summary><div class="draft-actions">{{ caller() }}</div></details>{% endmacro %}