Как убрать тряску при убирание скролла?

const openButtonRelationsCustom = document.querySelector('.product__order ');
if(openButtonRelationsCustom) {
  const closePopupRelations = document.querySelector('.relations-popup__close');
  const popupRelations= document.querySelector('.relations-popup');
  const overlay = document.querySelector('.overlay')
  let releations = document.querySelector('.relations-popup__body')

  openButtonRelationsCustom.addEventListener('click', function(e) {
    e.preventDefault();
    popupRelations.classList.remove('hidden');
    overlay.classList.add('show')
    releations.classList.add('fadeTop')
    document.body.classList.add('no-scroll');
  });

  overlay.addEventListener('click', () => {
    popupRelations.classList.add('hidden')
    overlay.classList.remove('show')
    document.body.classList.add('no-scroll');
  })
  
  closePopupRelations.addEventListener('click', function() {
    popupRelations.classList.add('hidden')
    overlay.classList.remove('show')
    document.body.classList.remove('no-scroll');
  });
}

.overlay {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
  backdrop-filter: blur(15px);
  z-index: 92;
}

.no-scroll {
  overflow: hidden;
}

.relations-popup {
      position: fixed;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      z-index: 99;

  &__body {
    position: relative;
    padding: 30px 70px;
    background: #FFFFFF;
    border-radius: 22px;
    z-index: 99;
    height: 270px;
    margin-bottom: 50px;
  }

  &__wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    width: 100%;
  }

  &__body::after {
    content: '';
    position: absolute;
    background-image: url('/images/product/border-popup.svg');
    top: 0;
    left: 0;
    width: 447px;
    height: 274px;
    z-index: -3;
  }

  &__content {
    position: relative;
    margin: 30px 0 20px 0;
  }

  &__title {
    font-weight: 700;
    font-size: 32px;
  }

  &__subtitle {
    font-weight: 600;
    font-size: 18px;
  }

  &__input {
    position: relative;
    margin-top: 4px;
    width: 300px;
  }

  &__input-bc {
    position: absolute;
    top: 28px;
    right: 10px;
    width: 56px;
    height: 46px;
    background: linear-gradient(270deg, #E8E8E8 20.68%, rgba(232, 232, 232, 0) 100%);
    border-radius: 0px 15px 15px 0px;
}

  &__btn {
    display: block;
    width: 190px;
    padding: 15px 24px;
    margin: 0 auto;
    cursor: pointer;
  }

  &__close {
    position: absolute;
    top: 16px;
    right: 16px;
  }
}

<div class="relations-popup hidden">
      <div class="relations-popup__wrapper">
          <div class="relations-popup__body fadeTop">
            <h3 class="relations-popup__title red-text">БЫСТРЫЙ ЗАКАЗ</h3>
            <div class="relations-popup__content">
              <div class="relations-popup__subtitle">Как с Вами связаться?</div>
              <input type="text" class="relations-popup__input input-text" placeholder="Номер телефона / email / соц. сети / мессе">
              <div class="relations-popup__input-bc"></div>
            </div>
            <a href="/bill.html" class="relations-popup__btn red-hover-btn">Оформить заказ</a>
            <button class="relations-popup__close"><img src="/images/product/close.svg" alt="close"></button>
          </div>
      </div>
</div>