/* 


new-products-shop.css only appears on the shop page, product cateogry or in the single product

1. Shop page
2. Shop filter 
3. Price filter
4. Reset filter button
5. if product not found page - empty 
6. Reset filter button moved at the bottom
7. mobile filter popup
8. mobile responsive 
9. Sort by filter
10. Popup for the custom sorting 
11. Category page heading

*/

/* 


1. Shop page



*/

.woocommerce .woocommerce-result-count {
  margin-left: 10px;
}

#new-products-shop {
  padding-top: 10px;
}

#new-products-shop .woocommerce-breadcrumb-custom {
  color: var(--Juoda, #000);
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
}

#new-products-shop .woocommerce-breadcrumb-custom a {
  color: var(--Juoda, #000);
  text-decoration: none;
}

#new-products-shop .woocommerce-breadcrumb-custom .arrow {
  color: #ffcb00;
  margin-left: 7px;
  margin-right: 7px;
}

#new-products-shop h1 {
  color: var(--Juoda, #000);
  text-align: center;
  font-size: 48px;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
  text-transform: uppercase;
  margin-top: 64px;
  margin-bottom: 48px;
}

#new-products-shop .woocommerce-result-count {
  color: var(--Juoda, #000);
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
  margin-top: 10px;
}

#new-products-shop {
  background: #f7f7f7;
}

#new-products-shop .heading {
  margin-bottom: 64px;
}

#new-products-shop .custom-product-card {
  margin: 10px !important;
}

#new-products-shop .product {
  background-color: white;
  margin: 0px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: stretch;
  min-height: 490px !important;
}

#new-products-shop .slick-track {
  display: flex !important;
}

#new-products-shop .slick-slide {
  display: flex !important;
  height: auto !important;
}

#new-products-shop .product-footer {
  margin-top: auto;
  padding-top: 16px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#new-products-shop .product a {
  text-decoration: none;
}

#new-products-shop .product h3 {
  color: var(--Juoda, #000);
  font-family: Poppins;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  /* 142.857% */
  text-transform: none;
  text-align: left;
  margin: 0px;
  padding-left: 16px;
  padding-right: 16px;
}

#new-products-shop .slick-prev,
#new-products-shop .slick-next {
  color: #fff;
  border: none;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 1;
  width: 48px;
  height: 48px;
  background-size: contain;
  background-repeat: no-repeat;
}

#new-products-shop .slick-prev.slick-disabled,
#new-products-shop .slick-next.slick-disabled {
  display: none !important;
}

#new-products-shop .slick-prev {
  left: -15px;
}

#new-products-shop .slick-prev::before {
  content: "";
}

#new-products-shop .slick-next {
  right: -15px;
}

#new-products-shop .slick-next::before {
  content: "";
}

#new-products-shop .product {
  position: relative;
  text-align: center;
  min-height: 469px;
  display: flex;
  flex-direction: column;
  border-radius: 6px;
}

#new-products-shop .product img {
  width: 100%;
  aspect-ratio: 1 / 1;
  object-fit: cover;
  margin: 0 auto;
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
}

#new-products-shop .product .banner {
  position: absolute;
  top: 10px;
  right: 10px;
  background: var(--Orange, #ff7a06);
  color: var(--Balta, #fff);
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
  font-size: 12px;
  z-index: 1;
  padding: 8px 12px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  border-radius: 25px;
}

#new-products-shop .product .status {
  display: flex;
  align-items: center;
  font-size: 12px;
  color: var(--Juoda);
  margin-top: 24px;
  font-weight: 400;
  line-height: 16px;
  padding-left: 16px;
  padding-right: 16px;
}

#new-products-shop .product .status .circle {
  width: 9px;
  height: 9px;
  background-color: #06ff4c;
  border-radius: 50%;
  display: inline-block;
  margin-right: 8px;
}

/* Green when in stock */
.in-stock {
  background-color: #06ff4c;
}

/* Red when out of stock */
.out-of-stock {
  background-color: #ff0000 !important;
}

#new-products-shop .product .product-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-top: auto;
  padding-left: 16px;
  padding-right: 16px;
  margin-bottom: 24px;
  margin-top: auto;
}

#new-products-shop .product .price {
  font-size: 16px;
  font-weight: bold;
  color: #333;
  text-align: left;
}

#new-products-shop .product .shopping-bag a{
  width: 40px;
  height: 40px;
  font-size: 20px;
  color: #333;
  display: flex;
  justify-content: center;
  align-items: center;
  background: var(--Yellow);
  transition: background-color 0.3s ease;
  border-radius: 50%;
}
#new-products-shop .product .shopping-bag:hover a{
  background: #ffe066;
}

#new-products-shop .product .shopping-bag img {
  aspect-ratio: unset;
  object-fit: unset;
  width: unset;
}

@media screen and (max-width: 768px) {
  #new-products-shop {
    background: #f7f7f7;
    padding: 10px 0px 96px 0px;
  }

  #new-products-shop h1 {
    text-align: center;
    font-size: 30px;
    font-style: normal;
    font-weight: 700;
    line-height: 36px; /* 120% */
    text-transform: uppercase;
    margin-top: 32px;
    margin-bottom: 40px;
  }
}

/* 




2. Shop filter 




*/

/* Hide checkboxes */

#new-products-shop .wpc-filter-product_cat input[type="checkbox"] {

}

#new-products-shop .wpc-filter-collapsible .wpc-filter-title .wpc-open-icon {
  border-left: 1px solid #000000;
  border-top: 1px solid #000000;
}

/* Hide the number of products in each category */
#new-products-shop .wpc-term-count {
  display: none !important;
}

#new-products-shop .wpc-term-item-content-wrapper {
  display: flex;
  align-items: center;
  gap: 10px;
  padding-right: 1rem;
}

#new-products-shop .widget_wpc_filters_widget {
  border-radius: 6px;
  background: #fff;
  padding: 24px 24px 104px 24px;
}

#new-products-shop .widget_wpc_filters_widget:has(.wpc-filter-chips-list.wpc-empty-chips-container) {
  padding-bottom: 40px;
}

#new-products-shop .widget_wpc_filters_widget h3 {
  color: var(--Juoda, #000);
  font-size: 20px;
  font-style: normal;
  font-weight: 600;
  line-height: 28px;
  text-transform: capitalize;
  margin-bottom: 24px;
}

#new-products-shop .wpc-posts-found {
  display: none;
}

#new-products-shop .wpc-toggle-children-list {
  cursor: pointer;
}

#new-products-shop .wpc-checkbox-item .children {
  padding: 0;
  margin-left: 1.5rem;
}

#new-products-shop .wpc-toggle-children-list:after {
  bottom: calc(50% - 2px);
}
#new-products-shop .wpc-toggle-children-list:before, #new-products-shop .wpc-toggle-children-list:after {
  height: 2px;
}

#new-products-shop .wpc-toggle-children-list:hover:before, #new-products-shop .wpc-toggle-children-list:hover:after {
  background: #ffcb00;
}

#new-products-shop .wpc-filter-link {
  text-decoration: none;
  color: var(--Juoda, #000);
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  opacity: 1;
}

#new-products-shop body .wpc-filters-main-wrap li.wpc-term-item {
  opacity: 1;
  color: #000;
}

#new-products-shop .wpc-filter-collapsible.wpc-closed .wpc-filter-selected-values {
  display: none;
}

#new-products-shop .wpc-wrap-icons .wpc-filter-selected-values {
  display: none;
}

#new-products-shop .wpc-wrap-icons .wpc-help-tip {
  display: none;
}

#new-products-shop .wpc-term-count-0:not(.wpc-has-not-empty-children) {
  display: none;
}

#new-products-shop .wpc-filters-section:nth-child(2) {
  padding-top: 24px;
  border-top: 1px solid #bebebe;
}

#new-products-shop .wpc-filters-section {
  padding-bottom: 24px;
  border-bottom: 1px solid #bebebe;
}

#new-products-shop .wpc-filter-link:hover {
  color: var(--Yellow, #ffcb00);
  text-decoration-line: underline;
}

#new-products-shop .wpc-filters-main-wrap li.wpc-term-item label {
  position: relative !important;
  display: inline-flex !important;
}

.wc-block-product-filter-checkbox-list__item.has-depth-1 {
  padding-left: 1rem;
}

#new-products-shop i.wpc-toggle-children-list {
  margin-left:  auto;
  position: relative !important;
  display: inline-flex !important;
  width: 100%;
  padding-left: 38px;
  color: var(--Juoda, #000);
}

#new-products-shop i.wpc-toggle-children-list:hover {
  color: var(--Yellow, #ffcb00);
  text-decoration-line: underline;
}

#new-products-shop i.wpc-toggle-children-list::before {
  width: 16px;
}

#new-products-shop i.wpc-toggle-children-list::after {
  width: 16px;
}

#new-products-shop .wpc-filters-widget-containers-wrapper {
  display: flex;
  flex-flow: column;
}

#new-products-shop i.wpc-toggle-children-list::before,
#new-products-shop i.wpc-toggle-children-list::after {
  left: 2px;
  right: unset;
}

#new-products-shop .wpc-toggle-children-label {
  text-decoration: none;
  font-size: 14px;
  font-style: normal;
  font-weight: 400;
  line-height: 20px;
  opacity: 1;
}

#new-products-shop .widget_wpc_filters_widget .wpc-widget-top-inside .wpc-inner-widget-chips-wrapper {
  overflow: hidden;
}

#new-products-shop .widget_wpc_filters_widget .wpc-filter-chip {
  margin: 0;
}

#new-products-shop .widget_wpc_filters_widget .wpc-filter-chip:not(.wpc-chip-reset-all) a{
  border: 1px solid var(--Platinum, #e0e0e0);
  color: var(--Juoda, #000000);
  padding: 6px 8px;
  border-radius: 6px;
}

#new-products-shop .widget_wpc_filters_widget .wpc-filter-chip a {
  font-size: 14px;
  line-height: 20px;
  font-weight: 600;
}

#new-products-shop .widget_wpc_filters_widget .wpc-filter-chips-list {
  display: flex;
  flex-flow: row wrap;
  gap: 8px;
}

#new-products-shop .widget_wpc_filters_widget .wpc-filter-chip.wpc-chip-reset-all {
  position: absolute;
  bottom: -16px;
  transform: translateY(100%);
  width: 100%;
}

#new-products-shop .widget_wpc_filters_widget .wpc-filter-chip.wpc-chip-reset-all a {
  background: #FFF0E3;
  padding: 14px;
  text-align: center;
  width: 100%;
  border: 0;
  border-radius: 6px;
}

#new-products-shop .widget_wpc_filters_widget .wpc-filter-chip.wpc-chip-reset-all a:hover {
  background: #E0E0E0;
}

#new-products-shop .widget_wpc_filters_widget .wpc-filter-chip.wpc-chip-reset-all a .wpc-chip-content{
  justify-content: center;
  align-items: center;
  gap: 8px;
}

#new-products-shop .widget_wpc_filters_widget .wpc-filter-chip.wpc-chip-reset-all a .wpc-chip-remove-icon{
  display: block;
}

#new-products-shop .wpc-filter-title {
  color: var(--Juoda, #000);
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px;
}

#new-products-shop
  .wpc-filters-main-wrap
  li.wpc-term-item
  input[type="checkbox"] {
  border: 2px solid black;
}

#new-products-shop
  .wpc-filters-main-wrap
  li.wpc-term-item
  input[type="checkbox"]:checked {
  border: 1px solid #ffcb00;
}

#new-products-shop .wpc-filters-main-wrap input[type="checkbox"]:checked {
  border: 1px solid #ffcb00;
  border-color: #ffcb00;
  background: #ffcb00;
}

#new-products-shop .wpc-filters-main-wrap input[type="checkbox"]::after {
  border-color: white !important;
}

.wc-block-product-categories-list-item a {
  color: black;
  text-decoration: none;
}

.wc-block-product-categories-list-item .category-toggle {
  margin-right: 12px;
}

.wc-block-product-categories-list-item__name {
  color: black;
  text-decoration: none;
}

#new-products-shop .wpc-filters-widget-top-container{
  order: -1;
}

#new-products-shop .wpc-filter-set-widget-title {
  order: -2;
}

/*


3. Price filter



*/

#new-products-shop .wpc-filters-range-column {
  position: relative;
}

#new-products-shop .wpc-filters-range-column input {
  padding-right: 35px !important;
  text-align: left;
  border-radius: 6px;
  border: 1px solid var(--Platinum, #e0e0e0);
  display: flex;
  height: 48px;
  padding: 0px 12px;
  justify-content: space-between;
  align-items: center;
  flex: 1 0 0;
  color: var(--Juoda, #000);
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
}

/* Add "EUR" as a pseudo-element after the input value */
#new-products-shop .wpc-filters-range-column::after {
  content: "EUR";
  position: absolute;
  right: 10px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--Juoda, #000);
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px; /* 142.857% */
  pointer-events: none;
}

/* Remove arrows in Chrome, Safari, Edge, Opera */
#new-products-shop .wpc-filters-range-column input::-webkit-outer-spin-button,
#new-products-shop .wpc-filters-range-column input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Remove arrows in Firefox */
#new-products-shop .wpc-filters-range-column input[type="number"] {
  -moz-appearance: textfield;
}

/* Remove number input arrows in Chrome, Safari, Edge, Opera */
#new-products-shop
  .wpc-filters-range-column
  input[type="number"]::-webkit-outer-spin-button,
#new-products-shop
  .wpc-filters-range-column
  input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
  margin: 0;
}

/* Remove number input arrows in Firefox */
#new-products-shop .wpc-filters-range-column input[type="number"] {
  -moz-appearance: textfield !important;
}

/* Additional fix to ensure styles apply */
#new-products-shop .wpc-filters-range-column input[type="number"] {
  appearance: textfield !important;
}

#new-products-shop .wpc-wrap-icons {
  flex-wrap: inherit;
}

/* Change the order so the slider appears first */
#new-products-shop .wpc-filters-range-inputs .wpc-filter-range-form {
  display: flex;
  flex-direction: column;
}

#new-products-shop .wpc-filters-range-wrapper {
  order: 2; /* Moves the number inputs below */
}

#new-products-shop .wpc-filters-range-slider-wrapper {
  margin-top: 12px;
  margin-bottom: 30px;
}

#new-products-shop
  .wpc-filters-range-inputs
  .ui-slider-horizontal
  .ui-slider-handle {
  box-shadow: none;
  background-color: #ffcb00;
  border: none;
}

#new-products-shop
  .wpc-filters-range-inputs
  .ui-slider-horizontal
  .ui-slider-range {
  background-color: #ffcb00;
}

#new-products-shop
  .wpc-filters-range-inputs
  .ui-slider-horizontal
  .ui-slider-handle {
  top: -8px;
}

#new-products-shop .wpc-filters-range-inputs .ui-slider .ui-slider-handle {
  width: 20px;
  height: 20px;
}

/*
5. if product not found page - empty 
*/

.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles))
  a.button {
  background: #ffcb00 !important;
  color: var(--Juoda) !important;
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px; /* 150% */
  background-color: var(--Yellow);
  text-align: center;
  text-decoration: none;
  height: 48px;
  padding: 12px 40px;
  min-width: 200px;
  transition: background-color 0.3s ease, color 0.3s ease;
  clip-path: polygon(
    5.831% 8.838%,
    5.831% 8.838%,
    5.972% 7.315%,
    6.158% 5.902%,
    6.383% 4.613%,
    6.645% 3.458%,
    6.94% 2.45%,
    7.262% 1.598%,
    7.61% 0.916%,
    7.979% 0.415%,
    8.364% 0.106%,
    8.763% 0%,
    97.067% 0%,
    97.067% 0%,
    97.667% 0.236%,
    98.222% 0.909%,
    98.724% 1.972%,
    99.164% 3.375%,
    99.534% 5.068%,
    99.823% 7.002%,
    100.023% 9.127%,
    100.125% 11.395%,
    100.12% 13.757%,
    100% 16.162%,
    94.362% 91.162%,
    94.362% 91.162%,
    94.22% 92.685%,
    94.035% 94.098%,
    93.809% 95.387%,
    93.547% 96.542%,
    93.253% 97.55%,
    92.93% 98.402%,
    92.583% 99.084%,
    92.214% 99.585%,
    91.828% 99.894%,
    91.429% 100%,
    3.125% 100%,
    3.125% 100%,
    2.526% 99.764%,
    1.97% 99.091%,
    1.468% 98.028%,
    1.028% 96.625%,
    0.659% 94.932%,
    0.37% 92.998%,
    0.17% 90.873%,
    0.068% 88.605%,
    0.072% 86.243%,
    0.193% 83.838%,
    5.831% 8.838%
  );
}

/* 


6. Reset filter button moved at the bottom



*/

.woocommerce:where(body:not(.woocommerce-block-theme-has-button-styles))
  a.button:hover {
  background-color: var(--Orange, #ff7a06) !important;
  color: var(--Juoda) !important;
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* Style the custom sorting dropdown */
.custom-sorting-form {
  margin-top: 10px;
  width: 100%;
  text-align: center;
}

/* Ensure dropdown fits properly */
.custom-orderby {
  width: 100%;
  padding: 8px;
  border: 1px solid #ccc;
  font-size: 14px;
  background: #fff;
}

@media screen and (max-width: 768px) {
  .custom-orderby {
    font-size: 14px;
    padding: 5px;
  }

  .wpc-filters-widget-containers-wrapper {
    display: flex;
    flex-direction: column;
  }

  .wpc-filters-widget-top-container {
    order: 9999;
  }
}

/* Ensure the filters button comes before sorting */
#new-products-shop .custom-ordering-wrapper .wpc-filters-open-widget {
  display: none;
}

/* hides the default filter button */
.wpc_show_bottom_widget .wpc-filters-open-button-container {
  width: 50%;
  margin-bottom: 0px !important;
}

@media screen and (max-width: 768px) {
  .custom-ordering-wrapper {
    display: flex;
    align-items: center;
    gap: 10px; /* Space between elements */
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .woocommerce-ordering {
    flex-grow: 1;
  }

  .wpc-filters-open-button-container {
    flex-shrink: 0;
  }

  .woocommerce-result-count {
    margin-left: auto;
  }
}

/* 


7. mobile filter popup



*/

@media screen and (max-width: 768px) {
  #new-products-shop .custom-ordering-wrapper {
    display: inline-flex;
    align-items: center;
    gap: 0px; /* Adjust spacing */
    align-items: flex-start;
    width: 100%;
  }

  /* Ensure the filters button comes before sorting */
  #new-products-shop .custom-ordering-wrapper .wpc-filters-open-widget {
    order: -1;
    display: flex;
    height: 48px;
    padding: 0px 12px;
    align-items: center;
    gap: 8px;
    flex: 1 0 0;
    border-radius: 6px;
    border: 1px solid var(--Platinum, #e0e0e0);
    color: var(--Juoda, #000);
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    line-height: 20px;
    text-decoration: none;
  }

  .woocommerce .woocommerce-ordering {
    width: 50%;
  }

  .woocommerce-ordering select {
    display: flex;
    height: 48px !important;
    padding: 0px 12px;
    justify-content: space-between;
    align-items: center;
    flex: 1 0 0;
  }

  /* change the logo of the filters by default */
  .custom-ordering-wrapper .wpc-button-inner::before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    background-color: black; /* Adjust color */
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cmask id='mask0_849_9626' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='20' height='20'%3E%3Crect width='20' height='20' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_849_9626)'%3E%3Cpath d='M9.16667 17.5V12.5H10.8333V14.1667H17.5V15.8333H10.8333V17.5H9.16667ZM2.5 15.8333V14.1667H7.5V15.8333H2.5ZM5.83333 12.5V10.8333H2.5V9.16667H5.83333V7.5H7.5V12.5H5.83333ZM9.16667 10.8333V9.16667H17.5V10.8333H9.16667ZM12.5 7.5V2.5H14.1667V4.16667H17.5V5.83333H14.1667V7.5H12.5ZM2.5 5.83333V4.16667H10.8333V5.83333H2.5Z' fill='black'/%3E%3C/g%3E%3C/svg%3E");
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cmask id='mask0_849_9626' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='20' height='20'%3E%3Crect width='20' height='20' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_849_9626)'%3E%3Cpath d='M9.16667 17.5V12.5H10.8333V14.1667H17.5V15.8333H10.8333V17.5H9.16667ZM2.5 15.8333V14.1667H7.5V15.8333H2.5ZM5.83333 12.5V10.8333H2.5V9.16667H5.83333V7.5H7.5V12.5H5.83333ZM9.16667 10.8333V9.16667H17.5V10.8333H9.16667ZM12.5 7.5V2.5H14.1667V4.16667H17.5V5.83333H14.1667V7.5H12.5ZM2.5 5.83333V4.16667H10.8333V5.83333H2.5Z' fill='black'/%3E%3C/g%3E%3C/svg%3E");
    margin-right: 8px;
  }

  /* hide the default logo of the filters */
  .wpc-filters-open-widget .wpc-icon-html-wrapper {
    display: none;
  }
  /* 
  .wpc-widget-close-container {
    padding: 3px 21px;
  }

  .wpc-widget-close-container .wpc-icon-html-wrapper {
    background: none !important;
    right: 100%;
    padding: 0px;
  }

  .wpc-widget-close-container {
    position: relative; 
    width: 100%;
    height: 50px; 
  }

  .wpc-widget-popup-title {
    position: relative;
    top: 10px;
  } */

  .wpc-widget-popup-title {
    justify-content: flex-start !important;
    padding-left: 17px;
    padding-right: 17px;
    top: 26px;
  }

  .wpc-icon-html-wrapper svg {
    width: 24px;
    height: 24px;
    display: none;
  }

  .wpc-widget-close-container {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important; /* Pushes content to both ends */
    width: 100% !important;
  }

  /* Make sure the close icon is at the end (right) */
  .wpc-widget-close-icon {
    margin-left: auto !important; /* Pushes it to the right */
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 56px !important;
    height: 56px !important;
    cursor: pointer !important;
  }

  .wpc-widget-close-container .wpc-icon-html-wrapper {
    left: 0px !important;
    background: none !important;
  }

  .wpc_show_bottom_widget .wpc-filters-widget-containers-wrapper {
    margin-top: 10px !important;
  }

  /* hide default buttons on filter popup */

  .wpc-filters-widget-controls-wrapper {
  }

  .custom-filter-buttons {
    display: flex;
    gap: 8px;
    flex: 1 0 0;
    padding-right: 20px;
    padding-left: 20px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 24px;
    align-items: center;
    gap: 12px;
    background: #f7f7f7;
  }

  .custom-filter-buttons .custom-reset-button {
    height: 48px;
    padding: 0px 12px;
    justify-content: center;
    align-items: center;
    border-radius: 6px;
    background: #fff0e3;
    border: none;
    width: 50%;
    font-weight: 600;
  }

  .custom-filter-buttons .custom-close-button {
    height: 48px;
    padding: 0px 12px;
    justify-content: center;
    align-items: center;
    border-radius: 6px;
    background: var(--Yellow, #ffcb00);
    border: none;
    width: 50%;
    font-weight: 600;
  }

  .wpc-icon-html-wrapper span {
    display: none !important; /* Hide default icon */
  }

  .wpc-icon-html-wrapper::before {
    content: "";
    display: inline-block;
    width: 36px;
    height: 36px;
    background-image: url('data:image/svg+xml;charset=UTF-8,<svg width="36" height="36" viewBox="0 0 36 36" fill="none" xmlns="http://www.w3.org/2000/svg"><mask id="mask0_393_8033" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="36" height="36"><rect width="36" height="36" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_393_8033)"><path d="M12.6 25.5L10.5 23.4L15.9 18L10.5 12.6375L12.6 10.5375L18 15.9375L23.3625 10.5375L25.4625 12.6375L20.0625 18L25.4625 23.4L23.3625 25.5L18 20.1L12.6 25.5Z" fill="black"/></g></svg>');
    background-repeat: no-repeat;
    background-size: contain;
  }
}

.category-accordion {
  border-top: 1px solid #bebebe;
  overflow: hidden;
}

.category-accordion .accordion-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 24px 0px;
  padding-right: 1px;
  cursor: pointer;
}

.category-accordion .accordion-title {
  color: var(--Juoda, #000);
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 24px; /* 150% */
}

.category-accordion .wpc-open-icon {
  content: "";
  width: 0.5em;
  min-width: 0.5em;
  height: 0.5em;
  display: inline-block;
  border-left: 1px solid #000000;
  border-top: 1px solid #000000;
  position: relative;
  transform: rotate(-135deg);
  transition: transform 0.3s ease-in-out;
  margin-left: 10px; /* Adjust spacing from text */
}

/* Rotate the chevron when accordion is opened */
.category-accordion .accordion-header.active .wpc-open-icon {
  transform: rotate(45deg);
}

.category-accordion .wc-block-product-categories-list-item-count {
  display: none !important;
}

.category-accordion ul li a {
  color: var(--Juoda, #000);
  text-decoration: none;
}

.category-accordion ul li a:hover {
  text-decoration: underline;
}

.wc-block-product-categories-list--depth-1 {
  margin-left: 3rem !important;
}

.category-accordion .category-toggle {
  display: inline-flex;
  align-items: center;
  cursor: pointer;
  margin-right: 12px;
}

.category-accordion .category-toggle svg {
  width: 12px;
  height: 12px;
  transition: opacity 0.2s ease-in-out;
}

.category-accordion .category-toggle .minus-icon {
  display: none; /* Initially hidden */
}

.category-accordion .category-toggle.active .plus-icon {
  display: none;
}

.category-accordion .category-toggle.active .minus-icon {
  display: inline-block;
}

.wp-block-woocommerce-product-categories {
  visibility: hidden;
}

.wp-block-woocommerce-product-categories ul {
  list-style: none;
  padding-left: 0; /* Removes default left padding */
  margin: 0; /* Optional: Removes margin for alignment */
}

.wp-block-woocommerce-product-categories ul li {
  margin-bottom: 6px !important;
}

.wp-block-woocommerce-product-categories .your-class ul {
  list-style: none;
  padding-left: 0;
}

@media (max-width: 768px) {
  .category-accordion {
    border-top: 1px solid #bebebe;
    overflow: visible;
    padding: 0px 20px 0px;
  }

  .wpc_show_bottom_widget .wpc-filters-widget-wrapper {
    padding-top: 0px !important;
  }
}

/* 


8. mobile responsive 


*/

/* Desktop layout: sidebar + content side by side */
@media (max-width: 1200px) {
  #new-products-shop .custom-product-card {
    margin: 8px;
  }
}

/* Desktop layout: sidebar + content side by side */
@media (max-width: 1080px) {
  #new-products-shop .custom-product-card {
    margin: 6px !important;
  }
}

/* Desktop layout: sidebar + content side by side */
@media (max-width: 992px) {
  #new-products-shop .custom-product-card {
    margin: 5px !important;
  }
}

@media (max-width: 768px) {
  #new-products-shop .widget_wpc_filters_widget .wpc-filter-chip.wpc-chip-reset-all {
    display: none;
  }

  #new-products-shop .custom-product-card {
    margin-bottom: 24px !important;
  }

  #new-products-shop .product .status {
    padding-left: 12px;
    padding-right: 12px;
    margin-top: 12px;
  }

  #new-products-shop .product h3 {
    font-size: 12px;
    font-style: normal;
    font-weight: 400;
    padding: 0 12px;
    line-height: 16px; /* 133.333% */
  }

  #new-products-shop .product .product-footer {
    padding-left: 12px;
    padding-right: 12px;
    align-content: center;
    justify-content: space-between;
    align-items: end;
    margin-bottom: 12px;
  }

  #new-products-shop .product {
    min-height: 348px !important;
  }

  #new-products-shop .product .price {
    font-size: 14px;
    font-weight: bold;
    text-align: left;
    width: 65%;
  }

}

@media (max-width: 552px) {
  #new-products-shop .custom-product-card {
    margin-bottom: 0px !important;
    margin-left: 0px !important;
    margin-right: 0px !important;
    margin-bottom: 24px !important;
  }
}

/* 


9. Sort by filter


*/

/* Wrapper to align SVG icons with the dropdown */
.custom-ordering-wrapper {
  position: relative;
  display: inline;
  gap: 8px;
}

/* First SVG (Before Text) */
.order-icon-left {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  left: 28px;
  position: relative;
}

/* Second SVG (After Text) */
.order-icon-right {
  pointer-events: none;
  position: relative;
  right: 27px;
  top: 5px;
}

/* Adjust select dropdown */
.woocommerce-ordering select {
  width: 100%;
  padding-right: 30px;
  padding-left: 40px;
  appearance: none;
  background: transparent;
  border: 1px solid #ddd;
  font-size: 16px;
  height: 40px;
  cursor: pointer;
  border-radius: 6px;
  border: 1px solid var(--Platinum, #e0e0e0);
  font-size: 14px;
  font-style: normal;
  font-weight: 600;
  line-height: 20px;
}

/* Improve focus styles */
.woocommerce-ordering select:focus {
  border-color: #333;
}

.woocommerce .woocommerce-ordering {
  display: inline-flex;
}

@media screen and (max-width: 768px) {
  .custom-ordering-wrapper {
    display: flex;
    align-items: center;
    gap: 16px !important;
    width: 100%;
  }

  /* Optional: force the form itself to stretch too */
  .woocommerce-ordering {
    flex: 1;
    display: flex;
    align-items: center;
    position: relative;
  }

  /* SVG positioning (fine-tune if needed) */
  .order-icon-left {
    position: absolute;
    left: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .order-icon-right {
    position: absolute;
    right: 8px;
    pointer-events: none;
  }

  .woocommerce .woocommerce-ordering {
    margin-top: 1em;
    margin-bottom: 0em;
  }

  /* Make select 100% width inside the form */
  .woocommerce-ordering select {
    width: 100%;
    padding-left: 30px; /* space for left icon */
    padding-right: 30px; /* space for right icon */
    appearance: none;
    background: transparent;
    border: 1px solid #ddd;
    font-size: 16px;
    height: 40px;
    cursor: pointer;
    border-radius: 6px;
    border: 1px solid var(--Platinum, #e0e0e0);
    font-size: 14px;
    font-weight: 600;
    line-height: 20px;
  }

  #new-products-shop .woocommerce-result-count {
    width: 100%;
    margin-top: 28px !important;
    margin-left: 0px !important;
    margin-bottom: 24px !important;
  }

  /* Second SVG (After Text) */
  .order-icon-right {
    top: 11px;
  }

  .woocommerce .woocommerce-ordering select {
    padding-left: 38px;
  }
}

/* 

10. Popup for the custom sorting 


*/

/* Desktop: Show normal select */
.desktop-ordering {
  display: flex !important;
}

/* Mobile trigger and popup hidden by default */
.mobile-ordering-trigger {
  display: none !important;
}

.mobile-orderby-popup {
  display: none;
}

/* Mobile overrides */
@media (max-width: 768px) {
  .mobile-orderby-popup {
    display: inline-block;
  }

  .desktop-ordering {
    display: none !important;
    /* Hide default select */
  }

  .mobile-orderby-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* pushes items to edges */
    width: 100%;
  }

  .mobile-orderby-header h3 {
    color: var(--Juoda, #000);
    font-size: 16px;
    font-style: normal;
    font-weight: 600;
    line-height: 24px;
    margin-bottom: 0px;
    text-transform: none;
    /* 150% */
  }

  .mobile-orderby-content hr {
    margin: 24px 0 !important;
  }

  .close-popup {
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: #666;
  }

  .mobile-ordering-trigger {
    display: flex !important;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    height: 48px !important;
    background-color: #fff;
    border: 1px solid var(--Platinum, #e0e0e0);
    border-radius: 6px;
    font-size: 16px;
    cursor: pointer;
    margin-top: auto !important;
    background-color: transparent;

    color: var(--Juoda, #000);

    font-family: Poppins;
    font-size: 14px;
    font-style: normal;
    font-weight: 600;
    padding: 0px 40px;
  }

  .mobile-orderby-popup {
    display: block;
    position: fixed;
    bottom: -100%;
    left: 0;
    width: 100%;
    background: #fff;
    padding: 24px;
    box-shadow: 0 -4px 10px rgba(0, 0, 0, 0.2);
    transition: bottom 0.3s ease-in-out;
    z-index: 9999;
  }

  .mobile-orderby-popup.active {
    bottom: 0;
  }

  .mobile-orderby-content {
    text-align: center;
  }

  .mobile-orderby-content ul {
    list-style: none;
    padding: 0;
    margin: 0;
    gap: 23px !important;
    display: flex;
    flex-direction: column;
    text-align: left;
  }

  .mobile-orderby-content ul li a {
    display: block;
    padding: 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    text-decoration: none;
    color: #333;
    margin-bottom: 8px;
  }

  .mobile-orderby-content ul li label {
    display: flex;
    align-items: center;
    gap: 12px;
  }

  .close-popup {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    background: none;
    border: none;
    font-size: 24px;
    cursor: pointer;
    color: #666;
    position: static;
    /* no absolute since it's inline now */
  }

  .mobile-orderby-content input[type="radio"] {
    appearance: none;
    width: 20px;
    height: 20px;
    background-color: transparent;
    position: relative;
    cursor: pointer;
    border: none;
  }

  /* Default unselected state - empty border circle */
  .mobile-orderby-content input[type="radio"]::before {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 2px solid #ccc;
    background-color: #fff;
  }

  /* When selected, replace with your SVG */
  .mobile-orderby-content input[type="radio"]:checked::before {
    content: "";
    background-image: url('data:image/svg+xml;charset=utf-8,<svg width="20" height="20" xmlns="http://www.w3.org/2000/svg"><mask id="mask0_393_8640" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="20" height="20"><rect width="20" height="20" fill="%23D9D9D9"/></mask><g mask="url(%23mask0_393_8640)"><path d="M9.99935 14.1667C11.1521 14.1667 12.1348 13.7604 12.9473 12.9479C13.7598 12.1354 14.166 11.1528 14.166 9.99999C14.166 8.84721 13.7598 7.86457 12.9473 7.05207C12.1348 6.23957 11.1521 5.83332 9.99935 5.83332C8.84657 5.83332 7.86393 6.23957 7.05143 7.05207C6.23893 7.86457 5.83268 8.84721 5.83268 9.99999C5.83268 11.1528 6.23893 12.1354 7.05143 12.9479C7.86393 13.7604 8.84657 14.1667 9.99935 14.1667ZM9.99935 18.3333C8.84657 18.3333 7.76324 18.1146 6.74935 17.6771C5.73546 17.2396 4.85352 16.6458 4.10352 15.8958C3.35352 15.1458 2.75977 14.2639 2.32227 13.25C1.88477 12.2361 1.66602 11.1528 1.66602 9.99999C1.66602 8.84721 1.88477 7.76388 2.32227 6.74999C2.75977 5.7361 3.35352 4.85416 4.10352 4.10416C4.85352 3.35416 5.73546 2.76041 6.74935 2.32291C7.76324 1.88541 8.84657 1.66666 9.99935 1.66666C11.1521 1.66666 12.2355 1.88541 13.2493 2.32291C14.2632 2.76041 15.1452 3.35416 15.8952 4.10416C16.6452 4.85416 17.2389 5.7361 17.6764 6.74999C18.1139 7.76388 18.3327 8.84721 18.3327 9.99999C18.3327 11.1528 18.1139 12.2361 17.6764 13.25C17.2389 14.2639 16.6452 15.1458 15.8952 15.8958C15.1452 16.6458 14.2632 17.2396 13.2493 17.6771C12.2355 18.1146 11.1521 18.3333 9.99935 18.3333ZM9.99935 16.6667C11.8605 16.6667 13.4368 16.0208 14.7285 14.7292C16.0202 13.4375 16.666 11.8611 16.666 9.99999C16.666 8.13888 16.0202 6.56249 14.7285 5.27082C13.4368 3.97916 11.8605 3.33332 9.99935 3.33332C8.13824 3.33332 6.56185 3.97916 5.27018 5.27082C3.97852 6.56249 3.33268 8.13888 3.33268 9.99999C3.33268 11.8611 3.97852 13.4375 5.27018 14.7292C6.56185 16.0208 8.13824 16.6667 9.99935 16.6667Z" fill="%23FFCB00"/></g></svg>');
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    border: none;
    /* Hide border when using SVG */
  }
}

/* 
  
  
  11. Category page heading
  
  
  */

#category-page-heading {
  background: #000;
  min-height: auto;
  padding-bottom: 64px;
  margin-top: -70px;
  padding-top: 80px;
}

#category-page-heading .row .breadcrumbs__items {
  gap: 12px;
  align-items: center;
  text-align: center;
}

#category-page-heading .row .breadcrumbs__items a,
#category-page-heading .row .breadcrumbs__items span {
  color: #fff;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 16px;
  text-decoration: none;
}

#category-page-heading .row .breadcrumbs__items img {
  width: 12px;
  height: 12px;
}

#category-page-heading .headign-title {
  margin-top: 84px;
}

#category-page-heading .headign-title h1 {
  color: var(--Balta, #fff);
  text-align: center;
  font-size: 55px;
  font-style: normal;
  font-weight: 700;
  line-height: 130%;
  text-transform: uppercase;
  margin-bottom: 0px;
  margin-bottom: 24px;
}

/* Ensure product fits inside its slide cleanly */
#category-page-heading .best-seller-slider .product {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  height: 100%;
  text-align: center;
  border-radius: 6px;
  width: 100%;
  margin: 0; /* No more margin here! */
}

#category-page-heading .best-seller-slider .slick-track {
  display: flex !important;
}

#category-page-heading .best-seller-slider .slick-slide {
  height: inherit !important;
}

#category-page-heading .slick-slide {
    /* margin: 0 22px; */
    margin: 0px 12px;
  }

/* Links */
#category-page-heading .best-seller-slider .product a {
  min-width: 188px;
  text-decoration: none;
  width: 100%;
}

/* Title */
#category-page-heading .best-seller-slider .product h3 {
  color: var(--Balta, #fff);
  text-align: center;
  font-size: 24px;
  font-weight: 600;
  line-height: 32px;
  margin: 12px 0;
  padding: 0 16px;
}

/* Product Image */
#category-page-heading .best-seller-slider .product img {
  width: 188px;
  height: 188px;
  border-radius: 6px;
  aspect-ratio: 1 / 1;
  object-fit: cover;
}

/* Arrows */
#category-page-heading .slick-prev,
#category-page-heading .slick-next {
  color: #fff;
  border: none;
  position: absolute;
  top: 40%;
  transform: translateY(-50%);
  z-index: 1;
  width: 48px;
  height: 48px;
  background-size: contain;
  background-repeat: no-repeat;
}

#category-page-heading .slick-prev.slick-disabled,
#category-page-heading .slick-next.slick-disabled {
  display: none !important;
}

#category-page-heading .slick-prev {
  left: -15px;
  /* background-image: url('/images/arrow-slider-left.svg');  */
}

#category-page-heading .slick-prev:hover {
  /* background-image: url('/images/arrow-slider-left-hover.svg');  */
}

#category-page-heading .slick-prev::before {
  content: "";
}

#category-page-heading .slick-next {
  right: -15px;
  /* background-image: url('/images/arrow-slider-right.svg'); */
}

#category-page-heading .slick-next:hover {
  /* background-image: url('/images/arrow-slider-right-hover.svg');  */
}

#category-page-heading .slick-next::before {
  content: "";
}

/* Banner */
#category-page-heading .best-seller-slider .product .banner {
  position: absolute;
  top: 10px;
  right: 10px;
  background: var(--Orange, #ff7a06);
  color: var(--Balta, #fff);
  font-size: 12px;
  font-weight: 400;
  line-height: 16px;
  padding: 8px 12px;
  border-radius: 25px;
}

/* Status */
#category-page-heading .best-seller-slider .product .status {
  display: flex;
  align-items: center;
  font-size: 12px;
  color: var(--Juoda);
  margin-top: 24px;
  padding: 0 16px;
}

/* Status Indicator */
#category-page-heading .best-seller-slider .product .status .circle {
  width: 9px;
  height: 9px;
  background-color: #06ff4c;
  border-radius: 50%;
  display: inline-block;
  margin-right: 8px;
}

/* Footer */
#category-page-heading .best-seller-slider .product .product-footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-top: auto;
  padding: 0 16px;
  margin-bottom: 24px;
  margin-top: 24px;
}

/* Price */
#category-page-heading .best-seller-slider .product .price {
  font-size: 16px;
  font-weight: bold;
  color: #333;
}

/* Shopping Bag Icon */
#category-page-heading .best-seller-slider .product .shopping-bag {
  font-size: 20px;
  color: #333;
}

#category-page-heading .best-seller-slider .product .shopping-bag img {
  width: 40px;
  height: 40px;
}

/* Scrollbar */
#category-page-heading .best-seller-slider-scroll {
  position: relative;
  width: 100%;
  height: 6px;
  background: var(--Pilka-teksto, #5b5b5b);
  margin-top: 12px;
  cursor: pointer;
  border-radius: 3px;
  overflow: hidden;
  display: none;
}

#category-page-heading .best-seller-slider-scroll .scroll-thumb {
  position: absolute;
  height: 100%;
  background: #d9d9d9;
  border-radius: 3px;
  width: 0;
  left: 0;
  transition: left 0.3s ease;
}

/* Show scrollbar only on mobile */
@media (max-width: 922px) {
  #category-page-heading .best-seller-slider-scroll {
    display: block;
  }
}

/* Hide arrows on smaller screens if needed */
@media screen and (max-width: 768px) {
  #category-page-heading .best-seller-slider .product {
    max-width: 188px;
  }
  #category-page-heading .slick-slider {
    overflow: hidden;
  }

  #category-page-heading .slick-prev,
  #category-page-heading .slick-next {
    display: none !important;
  }

  /* Product Image */
  #category-page-heading .best-seller-slider .product img {
    width: 188px;
    height: 188px;
    border-radius: 6px;
    aspect-ratio: 1 / 1;
    object-fit: cover;
  }

  /* #category-page-heading .best-seller-slider .slick-track {
      padding-left: 15px;
      padding-right: 15px;
    } */

  /* the slides */
  #category-page-heading .slick-slide {
    /* margin: 0 22px; */
    margin: 0px 12px;
  }

  /* the parent */
  #category-page-heading .slick-list {
    /* margin: 0 -22px; */
    margin: 0px;
  }
}

@media screen and (max-width: 600px) {
  #category-page-heading .btn-primary {
    transition: background-color 0.3s ease, color 0.3s ease;
    background-image: url("/images/small-button-category.svg");
    border: none;
  }
}

.woocommerce-products-header {
  display: none;
}

.spacing {
  padding-bottom: 96px;
  background-color: #f7f7f7;
}

@media screen and (max-width: 992px) {
  .spacing {
    padding-bottom: 48px;
    background-color: #f7f7f7;
  }
}
