/* ==========================================================================
   MrSeries — Botón "Solicitar información por WhatsApp"
   ==========================================================================

   Archivo propio, encolado desde sys/whatsapp.php. No se toca
   assets/css/style.css para no alterar el diseño ya terminado, mismo
   criterio ya usado en assets/css/mrs-idiomas.css.

   El contenedor .mrs-whatsapp-cta reutiliza la misma estructura de
   bloque (flex en columna, ancho completo) que .mrs-buy/.mrs-cta, para
   que se integre visualmente sin introducir un patrón nuevo.
   ========================================================================== */

.mrs-whatsapp-cta {
    display: flex;
    width: 100%;
    margin: 0.6rem 0;
}

.mrs-whatsapp-cta__button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    padding: 0.7rem 1.2rem;
    border-radius: 6px;
    background-color: #25d366;
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    text-align: center;
    transition: background-color 0.2s ease;
}

.mrs-whatsapp-cta__button:hover,
.mrs-whatsapp-cta__button:focus {
    background-color: #1ebe5b;
    color: #fff;
}

.mrs-whatsapp-cta__icon {
    width: 20px;
    height: 20px;
    flex-shrink: 0;
}

.mrs-whatsapp-cta__text {
    line-height: 1.2;
}

/* Móvil: mismo bloque a ancho completo, texto ligeramente más compacto. */
@media (max-width: 576px) {
    .mrs-whatsapp-cta__button {
        padding: 0.65rem 1rem;
        font-size: 0.95rem;
    }
}