/*
 * Reset Bootstrap (and similar framework) input styles off the <altcha-widget> wrapper.
 *
 * Projects often hand `class="form-control"` (or the equivalent Bootstrap input class) to the
 * widget — that's the default in tx_form's FormSetup.yaml, rsn_form's Captcha.html and various
 * bbysaeth-era templates. The class is harmless on a normal <input> but on the <altcha-widget>
 * host it draws an empty input border around the entire Altcha UI, making it look like there
 * is a spurious empty text field next to the captcha. The widget already brings its own
 * checkbox + footer chrome, so the host element should have no input-field styling.
 */
altcha-widget.form-control,
altcha-widget.form-control-lg,
altcha-widget.form-control-sm {
    /* Strip the Bootstrap input shell — let the widget's own UI define its box. */
    border: 0;
    padding: 0;
    background: transparent;
    height: auto;
    min-height: 0;
    line-height: normal;
    box-shadow: none;
}

/* When the widget is focused or invalid, Bootstrap turns the border red/blue. The widget
 * communicates its own state via the inner checkbox + footer, so suppress the focus ring. */
altcha-widget.form-control:focus,
altcha-widget.form-control:focus-within,
altcha-widget.form-control:invalid {
    border: 0;
    outline: none;
    box-shadow: none;
}