/*
 * CC Captcha - widget styling.
 *
 * Theme-agnostic on purpose. The previous version keyed off
 * ".contact-form form .form-fields", which only ever matched the classic theme
 * and styled nothing on any custom theme (verified on cc-theme, where
 * ".contact-form" IS the <form> and the field container is ".contact-form__grid").
 * The widget is now placed directly before the submit button, so plain block
 * spacing is enough and no float clearing is needed.
 */

.cc-captcha-container {
    margin: 1rem 0;
}

/* Newsletter blocks are tighter than page forms. */
.cc-captcha-newsletter {
    margin-top: 0.5rem;
}

/*
 * Both providers render the widget in a fixed-width iframe (300px for Turnstile,
 * 304px for reCAPTCHA v2). Let it shrink rather than overflow a narrow column.
 */
.cc-captcha-widget {
    max-width: 100%;
}

@media (max-width: 379px) {
    /*
     * Scaling an iframe also scales its hit targets, which is why this is kept
     * to the narrowest breakpoint only - below ~330px the widget would
     * otherwise overflow the viewport.
     */
    .cc-captcha-widget {
        transform: scale(0.9);
        transform-origin: left top;
    }
}
