/* Страховка от горизонтальной прокрутки документа на мобильных.

   ЧТО ДЕЛАЕТ. На ширинах до 767px обрезает по горизонтали всё НЕ-fixed содержимое, вылезающее
   за край: documentElement.scrollWidth становится равен clientWidth. Замер: синтетический блок
   position: absolute с right: -25px даёт scrollWidth 385 при clientWidth 360 без правила и 360 с ним
   (412 -> 437 и 412). Смысл — чтобы будущий вылет (в том числе вставленный сторонним виджетом
   обратного звонка или чата) превращался в «не видно», а не в панорамирование страницы.

   ЧЕГО НЕ ДЕЛАЕТ. Не обрезает position: fixed-потомков body (плавающая панель .widgets,
   баннер cookie, кнопка «наверх») — такие элементы и не создают документной прокрутки по X
   (проверено: fixed-блок со свесом 500px оставляет scrollWidth == clientWidth). И не лечит
   переполнение на планшетных ширинах 769-1200: там правило не действует, вылеты правятся
   в самих блоках (см. reviews.css, stocks.css, news.css).

   ПОЧЕМУ ТРИ ПРАВИЛА, А НЕ ОДНО. Пока у html overflow: visible, браузер переносит overflow
   с body на вьюпорт — на этом держится проектная блокировка прокрутки под модалками:
   класс .o-hidden (bx-styles-base.css) ставят modal/modal.js, header/header.js (бургер) и
   popup-story/script.js, а services/insurance/osago.js пишет инлайновый overflow прямо в body.
   Любой не-visible overflow у html этот перенос отключает, body становится собственным
   скроллером, и при открытии модалки страница прыгает в начало, а после закрытия вертикальная
   прокрутка перестаёт работать (замер: y 1200 -> 0, после закрытия scrollY стоит, body.scrollTop=400).
   Поэтому на время блокировки overflow: hidden переносится на html, а с body любой нештатный
   overflow снимается.

   @supports обязателен: в браузерах с overflow: clip, но без :has() (Chrome 90-104) правила 2 и 3
   не сработали бы, и блокировка модалок сломалась бы. В @supports они не применяются вовсе. */

@media (max-width: 767px) {
  @supports selector(html:has(> body)) and (overflow-x: clip) {
    html,
    body {
      overflow-x: clip;
    }

    /* пока открыта модалка или бургер — запрет прокрутки переносим на html */
    html:has(> body.o-hidden),
    html:has(> body[style*="overflow: hidden"]),
    html:has(> body[style*="overflow:hidden"]),
    html:has(> body[style*="overflow-y: hidden"]),
    html:has(> body[style*="overflow-y:hidden"]) {
      overflow: hidden;
    }

    /* ...а с body снимаем любой нештатный overflow, иначе он станет вторым скроллером */
    html:has(> body.o-hidden) > body,
    html:has(> body[style*="overflow"]) > body {
      overflow: visible !important;
    }
  }
}
