/* =========================================================
   Gravity Forms — calce con el diseño de Autovía del Mercosur.

   Este archivo solo se encola cuando el plugin está activo
   (ver inc/enqueue.php). Los selectores cubren GF 2.5+.
   ========================================================= */

.gform_wrapper.gravity-theme {
	font-family: var(--am-font-body);
}

/* La grilla de GF ya es de 12 columnas: solo se ajusta el aire. */
.gform_wrapper.gravity-theme .gform_fields {
	grid-row-gap: 22px;
	grid-column-gap: 26px;
}

/* Los labels no se esconden acá: los formularios se crean con labelPlacement
   'hidden_label' y el propio basic.css de GF los recorta. Los únicos que se
   ven son los de los campos de archivo, que se crean con 'top_label' porque
   son lo único que dice qué hay que adjuntar. */
.gform_wrapper.gravity-theme .gfield.top_label > .gfield_label {
	/* El contenedor de la grilla lleva la clase hidden_label, y su regla recorta
	   todos los labels a 1px. Hay que deshacer ese recorte entero, no solo
	   volver a poner display: block. */
	position: static;
	width: auto;
	height: auto;
	margin: 0 0 10px;
	padding: 0;
	overflow: visible;
	clip-path: none;
	display: block;
	font-family: var(--am-font-body);
	font-size: 16px;
	font-weight: 600;
	color: var(--am-text);
}

/* Campos */
.gform_wrapper.gravity-theme .gfield input[type='text'],
.gform_wrapper.gravity-theme .gfield input[type='email'],
.gform_wrapper.gravity-theme .gfield input[type='tel'],
.gform_wrapper.gravity-theme .gfield input[type='number'],
.gform_wrapper.gravity-theme .gfield input[type='url'],
.gform_wrapper.gravity-theme .gfield select,
.gform_wrapper.gravity-theme .gfield textarea {
	width: 100%;
	padding: 17px 20px;
	background: #fff;
	color: var(--am-text);
	font-family: var(--am-font-body);
	font-size: 17px;
	line-height: 1.4;
	border: 1px solid var(--am-dark);
	border-radius: 0;
	box-shadow: none;
	transition: border-color 0.2s var(--am-ease);
}

.gform_wrapper.gravity-theme .gfield textarea {
	min-height: 150px;
	resize: vertical;
}

.gform_wrapper.gravity-theme .gfield input::placeholder,
.gform_wrapper.gravity-theme .gfield textarea::placeholder {
	color: #9b9b9f;
	opacity: 1;
}

.gform_wrapper.gravity-theme .gfield input:focus,
.gform_wrapper.gravity-theme .gfield select:focus,
.gform_wrapper.gravity-theme .gfield textarea:focus {
	border-color: var(--am-orange);
	outline: 2px solid var(--am-orange);
	outline-offset: 1px;
}

/* Select con flecha propia */
.gform_wrapper.gravity-theme .gfield select {
	appearance: none;
	padding-right: 52px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath fill='%2335363a' d='M5 7l5 6 5-6z'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 16px center;
	background-size: 20px;
	text-transform: uppercase;
	letter-spacing: 0.02em;
}

/* Email con repetición: un solo campo de GF que se parte en dos. La grilla
   interna viene con columnas 'auto', que reparte según el contenido; el diseño
   pide dos mitades exactas, con el mismo aire que el resto de la grilla. */
.gform_wrapper.gravity-theme .ginput_complex.ginput_container_email {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 26px;
}

.gform_wrapper.gravity-theme .ginput_complex.ginput_container_email > span {
	width: auto;
	padding: 0;
}

/* GF cierra el campo complejo con un clearfix, herencia de cuando esto se
   maquetaba con floats. Dentro de un grid es un hijo más: cae en una segunda
   fila y le suma el gap al alto del campo. */
.gform_wrapper.gravity-theme .ginput_complex.ginput_container_email > .gf_clear {
	display: none;
}

/* Subida de archivos */
.gform_wrapper.gravity-theme .gfield input[type='file'] {
	width: 100%;
	padding: 14px 16px;
	background: #fff;
	border: 1px solid var(--am-dark);
	font-size: 16px;
}

.gform_wrapper.gravity-theme .gfield input[type='file']::file-selector-button {
	margin-right: 14px;
	padding: 7px 16px;
	background: var(--am-gray-bg);
	color: var(--am-text);
	font-family: var(--am-font-body);
	font-size: 15px;
	border: 1px solid var(--am-gray-line);
	border-radius: var(--am-radius);
	cursor: pointer;
}

.gform_wrapper.gravity-theme .gform_fileupload_rules {
	display: block;
	padding-top: 8px;
	color: var(--am-text-soft);
	font-size: 14px;
}

/* Botón Enviar con la flecha del diseño */
.gform_wrapper.gravity-theme .gform_footer {
	padding: 26px 0 0;
	margin: 0;
}

.gform_wrapper.gravity-theme .gform_button {
	display: inline-flex;
	align-items: center;
	gap: 16px;
	padding: 17px 34px;
	background: var(--am-orange-soft);
	color: #fff;
	font-family: var(--am-font-title);
	font-weight: 500;
	font-size: 19px;
	letter-spacing: 0.02em;
	border: 0;
	border-radius: var(--am-radius);
	cursor: pointer;
	transition: background 0.25s var(--am-ease), transform 0.25s var(--am-ease);
}

.gform_wrapper.gravity-theme .gform_button::after {
	content: '→';
	font-size: 21px;
	line-height: 1;
}

.gform_wrapper.gravity-theme .gform_button:hover {
	background: var(--am-orange-dark);
	transform: translateY(-2px);
}

/* Validación y confirmación */
.gform_wrapper.gravity-theme .gfield_required {
	color: var(--am-orange);
}

/* Los selectores de arriba llevan [type='…'], que suma especificidad: sin
   repetirlo acá, el borde normal le gana al de error y el campo con problema
   se ve igual que el resto. */
.gform_wrapper.gravity-theme .gfield_error input[type='text'],
.gform_wrapper.gravity-theme .gfield_error input[type='email'],
.gform_wrapper.gravity-theme .gfield_error input[type='tel'],
.gform_wrapper.gravity-theme .gfield_error input[type='number'],
.gform_wrapper.gravity-theme .gfield_error input[type='url'],
.gform_wrapper.gravity-theme .gfield_error input[type='file'],
.gform_wrapper.gravity-theme .gfield_error select,
.gform_wrapper.gravity-theme .gfield_error textarea {
	border-color: #b32d2e;
}

.gform_wrapper.gravity-theme .gfield_validation_message,
.gform_wrapper.gravity-theme .validation_message {
	background: transparent;
	border: 0;
	padding: 6px 0 0;
	color: #b32d2e;
	font-size: 15px;
}

.gform_wrapper.gravity-theme .gform_validation_errors {
	background: #fff3f3;
	border: 1px solid #e6b8b8;
	border-radius: 4px;
	box-shadow: none;
}

.gform_confirmation_message {
	padding: 30px 32px;
	background: #f1f8f1;
	border-left: 4px solid var(--am-whatsapp);
	font-size: 17px;
}

@media (max-width: 640px) {
	.gform_wrapper.gravity-theme .gform_button {
		width: 100%;
		justify-content: center;
	}
}
