:root {
    --ombox-keyboard-inset: 0px;
    --ombox-visual-viewport-height: 100vh;
    --ombox-viewport-offset-top: 0px;
}

body.is-mobile-visual-viewport {
    min-height: var(--ombox-visual-viewport-height, 100vh);
}

@media (max-width: 1024px), (pointer: coarse) {
    body.is-mobile-visual-viewport input:not([type="hidden"]),
    body.is-mobile-visual-viewport textarea,
    body.is-mobile-visual-viewport select,
    body.is-mobile-visual-viewport .form-control,
    body.is-mobile-visual-viewport .form-select,
    body.is-mobile-visual-viewport .admin-system-form-control,
    body.is-mobile-visual-viewport .admin-system-form-select {
        font-size: max(16px, var(--form-control-font-size, 14px));
    }

    body.is-mobile-visual-viewport .ombox-field-input,
    body.is-mobile-visual-viewport .ombox-form-field,
    body.is-mobile-visual-viewport .form-group,
    body.is-mobile-visual-viewport .mb-3 {
        scroll-margin-top: calc(var(--navbar-height, 56px) + env(safe-area-inset-top, 0px) + 18px);
        scroll-margin-bottom: calc(var(--ombox-keyboard-inset, 0px) + var(--mobile-bottom-nav-height, 64px) + env(safe-area-inset-bottom, 0px) + 96px);
    }

    body.is-keyboard-open.has-mobile-bottom-nav .ombox-page-content {
        padding-bottom: calc(var(--ombox-keyboard-inset, 0px) + env(safe-area-inset-bottom, 0px) + 24px);
    }

    body.is-keyboard-open .ombox-mobile-bottom-nav {
        opacity: 0;
        pointer-events: none;
        transform: translateY(calc(100% + env(safe-area-inset-bottom, 0px)));
        transition: opacity .16s ease, transform .16s ease;
    }

    body.is-keyboard-open .ombox-form-actions.is-sticky,
    body.is-keyboard-open .ombox-page-actions.is-sticky,
    body.is-keyboard-open .ombox-sticky-action,
    body.is-keyboard-open .ombox-sticky-actions {
        position: static;
        bottom: auto;
        transform: none;
    }
}