{{ header }}
<header class="background-white bottom-margin-large">
  <div class="container-fluid">
    <div class="row no-space-xs">
      <div class="col-xs-12">
        <div class="content-box vertical-padding-large flex between-xs middle-xs js-header-notifications">
          <div>
            <span class="text-x-large text-dark">{{ heading_title }}</span>
            <div class="adm-breadcrumb">
              {% for breadcrumb in breadcrumbs %}
                <i class="fas fa-angle-right text-x-small text-gray horizontal-padding-small"></i>
                <a class="text-x-small text-gray text-decoration-none" href="{{ breadcrumb.href }}">{{ breadcrumb.text }}</a>
              {% endfor %}
            </div>
          </div>
          <div>
            <button type="button" class="btn-default btn-medium-square btn-success top-margin-medium js-search-order-download-selected pull-right">
              <span>{{ button_filter_selected }}</span>
            </button>
          </div>
          {% if error_warning %}
            <div class="text-warning">{{ error_warning }}</div>
          {% endif %}
        </div>
      </div>
    </div>
  </div>
</header>
<div class="container-fluid">
  <div class="row small-space-xs bottom-xs bottom-margin-large">
    <div class="col-md-2 col-xs-6">
      <label class="field field-medium">
        <span class="field-label">{{ column_date_start }}</span>
        <input type="text" class="field-entry" name="filter_date_start" value="{{ filter_date_start }}" id="date-start" size="12" readonly />
      </label>
    </div>
    <div class="col-md-2 col-xs-6">
      <label class="field field-medium">
        <span class="field-label">{{ column_date_end }}</span>
        <input type="text" class="field-entry" name="filter_date_end" value="{{ filter_date_end }}" id="date-end" size="12" readonly />
      </label>
    </div>
    <div class="col-md-3 col-xs-12">
      <label class="field field-medium">
        <span class="field-label">{{ column_status }}</span>
        <select class="field-entry" name="filter_status" value="{{ filter_status }}" id="status">
          {% for key, status in shopee_status %}
            <option value="{{ key }}">{{ status }}</option>
          {% endfor %}
        </select>
      </label>
    </div>
    <div class="col-md col-xs-12">
      <label class="field field-medium">
        <span class="field-label">{{ column_name_apelido }}</span>
        <input type="text" name="filter_id" class="field-entry" value="{{ filter_id }}"/>
      </label>
    </div>
    <div class="col-xs-width-auto">
      <button type="button" class="btn-default btn-medium btn-primary js-search-order-filter">
        <span>{{ button_filter }}</span>
      </button>
    </div>
  </div>

  <label class="checkbox checkbox-medium left-padding-medium right-margin-medium hidden js-select-all-container">
    <input class="checkbox-entry js-selected-all" type="checkbox"/>
    <span class="checkbox-text">Selecionar Todos</span>
  </label>

  <div class="search-orders" id="order-list" data-nextOffset="0"></div>

  <button type="button" class="btn-default btn-small full-width btn-primary hidden load-more top-margin-medium">
    <span>Mostrar mais</span>
  </button>
</div>
{{ footer }}
