@import url('colors.css');

input[type="number"]::-webkit-outer-spin-button,
input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
}
.catalog{
    background-color: var(--gray);
}
.catalog-breadcrumbs{
    padding-top: 20px;
    margin-bottom: 15px;
}
.catalog-breadcrumb__item::after{
   content: "/";
   color: var(--blue);
   font-size: 12px;
   margin: 0 10px;
   line-height: 1;
   font-weight: 600;
}

.catalog-breadcrumb__item:last-child::after{
    content: "";
 }

 .catalog-breadcrumb__item{
    color: var(--black);
    font-size: 12px;
    line-height: 1;
    font-weight: 600;
    transition: color 0.3s;
    margin-bottom: 20px;
 }

 .catalog-breadcrumb__item:hover{
    color: var(--blue);

 }

 .catalog-filtered-content {
   position: relative;
 }

 .catalog-filtered-content__wrapper {
   padding-top: 80px;
   position: absolute;
   left: 0;
   top: 0;
   width: 100%;
   height: 100%;
   background-color: rgba(255, 255, 255, 0.4);
   z-index: 50;
 }

 .catalog-filtered-content__wrapper__container {
   width: 100%;
   height: 100%;
   display: flex;
   justify-content: center;
 }

 .loader {
   width: 48px;
   height: 48px;
   border-radius: 50%;
   display: inline-block;
   position: relative;
   border: 3px solid;
   border-color: #FFF #FFF transparent transparent;
   box-sizing: border-box;
   animation: rotation 1s linear infinite;
 }
 .loader::after,
 .loader::before {
   content: '';  
   box-sizing: border-box;
   position: absolute;
   left: 0;
   right: 0;
   top: 0;
   bottom: 0;
   margin: auto;
   border: 3px solid;
   border-color: transparent transparent #03a9f4 #03a9f4;
   width: 40px;
   height: 40px;
   border-radius: 50%;
   box-sizing: border-box;
   animation: rotationBack 0.5s linear infinite;
   transform-origin: center center;
 }
 .loader::before {
   width: 32px;
   height: 32px;
   border-color: #FFF #FFF transparent transparent;
   animation: rotation 1.5s linear infinite;
 }
     
 @keyframes rotation {
   0% {
     transform: rotate(0deg);
   }
   100% {
     transform: rotate(360deg);
   }
 } 
 @keyframes rotationBack {
   0% {
     transform: rotate(0deg);
   }
   100% {
     transform: rotate(-360deg);
   }
 }
     

 .catalog-breadcrumb__item:last-child{
    color: var(--semi-gray);
    cursor: default;
    pointer-events: none;
 }

 .catalog-category{
   display: flex;
   gap: 20px;
   position: relative;
   padding-bottom: 120px;
   
}

/*
   START Side filter Block
*/

 .catalog-category__side{
   position: sticky;
   width: 234px;
   height: 100%;
   top: 200px;
   display: flex;
   flex-direction: column;
   gap: 10px;
   margin-bottom: 20px;
 }

 .catalog-menu{
   padding: 13px 20px;
   background-color: var(--gray-light);
   border-radius: 10px;
   min-width: 235px;

 }
 .catalog-menu__title{
   font-size: 20px;
   font-weight: 700;
   margin-bottom: 20px;
   padding-top: 7px;
   line-height: 1.25;
   color: var(--semi-black);

 }
 .catalog-menu__list{
   display: flex;
   flex-direction: column;
   gap: 10px;
   padding: 0 10px 7px 10px;


 }
 .catalog-menu__list a{
   font-size: 14px;
   font-weight: 600;
   list-style: none;
   line-height: 1.57;
   color: var(--black);
   transition: all 0.2 ease-in;
 }
 .catalog-menu__list a:hover{
   text-decoration: underline;
   color: var(--semi-gray);
 }

.form-switch__text{
   font-size: 16px;
   font-weight: 700;
   line-height: 1.37
}

.catalog-menu__switch{
   display: flex;
   justify-content: space-between;
}


 .switch {
   position: relative;
   display: inline-block;
   width: 40px;
   height: 24px;
 }
 

 .switch input {
   opacity: 0;
   width: 0;
   height: 0;
 }
 

 .slider {
   position: absolute;
   cursor: pointer;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   background-color: #ccc;
   -webkit-transition: .4s;
   transition: .4s;
 }
 
 .slider:before {
   position: absolute;
   content: "";
   height: 18px;
   width: 18px;
   left: 3px;
   top: 3px;
   background-color: white;
   -webkit-transition: .4s;
   transition: .4s;
 }
 
 input:checked + .slider {
   background-color: #2196F3;
 }
 
 input:focus + .slider {
   box-shadow: 0 0 1px #2196F3;
 }
 
 input:checked + .slider:before {
   -webkit-transform: translateX(18px);
   -ms-transform: translateX(18px);
   transform: translateX(18px);
 }
 

 .slider.round {
   border-radius: 34px;
 }
 
 .slider.round:before {
   border-radius: 50%;
 }

 .catalog-price__title{
   font-size: 16px;
   font-weight: 700;
   line-height: 1.37;
   color: var(--black);

   margin-top: 20px;
   margin-bottom: 5px;
 }

 .catalog-price__range-inputs{
   display: flex;
   padding: 0;
   border-radius: 10px;

 }

 .catalog-price__range-inputs input{
   -webkit-appearance: none;
   font-size: 14px;
   font-weight: 700;
   line-height: 1.57;
   color: var(--black);
   background-color: var(--gray-light);
   border: none;
   text-align: center;
   padding: 14px;
 }

 .catalog-price__range-inputs input:first-child{
   border-right: 1px solid var(--gray);
   border-radius: 10px 0 0 10px;
 }
 .catalog-price__range-inputs input:last-child{
   border-radius: 0 10px 10px 0;
 }

 .catalog-price__range-slider {
   position: relative;
   margin-top: 35px;
   height: 5px;
   border-radius: 5px;
   background-color: #AEBDD2;
}

.price-range__progress{
   height: 100%;
   left: 0%;
   right: 0%;
   position: absolute;
   border-radius: 5px;
   background-color: var(--blue);
}

.price-range__inputs{
   position: relative;
}  

.price-range__inputs input{
   position: absolute;
   width: 100%;
   height: 5px;
   top: 0;
   background: none;
   pointer-events: none;
   -webkit-appearance: none;
   -moz-appearance: none;
}  

.price-range__inputs input[type="range"]::-webkit-slider-thumb{
   -webkit-appearance: none;
   height: 24px;
   width: 24px;
   border-radius: 5px;
   background: var(--blue);
   pointer-events: auto;
   cursor: pointer;
   
}  
.price-range__inputs input[type="range"]::-moz-range-thumb{
   -webkit-appearance: none;
   height: 24px;
   width: 24px;
   border-radius: 5px;
   background: var(--blue);
   pointer-events: auto;
   cursor: pointer;
   
}  


.catalog-reset{
   padding: 0;
   margin-top: 35px;
}
.catalog-reset button{
   width: 100%;
   height: 100%;
   padding: 14px 20px;
   background-color: var(--gray-light);
   border-radius: 10px;

   display: flex;
   justify-content: space-between;
   align-items: baseline;

   transition: all 0.4 ease-in;
}
.catalog-reset button span{
   font-size: 16px;
   font-weight: 700;
   color: var(--semi-gray);
}

.catalog-reset button:hover{
   background-color: var(--white);
}
.catalog-reset button svg{
   width: 16px;
   height: 16px;
}



.catalog-show{
   padding: 0;
   margin-top: 35px;
}
.catalog-show button{
   width: 100%;
   height: 100%;
   padding: 14px 20px;
   background-color: var(--blue);
   border-radius: 10px;

   display: flex;
   justify-content: space-between;
   align-items: baseline;

   transition: all 0.4 ease-in;
}
.catalog-show button span{
   font-size: 16px;
   font-weight: 700;
   color: var(--white);
}

.catalog-show button svg{
   width: 16px;
   height: 16px;
   fill: var(--blue);
   background-color: var(--white);
   border-radius: 50%;
   padding: 2px;
}
/*
   END Side filter Block
*/


/*
   START Main product Block
*/

.catalog-category__products{
   margin-bottom: 20px;
   width: 100%;
}
.catalog-category__products h1{
   font-size: 60px;
   font-weight: 800;
   line-height: 1.2;

   color: var(--semi-black);
   margin-bottom: 30px;
}

.catalog-category__products h1 span{
   font-size: 24px;
   font-weight: 700;
   line-height: 1.4;
   color: var(--semi-gray);

   margin-left: 5px;
   vertical-align: top;
}

.catalog-products__controls{
   position: relative;
}
.catalog-control{
   display: flex;
   align-items: end;
   gap: 10px;

   cursor: pointer;
   transition: all 0.3 ease-in;
}

.catalog-control:hover{
   color: var(--semi-gray);
}

.catalog-control span{
   font-size: 20px;
   line-height: 1;
   font-weight: 600;
}

.catalog-control svg{
   width: 16px;
   height: 16px;
}

.catalog-control__dropdown{
   display: none;
   flex-direction: column;
   gap: 10px;

   position: absolute;
   z-index: 30;
   background-color: var(--white);
   top: calc(100% + 10px);
   padding: 20px 25px;
   border-radius: 24px;
   box-shadow: 0 15px 30px rgba(66, 71, 99, .4);
   transition: all 0.2 ease-in visibility .2s ease-in;
}
.catalog-control__dropdown.is-active{
   visibility: visible;
   pointer-events: auto;
   display: flex;
}
.catalog-control__item{
   font-size: 20px;
   line-height: 1.4;
   font-weight: 700;
   color: var(--semi-black);
   text-align: left;
   white-space: nowrap;
   transition: all 0.2 ease-in;
}
.catalog-control__item:hover{
   color: var(--semi-gray);
}
.catalog-control__item.is-active{
   color: var(--blue);
   pointer-events: none;
}

.catalog-products__list{
   margin-top: 20px;
   display: flex;
   flex-wrap: wrap;
   gap: 10px;
   width: 100%;
}
.inner-product-card{
   width: 244px;
   display: flex;
   flex-direction: column;
   flex-grow: 1; /* Растягиваем по высоте */
}

.catalog-product__pagination{
   margin-top: 25px;
   display: flex;
}
.base-button,
.parent-product-link,
.base-red-button{
   /* width: 360px; */
   width: 100%;
   margin-right: 30px;
   background-color: var(--black);
   border-radius: 20px;
   padding: 27px 0;

   position: relative;
   transition: all 0.2 ease-in;
}
.base-button:hover{
   background-color: var(--blue);
}
.base-button span{
   font-size: 24px;
   line-height: 1;
   font-weight: 700;
   color: var(--white);

}
.base-button svg{
   width: 30px;
   height: 30px;

   position: absolute;
   top: 10px;
   right: 10px;
   fill: var(--white);
   stroke: var(--white);
}

.base-silver-button{
   width: 360px;
   margin-right: 30px;
   background-color: var(--gray);
   border-radius: 20px;
   padding: 27px 0;

   position: relative;
   transition: all 0.2 ease-in;
}
.base-silver-button:hover{
   background-color: var(--semi-gray);
}
.base-silver-button:hover svg{
   stroke: var(--white);
}
.base-silver-button span{
   font-size: 24px;
   line-height: 1;
   font-weight: 700;
   color: var(--white);

}
.base-silver-button svg{
   width: 30px;
   height: 30px;
   stroke: var(--semi-gray);

   position: absolute;
   top: 10px;
   right: 10px;
}


.base-red-button{
   /* width: 360px; */
   margin-right: 30px;
   background-color: #F14635;
   border-radius: 20px;
   padding: 27px 0;

   position: relative;
   transition: all 0.2 ease-in;
}
.base-red-button:hover{
   background-color: var(--semi-gray);
}
.base-red-button:hover svg{
   stroke: var(--white);
   fill: var(--white);
}
.base-red-button{
   font-size: 24px;
   line-height: 1;
   font-weight: 700;
   color: var(--white);
   display: flex;
   justify-content: center;
   align-items: center;
}
.base-red__description{
   font-size: 18px;
   margin-top: 10px;
}
.base-red__description small{
   font-size: 0.7em;
}
.base-red-button svg{
   width: 40px;
   height: 40px;
   stroke: var(--white);
   margin-right: 15px;
}

.catalog-pagination{
   display: flex;
   gap: 5px;
   background-color: var(--gray-light);
   border-radius: 30px;
   padding: 10px;
   font-size: 24px;
   font-weight: 700;
   color: var(--semi-gray);
}

.pagination-page-item{
   display: flex;
   justify-content: center;
   align-items: center;
   background-color: none;
   border-radius: 50%;
   width: 60px;
   height: 60px;
}
.pagination-page-item.is-active{
   background-color: var(--white);
   color: var(--semi-black);
}
.pagination-page-item:hover{
   color: var(--semi-black);
}
/*
   END Main product Block
*/




/*
   START PRODUCT DETAILS PAGE
*/


.product-availbale {
   color: var(--blue);
}

.product-availbale.unavailable {
   color: var(--red);
}

.product-availbale svg{
   width: 12px;
   height: 22px;
   fill: var(--blue);
}


.icon-lighting{

   color: var(--blue);
}

.no-available{
   color: var(--semi-black);
}
.no-available svg{
   fill: var(--semi-gray);
}
.product-wrap{
   display: flex;
   flex-direction: row;
   gap: 20px;
   position: relative;
}

.product-content__wrap{

}

.product-content{

}
.product-gallery__wrap{
   padding: 30px;
   border-top-left-radius: 24px;
   border-top-right-radius: 24px;
   background-color: var(--white);
   position: relative;
}

.product-gallery__wrap .label-lowered {
   position: absolute;
   right: 20px;
   top: 20px;
   display: block;
   padding: 5px 10px;
   font-size: 15px;
   background-color: var(--red);
   color: #fff;
   border-radius: 5px;
   font-weight: bolder;
}

.product__gallery{

}
.product-gallery__thumbs{

}
.product-gallery__container{
   min-width: 0;
   /* overflow: hidden; */
}


.product-body__content{
   padding: 30px;
   margin-top: 1px;
   background-color: var(--white);
   border-bottom-left-radius: 24px;
   border-bottom-right-radius: 24px;
}
.product-instruction-wrap{
   display: flex;
   flex-direction: column;

   margin: 30px 0 50px;
}
.product-instruction-wrap h3{
   font-size: 18px;
   font-weight: 700;
   color: var(--semi-black);

   margin-bottom: 20px;
}
.product-instruction{
   display: flex;
   flex-wrap: wrap;
   gap: 10px;

}
.instruction-item{
   display: flex;
   /* align-items: center; */
   max-width: 200px;
   width: 100%;
   gap: 5px;

   position: relative;
   padding: 10px;
   border-radius: 5px;
   background-color: var(--gray-light);
}
.instruction-item span{
   background-color: var(--black);
   padding: 5px 7px;
   border-radius: 5px;
   color: var(--white);
   font-size: 12px;
}
.instruction-item-img-wrap{
   display: flex;
   flex-direction: column;
   align-items: center;
   gap: 5px;
   font-size: 10px;
   font-weight: 700;
}
.instruction-item-description{
   font-size: 14px;
   line-height: 1.37;
   font-weight: 500;
   color: var(--semi-black);
}
.instruction-item__additional{
   display: flex;
   align-items: center;
   width: 230px;
   gap: 20px;

   border-radius: 5px;
}
.img-with__bg-gray{
   height: 100%;
   padding: 10px;

   background-color: var(--gray-light);
   border-radius: 5px;
}
.img-with__bg-gray img{
   padding: 5px;
}
.instruction-item__additional img{
   width: 40px;
}

.product-reviews__wrap{
margin-top: 20px;
}
.product-reviews-title-wrap{
   display: flex;
   align-items: center;
   gap: 15px;
}
.product-reviews-title-wrap h3{
   font-size: 18px;
   line-height: 1;
   font-weight: 800;
   color: var(--semi-black);
}
.review-middle-wrap{
   display: flex;
   align-items: center;

   position: relative;
}
.review-middle-wrap svg{
   position: absolute;
   top: -17px;
   left: -17px;
   width: 50px;

   fill:var(--yellow);
   stroke:var(--yellow);

   z-index: 0;
}
.review-middle{
   z-index: 1;
   font-size: 14px;
   font-weight: 700;
   color: var(--semi-black);
}
.review-middle span{
   color: var(--semi-gray);
   position: relative;
   padding-left: 3px;
}
.review-middle span:before{
   content: "/";
   margin-right: 3px;
}
.product-reviews{
   display: flex;
   flex-direction: column;
   gap: 20px;
   margin-top: 50px;

}
.product-review-item{
   display: flex;
   gap: 10px;
   justify-content: space-between;
   margin-bottom: 50px

}
.product-review-item__left{
   display: flex;
   flex-direction: column;
   gap: 10px;
}
.item-inner__wrap{
   display: flex;
   gap: 15px;
}
.item-inner-stars{
   display: flex;

}
.review-star{
   width: 24px;
   height: 24px;
   fill: var(--gray-light);
   cursor: pointer;
   transition: fill 0.3 ease;
}
.review-star:hover,
.review-star.hover {
   fill:var(--yellow);
   stroke:var(--yellow);
}
.review-star.active {
   fill:var(--yellow);
   stroke:var(--yellow);
}
.item-inner-description{
   font-size: 14px;
   line-height: 1.37;
   font-weight: 500;

   color: var(--semi-gray);

}

.item-inner__wrap h4{
   font-size: 18px;
   line-height: 1.2;
   font-weight: 700;
   color: var(--semi-black);

}
.product-review-item__right{
   display: flex;
   align-items: center;
   gap: 10px;
   flex-direction: column;
}
.product-review__date{
   font-size: 14px;
   line-height: 1.2;
   font-weight: 400;
   color: var(--semi-gray);
}
.product-review-item__right img{
   width: 100px;

}


.product-content__features{
   display: flex;
   flex-direction: column;
   background-color: var(--yellow-light);
   border-radius: 14px;
   padding: 30px 40px 40px;
   margin-bottom: 30px;
}
.product-feature__title{
   font-size: 32px;
   font-weight: 700;
   line-height: 1.37;
   color: var(--semi-black);
   
}
.product-feature__title svg{
   width: 32px;
   height: 32px;
   margin-right: 14px;
}
.product-feature__list{
   padding-top: 30px;
   padding-left: 10px;
   display: flex;
   flex-direction: column;
   gap: 10px;
}
.feature__item{
   position: relative;
   padding-left: 52px;
   font-size: 20px;
   font-weight: 700;
   line-height: 1.4;
   color: var(--semi-black);
}
.feature__item:before{
   content: "";
   position: absolute;
   left: 0;
   top: 50%;
   transform: translateY(-50%);
   border-width: 6px 0 6px 9px;
   border-style: solid;
   border-color: transparent transparent transparent #e1d3c1;
}
.product-tabs{
   margin-bottom: 70px;
}
.product-tab__item{
   font-size: 18px;
   font-weight: 700;
   color: var(--semi-gray);
   transition: all 0.2 ease-in;
}

.product-tab__item:hover{
   font-weight: 800;
   color: var(--blue)
}


.product-content__description h1 {
   font-size: 30px;
   margin-bottom: 20px;
}

.product-content__description em {
   font-style: italic;
}

.product-content__description figure img {
   width: 100% !important;
   height: auto !important;
}

.product-content__description .attachment__caption {
   display: none !important;
}

.product-content__description i {
   font-style: italic;
}

.product-content__description b {
   font-weight: bolder;
}

.product-content__description strong {
   font-weight: bolder;
}

.product-content__description{
   transition: all 0.2 ease-in;
}
.product-content__description h3{
   font-size: 28px;
   line-height: 1.28;
   font-weight: 700;
   color: var(--semi-black);
   margin-bottom: 15px;
}
.product-content__description p{
   display: block;
   font-size: 16px;
   line-height: 1.5;
   font-weight: 500;
   margin-bottom: 25px;
}
.product-content__text{
   position: relative;
   max-height: 250px;
   overflow: hidden;
}
.product-content__text.expanded {
   max-height: none;
   overflow: visible;
}
.gradient-block{
   position: absolute;
   z-index: 1;
   left: 0;
   right: 0;
   bottom: 0;
   height: 70px;
   background: linear-gradient(hsla(0, 0%, 100%, 0), #fff);
}
.text-skiper{
   font-size: 14px;
   font-weight: 700;
   margin-top: 16px;

   color: var(--blue);
}
.text-skiper svg{
   fill: var(--blue);
   transform: rotate(-90deg);
}
.text-skiped {
   display: none;
}
.text-skiped svg{
   transform: rotate(90deg);
}
.product-content__property{

}
.product-content__property h3{
   font-size: 28px;
   line-height: 1.28;
   font-weight: 700;
   color: var(--semi-black);
   margin-bottom: 15px;
}
.product-property__list{
   list-style: none;
}
.property__item{
   padding: 18px 0 20px;
   border-top: none;
   border-bottom: 1px solid rgba(173, 189, 210, .5);
   display: flex;
   font-size: 16px;
   font-weight: 700;
}
.property-item__title{
   display: block;
   color: var(--semi-black);
   width: 238px;
}
.property-item__content{
   display: block;
   color: var(--semi-gray);
}

.product-property-second__list{
   position: relative;
}
.product-property-second__item{
   font-size: 16px;
   line-height: 2;
   font-weight: 400;
   padding-left: 8px;
   position: relative;

   color: var(--semi-black);
}
.product-property-second__item:after{
   content: "";
   position: absolute;
   top: 15px;
   left: 0;
   width: 2px;
   height: 2px;
   background-color: var(--semi-gray);
   border-radius: 50%;
}


.checkbox-wrapper-47 input[type="checkbox"] {
   display: none;
   visibility: hidden;
 }

 .checkbox-wrapper-47 label {
   position: relative;
   padding-left: 2em;
   padding-right: 1em;
   line-height: 2;
   cursor: pointer;
   display: inline-flex;
   z-index: 1;
 }

 .checkbox-wrapper-47 label:before {
   box-sizing: border-box;
   content: " ";
   position: absolute;
   top: 0.3em;
   left: 0;
   display: block;
   width: 1.4em;
   height: 1.4em;
   border: 2px solid #9098A9;
   border-radius: 6px;
   z-index: -1;
 }

 .checkbox-wrapper-47 input[type=checkbox]:checked + label {
   padding-left: 1em;
   color: #fff;
 }
 .checkbox-wrapper-47 input[type=checkbox]:checked + label:before {
   top: 0;
   width: 100%;
   height: 100%;
   background: rgba(3, 169, 244, 0.6);
   border-color: var(--blue);
 }

 .checkbox-wrapper-47 label,
 .checkbox-wrapper-47 label::before {
   transition: 0.25s all ease;
 }



.product-info{
   padding: 30px;
   border-radius: 24px;
   background-color: var(--yellow-light);

   display: flex;
   align-items: center;
   gap: 20px;

   font-size: 16px;
   font-weight: 500;
   line-height: 1.5;
   margin-top: 10px;
}



.catalog-title {
   font-size: 28px;
   line-height: 1.28;
   font-weight: 700;
   color: var(--semi-black);
   margin-bottom: 15px;
}

.category-block {
   display: flex;
   flex-direction: column;
   min-height: 352px;
   background-color: #fff;
   margin-bottom: 30px;
   border-radius: 10px;
   padding: 20px;
   /* box-shadow: 0 1px 4px 1px rgba(0, 0, 0, 0.1); */
}

.category-block .category-image {
   margin-bottom: 10px;
   min-height: 266px;
   display: flex;
   align-items: center;
   justify-content: center;
}

.category-block .category-image img {
   width: 100%;
}

.category-block .category-name {
   font-size: 18px;
   line-height: 1.4;
   font-weight: 700;
   text-transform: uppercase;
   color: #03a9f4;
}

.product-side{
   min-width: 404px;
   position: relative;
}

.product-side__top{
   border-radius: 24px;
   background-color: var(--white);
   padding: 10px 30px 30px;
}
.product-side__top .tools-wrapper {
   justify-content: start;
}
.product-side__article-wrap{
   display: flex;
   justify-content: space-between;
   margin-top: 10px;

   font-size: 16px;
   line-height: 1.37;
   font-weight: 700;
}
.product-article{
   color: var(--semi-gray);
}


.product-title{
   font-size: 32px;
   font-weight: 700;
   line-height: 1.37;
   color: var(--semi-black);
   margin-top: 10px;
}

.product-title.mobile {
   display: none;
}
.product-favorite__wrap{

}
.product-comparison__wrap {
   margin-left: 15px;
}
.product-favorite,
.product-comparison{
   display: flex;
   gap: 10px;
   align-items: center;
   font-size: 14px;
   font-weight: 600;
   line-height: 1.57;
   color: var(--semi-gray);
   margin-top: 15px;
   cursor: pointer;
   width: max-content;
}
.product-favorite svg,
.product-comparison svg {
   fill: none;
   width: 18px;
}
.product-favorite svg{
   stroke: var(--red);
}
.product-comparison svg {
   stroke: var(--z2kad5);
}
.product-favorite.active svg {
   fill: var(--red);
   animation: prod-anime 0.3s;
}
.product-comparison.active svg {
   fill: var(--z2kad5);
   animation: prod-anime 0.3s;
}
@keyframes prod-anime{
   0%{
      transform: scale(1);
   }
   50%{
      transform: scale(1.6);
   }
   100%{
      transform: scale(1);
   }
}


.product-favorite:hover svg{
   fill: var(--red);
   stroke: var(--red);
}
.liked svg{
   fill: var(--red);
   stroke: var(--red);
}

.product-price{
   display: flex;
   flex-direction: column;
   gap: 10px;
   margin-top: 30px;
}
.product-price span{
   font-size: 0.7em;
}
.product-price__current{
   font-size: 48px;
   line-height: 1;
   font-weight: 800;
   color: var(--red);
}
.product-price__old{
   font-size: 20px;
   font-weight: 700;
   line-height: 1;
   color: var(--semi-gray);
   text-decoration: line-through;
}

.product-controls{
   display: flex;
   flex-direction: column;
   gap: 10px;
   margin-top: 20px;
}



.product-side__center{
   margin-top: 1px;
   margin-bottom: 30px;
   border-bottom-left-radius: 24px;
   border-bottom-right-radius: 24px;
   background-color: var(--white);
   /* padding: 10px 30px 30px; */
   padding: 30px 30px 0;
}

.delivery-address__wrap,
.delivery-info__wrap{
   display: flex;
   flex-direction: column;
   /* padding-top: 20px; */
   padding-top: 10px;
}

.delivery-address__wrap span{
   font-size: 16px;
   line-height: 1.37;
   font-weight: 700;
   color: var(--semi-gray);
}

.delivery-address__wrap .parent-product-link {
   background-color: var(--blue);
   font-weight: bolder;
   color: var(--white);
   display: flex;
   justify-content: center;
   align-items: center;
   /* padding: 5px 10px; */
   /* min-height: 50px; */
   /* border-radius: 10px; */
}

.delivery-address__wrap p.city-group-title {
   font-size: 20px;
   line-height: 1.37;
   font-weight: 700;
   color: var(--semi-gray);
   margin-bottom: 10px;
}

.delivery-info-title {
   font-size: 20px;
   line-height: 1.37;
   font-weight: 700;
   color: var(--semi-gray);
   margin-bottom: 10px;
}

.delivery-address__wrap ul.city-group-stocks li {
   display: flex;
   flex-direction: column;
   font-size: 15px;
   padding-bottom: 10px;
   margin-bottom: 10px;
   border-bottom: 1px solid var(--gray);
}

.delivery-info-list li {
   display: flex;
   flex-direction: column;
   font-size: 15px;
   padding-bottom: 10px;
   margin-bottom: 10px;
   border-bottom: 1px solid var(--gray);
}

.delivery-info-list li b {
   font-weight: bolder;
   margin-bottom: 5px;
}

.delivery-info-list li b span {
   font-weight: 400;
}

.delivery-address__wrap ul.city-group-stocks li b {
   font-weight: bolder;
   margin-bottom: 5px;
}

.delivery-address__wrap ul.city-group-stocks li span {
   font-weight: 400;
   
}

.delivery__city{
   text-align: start;
   font-size: 32px;
   line-height: 1.37;
   font-weight: 700;
   color: var(--blue);
   margin-bottom: 30px;
}
.delivery__empty{
   font-size: 14px;
   line-height: 1.37;
   font-weight: 400;
   text-align: center;
   margin: 30px 0;
}

.product-side__bottom{
   display: flex;
   flex-direction: column;
   gap: 10px;
}
.side-banner img{
   border-radius: 12px;
}





.advantage-block{
   display: flex;
   flex-direction: column;
   margin-top: 50px;
   padding-bottom: 80px;
}
.advantage-block h3{
   font-size: 48px;
   line-height: 1.25;
   font-weight: 800;
   margin-bottom: 60px;
   text-align: center;

}

.advantages{
   display: flex;
   flex-wrap: wrap;
}
.advantage-item__wrap{
   flex-basis: calc(33.3333% - 10px);
   max-width: calc(33.3333% - 10px);
   margin: 5px;
}
.adtavtage-item{
   border-radius: 24px;
   background-color: var(--gray-light);
   padding: 20px;
   height: 100%;
   display: flex;
   align-items: center;
   gap: 20px;
}
.advantage-item__img{
   display: flex;
   justify-content: center;
   align-items: center;
   pointer-events: none;
   border-radius: 50%;

   width: 80px;
   height: 80px;
   background-color: green;
}
.advantage-item__img svg{

}
.advantage-item__content{
   display: flex;
   flex-direction: column;
   gap: 10px;

   font-size: 12px;
   font-weight: 500;
   line-height: 1.66;
   color: #475362;

}
.advantage-item__content h4{
   font-size: 18px;
   line-height: 1;
   font-weight: 700;
   color: #364758;
}
.advantage_1{
   background-color: #27AE4D;
}
.advantage_2{
   background-color: #FF93B3;
}
.advantage_3{
   background-color: #F3AF11;
}
.advantage_4{
   background-color: #52ABFD;   
}
.advantage_5{
   background-color: #8271FC;   
}
.advantage_6{
   background-color: #25A6AE;   
}

.catalog-control__mobile{
   display: none;
}
.catalog-control__desktop{
   display: block;
}




.swiper-thumbs{
   display: flex;
   flex-direction: column;
   margin-right: 10px;
}

.swiper-thumbs .swiper-slide img {
   max-height: 80px;
}


.swiper-container {
   width: 100%;
   height: 100%;
   margin: 0;
   overflow: hidden;
 }

 .swiper-slide {
   background-size: cover;
   background-position: center;
 }

 .gallery-top {
   height: 100%;
   width: 100%;
 }

 .gallery-thumbs {
   width: 80px;
   box-sizing: border-box;
   height: auto !important;
   /* padding: 10px; */
 }

.swiper-slide-active {
   display: flex;
   justify-content: center;
   align-items: center;
}

 .gallery-thumbs .swiper-slide {
   height: 100%;
   opacity: 0.4;
 }

 .gallery-thumbs .swiper-slide-thumb-active {
   opacity: 1;
 }

 .pickup_free {
   color: green;
 }

 /* Comparison */
 .product-comparison__icon {
   width: 18px;
   height: 18px;
   background: no-repeat center url(../images/icons/header/comparison.png);
   background-size: contain;
}
.product-comparison__icon.is_active {
   background: no-repeat center url(../images/icons/header/comparison_active.png);
   background-size: contain;
}
 /* End comparison */

 .lowered-info {
   display: flex;
   flex-direction: column;
   gap: 16px;
   background-color: #fff;
   border-radius: 10px;
   padding: 20px;
   margin-bottom: 30px;
 }

 .lowered-info__title {
   font-size: 28px;
   margin-bottom: 0;
   text-align: center;
   font-weight: 600;
 }

 .lowered-info__details {
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
   gap: 10px;
 }

 .lowered-info__details__detail {
   display: flex;
   align-items: flex-start;
   gap: 16px;
   width: 32%;
 }

 .lowered-info__details__detail span {
   display: flex;
   align-items: center;
   justify-content: center;
   width: 40px;
   height: 40px;
   min-width: 40px;
   border-radius: 40px;
   border: 3px solid #03a9f4;
 }

 .lowered-info__details__detail p {
   font-size: 14px;
 }

@media screen and (max-width:1365px){
   .advantage-item__wrap{
      flex-basis: calc(50% - 10px);
      max-width: calc(50% - 10px);
   }
}

@media screen and (max-width: 1292px) {
   .catalog-products__list{
      gap: 10px;
   }
   .inner-product-card{
      flex-grow: 1;
      /* width: 330px; */
      width: 240px;
   }
}

@media screen and (max-width: 1275px) {
   .product-wrap {
      gap: 10px;
   }
   .product-side__top {
      padding: 10px 10px 30px;
   }
   .product-side {
      max-width: 370px;
      min-width: 340px;
   }
   .product-content__wrap {
      width: 770px;
   }
}

@media screen and (max-width: 1195px) {
   .product-side {
      min-width: 300px;
   }
   .product-content__wrap {
      width: 700px;
   }
}


.product-details__mobile{
   display: none;
}
.product-delivery__mobile{
   display: none;
}

@media screen and (max-width:991px) {
   .product-content__wrap {
      width: 100%;
   }
   .product-content__features{
      padding: 15px;
   }
   .product-feature__title svg{
      width: 18px;
      height: 18px;
      margin-right: 7px;
   }
   .product-feature__title{
      font-size: 18px;
   }
   .product-feature__list{
      margin-bottom: 10px;
   }
   .feature__item{
      padding-left: 17px;
      font-size: 14px;
   }
   .feature__item:before {
      border-width: 3px 0 3px 5px;
   }

   .product-gallery__wrap {
      padding: 10px 20px 20px;
   }

   .product-title.mobile {
      display: block;
      margin-bottom: 30px;
      font-size: 20px;
   }

   .product-title.mobile.padding-lowered {
      margin-top: 40px;
   }

   .base-button span, .base-silver-button span,
   .base-red-button .base-red__title{
      width: 100%;
      font-size: 18px;
   }
   .product-side{
      display: none;
   }

   .product-details__mobile{
      display: block;
   }
   .product-details__mobile .tools-wrapper {
      justify-content: start;
   }
   .product-delivery__mobile{
      display: block;
      flex-direction: column;
      font-size: 14px;
      border-top: 1px solid var(--gray-light);
      margin-top: 20px;
      
   }
   .product-delivery__mobile .delivery__city{
      font-size: 18px;
      margin-top: 10px;
   }

   .product-review-item{
      flex-direction: column;
      padding-bottom: 20px;
      margin-bottom: 0;
      border-bottom: 1px solid var(--gray-light);
   }


   .swiper-thumbs{
      display: none;
   }


   .catalog-reset button{
      margin-top: 0px;
   }
   .desktop-hide{
      display: none;
   }
   .catalog-category__products h1{
      font-size: 30px;
   }
   .catalog-category__products h1 span{
      font-size: 18px;
   }
   .catalog-control__mobile{
      display: flex;
      justify-content: space-between;
   }
   .catalog-category__desktop{
      display: none;
   }
   .catalog-control__desktop{
      display: none;
   }
   .catalog-filter svg{
      width: 34px;
      height: 34px;
   }




   .catalog-control span{
      font-size: 18px;
   }
   .catalog-control__dropdown{
      right: 10px;
   }
   
   .catalog-product__pagination{
      display: flex;
      flex-direction: column;
      gap: 10px;
   }
   .base-button{
      width: 100%;
   }
   .catalog-pagination{
      justify-content: center;
      font-size: 18px;
   }

   .product-wrap{
      flex-direction: column;
   }
   .product-body__content{
      border-bottom-left-radius: 24px;
      border-bottom-right-radius: 24px;
      padding: 10px;
   }
   .product-content__description h3{
      font-size: 18px;
      margin-bottom: 5px;
   }
   .product-content__property h3{
      font-size: 18px;
      margin-bottom: 5px;
   }
   .product-content__description p{
      font-size: 14px;
      margin-bottom: 15px;
   }
   .property__item{
      flex-direction: column;
      gap: 5px;
      /* font-weight: 500; */
      font-weight: 600;
   }
  

   .advantage-item__wrap{
      flex-basis: 100%;
      max-width: 100%;
      margin: 0ж
   }






   .product-info{
      flex-direction: column;
      text-align: center;
   }
   .product-side{
      width: 100%;
   }
   .product-side__top{
      border-top-left-radius: 0px;
      border-top-right-radius: 0px;
      background-color: var(--white);
      padding: 10px;
   }
   .product-side__center{
      border-top-left-radius: 0px;
      border-top-right-radius: 0px;
      background-color: var(--white);
      padding: 10px;
   }
   .base-button,
   .base-silver-button,
   .base-red-button{
      width: 100%;
   }
   .side-banner{
      display: flex;
      flex-direction: column;
      align-items: center;
   }



   .product-details__mobile .product-side__article-wrap{
      flex-direction: column;
      gap: 5px;
      font-size: 14px;
   }
   .product-details__mobile .product-side__article-wrap .product-title{
      font-size: 16px;
   }
   .product-details__mobile .product-price{
      flex-direction: row;
      align-items: baseline;
      font-size: 16px;
   }
   .product-details__mobile .product-price__current{
      font-size: 36px;
   }
   .product-details__mobile .product-price__old{
      font-size: 20px;
   }

   .catalog-products__list {
      justify-content: center;
      align-items: stretch;
      gap: 1px;
   }

   .main-products__card {
      /* flex: 0 1 calc(33.33% - 10px); */
      flex: 1 1 calc(50% - 20px); /* 2 карточки в ряду, с учетом промежутков */
      display: flex;
      flex-direction: column;
    }

    .base-red-button svg{
      width: 25px;
      height: 25px;
   }

   .base-red-button {
      margin-right: initial;
   }

}

@media screen and (max-width: 935px) {
   .lowered-info__details {
      flex-wrap: wrap;
      justify-content: center;
   }

   .lowered-info__details__detail {
      min-width: 240px;
      width: 49%;
   }
}

@media screen and (max-width: 701px) {
   .inner-product-card{
      width: 100%;
   }

   .inner-products__mobile.hide-desktop .inner-product-card {
      width: 100%;
   }

   .catalog-pagination{
      font-size: 16px;
   }
  
}

@media screen and (max-width: 571px) {
   .lowered-info {
      padding: 20px 10px;
   }

   .lowered-info__details__detail {
      min-width: 240px;
      width: 100%;
   }
}

@media screen and (max-width: 460px) {
   .adtavtage-item {
      gap: 10px;
   }

   .advantage-item__img {
      width: 50px;
      height: 50px;
   }

   .advantage-block.h-container {
      padding: 0;
   }
}

@media screen and (max-width: 414px) {
   .inner-products__mobile.hide-desktop .inner-product-card {
      width: 100%;
   }
}

@media screen and (max-width: 442px) {
   .product-tab__item {
      font-size: 13px;
      padding: 8px 6px !important;
   }
}

@media screen and (max-width: 412px) {
   .inner-products__mobile.hide-desktop .inner-product-card {
      width: 100%;
   }
}

@media screen and (max-width: 390px) {
   .inner-products__mobile.hide-desktop .inner-product-card {
      width: 100%;
   }
}

@media screen and (max-width: 360px) {
   .inner-products__mobile.hide-desktop .inner-product-card {
      width: 100%;
   }
}

/*
   END PRODUCT DETAILS PAGE
*/

.catalog-mob-menu-wrap__body.this-active{
    transform: translateY(0);
}

.catalog-mob-menu-wrap__body {
    background-color: #fff;
    position: fixed;
    top: 83px;
    left: 0;
    width: 100%;
    max-height: 100%;
    padding: 10px;
    overflow: auto;
    transform: translateY(-120%);
    transition: transform .3s ease-in-out;
    z-index: 2061;
}



.product-gallery__container{
   width: 100%; 
   max-width: 776px;
   max-height: 670px;
   height: 100%;
   display: flex;
   flex-direction: row;
}









