.first-shop-block .category-list {
	 display: grid;
	 grid-template-columns: 1fr 1fr 1fr 1fr;
	 gap: 40px;
	 margin-top: 32px;
	 width: 100%;
}
 .first-shop-block .category-list li {
	 width: 100%;
	 background-size: 120%;
	 background-repeat: no-repeat;
	 height: 230px;
	 display: flex;
	 flex-wrap: wrap;
	 align-content: center;
	 position: relative;
	 background-position: center center;
	 transition: all 0.5s;
}
 .first-shop-block .category-list li a {
	 width: 100%;
	 text-align: center;
	 margin: 0;
	 position: relative;
	 z-index: 10;
	 height: 100%;
	 display: flex;
	 flex-wrap: wrap;
	 justify-content: center;
	 align-items: center;
}
 .first-shop-block .category-list li:hover{
	 background-size: 140%;
	 transition: all 0.6s;
}
 .first-shop-block .category-list li h2 {
	 font-size: var(--h2-size);
	 line-height: var(--h1-height);
	 letter-spacing: var(--h1-letter-s);
	 color: var(--white-color);
	 font-weight: var(--bold);
	 text-transform: uppercase;
	 font-family: 'Title font';
}
 .first-shop-block .category-list div {
	 background-color: #000;
	 width: 100%;
	 height: 100%;
	 position: absolute;
	 z-index: 0;
	 opacity: 30%;
}
 .bg-cat-row{
	 background-position: center;
	 background-size: cover;
	 background-repeat: no-repeat;
	 display: flex;
	 flex-wrap: wrap;
	 width: 100%;
	 justify-content: center;
	 align-items: center;
	 height: 500px;
	 margin: 33px 0;
}
 .bg-cat-row h1 {
	 color: var(--white-color);
	 font-weight: var(--bold);
}
 .shop-loop{
	 margin: 130px 0 80px;
}
 main .shop-loop .container > .row{
	 display:grid;
	 grid-template-columns:1fr 1fr 1fr;
	 gap:30px 40px;
}
 .shop-loop-search{
	 grid-column-start: 1;
	 grid-column-end: 2;
}
 .shop-loop-search #yith-ajaxsearchform > div{
	 display: flex;
	 border: 1px solid var(--bg-bread-c);
}
 .shop-loop-search input[type="search"] {
	 outline: none;
	 border: none;
	 width: 100%;
	 padding: 10px;
	 font-size: var(--p-size);
	 margin-bottom: 0px;
	 border-right: 1px solid var(--bg-bread-c);
	 border-radius: 0px !important;
  background-color: #fff !important;
}
 .shop-loop-search input[type="submit"]{
	 border: none;
	 background-color: inherit;
	 padding: 0;
	 width:44px;
	 mask-image: url("/wp-content/themes/lu-li-loona-theme/image/search.svg");
	 mask-repeat: no-repeat;
	 mask-position: center;
	 mask-size: 26px;
	 -webkit-mask-image: url("/wp-content/themes/lu-li-loona-theme/image/search.svg");
	 -webkit-mask-repeat: no-repeat;
	 -webkit-mask-position: center;
	 -webkit-mask-size: 26px;
	 background-color: var(--font-color);
	 transition:all 0.3s;
}
 .shop-loop-search input[type="submit"]:hover {
	 background-color: var(--accent-color);
}
 #wpfBlock_1{
	 visibility: inherit;
	 margin: 0;
	 position:relative;
}
 #wpfBlock_1::before {
	 content:url(/wp-content/themes/lu-li-loona-theme/image/arrow-select.svg);
	 position: absolute;
	 right: 10px;
	 top: 12px;
}


.wpfFilterContent select{
  color: var(--font-color);
  font-size: var(--p-size);
  font-family: 'text font';
  padding: 11px 28px 11px 8px;
}

 .wpfFilterWrapper[data-filter-type] {
	 padding: 0px!important;
}
/* Стилизация основного блока */
 .wpfFilterContent select {
	 appearance: none;
	/* Убирает стандартные стили браузера */
	 -webkit-appearance: none;
	/* Для Safari */
	 -moz-appearance: none;
	/* Для Firefox */
	 border: 1px solid var(--bg-bread-c);
	 border-radius: 0px;
	 background-color: #fff;
	 cursor: pointer;
	 padding: 12px 32px 12px 12px;
}
/* Стилизация при наведении */
 .wpfFilterContent select:hover {
	 border-color: var(--accent-color);
	/* Изменяет цвет границы при наведении */
}
/* Стилизация при фокусе */
 .wpfFilterContent select:focus {
	 outline: none;
	/* Убирает обводку при фокусе */
}
/* Изменение стиля стрелки в селекте (для Safari) */
 .wpfFilterContent select::-webkit-inner-spin-button, .wpfFilterContent select::-webkit-outer-spin-button {
	 -webkit-appearance: none;
	 margin: 0;
}
/* Изменение стиля стрелки в селекте (для Firefox) */
 .wpfFilterContent select[type="number"] {
	 -moz-appearance: textfield;
}
 .shop-loop-filtrsort{
	 display:flex;
	 flex-wrap:wrap;
	 justify-content: space-between;
	 align-items: center;
	 grid-column-start: 3;
	 grid-column-end: 4;
}
 .shop-loop-filtrbtn {
	 font-size: var(--p-size);
	 border: 1px solid var(--bg-bread-c);
	 line-height: var(--p-height);
	 display: flex;
	 align-items: center;
	 color: var(--font-color);
	 padding: 8px;
	 transition:all 0.3s;
	 cursor:pointer;
}
 .shop-loop-filtrbtn:hover {
	 border: 1px solid var(--accent-color);
	 background-color:var(--accent-color);
	 color:var(--white-color);
}
 .shop-loop-filtrbtn svg{
	margin-left: 10px;
}
 .shop-loop-filtrbtn svg rect, .shop-loop-filtrbtn svg circle{
	 fill: var(--font-color);
	 transition:all 0.3s;
}
 .shop-loop-filtrbtn:hover svg rect, .shop-loop-filtrbtn:hover svg circle{
	 fill:var(--white-color);
}
 .shop-loop-filtr {
	 background-color: var(--white-color);
	 grid-column-start: 1;
	 grid-column-end: 4;
	 border: 1px solid #F3F3F3;
	 position: fixed;
	 top: 0;
	 right: -100%;
	 z-index: 1001;
	 width: 400px;
	 overflow-y: scroll;
	 height: 100%;
	 transition: all 0.5s;
}
 .shop-loop-filtr.open {
	 right: 0;
}
 .shop-loop-filtr .shop-loop-filtrbtn-head{
	 padding: 25px 60px 0px 20px;
	 display:flex;
	 align-items: center;
}
 .shop-loop-filtr .wpfFilterWrapper{
	 margin-bottom: 40px !important;
}
 .shop-loop-filtr .shop-loop-filtrbtn-head svg{
	 width: 40px;
	 height: 40px;
}

 .shop-loop-filtr .shop-loop-filtrbtn-head svg rect, .shop-loop-filtr .shop-loop-filtrbtn-head svg circle{
	 fill: var(--font-color);
}
 .close-filtr{
	 position: absolute;
	 right: 13px;
	 top: 48px;
	 width: 30px!important;
	 height: 30px!important;
	 cursor:pointer;
}
 .close-filtr rect{
	 fill:var(--font-color);
}


 .shop-loop-filtr .shop-loop-filtrbtn-head h2 {
	 font-size: var(--h2-size);
	 letter-spacing: var(--h1-letter-s);
	 line-height: var(--h1-height);
	 font-weight: var(--light);
	 margin: 10px 46px 10px 32px;
	 color: var(--font-color);
}
 .shop-loop-filtr > div.wpfMainWrapper{
	 padding: 40px;
	 display: block;
	 width: auto!important;
}
 .shop-loop-filtr > div > div{
	 width:100%!important;
	 margin: 0;
}
 .shop-loop-filtr .wpfFilterButtons{
	 width:100%;
}
 .shop-loop-filtr .wpfFilterWrapper .wfpTitle {
	 font-size: var(--h3-size);
	 font-weight: var(--medium);
	 margin: 0 0 20px;
	 color: var(--font-color);
	 line-height: var(--h1-height);
	 font-family: 'text font';
}
 .shop-loop-filtr .wpfFilterButton.wpfButton {
	 border: inherit;
	 border-radius:0;
	 width:auto;
	 background-color: var(--accent-color);
	 font-size: var(--a-size);
	 padding: 12px 30px;
	 font-family: 'text font';
	 color: var(--white-color);
	 border: 1.5px solid var(--accent-color);
	 transition: all 0.3s;
	 cursor:pointer;
	 margin: 0;
}
 .shop-loop-filtr .wpfFilterButton.wpfButton:hover{
	 color:var(--accent-color);
	 background-color: var(--white-color);
}
 .shop-loop-filtr .wpfFilterWrapper .wpfPriceInputs{
	 justify-content: space-between;
}
 .shop-loop-filtr .wpfPriceInputs .input-wrapper-custom input{
	 border-radius: 0px !important;
	 margin: 0;
	 border: 1px solid var(--accent-color) !important;
	 background-color: inherit !important;
	 min-width: 30px !important;
}
 .shop-loop-filtr .wpfFilterWrapper .ui-slider-horizontal {
	 height: 1.5px;
	 background: var(--bg-bread-c) !important;
	 border:inherit!important;
}
 .shop-loop-filtr .ui-widget-header {
	 background: var(--accent-color) !important;
}
 .shop-loop-filtr .wpfPriceInputs .plus, .shop-loop-filtr .wpfPriceInputs .minus, .shop-loop-filtr .wpfPriceInputs .wpfCurrencySymbol, .shop-loop-filtr .wpfPriceInputs .wpfFilterDelimeter {
	 display:none;
}
 .wpfFilterContent li{
	 margin-bottom: 6px;
}
 .shop-loop-filtr .wpfFilterWrapper .wpfCheckbox label {
	 width: 30px !important;
	 height: 30px !important;
}
 .shop-loop-filtr .ui-slider-horizontal .ui-slider-handle {
	 top: -7px!important;
	 margin-left: -7px!important;
	 width: 14px!important;
	 height: 14px!important;
}
 .shop-loop-filtr .wpfFilterButton.wpfButton:hover{
	 color: var(--accent-color);
}
 .products {
	 grid-column-start: 1;
	 grid-column-end: 4;
	 display: grid;
	 grid-template-columns: 1fr 1fr 1fr;
	 gap: 40px;
	 margin-top: 60px;
}
 .products a p{
	 margin: 0;
}
 .products a p > span > bdi{
	 font-size: var(--a-size);
}
 .products a p del{
	 color:var(--bg-bread-c);
}
 .products a p ins{
	 font-size: var(--a-size);
	 text-decoration: inherit;
}
 .products a {
	 display: flex;
	 flex-wrap: wrap;
	 justify-content: space-between;
}
 .products a h3{
	 font-family: 'text font';
	 font-size: var(--a-size);
	 margin: 0;
}

.shop-loop-filtr .shop-loop-filtrbtn-head .close-filtr:hover rect{
	 fill:var(--accent-color);
}

.woocommerce-info, .woocommerce-noreviews, p.no-comments {
  background-color: inherit;
}

 @media (max-width: 756px) {
	 main .shop-loop .container > .row {
		 display: flex;
	}
	 
	 
	 .close-filtr {
  right: 22px;
  top: 30px;
}
	 
	 .shop-loop-filtrbtn {
  padding: 6px;
}
	 .shop-loop-filtrbtn svg {
  margin-left: 4px;
}
	 
	 .wpfFilterContent select{
  padding: 9px 28px 9px 8px;
}
	 
	 #wpfBlock_1::before {
  top: 10px;
}
	 
	 .shop-loop {
		 margin: 20px 0 60px;
	}
	 .shop-loop-search{
		 width: 100%;
	}
	 .shop-loop-filtrsort {
		 width: 100%;
	}
	 .bg-cat-row {
		 height: 260px;
		 margin: 33px 0 35px;
	}
	 .bg-cat-row h1 {
		 font-size: var(--h1-mob-size);
	}
	 main .container > .row {
		 margin: 0 20px;
	}
	 .first-shop-block .category-list {
		 grid-template-columns: 1fr 1fr;
		 gap: 10px;
	}
	 .first-shop-block .category-list li h2 {
		 font-size: var(--h2-mob-size);
	}
	 .first-shop-block .category-list li {
		 height: 100px;
	}
	 .products {
		 grid-template-columns: 1fr;
		 gap: 20px;
	}
	 .products a h3 {
		 font-family: 'text font';
		 font-size: var(--a-mob-size);
		 margin: 0;
	}
	 .products a p > span > bdi{
		 font-size: var(--a-mob-size);
	}
	 .products a p del{
		 font-size: var(--copyright-size);
	}
	 .products a p ins{
		 font-size: varvar(--a-mob-size);
		 text-decoration: inherit;
	}
	 .shop-loop-filtr {
		width: 100%;
	}
	 
	 	 .shop-loop-filtr .shop-loop-filtrbtn-head {
  padding: 14px 20px;
} 
	 .shop-loop-filtr > div.wpfMainWrapper {
  padding: 25px 20px;
}
	 
	 .shop-loop-filtr .shop-loop-filtrbtn-head h2 {
  font-size: var(--h1-mob-size);
  margin: 10px 24px 10px;
}
	 .shop-loop-filtr .shop-loop-filtrbtn-head svg {
  width: 28px;
  height: 36px;
}
	 
	 .shop-loop-filtr .wpfFilterWrapper .wfpTitle {
  font-size: var(--h3-mob-size);
margin: 0 0 12px;
}
	 
	 .wpfPriceRangeField#wpfMinPrice, .wpfPriceRangeField#wpfMaxPrice {
  padding: 0px!important;
}
	 .shop-loop-filtr .wpfFilterWrapper .wpfCheckbox label {
  width: 20px !important;
  height: 20px !important;
}
	 .wpfFilterButton.wpfButton, .wpfClearButton.wpfButton {
  min-height: 48px!important;
}
	 
	 
}