/* Плавающие элементы управления используют общий отступ от нижней границы и закреплённых панелей */
:root {
    --quick-tickets-floating-controls-bottom: 16px;
    --quick-tickets-floating-controls-inline-start: 16px;
    --quick-tickets-floating-controls-inline-start: max(16px, env(safe-area-inset-left));
}

.quick-tickets-scroll-top {
    position: fixed;
    right: 16px;
    bottom: var(--quick-tickets-floating-controls-bottom);
    bottom: max(var(--quick-tickets-floating-controls-bottom), env(safe-area-inset-bottom));
    z-index: 1020;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--quick-tickets-touch-target);
    height: var(--quick-tickets-touch-target);
    padding: 0;
    border: 1px solid var(--quick-tickets-color-brand);
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.96);
    box-shadow: 0 4px 14px rgba(54, 54, 54, 0.2);
    color: var(--quick-tickets-color-brand);
    font-size: 20px;
    line-height: 1;
    transition: background-color 150ms ease, box-shadow 150ms ease, color 150ms ease;
}

.quick-tickets-scroll-top[hidden] {
    display: none !important;
}

.quick-tickets-scroll-top:active,
.quick-tickets-scroll-top:focus-visible {
    border-color: var(--quick-tickets-color-brand-hover);
    background: var(--quick-tickets-color-brand);
    box-shadow: 0 6px 18px rgba(54, 54, 54, 0.26);
    color: #ffffff;
}

/* Подсветка наведения применяется только к устройствам, поддерживающим наведение */
@media (hover: hover) {
    .quick-tickets-scroll-top:hover {
        border-color: var(--quick-tickets-color-brand-hover);
        background: var(--quick-tickets-color-brand);
        box-shadow: 0 6px 18px rgba(54, 54, 54, 0.26);
        color: #ffffff;
    }
}

/* При загруженном чате кнопка вверх располагается слева от его пусковой кнопки */
body.quick-tickets-floating-controls-ready.Verbox-initialized .quick-tickets-scroll-top {
    right: 68px;
}

/* В мобильном режиме встроенного зала правая область остаётся свободной для его навигации */
body.quick-tickets-floating-controls-ready.quick-tickets-mobile-hall .quick-tickets-scroll-top {
    right: auto;
    left: var(--quick-tickets-floating-controls-inline-start);
}

body.quick-tickets-floating-controls-ready.quick-tickets-mobile-hall.Verbox-initialized .quick-tickets-scroll-top {
    right: auto;
    left: calc(var(--quick-tickets-floating-controls-inline-start) + 52px);
}

/* Пусковая кнопка Verbox располагается над закреплёнными панелями зрительской страницы */
body.quick-tickets-floating-controls-ready .online-chat-root.online-chat-root-Verbox #supportTrigger.trigger {
    right: 16px !important;
    bottom: var(--quick-tickets-floating-controls-bottom) !important;
    bottom: max(var(--quick-tickets-floating-controls-bottom), env(safe-area-inset-bottom)) !important;
}

body.quick-tickets-floating-controls-ready.quick-tickets-mobile-hall .online-chat-root.online-chat-root-Verbox #supportTrigger.trigger {
    right: auto !important;
    left: var(--quick-tickets-floating-controls-inline-start) !important;
}

/* Меню наследует выравнивание от обоих контейнеров и раскрывается вправо от левой кнопки */
body.quick-tickets-floating-controls-ready.quick-tickets-mobile-hall .online-chat-root.online-chat-root-Verbox #supportTrigger .dropdown-container,
body.quick-tickets-floating-controls-ready.quick-tickets-mobile-hall .online-chat-root.online-chat-root-Verbox #supportTrigger .dropdown-container > .inner {
    right: auto !important;
    left: 0 !important;
}

/* При модальном или полноэкранном сценарии плавающие элементы не перекрывают основное действие */
body.modal-open .quick-tickets-scroll-top,
body.order-code-viewer-open .quick-tickets-scroll-top,
body.modal-open .online-chat-root.online-chat-root-Verbox,
body.order-code-viewer-open .online-chat-root.online-chat-root-Verbox {
    visibility: hidden !important;
    pointer-events: none !important;
}

@media (max-width: 980px) {
    /* Уведомление о cookies остаётся единственным плавающим элементом до выбора пользователя */
    body.quick-tickets-cookie-notification-visible .quick-tickets-scroll-top,
    body.quick-tickets-cookie-notification-visible .online-chat-root.online-chat-root-Verbox {
        visibility: hidden !important;
        pointer-events: none !important;
    }
}

@media (max-width: 767.999px) {
    /* При увеличении панели следуют за видимой областью, сохраняя выбранный зрителем масштаб текста */
    #order-create .order-mobile-summary.quick-tickets-viewport-summary,
    .collective-order-content .collective-order-mobile-summary.quick-tickets-viewport-summary,
    #organisation .certificate-summary.quick-tickets-viewport-summary {
        right: var(--quick-tickets-viewport-right);
        bottom: var(--quick-tickets-viewport-bottom);
        left: var(--quick-tickets-viewport-left);
        max-height: calc(var(--quick-tickets-viewport-height) * 0.75);
        overflow: auto;
    }

    /* При низком экране панель прокручивается, сохраняя основное действие и часть страницы доступными */
    #order-create .order-mobile-summary.quick-tickets-viewport-summary .order-mobile-summary__submit,
    .collective-order-content .collective-order-mobile-summary.quick-tickets-viewport-summary .collective-order-mobile-summary__submit,
    #organisation .certificate-summary.quick-tickets-viewport-summary .buttons {
        position: sticky;
        bottom: 0;
        z-index: 1;
    }

    /* Масштабирование сужает видимую область без переключения медиазапросов страницы */
    #order-create .order-mobile-summary.quick-tickets-viewport-summary--narrow,
    .collective-order-content .collective-order-mobile-summary.quick-tickets-viewport-summary--narrow,
    #organisation .certificate-summary.quick-tickets-viewport-summary--narrow {
        grid-template-columns: minmax(0, 1fr);
        grid-template-rows: minmax(0, 1fr) auto;
    }

    /* Сумма и таймер прокручиваются отдельно, не заходя под кнопку при недостатке высоты */
    #order-create .order-mobile-summary.quick-tickets-viewport-summary--narrow .order-mobile-summary__details,
    .collective-order-content .collective-order-mobile-summary.quick-tickets-viewport-summary--narrow .collective-order-mobile-summary__details,
    #organisation .certificate-summary.quick-tickets-viewport-summary--narrow .total {
        align-self: stretch;
        min-height: 0;
        overflow: auto;
    }

    #order-create .order-mobile-summary.quick-tickets-viewport-summary--narrow .order-mobile-summary__details,
    .collective-order-content .collective-order-mobile-summary.quick-tickets-viewport-summary--narrow .collective-order-mobile-summary__details {
        grid-auto-rows: max-content;
    }

    #organisation .certificate-summary.quick-tickets-viewport-summary--narrow .total {
        align-items: flex-start;
    }

    #order-create .order-mobile-summary.quick-tickets-viewport-summary--narrow .order-mobile-summary__timer,
    #order-create .order-mobile-summary.quick-tickets-viewport-summary--narrow .order-mobile-summary__time,
    #order-create .order-mobile-summary.quick-tickets-viewport-summary--narrow .order-mobile-summary__total,
    .collective-order-content .quick-tickets-viewport-summary--narrow .collective-order-mobile-summary__time,
    .collective-order-content .quick-tickets-viewport-summary--narrow .collective-order-mobile-summary__total {
        flex-wrap: wrap;
        white-space: normal;
        overflow-wrap: anywhere;
    }

    #order-create .order-mobile-summary.quick-tickets-viewport-summary--narrow .order-mobile-summary__submit,
    .collective-order-content .quick-tickets-viewport-summary--narrow .collective-order-mobile-summary__submit {
        white-space: normal;
        overflow-wrap: anywhere;
    }

    /* Во время ввода плавающие кнопки не перекрывают поля и экранную клавиатуру */
    body.quick-tickets-site-input-active .quick-tickets-scroll-top,
    body.quick-tickets-site-input-active .online-chat-root.online-chat-root-Verbox #supportTrigger {
        visibility: hidden !important;
        pointer-events: none !important;
    }
}

@media print {
    .quick-tickets-scroll-top,
    body .online-chat-root.online-chat-root-Verbox {
        display: none !important;
    }
}
