/* Mensajes al enviar un formulario de Forminator (todos los formularios):
   «Enviando…» (.forminator-loading) y el de éxito (.forminator-success).
   Forminator los pinta como franjas planas (gris con un ícono genérico y verde
   menta), ajenas al resto del sitio. Se reemplazan por una tarjeta redondeada
   como los campos (14px), texto navy en negrita, un aro que gira en amarillo
   (palette, #fea900) al enviar y un check en círculo amarillo al terminar.
   !important porque el CSS generado por Forminator (style-{id}.css) usa
   selectores con id (#forminator-module-{id}). */

.forminator-ui .forminator-response-message.forminator-loading,
.forminator-ui .forminator-response-message.forminator-success {
    position: relative;
    display: flex !important;
    align-items: center;
    gap: 12px;
    margin-bottom: 24px !important;
    padding: 16px 20px !important;
    border: 2px solid #e4e7ee !important;
    border-radius: 14px !important;
    background: #f5f6ff !important;
    box-shadow: none !important;
    color: #1A1860 !important;
    font-family: var(--global-body-font-family, 'Manrope', sans-serif) !important;
    font-size: 1rem !important;
    font-weight: 700 !important;
    line-height: 1.45 !important;
}

/* El mensaje llega a veces dentro de un <p> y a veces suelto. */
.forminator-ui .forminator-response-message.forminator-loading p,
.forminator-ui .forminator-response-message.forminator-success p {
    margin: 0 !important;
    color: inherit !important;
    font: inherit !important;
}

.forminator-ui .forminator-response-message.forminator-success {
    border-color: #fea900 !important;
    background: #fff8e6 !important;
}

/* Aro que gira (reemplaza el ícono «◌» de Forminator). */
.forminator-ui .forminator-response-message.forminator-loading::before {
    content: '' !important;
    position: static !important;
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    box-sizing: border-box;
    border: 3px solid rgba(26, 24, 96, 0.15);
    border-top-color: #fea900;
    border-radius: 50%;
    animation: fj-form-giro 0.8s linear infinite !important;
}

/* Check en círculo amarillo. */
.forminator-ui .forminator-response-message.forminator-success::before {
    content: '';
    flex: 0 0 28px;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: #fea900 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231A1860' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / 16px no-repeat;
}

@media screen and (max-width: 719px) {
    .forminator-ui .forminator-response-message.forminator-loading,
    .forminator-ui .forminator-response-message.forminator-success {
        padding: 14px 16px !important;
        font-size: 0.95rem !important;
    }
}

@keyframes fj-form-giro {
    to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
    .forminator-ui .forminator-response-message.forminator-loading::before {
        animation-duration: 2.4s !important;
    }
}

/* Formulario de contacto del footer (676): fondo navy. Tarjeta translúcida y
   texto blanco; el amarillo se mantiene. */
#colophon .forminator-ui .forminator-response-message.forminator-loading,
#colophon .forminator-ui .forminator-response-message.forminator-success {
    border-color: rgba(255, 255, 255, 0.25) !important;
    background: rgba(255, 255, 255, 0.08) !important;
    color: #fff !important;
}

#colophon .forminator-ui .forminator-response-message.forminator-success {
    border-color: #fea900 !important;
}

#colophon .forminator-ui .forminator-response-message.forminator-loading::before {
    border-color: rgba(255, 255, 255, 0.25);
    border-top-color: #fea900;
}
