/* Каркас сайта (chat-widget) — есть на каждой странице. */

/*
 * Пока видна плашка cookies, кружок виджета уезжает над ней. Без этого он
 * ложится на плашку: на десктопе — на картинку в её правом нижнем углу, на
 * мобильном (где правило ниже уводит виджет влево) — прямо на кнопку
 * «I agree».
 *
 * Класс `nv-cookie-visible` на `<body>` и высоту плашки в `--nv-cookie-height`
 * ставит `initCookieBanner()` (js/main.js). Через класс на body, а не
 * комбинатором от самой плашки, потому что виджет вставляется скриптом ПЕРЕД
 * разметкой темы (`#web-chat-widget-root` идёт до `#site-content`), и
 * селектора от `#cookieBanner` к нему не существует.
 *
 * 48px = 32px (отступ плашки от низа) + 16px зазора. Запасное значение высоты
 * нужно на случай, если JS не отработал: тогда кружок всё равно не на плашке.
 * `!important` — потому что собственный класс виджета `wc-bottom-4` тоже
 * задаёт `bottom` и приходит из чужой разметки.
 */
body.nv-cookie-visible .web-chat-widget .wc-chat-button {
    bottom: calc(var(--nv-cookie-height, 248px) + 48px)!important;
}

/*
 * Пока открыто мобильное меню, кружок убран совсем: он стоит `fixed` с z-index 9998,
 * то есть поверх меню, и ложится на его кнопки, а когда языков много — ещё и на плашки
 * языков. Класс `nv-menu-open` на `<body>` ставит `initHeaderMenu()` (js/main.js) и
 * только на мобильной ширине, поэтому своего media-запроса правилу не нужно.
 *
 * `visibility`, а не `display`: виджет чужой, и перерисовывать его на каждое открытие
 * меню незачем — прячем, не трогая его разметку и состояние. Правило выше (подъём над
 * плашкой cookies) не затронуто: оно меняет `bottom`, и когда меню закроется, кружок
 * вернётся туда же, где был.
 */
body.nv-menu-open .web-chat-widget {
    visibility: hidden;
    pointer-events: none;
}

@media (max-width: 575.98px) {
    .wp-singular .web-chat-widget .wc-right-4 {
        right: unset!important;
        left: 1rem!important;
    }
}
