/* Store4Bike · Botones a ancho completo en móvil.
 * ============================================================================
 * Petición del cliente (11/09/2026), extendida a toda la tienda.
 *
 * POR QUÉ: en una columna de 390 px un botón corto y suelto se lee como un
 * adorno, no como la acción. Y hay casos medidos que son peores que feos:
 * «Ver más productos» salía de 86×80 px, con el texto partido en tres líneas,
 * siendo el único modo de avanzar en un listado de 3.444 productos.
 *
 * CÓMO: hoja de anulación aparte, igual que sin-radios.css. NO se toca
 * `theme-*.css`, que es generado y se perdería al recompilar, ni el CSS que
 * vive en la base de datos.
 *
 * ----------------------------------------------------------------------------
 * LAS EXCEPCIONES VAN EN UN `:not()`, NO EN UNA REGLA QUE DESHAGA.
 * ----------------------------------------------------------------------------
 * Primero se intentó con una regla general y otra de excepciones con `revert`.
 * NO FUNCIONA, y el fallo es instructivo: **`revert` retrocede al origen
 * anterior, o sea que descarta TODO el CSS de autor para esa propiedad**, no
 * solo el de esta hoja. La lupa de la cabecera perdió el ancho que le da
 * cabecera.css y pasó de 52 a 204 px. Con `:not()` la declaración sencillamente
 * no llega a aplicarse y no hay nada que deshacer.
 *
 * QUÉ QUEDA FUERA, comprobado uno a uno en el navegador a 390 px:
 *   · los `+` y `−` de cantidad (`.btn-touchspin`), de 22-30 px y pegados al
 *     campo: a ancho completo la ficha y el carrito quedan inutilizables;
 *   · el «Mostrar» de la contraseña, que vive DENTRO del campo, en la ficha de
 *     acceso y en el pago (`.ets_password`);
 *   · lupas, menú y aspas de cerrar: son iconos cuadrados;
 *   · las flechas y los puntos del carrusel de la portada;
 *   · lo que va dentro de un `.input-group`, que forma una fila con su campo.
 *
 * Si mañana un módulo añade un botón que no deba ensancharse, se añade a la
 * lista de `:not()`.
 */

@media (max-width: 767px) {

    .btn:not(.btn-touchspin):not(.btn-unstyle):not(.btn-link):not(.ets_password):not(.close):not(.s4b-icono):not(.s4b-buscador__boton):not(.s4b-p-buscar__boton):not(.s4b-p-banners__flecha):not(.s4b-p-banners__punto):not([data-action="show-password"]):not(.input-group .btn):not(.input-group-btn .btn):not(.btn-group .btn),
    button[type="submit"]:not(.btn-touchspin):not(.btn-unstyle):not(.ets_password):not(.s4b-icono):not(.s4b-buscador__boton):not(.s4b-p-buscar__boton):not([data-action="show-password"]):not(.input-group .btn):not(.input-group-btn .btn),
    input[type="submit"],
    /* Botones de módulo que no llevan `.btn` ni son submit, localizados a mano:
       el «Añadir los tres al carrito» de la ficha y el «Elegir» del pago. */
    button.absq_post_question,
    button.ajax_add_to_cart_button {
        display: block;
        /* EL `!important` ES OBLIGATORIO AQUÍ, y no es pereza:
         * `wkinfinitescroll` escribe `width:25%` **en línea** en el botón «Ver
         * más productos» (sale de su configuración en la base de datos), y un
         * estilo en línea solo lo vence un `!important`. Sin él ese botón se
         * queda en 86×80 px con el texto partido en tres líneas.
         * No afecta a las excepciones: esas no llegan aquí, las descarta el
         * `:not()` de arriba. */
        width: 100% !important;
        /* `display: block` con relleno lateral heredado deja el texto a la
           izquierda; se recentra a mano. */
        text-align: center;
    }
}