/*
 * AUTH NATIVE GUARD
 *
 * Deliberately does NOT recreate Printful's responsive layout.
 *
 * Bootstrap + Printful auth.css/login-vue.css own:
 *   < 768px  = mobile
 *   >=768px  = md / two-column auth layout
 *
 * This file only protects against horizontal overflow caused
 * by captured third-party widgets/assets.
 */

@media (max-width: 767.98px) {

    html,
    body {
        max-width: 100%;
        min-width: 0;
        overflow-x: hidden;
    }

    #content,
    .main-auth,
    .main-auth__wrap,
    .main-auth__info,
    .main-auth__vertical-align--parent,
    .main-auth__vertical-align--child,
    .main-auth__form,
    .main-auth__wrap__image {
        min-width: 0;
        max-width: 100%;
        box-sizing: border-box;
    }

    .main-auth__form input,
    .main-auth__form button,
    .main-auth__form select,
    .main-auth__form textarea {
        max-width: 100%;
        box-sizing: border-box;
    }

    .main-auth__wrap__image img {
        height: auto;
        max-width: 100%;
    }

    /*
     * Saved reCAPTCHA iframe must not create page width.
     */
    .g-recaptcha,
    .grecaptcha-badge {
        max-width: 100%;
    }
}
