{**
 * 2007-2019 PrestaShop and Contributors
 *
 * NOTICE OF LICENSE
 *
 * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
 * that is bundled with this package in the file LICENSE.txt.
 * It is also available through the world-wide-web at this URL:
 * https://opensource.org/licenses/AFL-3.0
 * If you did not receive a copy of the license and are unable to
 * obtain it through the world-wide-web, please send an email
 * to license@prestashop.com so we can send you a copy immediately.
 *
 * DISCLAIMER
 *
 * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
 * versions in the future. If you wish to customize PrestaShop for your
 * needs please refer to https://www.prestashop.com for more information.
 *
 * @author    PrestaShop SA <contact@prestashop.com>
 * @copyright 2007-2019 PrestaShop SA and Contributors
 * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
 * International Registered Trademark & Property of PrestaShop SA
 *}
{if $facets|count}
  <div id="products_top_sidebar" class="sidebar lg:left-0 p-2 overflow-y-auto text-center bg-white h-screen w-56">
    <div id="search_filters">
      <div id="search_filter_buttons" class="flex">
        {block name='facets_clearall_button'}
          {if $activeFilters|count}
          <button id="_desktop_search_filters_clear_all"  data-search-url="{$clear_all_link}"  class="flex w-6 h-6 flex items-center justify-center select-none js-search-filters-clear-all">
            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-filter-off hover:stroke-2 cursor-pointer" width="16" height="16" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round">
              <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
              <path d="M8 4h12v2.172a2 2 0 0 1 -.586 1.414l-3.914 3.914m-.5 3.5v4l-6 2v-8.5l-4.48 -4.928a2 2 0 0 1 -.52 -1.345v-2.227"></path>
              <path d="M3 3l18 18"></path>
            </svg>
          </button>
          {else}
          <button id="_desktop_search_filters" class="flex w-6 h-6 items-center justify-center select-none">
            <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-filter hover:stroke-2 cursor-pointer" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke-linecap="round" stroke-linejoin="round">
              <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
              <path d="M4 4h16v2.172a2 2 0 0 1 -.586 1.414l-4.414 4.414v7l-6 2v-8.5l-4.48 -4.928a2 2 0 0 1 -.52 -1.345v-2.227z"></path>
            </svg>
          </button>
          {/if}
        {/block}
      </div>

    <div class="flex gap-4 flex-1 flex-col">
      {foreach from=$facets item="facet"}
        {if !$facet.displayed}
          {continue}
        {/if}
        {if $facet.widgetType === 'dropdown'}
          <div class="dropdown relative flex-1 max-w-[140px] group">
            <button class="dropdown-toggle relative px-4 pr-6 leading-1 w-full text-left">
              {$active_found = false}
              {foreach from=$facet.filters item="filter"}
                {if $filter.active}
                  {$filter.label}
                  {$active_found = true}
                {/if}
              {/foreach}
              {if !$active_found}
                {$facet.label}
              {/if}
              <svg xmlns="http://www.w3.org/2000/svg" class="icon icon-tabler icon-tabler-chevron-down absolute right-0 top-1" width="16" height="16" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round">
                <path stroke="none" d="M0 0h24v24H0z" fill="none"></path>
                <path d="M6 9l6 6l6 -6"></path>
              </svg>
            </button>
            <div class="dropdown-menu hidden group-hover:flex flex-col position absolute left-0 top-full w-full bg-white z-10">
              {foreach from=$facet.filters item="filter"}
                {if !$filter.active}
                  <a
                    rel="nofollow"
                    href="{$filter.nextEncodedFacetsURL}"
                    class="select-list px-4 py-1"
                  >
                    {$filter.label}
                  </a>
                {/if}
              {/foreach}
            </div>
          </div>
        {/if}
      {/foreach}
    </div>

    </div>
  </div>
{/if}