/* =====================================================================
   Масштаб шаблона на компьютере — как Ctrl + «минус» в браузере.
   Число в --gr-scale: 0.9 = 90 %, 0.95 = 95 %, 1 = как было.
   Телефоны и планшеты (экран уже 1200px) не уменьшаются.
   Подключён последним в tpl/head.tpl; там же, после bootstrap.js, строка
   с boundary = 'viewport' (подсказки не вылезают за край экрана).
   Чтобы вернуть 100 % — удалите строку со scale.css в tpl/head.tpl.
   ===================================================================== */
:root {
    --gr-scale: 0.9;
}

@media (min-width: 1200px) {
    /* Уменьшается body, а не html: так ширина окна для скриптов (html.clientWidth) остаётся настоящей */
    body {
        zoom: var(--gr-scale);
    }

    /* Страница "Сайт на техработах" (tpl/off_site.tpl) рассчитана на высоту окна (100vh) — её не уменьшаем */
    body:has(.maintenance-page) {
        zoom: 1;
    }

    /* Чат справа был высотой 100vh, а в уменьшенной странице это 90 % экрана —
       растягиваем его от верха до низа окна */
    .chat_sidebar {
        bottom: 0;
        height: auto;
    }

    /* Эти окна сами считают своё место на экране, и расчёт совпадает с экраном только
       в масштабе 100 % — для них масштаб возвращаем, иначе они открываются в стороне:
       подсказки и всплывающие окна Bootstrap, просмотр картинок, меню редактора TinyMCE
       (форум), календарь выбора даты (бан-лист) */
    .tooltip,
    .popover,
    #lightbox,
    .tox-tinymce-aux,
    #ui-datepicker-div {
        zoom: calc(1 / var(--gr-scale));
    }

    /* Затемнение под картинкой скрипт растягивает на высоту страницы и в уменьшенной
       странице делает его выше неё — просто закрываем им весь экран */
    #lightboxOverlay {
        position: fixed;
        width: 100% !important;
        height: 100% !important;
    }

    /* Лента ножей (модуль knives_list) крутится и сдвигается стрелками на ширину,
       измеренную на экране: слой ленты — в масштабе 100 %, чтобы круг замыкался без рывка,
       а сами карточки ножей — уменьшены, как всё остальное */
    .kl-shift {
        zoom: calc(1 / var(--gr-scale));
    }

    .kl-shift .kl-track > * {
        zoom: var(--gr-scale);
    }
}