{{ header }}
{% if wg24_seo_fer_facebook_status =='enable' and wg24_seo_fer_facebook_pixel !='' %}
<script>window.waitEvent('scripts_document', function() { fbq('track', 'Search'); });</script>
{% endif %}

<section class="container-fluid" id="data-selected-url" data-aviseme="{{status_aviseme}}" data-selected-url="{{ url }}" data-pagination='{{ (paginationajax) ? pagination : "" }}'>
  {{ breadcrumbs }}
  <div class="row">
    {{ column_refinar }}
    {% if config.exist_content_left %}
      <aside class="col-xs-3 hidden-md-down">
        <div class="content-box js-aside-filter-container">
          {{ column_left }}
        </div>
      </aside>
    {% endif %}
    <div class="col-xs">
      <div class="content-box">
            {{ content_top }}
            <div id="content-search" class="row">
              <div class="col-xs-12 col-md-6">
                <label class="field field-medium">
                  <div class="field-entry-group">
                    <div class="flex-grow-1">
                      {% if search %}
                      <input type="text"
                        class="field-entry{% if error_criterio is defined %} field-entry-error {% endif %}" name="search"
                        value="{{ search }}" {% if error_criterio is defined %} placeholder="{{ error_criterio }}" {% endif %} />
                      {% else %}
                      <input type="text"
                        class="field-entry{% if error_criterio is defined %} field-entry-error {% endif %}" name="search"
                        onClick="javascript: $(this).val('')" {% if error_criterio is defined %} placeholder="{{ error_criterio }}"
                        {% endif %} />
                      {% endif %}
                    </div>
                    <div class="flex-grow-1">
                      <select name="category_id" class="field-entry">
                        <option value="0">{{ text_category }}</option>
                        {% for category_1 in categories %}
                        <option value="{{ category_1.category_id }}" {% if category_1.category_id == category_id %}selected{% endif %}>
                          {{ category_1.name }}
                        </option>
                        {% for category_2 in category_1.children %}
                        <option value="{{ category_2.category_id }}" {% if category_2.category_id == category_id %}selected{% endif %}>
                          &nbsp;&nbsp;&nbsp;{{ category_2.name }}
                        </option>
                        {% endfor %}
                        {% endfor %}
                      </select>
                    </div>
                    <div>
                      <button type="button" class="btn-default btn-full btn-medium btn-search" id="button-search">
                        <span>{{ button_search }}</span>
                      </button>
                    </div>
                  </div>

                </label>
              </div>
              {% if defaultList %}
                <div class="col-xs-12 col-md-6">
                  <div class="flex nowrap-xs end-md">
                    <label class="field field-medium right-margin-small" style="width:180px;">
                      <select class="field-entry" onchange="location = this.value;">
                        {% for sorts in sorts %}
                        <option value="{{ sorts.href }}" {% if sorts.value == sort ~ '-' ~ order %}selected{% endif %}>{{ sorts.text }}
                        </option>
                        {% endfor %}
                      </select>
                    </label>
                    <button id="change-view" class="btn-default btn-outline btn-medium-square" title="Visualizar em lista">
                      <i class="fas fa-list-ul"></i>
                    </button>
                  </div>
                </div>
              {% endif %}
            </div>

            {% if defaultList %}

              <div class="products-view {{ gridOrList }}">
                {{ defaultList }}
              </div>

              <div class="bottom toolbar">
                {% if paginationajax == false %}
                  <div class="top-border-gray top-padding-medium top-margin-medium">
                    {{ pagination }}
                  </div>
                {% else %}
                  <div class="flex center-xs">
                    <button type="button" class="btn-default btn-medium btn-outline margin-large js-more-products" disabled>
                      <span>Visualizar mais</span>
                    </button>
                  </div>
                {% endif %}
              </div>
            {% else %}
              <div class="row">
                <div class="col-xs-12">
                  <div class="content-box border-gray text-center padding-x-large">
                    <i class="far fa-meh bigger-text-medium vertical-middle bottom-margin-x-small" aria-hidden="true"></i>
                    <span class="text-x-large vertical-middle left-margin-small">{{ text_empty }}</span>
                  </div>
                </div>
              </div>
            {% endif %}  </div>
    {% if content_bottom %}
      <div class="col-xs-12">
        {{ content_bottom }}
      </div>
    {% endif %}
  </div>
</section>

{{ footer }}
