/* Formulario de contacto y suscripción. Medidas copiadas del formulario de Elementor Pro en producción (oct 2026):
   campos de 40 px con borde #69727D, Rubik 15 px gris; botón Determination con sombra que se encoge al pasar el cursor. */

.dk-formulario {
	--dk-separacion: 10px;
	--dk-alinear: center;
	--dk-boton-tam: 24px;
	--dk-boton-espaciado: 1.4px;
	--dk-boton-fondo: #9E0505;
	--dk-boton-borde: 0;
	--dk-boton-relleno: 0 24px;
	--dk-color-exito: #000;
	position: relative;
	/* Como Elementor: el espacio bajo la última fila no cuenta */
	margin-bottom: calc(-1 * var(--dk-separacion));
	font-family: Rubik, "Dialektico Rubik", sans-serif;
	font-size: 16px;
}

.dk-formulario__campo { margin: 0 0 var(--dk-separacion); }

.dk-formulario .dk-formulario__etiqueta {
	display: block;
	margin: 0;
	color: #7A7A7A;
	font-size: 16px;
	line-height: 1;
}
/* Espacio + 0.2 em antes del asterisco, como en Elementor */
.dk-formulario--contacto .dk-formulario__etiqueta::after { content: " *"; color: red; padding-inline-start: .2em; }

.dk-formulario input[type="text"],
.dk-formulario input[type="email"],
.dk-formulario textarea {
	display: block;
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	height: 40px;
	margin: 0;
	padding: 8px 16px;
	border: 1px solid #69727D;
	border-radius: 3px;
	background: #fff;
	color: #7A7A7A;
	font: 400 15px/21px Rubik, "Dialektico Rubik", sans-serif;
	box-shadow: none;
}
.dk-formulario textarea { height: auto; padding: 5px 14px; resize: vertical; }
.dk-formulario :is(input, textarea)::placeholder { color: inherit; font-family: inherit; opacity: .6; }
.dk-formulario :is(input, textarea):focus { box-shadow: inset 0 0 0 1px rgb(0 0 0 / .1); outline: 0; }

.dk-formulario__enviar {
	display: flex;
	justify-content: var(--dk-alinear);
	margin: 0 0 var(--dk-separacion);
}
/* "form." sube la especificidad sobre las reglas de botones del kit de Elementor y del tema */
form.dk-formulario .dk-formulario__boton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 5px;
	box-sizing: border-box;
	min-height: 40px;
	margin: 0;
	padding: var(--dk-boton-relleno);
	border: var(--dk-boton-borde);
	border-radius: 3px;
	background-color: var(--dk-boton-fondo);
	color: #fff;
	font-family: Determination, "Dialektico Pixel", monospace;
	font-size: var(--dk-boton-tam);
	font-weight: 500;
	line-height: 1;
	letter-spacing: var(--dk-boton-espaciado);
	text-transform: uppercase;
	box-shadow: 4px 4px 4px -1px rgb(0 0 0 / .78);
	cursor: pointer;
	transition: transform .3s, background-color .3s;
}
form.dk-formulario .dk-formulario__boton:hover,
form.dk-formulario .dk-formulario__boton:focus-visible { background-color: #000; }
.dk-formulario--encoger .dk-formulario__boton:is(:hover, :focus, :active) { transform: scale(.9); }
form.dk-formulario .dk-formulario__boton[disabled] { opacity: .6; cursor: progress; }
.dk-formulario__icono { width: 1.07em; height: 1em; flex: none; }
/* En móvil el kit de Elementor quita la sombra de los botones */
@media (max-width: 767px) {
	form.dk-formulario .dk-formulario__boton { box-shadow: none; }
}

.dk-formulario__mensaje { margin: 10px 0; font-family: Rubik, "Dialektico Rubik", sans-serif; font-weight: 400; font-size: 16px; line-height: 1; }
.dk-formulario__mensaje--exito { color: var(--dk-color-exito); }
.dk-formulario__mensaje--error { color: #d9534f; }
.dk-formulario__aviso:empty { display: none; }

/* Campo trampa: fuera de la vista y del teclado */
.dk-formulario__trampa { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.dk-formulario .screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
