body.lock {
  overflow: hidden;
}

.price-bin {
  width: 18px;
  height: 18px;
  background-image: url(assets/c74be354e4ae3079b917.svg);
  background-size: cover;
  margin-right: 3px;
}

.soldOut {
  font-size: 10px;
  color: red;
  font-weight: bold;
}

.price.putToCartButton {
  transition: box-shadow 0.2s; /* добавляем плавный переход для box-shadow */
  background-color: #3625FF;

}

.price.putToCartButton:hover {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.8); /* добавляем тень вокруг кнопки */
}

.cart {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #FFFFFF;
  border: none;
  cursor: pointer;
  height: 28px;
  position: relative;
  border-radius: 4px;
}

.cartAmount {
  position: absolute;
  top: -5px; /* Переместить элемент вверх */
  right: -10px; /* Переместить элемент вправо */
  background-color: #3625ff;
  border: 1.5px solid #FFFFFF;
  color: white;
  border-radius: 50%;
  width: 17px;
  height: 17px;
  line-height: 18px;
  text-align: center;
}

.cart__image {
  width: 18px;
  height: 18px;
  background-image: url(assets/0a073374a398e0c8413c.svg);
  background-size: cover;
  background-position: left;
}

.cart__title {
  color: #3625ff;
  margin-left: 3px;
}

/*.cartFull {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #3625ff;
  border: none;
  cursor: pointer;
  height: 28px;
}

.cartFull__image {
  width: 18px;
  height: 18px;
  background-image: url(../images/cart-white.svg);
  background-size: cover;
  background-position: left;
}

.cartFull__title {
  color: #FFFFFF;
  margin-left: 3px;
}*/

/*.button-search {
  width: 28px;
  height: 28px;
  background-image: url(../images/search.png);
  background-size: cover;
  background-position: center;
  cursor: pointer;
  border: none;
}*/


.popup-link {
  display: block;
  text-decoration: none;
  width: inherit;
  height: inherit;
  display: flex;
  justify-content: center;
  align-items: flex-end;
  padding: 6px 8px 6px 8px;
}

.popup {
  position: fixed;
  width: 100%;
  height: 100%;
  background-color: rgba(239, 238, 244, 0.8);
  top: 0;
  right: 0; /*чтобы корзина появлялась справа*/
  opacity: 0;
  visibility: hidden;
  overflow-y: auto; /*вертикальный скролл popup появится при необходимости*/
  overflow-x: hidden; /*горизонтальный скрол popup скрыт*/
  transition: all 0.8s ease 0s;
}
  
.popup.open {
  opacity: 1;
  visibility: visible;
}

.popup.open .popup__content {
  transform: perspective(600px) translate(0%, -50%) rotateY(0deg);
  opacity: 1;
}

.popup__area {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}

  .popup__body {
    min-height: 100vh;/*появился вертикальный скролл*/    
    display: flex;
    align-items: center;
    justify-content: center;
    /*padding: 30px 10px; /*чтобы popup не прилипал к краям экрана*/
  }

.popup__content {
  background-color: #fff;
  color: #000;
  min-width: 500px;
  min-height: 100vh;
  padding: 15px 40px;
  position: absolute;
  top: 50%; /*Положение по вертикали в центре */
  right: 0; /* Положение по горизонтали в центре */
  transform: translate(50%, -50%) perspective(600px) ; /* Центрируем и вращаем окно */
  transition: all 0.8s ease 0s; /* Плавное появление */
  opacity: 0;
  display: flex;
  flex-direction: column;
}

.popup__close {
  font-size: 20px;
  color: #000;
  text-decoration: none;
}

.popup__header {
  font-size: 20px;
  margin-bottom: 10px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}

.popup__header-label {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}

.popup__header-image {
  width: 18px;
  height: 18px;
  background-image: url(assets/0a073374a398e0c8413c.svg);
  background-size: cover;
  background-position: left;
}

.popup__header-title {
  color: rgba(54, 37, 255, 1);
  margin-left: 3px;
  font-size: 16px;
}

.popup__container {
  box-sizing: border-box;
  flex-grow: 1;
  display: flex;
  flex-direction: column;

}

.cart-empty {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  height: 250px;
}

.popup__container-top {
  height: 90%;
  flex-grow: 15;
}

.cart-list__item {
  transition: height 0.5s ease, opacity 0.5s ease;
  list-style-type: none;
  margin-top: 15px;
}

.cart-list__item.removing {
  height: 0;
  opacity: 0;
}

.cart-list__item-container {
  display: grid;
  grid-template-columns: 40px 200px 60px 25px 30px;
  align-items: center;
  gap: 15px;
  
}

.thumbnailWrapper {
  grid-column: 1;
  display: flex;
  justify-content: center;
  align-items: center;
}

.productThumbnail {
  object-fit: contain;
  width: 40px;
  height: 40px;
}

.productTitleWrapper {
  grid-column: 2;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.productAmounWrapper {
  border-radius: 5px;
  width: 50px;
  grid-column: 3;
  display: flex;
  justify-content: space-between;
  align-items: flex-end;
}

.minus,
.plus {
  width: 30px;
  height: 20px;
}

.productAmount {
  width: 35px;
  text-align: center; /* Выравнивание текста по центру */
}

.productPriceWrapper {
  grid-column: 4;
  display: flex;
  justify-content: center;
  align-items: center;
}

.deleteFromCartWrapper {
  grid-column: 5;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}

.deleteFromCart {
  width: 20px;
  height: 20px;
  background-image: url(assets/a75e42632437a3580ce1.svg);
  background-size: cover;
  background-position: center;
  cursor: pointer;
  border: none;
  background-color: #FFFFFF;
}





.popup__container-bottom {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: flex-end;
}

.popup__footer {
  margin-top: 10px;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

.button__backToProducts {
  border: none;
  border-radius: 2px;
  font-size: 18px;
  width: 100%;
  height: 40px;
  background-color: #3625ff;
  color: #fff;
  cursor: pointer;
  transition: box-shadow 0.2s; /* добавляем плавный переход для box-shadow */
}

.button__backToProducts:hover {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.8); /* добавляем тень вокруг кнопки */
}
.preloader{

    /* loading */
    
    position: absolute;
    z-index: 1;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
    background-color: #fff;
    
    };
.logotype {
    margin-left: 30px;
    width: 45px;
    height: 45px;
}

.logoImg {
    width: 100%;
}

.company {
    color: #ffffff;
    font-weight: 800;
    margin: auto;

    &::before {
        content: '• ';
        font-size: 12px;
    }

    &::after {
        content: ' •';
        font-size: 12px;
    }
}

.produce {
    color: #ffffff;
    padding: 0 25px;
}
.pagination {
    width: 100%;
    display: flex;
    justify-content: center;
}


.pageBtn {
    cursor: pointer;
    margin: 8px;
    padding: 6px 8px 6px 8px;
}

.pageBtn-active {
    border-radius: 12%;
    padding: 6px 8px 6px 8px;
    background-color: #3625FF;
    color: white;
    content: '• ';

    &::before {
        content: '• ';
        font-size: 12px;
    }
}
.pagination {
    width: 100%;
    display: flex;
    justify-content: center;
}


.pageBtn {
    cursor: pointer;
    margin: 8px;
    padding: 6px 8px 6px 8px;
}

.pageBtn-active {
    border-radius: 12%;
    padding: 6px 8px 6px 8px;
    background-color: #3625FF;
    color: white;
    content: '• ';

    &::before {
        content: '• ';
        font-size: 12px;
    }
}
*{margin:0;padding:0;box-sizing:border-box;font-weight:500;font-family:"Inter",sans-serif;color:#2e3438}.title{color:#2d9b92}.header{background-color:#3625ff;width:100%;height:64px;margin:0 0 1px 0;overflow:hidden}.header-row{padding:13px 14px 18px 14px;display:-ms-flexbox;display:flex;-ms-flex-wrap:row;flex-wrap:row;-ms-flex-align:center;align-items:center}.logo{color:#fff;font-weight:bolder;font-size:36px;padding:0 0 0 14px;cursor:pointer}.button{background-color:#fff;padding:6px 8px 6px 8px;border:0;cursor:pointer;color:#5c6970}.button.active{background-color:#3625ff;background-color:#3625ff;color:#fff}.button.active::before{content:"• ";font-size:12px}.search__block{display:-ms-flexbox;display:flex;margin:0 8px 0 18px}.button-search{width:28px;height:28px;background-image:url(assets/913359b8e0d7057d4719.png);background-size:cover;background-position:center;cursor:pointer;border:none;border-radius:4px}.inputSearch{border-style:none;padding:0 5px}.button-close{background-color:#fff;border-style:none;width:28px;height:28px;font-size:12px}.hide{display:none}.makeInvsbl{opacity:0;transition:opacity 1s}.attention{background-color:#3625ff;border-radius:0 10px 10px 10px;color:#fff;left:350px;line-height:20px;padding:15px;position:absolute;text-align:center;top:70px;width:250px}.basket{margin:0 0 0 8px}.container{width:100%;display:grid;grid-template-columns:repeat(4, 1fr);grid-gap:2px;gap:2px;padding:1px 0 0 0;height:100%}.item{background-color:#efeef4;min-width:320px;min-height:480px;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;overflow:hidden}.item-product{width:288px;height:436px;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column}.footer{display:-ms-flexbox;display:flex;height:50px;margin-top:2px;width:100%;height:64px;background-color:#2e3438;-ms-flex-pack:distribute;justify-content:space-around;-ms-flex-align:center;align-items:center}.discount{width:108px;height:24px;padding:2px 4px 2px 4px;background-color:#fff;border-radius:4px}.discount-percentage{color:#3625ff}.image-block{min-width:288px;min-height:288px;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;overflow:hidden}.image{max-width:100%}.rating{width:62px;height:24px;padding:2px 4px 2px 4px;background-color:#fff;border-radius:4px;margin-bottom:10px}.rating-star{color:#3625ff;padding:0 2px 0 2px}.title{font-size:14px;line-height:16px;margin-bottom:8px}.description{font-size:12px;margin-bottom:8px;min-height:44px}.price{width:71px;min-height:24px;padding:0 8px 0 4px;font-size:14px;line-height:16px;color:#fff;border-radius:4px;display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;-ms-flex-align:center;align-items:center;border:none;cursor:pointer}.category{display:-ms-flexbox;display:flex;overflow-x:auto;white-space:nowrap;gap:2px;margin-right:8px;white-space:nowrap;overflow:hidden}.category ::-webkit-scrollbar{width:0}