@if($products->isNotEmpty())
    <div class="catalog-head-right">
        <div class="catalog-head-grid col-lg-none">
            <p>{{ShowLabelById(55)}}</p>
            <ul>
                <li class="grid-1">
                    <button type="button"
                            class="catalog-head-grid-btn change-grid @if(grid()->selected() == 'grid-1')active @endif"
                            data-id="grid-1">

                        <img src="{{icon('grid-1.svg')}}" alt="grid-1">
                        <img src="{{icon('grid-1-active.svg')}}" alt="grid-1">
                    </button>
                </li>
                <li class="grid-2">
                    <button type="button"
                            class="catalog-head-grid-btn change-grid @if(grid()->selected() == 'grid-2')active @endif" data-id="grid-2">
                        <img src="{{icon('grid-2.svg')}}" alt="grid-2">
                        <img src="{{icon('grid-2-active.svg')}}" alt="grid-2">
                    </button>
                </li>
            </ul>
        </div>
        <div class="catalog-head-grid d-none col-lg-flex">
            <p>{{ShowLabelById(56)}}</p>
            <ul>
                <li class="grid-4">
                    <button type="button"
                            class="catalog-head-grid-btn change-grid @if(grid()->selected() == 'grid-4')active @endif"
                            data-id="grid-4">
                        <img src="{{icon('grid-4.svg')}}" alt="grid-4">
                        <img src="{{icon('grid-4-active.svg')}}" alt="grid-4">
                    </button>
                </li>
                <li class="grid-3">
                    <button type="button"
                            class="catalog-head-grid-btn change-grid @if(grid()->selected() == 'grid-3')active @endif" data-id="grid-3">
                        <img src="{{icon('grid-3.svg')}}" alt="grid-3">
                        <img src="{{icon('grid-3-active.svg')}}" alt="grid-3">
                    </button>
                </li>
            </ul>
        </div>
        <div class="catalog-head-sort">
            <button type="button" class="catalog-head-sort-btn open-catalog-sort">
                <span>{{ShowLabelById(54)}}</span>
                <img src="{{icon('arrow-right.svg')}}" alt="arrow-right">
            </button>
            <button type="button" class="catalog-head-sort-selected @if(sorter()->selected())active @endif">
                @if(sorter()->selected())
                    <img src="{{icon(sorter()->selected('icon'))}}" alt="{{sorter()->selected('text')}}">
                    <span>{{sorter()->selected('text')}}</span>
                @endif
            </button>
            <div class="catalog-sort-list" id="sort_by">
                <button type="button" class="catalog-modal-close">
                    <span>{{ShowLabelById(54)}}</span>
                </button>
                <ul>
                    @foreach(sorter()->data() as $sortData)
                        @if($sortData['value'] == sorter()->currentValue())
                            @continue
                        @endif
                        <li>
                            <button type="button" data-value="{{$sortData['value']}}" class="catalog-sort-status">
                                <img src="{{icon($sortData['icon'])}}" alt="{{$sortData['text']}}">
                                <span>{{$sortData['text']}}</span>
                            </button>
                        </li>
                    @endforeach

                </ul>
            </div>
        </div>
    </div>
@endif