{% load static i18n humanize %}
<tr id="task-{{ task.pk }}"
    class="hover-actions-trigger btn-reveal-trigger position-static {% if task.completed %}completed-task{% endif %}">
    <td class="fs-9 align-middle px-0 py-3">
        <div class="form-check mb-0 fs-8">
            <input class="form-check-input"
                   {% if task.completed %}checked{% endif %}
                   type="checkbox"
                   hx-post="{% url 'update_schedule' request.dealer.slug task.pk %}"
                   hx-trigger="change"
                   hx-swap="outerHTML"
                   hx-target="#task-{{ task.pk }}" />
        </div>
    </td>
    <td class="subject order align-middle white-space-nowrap py-2 ps-0">
        <a class="fw-semibold text-primary" href="">{{ task.purpose|capfirst }}</a>
        <div class="fs-10 d-block">{{ task.scheduled_type|capfirst }}</div>
    </td>
    <td class="sent align-middle white-space-nowrap text-start fw-thin text-body-tertiary py-2">{{ task.notes }}</td>
    <td class="date align-middle white-space-nowrap text-body py-2">{{ task.scheduled_at|naturaltime }}</td>
    <td class="date align-middle white-space-nowrap text-body py-2">
        {% if task.completed %}
            <span class="badge badge-phoenix fs-10 badge-phoenix-success"><i class="fa-solid fa-check"></i></span>
        {% else %}
            <span class="badge badge-phoenix fs-10 badge-phoenix-warning"><i class="fa-solid fa-xmark"></i></span>
        {% endif %}
    </td>
</tr>