/* The centred sign-up and sign-in (2026-10-26). Vytas, of /login: "maybe
   login no image ... just add login in center of page"; of /signup: "too
   distracting maybe is not needed any imagery and make like login". Both
   pages are the form alone in the middle of a white page, the logo in the
   top-left corner. Loaded raw after designerbox-v4-auth.css by
   frontend_signup_free.pug and frontend_login.pug: bump ?v= on every edit.
   Rules are scoped to body.ax-solo or .db-auth--solo, so the paid checkout
   pages that share designerbox-v4-auth.css never see them. Neither page
   scrolls on a laptop screen or a phone ("should not require scrolling"). */

/* ---- Sign-up (body.db-checkout.ax-solo) ---- */
html:root body.db-checkout.ax-solo .flex-screen {
    display: flex;
    justify-content: center;
    align-items: stretch;
    min-height: 100vh;
    padding: 8px;
}

html:root body.db-checkout.ax-solo .flex-screen-left {
    flex: 1 1 auto;
    width: 100%;
    min-height: calc(100vh - 16px);
    border: 0;
    border-radius: 0;
}

html:root body.db-checkout.ax-solo .flex-screen-right {
    display: none;
}

/* ---- Sign-in (body.db-login): the form alone in the middle of the page ---- */
html:root body.db-login .db-auth.db-auth--solo {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    padding: 8px;
}

html:root body.db-login .db-auth--solo .db-auth__col--form {
    flex: 1 1 auto;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    min-height: calc(100vh - 16px);
    padding: 96px 20px 64px;
    border: 0;
    border-radius: 0;
}

html:root body.db-login .db-auth--solo .db-auth__form {
    width: 100%;
    max-width: 380px;
    margin: 0 auto;
}

/* no scroll on a short laptop screen (720 to 820 high) or a phone: less air
   above and below the form, the logo keeps its corner */
@media (min-width: 901px) and (max-height: 820px) {
    html:root body.db-checkout.ax-solo .flex-screen-left,
    html:root body.db-login .db-auth--solo .db-auth__col--form {
        padding-top: 64px;
        padding-bottom: 24px;
    }
}

@media (max-width: 900px) {
    /* the free sign-up page's body kept a 32px tail under the card */
    html:root body.db-checkout.ax-solo {
        padding-bottom: 0 !important;
    }

    html:root body.db-checkout.ax-solo .flex-screen-left {
        padding-top: 80px;
        padding-bottom: 24px;
    }
}
