{% load i18n static %}
{% if cl.search_fields %}
    <div id="toolbar" class="flex items-center">
        <form id="changelist-search" method="get" class="max-w-md">
            <div class="flex items-center">
                <label for="searchbar">

                </label>
                <input type="text" name="{{ search_var }}" value="{{ cl.query }}" id="searchbar" autofocus>
                <input type="submit" class="mx-2 search-button text-white bg-primary-600 hover:bg-primary-700 focus:ring-primary-500" value="{% translate 'Search' %}">
                {% if show_result_count %}
                    <span class="small quiet">{% blocktranslate count counter=cl.result_count %}{{ counter }} result
                        {% plural %}{{ counter }} results{% endblocktranslate %} (<a href="?
                            {% if cl.is_popup %}{{ is_popup_var }}=1{% endif %}">{% if cl.show_full_result_count %}
                        {% blocktranslate with full_result_count=cl.full_result_count %}{{ full_result_count }} total
                        {% endblocktranslate %}{% else %}{% translate "Show all" %}{% endif %}</a>)</span>
                {% endif %}
                {% for pair in cl.params.items %}
                    {% if pair.0 != search_var %}<input type="hidden" name="{{ pair.0 }}" value="{{ pair.1 }}">
                    {% endif %}
                {% endfor %}
            </div>
            {% if cl.search_help_text %}
                <div class="mt-2 text-sm text-gray-500">{{ cl.search_help_text }}</div>
            {% endif %}
        </form>
    </div>
{% endif %}
