/* Login page – stack the two cards cleanly and enlarge tap targets on mobile.
   NOTE: the wrapper class is intentionally NOT "login-page", because AdminLTE
   ships a global ".login-page" rule (height: 100vh; display: flex; align-items: center)
   that would vertically center and stretch this form, leaving a large empty gap. */
.login-view .card {
    margin-bottom: 0;
}

@media (max-width: 767.98px) {
    .login-view h1 {
        font-size: 1.6rem;
    }

    .login-view .card-body {
        padding: 1rem;
    }

    /* Make the Google button full width and easy to tap, matching the primary button */
    .login-view #external-account {
        width: 100%;
    }

    .login-view #external-account .btn {
        width: 100%;
        white-space: normal;
    }
}