html.auth-lock-scroll {
    height: 100%;
    overflow: hidden;
}

body.login-body.auth-lock-scroll {
    width: 100%;
    height: 100dvh;
    min-height: 100dvh;
    max-height: 100dvh;
    overflow: hidden;
    overscroll-behavior: none;
    padding: calc(.75rem + env(safe-area-inset-top, 0px)) 1rem calc(.75rem + env(safe-area-inset-bottom, 0px));
}

body.login-body.auth-lock-scroll .login-card {
    max-height: calc(100dvh - 1.5rem - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px));
    overflow: hidden;
    padding: clamp(1rem, 2.1vh, 1.35rem);
}

body.login-body.auth-lock-scroll .brand-mark {
    width: clamp(58px, 9vh, 76px);
    height: clamp(58px, 9vh, 76px);
    margin-bottom: clamp(.45rem, 1.2vh, .8rem);
}

body.login-body.auth-lock-scroll .login-card h1 {
    font-size: clamp(1.45rem, 3.2vh, 2rem);
    margin-bottom: clamp(.75rem, 1.5vh, 1rem);
}

body.login-body.auth-lock-scroll .vstack.gap-3 {
    gap: clamp(.75rem, 1.45vh, 1rem) !important;
}

body.login-body.auth-lock-scroll .form-control-lg,
body.login-body.auth-lock-scroll .btn-lg {
    min-height: 3rem;
}

@supports (-webkit-touch-callout: none) {
    html.auth-lock-scroll {
        height: -webkit-fill-available;
    }

    body.login-body.auth-lock-scroll {
        height: -webkit-fill-available;
        min-height: -webkit-fill-available;
    }
}
