{% if listCor %}
  {% for list in listCor %}
    <div class="paper top-padding-small bottom-margin-medium border-gray hidden-overflow text-word-wrap aside-filter cc-sm-bg cc-sm-bd" id="aside-filter-color" data-url="{{ getscor }}">
      <div class="full-width vertical-padding-small horizontal-padding-medium">
        <div class="flex between-xs middle-xs">
          <span class="visible-inline-block text-medium cc-sm-tt"><b>{{ list[0] }}</b></span>
          {% if clearcor %}
            <a href="{{ linkclearcor }}" class="text-small cc-sm-tt">
              <span>{{ text_clear }}</span>
            </a>
          {% endif %}
        </div>
      </div>
      <div class="top-margin-small horizontal-padding-medium">
        <label class="field field-medium">
          <i class="fas fa-times field-icon field-icon-right js-aside-filter-clean-search hidden" aria-hidden="true"></i>
          <input type="text" class="field-entry right-padding-x-large js-aside-filter-search cc-sm-bd" name="cores" placeholder="{{ text_placeholder_pesquisa }}">
        </label>
      </div>
      <div class="vertical-padding-small horizontal-padding-medium aside-filter-limit-content">
        {% for color in list[1] %}
          <label class="checkbox checkbox-small js-aside-filter-item">
            <div class="row x-small-space-xs middle-xs nowrap-xs">
              <div class="col-xs">
                <input class="checkbox-entry js-check-color" type="checkbox" name="chkcolor[{{ color.product_color_id }}]" value="{{ color.product_color_id }}" {{ (color.checked is defined and color.checked) ? 'checked' : '' }} >
                <span class="checkbox-text js-checkbox-text cc-sm-ck cc-sm-tx">{{ color.description }}</span>
              </div>
              {% if color.primary_color %}
                <div class="col-xs-width-auto">
                  {% if color.primary_color and color.secundary_color %}
                    <div class="squared-color" style="width:18px; height: 18px; background: linear-gradient(135deg, {{ color.primary_color }} 0%, {{ color.primary_color }} 50%, {{ color.secundary_color }} 50%, {{ color.secundary_color }} 100%); border: 2px solid #fff;box-shadow: 0 0 2px rgba(0,0,0,.5);"></div>
                  {% else %}
                    <div class="squared-color" style="width:18px; height: 18px; background: {{ color.primary_color }};border: 2px solid #fff;box-shadow: 0 0 2px rgba(0,0,0,.5);"></div>
                  {% endif %}
                </div>
              {% endif %}
            </div>
          </label>
        {% endfor %}
      </div>
      <div class="padding-small top-border-gray hidden aside-filter-apply-button js-aside-filter-apply-button cc-sm-bd">
        <button type="button" name="button" class="btn-default btn-medium btn-full cc-sm-bt">
          <span>{{ text_apply }}</span>
        </button>
      </div>
    </div>
  {% endfor %}
{% endif %}

{% if listSize %}
  {% for list in listSize %}
    <div class="top-padding-small bottom-margin-medium border-gray hidden-overflow text-word-wrap aside-filter cc-sm-bg cc-sm-bd" id="aside-filter-size" data-url="{{ getsize }}">
      <div class="full-width vertical-padding-small horizontal-padding-medium">
        <div class="flex between-xs middle-xs">
          <span class="visible-inline-block text-medium cc-sm-tt"><b>{{ list[0] }}</b></span>
          {% if clearsize %}
            <a href="{{ linkclearsize }}" class="text-small cc-sm-tt">
              <span>{{ text_clear }}</span>
            </a>
          {% endif %}
        </div>
      </div>
      <div class="top-margin-small horizontal-padding-medium">
        <label class="field field-medium">
          <i class="fas fa-times field-icon field-icon-right js-aside-filter-clean-search hidden" aria-hidden="true"></i>
          <input type="text" class="field-entry right-padding-x-large js-aside-filter-search cc-sm-bd" name="cores" placeholder="{{ text_placeholder_pesquisa }}">
        </label>
      </div>
      <div class="vertical-padding-small horizontal-padding-medium aside-filter-limit-content">
        {% for size in list[1] %}
          <label class="checkbox checkbox-small js-aside-filter-item">
            <input class="checkbox-entry js-check-size" type="checkbox" name="chksize[{{ size.product_size_id }}]" value="{{ size.product_size_id }}" {{ (size.checked is defined and size.checked) ? 'checked' : '' }} >
            <span class="checkbox-text js-checkbox-text cc-sm-ck cc-sm-tx">{{ size.description }}</span>
          </label>
        {% endfor %}
      </div>
      <div class="padding-small top-border-gray hidden aside-filter-apply-button js-aside-filter-apply-button cc-sm-bd">
        <button type="button" name="button" class="btn-default btn-medium btn-full cc-sm-bt">
          <span>{{ text_apply }}</span>
        </button>
      </div>
    </div>
  {% endfor %}
{% endif %}

{% if listSpecification %}
  {% for list in listSpecification %}
    <div class="top-padding-small bottom-margin-medium border-gray hidden-overflow text-word-wrap aside-filter cc-sm-bg cc-sm-bd" id="aside-filter-specification" data-url="{{ getspecification }}">
      <div class="full-width vertical-padding-small horizontal-padding-medium">
        <div class="flex between-xs middle-xs">
          <span class="visible-inline-block text-medium cc-sm-tt"><b>{{ list[0] }}</b></span>
          {% if clearspecifications %}
            <a href="{{ linkclearspecifications }}" class="text-small cc-sm-tt">
              <span>{{ text_clear }}</span>
            </a>
          {% endif %}
        </div>
      </div>
      <div class="top-margin-small horizontal-padding-medium">
        <label class="field field-medium">
          <i class="fas fa-times field-icon field-icon-right js-aside-filter-clean-search hidden" aria-hidden="true"></i>
          <input type="text" class="field-entry right-padding-x-large js-aside-filter-search cc-sm-bd" name="cores" placeholder="{{ text_placeholder_pesquisa }}">
        </label>
      </div>
      <div class="vertical-padding-small horizontal-padding-medium aside-filter-limit-content">
        {% for specification in list[1] %}
          <label class="checkbox checkbox-small js-aside-filter-item">
            <input class="checkbox-entry js-check-specification" type="checkbox" name="chkspecification[{{ specification.product_specification_id }}]" value="{{ specification.product_specification_id }}" {{ (specification.checked is defined and specification.checked) ? 'checked' : '' }} >
            <span class="checkbox-text js-checkbox-text cc-sm-ck cc-sm-tx">{{ specification.description }}</span>
          </label>
        {% endfor %}
      </div>
      <div class="padding-small top-border-gray hidden aside-filter-apply-button js-aside-filter-apply-button cc-sm-bd">
        <button type="button" name="button" class="btn-default btn-medium btn-full cc-sm-bt">
          <span>{{ text_apply }}</span>
        </button>
      </div>
    </div>
  {% endfor %}
{% endif %}
