update

themes/classic/assets/css/custom.scss

@@ -3092,6 +3092,18 @@ body#authentication {
       }
     }
   }
+
+  .elementor-field-label {
+    display: flex;
+    gap: 10px;
+    margin-top: 10px;
+
+    .elementor-checkbox-label {
+      font-size: 12px;
+      font-weight: 500;
+      font-family: $fInter;
+    }
+  }
 }
 
 
@@ -3153,6 +3165,7 @@ body#authentication {
       font-family: "Inter", sans-serif;
       font-size: 14px;
       font-weight: 400;
+      white-space: nowrap;
 
       &:hover {
         color: #E79332;
@@ -3181,4 +3194,147 @@ body#authentication {
   img {
     height: 30px;
   }
+}
+
+#popular-products,
+#new-products {
+  h2 {
+    font-family: 'Inter';
+    color: #462D26;
+    font-size: 36px;
+    font-weight: 500;
+  }
+}
+
+#products {
+  .sort-by-row {
+    display: flex;
+    justify-content: flex-end;
+    gap: 20px;
+    align-items: center;
+
+    .products-sort-order {
+      .dropdown-menu {
+        background: #FFF;
+        width: 100%;
+
+        a {
+          white-space: nowrap;
+          font-size: 14px;
+          font-family: 'Inter';
+          font-weight: 400;
+
+          &:hover {
+            background: #FFF;
+            font-weight: 700;
+            color: #462D26;
+          }
+        }
+      }
+
+      button {
+        background: none;
+        border: 0;
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        color: #462D26;
+        font-family: 'Inter';
+        font-size: 16px;
+        font-weight: 700;
+        width: 350px;
+      }
+    }
+  }
+}
+
+#search_filters {
+  background: none;
+  border-top: 1px solid #110E0C1A;
+  border-bottom: 1px solid #110E0C1A;
+  border-radius: 0 !important;
+
+  .head {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+
+    .h6 {
+      font-size: 16px;
+      font-weight: 700;
+      font-family: 'Inter';
+      text-transform: uppercase;
+      color: #462D26;
+      cursor: pointer;
+      margin-bottom: 0;
+    }
+
+    .js-search-filters-clear-all {
+      background: #462D26;
+      color: #FFF;
+    }
+  }
+
+  &.active {
+    background: #FFF;
+    border: 0;
+    border-radius: 10px !important;
+
+    .content {
+      display: grid;
+    }
+  }
+
+  .content {
+    display: grid;
+    grid-template-columns: 1fr 1fr 1fr 1fr;
+    gap: 20px;
+    background: #FFF;
+    padding: 25px;
+    display: none;
+
+    .h6 {
+      font-weight: 700;
+      font-size: 16px;
+      font-family: 'Inter';
+      margin-bottom: 25px;
+    }
+
+    .custom-checkbox {
+      top: 0;
+      position: static;
+    }
+
+    .facet-label {
+      display: flex;
+      gap: 10px;
+      align-items: center;
+      margin-bottom: 10px;
+
+      a {
+        margin-top: 0;
+      }
+    }
+  }
+}
+
+#js-product-list-top {
+  padding: 0 20px;
+}
+
+.active_filters {
+  background: #FFF;
+  border-radius: 10px;
+  color: #462D26;
+
+  .filter-block {
+    background: #462D26;
+    color: #FFF;
+    padding: 3px 10px;
+
+    i {
+      text-shadow: none;
+      color: #FFF !important;
+    }
+  }
 }

themes/classic/assets/img/chevron-up.svg

@@ -0,0 +1,4 @@
+<svg width="11" height="6" viewBox="0 0 11 6" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M1 5.19336C2.46159 5.11643 5.38478 4.13178 5.38478 0.80858" stroke="#462D26" stroke-width="1.3"/>
+<path d="M10 5.19336C8.53841 5.11643 5.61522 4.13178 5.61522 0.808579" stroke="#462D26" stroke-width="1.3"/>
+</svg>

themes/classic/assets/js/custom.js

@@ -99,7 +99,7 @@ jQuery(document).ready(function ($) {
         $(".accordion-item-header").click(function(){
             $(".accordion-item-body").slideUp();
             $(".accordion-item").removeClass("active");
-            
+
             if ($(this).next(".accordion-item-body").is(":hidden")) {
                 $(this).next(".accordion-item-body").slideDown();
                 $(this).parent().addClass("active");
@@ -111,6 +111,30 @@ jQuery(document).ready(function ($) {
             "top",
             $("#header-panel-box").height() + 64
         )
-        
+
     }
-})
+})
+
+document.addEventListener("click", (event) => {
+  const toggleButton = event.target.closest(".search-toggle");
+
+  if (toggleButton) {
+      const filtersContainer = document.querySelector("#search_filters");
+      const filtersContent = filtersContainer?.querySelector(".content");
+
+      if (filtersContainer && filtersContent) {
+          // Pokaż/ukryj zawartość
+          const isContentVisible = filtersContent.style.display === "grid";
+          filtersContent.style.display = isContentVisible ? "none" : "grid";
+
+          // Obróć obrazek w przycisku
+          const img = toggleButton.querySelector("img");
+          if (img && img.src.includes("chevron-up.svg")) {
+              img.style.transform = isContentVisible ? "rotate(0deg)" : "rotate(180deg)";
+          }
+
+          // Dodaj/usuń klasę active na kontenerze
+          filtersContainer.classList.toggle("active", !isContentVisible);
+      }
+  }
+});

themes/classic/templates/catalog/_partials/sort-orders.tpl

@@ -23,8 +23,8 @@
  * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
  *}
 
-<span class="col-sm-3 col-md-3 hidden-sm-down sort-by">{l s='Sort by:' d='Shop.Theme.Global'}</span>
-<div class="{if !empty($listing.rendered_facets)}col-sm-9 col-xs-8{else}col-sm-12 col-xs-12{/if} col-md-9 products-sort-order dropdown">
+<span class="hidden-sm-down sort-by">{l s='Sort by:' d='Shop.Theme.Global'}</span>
+<div class="products-sort-order dropdown">
   <button
     class="btn-unstyle select-title"
     rel="nofollow"

themes/classic/templates/catalog/_partials/subcategories.tpl

@@ -31,8 +31,8 @@
         {foreach from=$subcategories item=subcategory}
           <li>
             <a class="subcategory-item" href="{$link->getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'html':'UTF-8'}">
-            
-              {if !empty($subcategory.image.large.url)}  
+
+              {if !empty($subcategory.image.large.url)}
                 <div class="subcategory-image">
                   <img class="replace-2x" src="{$subcategory.image.large.url}" alt="{$subcategory.name|escape:'html':'UTF-8'}" loading="lazy" width="141" height="180"/>
                 </div>