{% extends base %}
{% block navbar_kiosk %}
  {% if kiosk_mode %}
    <div class="border-2 border-primary rounded-box px-3 py-1 bg-base-100 text-base-content flex gap-0.5 items-center">
      <span class="text-sm font-medium ml-1">
        <span class="opacity-60">Filter:</span>
        {{ kiosk_filter_display|default:"Unset" }}
      </span>
      <span class="text-sm font-medium ml-1">
        <span class="opacity-60">After filtering:</span>
        <span id="kiosk-filtered-count">{{ refresh_info.filtered_count }}</span>
      </span>
      <span class="text-sm font-medium ml-1">
        <span class="opacity-60">Last refreshed:</span>
        <span id="kiosk-last-refreshed">{{ refresh_info.last_refreshed|date:preferences.argus_htmx.datetime_format|default:"?" }}</span>
      </span>
      <a href="{% url 'htmx:incident-list' %}"
         onclick="this.href='{% url 'htmx:incident-list' %}' + window.location.search"
         class="btn btn-sm btn-ghost">
        <i class="fa-solid fa-xmark fa-xs" aria-hidden="true"></i>
        <span class="link">Exit kiosk</span>
      </a>
    </div>
  {% endif %}
{% endblock navbar_kiosk %}
{% block main %}
  {% if incidents_extra_widget %}
    <div class="flex">
      <div class="w-2/3">{% include "htmx/incident/_incident_list_menubar.html" %}</div>
      <div class="w-1/3 ml-2">{% include incidents_extra_widget %}</div>
    </div>
  {% else %}
    {% include "htmx/incident/_incident_list_menubar.html" %}
  {% endif %}
  <section id="incident-list" class="loading-box overflow-x-auto relative">
    {% block table %}
      {% include "htmx/incident/_incident_table.html" %}
    {% endblock table %}
    <div class="htmx-indicator loading loading-spinner loading-lg text-primary absolute top-1/2 left-1/2"></div>
  </section>
{% endblock main %}