/*
 * Estilos de respaldo para [nauka_contact_form].
 *
 * El tema Nauka Comercial SRL ya define las clases .cta-form-* en su
 * style.css, por lo que en ese sitio la mayoría de estas reglas no
 * cambian nada visualmente. Se incluyen para que el formulario también
 * se vea presentable si el plugin se activa en otro tema.
 */

.nauka-cf-form .cta-form-row {
	display: flex;
	gap: 16px;
	flex-wrap: wrap;
}

.nauka-cf-form .cta-form-group {
	flex: 1 1 220px;
	margin-bottom: 16px;
}

.nauka-cf-form .cta-form-group label {
	display: block;
	font-weight: 600;
	margin-bottom: 6px;
}

.nauka-cf-form .cta-form-group input,
.nauka-cf-form .cta-form-group select,
.nauka-cf-form .cta-form-group textarea {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid #d7d7d7;
	border-radius: 6px;
	font-family: inherit;
	font-size: 15px;
}

.nauka-cf-form .cta-form-hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.nauka-cf-form .cta-form-submit:disabled {
	opacity: .7;
	cursor: default;
}

/*
 * Aviso clásico sin JavaScript (respaldo). El tema Nauka ya estiliza
 * .cta-form-alert-ok / .cta-form-alert-error; esto es solo su respaldo
 * más una transición de desvanecido antes de ocultarse solo.
 */
.cta-form-alert {
	padding: 12px 16px;
	border-radius: 8px;
	margin-bottom: 16px;
	font-size: 15px;
	display: flex;
	align-items: center;
	gap: 8px;
	transition: opacity .5s ease;
}

.cta-form-alert-ok {
	background: #e6f6ec;
	color: #1e7a3f;
	border: 1px solid #b7e4c7;
}

.cta-form-alert-error {
	background: #fdecec;
	color: #a12622;
	border: 1px solid #f3b7b5;
}

.nauka-cf-alert.is-hiding {
	opacity: 0;
}

/*
 * Toast de confirmación (envío normal, con JavaScript). No mueve la
 * página ni salta a ningún ancla: aparece con una transición suave
 * justo debajo del formulario y se desvanece solo.
 */
.nauka-cf-toast {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-top: 0;
	padding: 0 16px;
	border-radius: 8px;
	font-size: 14.5px;
	line-height: 1.4;
	opacity: 0;
	transform: translateY(-6px);
	max-height: 0;
	overflow: hidden;
	pointer-events: none;
	transition:
		opacity .35s ease,
		transform .35s ease,
		max-height .35s ease,
		margin-top .35s ease,
		padding .35s ease;
}

.nauka-cf-toast.is-visible {
	opacity: 1;
	transform: translateY(0);
	max-height: 200px;
	margin-top: 14px;
	padding: 12px 16px;
	pointer-events: auto;
}

.nauka-cf-toast i {
	font-size: 18px;
	flex-shrink: 0;
}

.nauka-cf-toast.nauka-cf-toast-ok {
	background: #e6f6ec;
	color: #1e7a3f;
	border: 1px solid #b7e4c7;
}

.nauka-cf-toast.nauka-cf-toast-error {
	background: #fdecec;
	color: #a12622;
	border: 1px solid #f3b7b5;
}