/**
 * BookPound SellerAddress
 * Loaded on customer_account_create and customer_account_login.
 *
 * reCAPTCHA alignment. From 768px up, every field on these forms has its
 * label in a left column 25.8% wide (the theme's .fieldset > .field > .label),
 * and checkbox rows such as "Show Password" are pushed over by a ::before of
 * the same width. Magento's reCAPTCHA wrapper (.field-recaptcha) has neither,
 * so it sat at the far left. Give it the same offset. Below 768px the form is
 * one column and needs nothing. Measured on the live site 2026-09-14: the box
 * lines up with the Email input at 768px and 1366px.
 */
@media (min-width: 768px) {
    .form-create-account .field-recaptcha,
    .form-login .field-recaptcha {
        margin-left: 25.8%;
    }
}

/**
 * reCAPTCHA on very small phones. Google's widget is a fixed 304px wide, and
 * the form's field column is the screen width minus 75px, so below 379px the
 * box spilled past the right edge. Scale it down to fit, keeping its top-left
 * corner in place, and shrink its reserved height to match so no gap opens
 * above the button. Measured on the live site 2026-09-14: at 360px the box is
 * 280px in a 285px column, at 320px it is 243px in a 245px column.
 */
@media (max-width: 378px) {
    .form-create-account .field-recaptcha .g-recaptcha,
    .form-login .field-recaptcha .g-recaptcha {
        transform: scale(0.92);
        transform-origin: 0 0;
        height: 72px;
    }
}

@media (max-width: 354px) {
    .form-create-account .field-recaptcha .g-recaptcha,
    .form-login .field-recaptcha .g-recaptcha {
        transform: scale(0.8);
        height: 63px;
    }
}
