/**
 * UX del popup de contacto (CF7 dentro de los popups de Elementor "Pedí tu Cotización" /
 * "Request a Quote") — 28/08/2026, ver HALLAZGOS.md.
 *
 * Aplica por igual a los dos formularios (1717 ES, 3878 EN) porque ambos comparten las
 * mismas clases de CF7 (.wpcf7-spinner, .wpcf7-response-output) — no depende del idioma.
 *
 * Azul marino tomado directo del popup real (color del título "Dejanos tus datos de
 * contacto" y del borde del botón "Enviar", medido en pantalla): #08104B.
 */

/* 1. Spinner: mismo spinner CSS que ya trae CF7 (círculo + animación de rotación),
   solo se le cambia la paleta de gris genérico a los colores del sitio. */
.wpcf7-spinner {
	background-color: #08104b;
}

.wpcf7-spinner::before {
	background-color: #ffffff;
}

/* 2. Mensaje de respuesta: sacar la caja con borde de color que trae CF7 por defecto,
   integrarlo como texto simple debajo del formulario. */
.wpcf7 form .wpcf7-response-output {
	margin: 1em 0 0;
	padding: 0;
	border: none;
	background: none;
	text-align: center;
	font-size: 0.95em;
	line-height: 1.5;
}

.wpcf7-form.sent .wpcf7-response-output {
	color: #08104b;
}

.wpcf7-form.failed .wpcf7-response-output,
.wpcf7-form.aborted .wpcf7-response-output,
.wpcf7-form.spam .wpcf7-response-output {
	color: #a4262c;
}

.wpcf7-form.invalid .wpcf7-response-output,
.wpcf7-form.unaccepted .wpcf7-response-output,
.wpcf7-form.payment-required .wpcf7-response-output {
	color: #8a6d00;
}

/* 3. Botón "Cerrar" / "Close": solo visible cuando el envío fue exitoso, agrupado con el
   mensaje dentro del mismo .wpcf7-response-output (inyectado por el JS de este mu-plugin). */
.pacific-ocean-cf7-close-btn {
	display: none;
	margin: 0.75em auto 0;
	padding: 0.6em 2em;
	background: #08104b;
	color: #ffffff;
	border: 1px solid #08104b;
	border-radius: 2px;
	font-size: 0.85em;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	cursor: pointer;
	transition: opacity 0.2s ease;
}

.pacific-ocean-cf7-close-btn:hover {
	opacity: 0.85;
}

/* display:block (no inline-block) + width:fit-content es a propósito, no cosmético:
 * el botón se agrega con appendChild() justo después del texto de respuesta (ver .js),
 * sin ningún separador de por medio. Con inline-block, si la última línea del texto no
 * llega a ocupar todo el ancho del contenedor, el botón queda flotando pegado al final
 * de esa línea en vez de bajar a la suya — y si le sumamos que el punto exacto de wrap
 * cambia según el idioma (encontrado 04/09/2026: se veía bien en español, pegado al botón
 * "Close" en inglés), termina viéndose distinto en cada idioma aunque el CSS sea el mismo.
 * block obliga a que el botón siempre arranque en su propia línea, sin importar dónde
 * cortó el texto; width:fit-content evita que ese block ocupe todo el ancho del popup
 * (que rompería el centrado), dejando que margin:auto lo centre igual que antes. */
.wpcf7-form.sent .pacific-ocean-cf7-close-btn {
	display: block;
	width: fit-content;
}