/* ============================================================
 * Atria Real Estate — Estilos provisionales de formularios
 * (Vender tu propiedad + Contacto general)
 * Estilo base coherente con buscador-propiedades.css.
 * Se refinará en el Prompt 10 (diseño premium).
 * Ubicación: wp-content/themes/atria-child/assets/css/atria-formularios.css
 * ============================================================ */

.atria-form-wrap {
	max-width: 760px;
	margin: 0 auto;
}

.atria-form {
	background: #fff;
	border: 1px solid #e8e8e8;
	border-radius: 10px;
	padding: 32px;
}

.atria-form-titulo {
	font-size: 1.1rem;
	letter-spacing: 0.02em;
	margin: 24px 0 12px;
	padding-bottom: 8px;
	border-bottom: 1px solid #eee;
}

.atria-form-titulo:first-of-type {
	margin-top: 0;
}

.atria-form-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 20px;
}

.atria-form-grid .atria-full {
	grid-column: 1 / -1;
}

.atria-form label {
	display: block;
	font-weight: 600;
	font-size: 0.9rem;
	margin-bottom: 6px;
}

.atria-form .req {
	color: #b3261e;
}

.atria-form input[type="text"],
.atria-form input[type="tel"],
.atria-form input[type="email"],
.atria-form select,
.atria-form textarea {
	width: 100%;
	padding: 10px 12px;
	border: 1px solid #d9d9d9;
	border-radius: 6px;
	/* Métricas explícitas para que el texto de los <select> no se recorte
	   (antes: font: inherit heredaba un line-height del tema que lo cortaba). */
	font-family: inherit;
	font-size: 1rem;
	line-height: normal;
	box-sizing: border-box;
	background: #fafafa;
	transition: border-color 0.2s ease, background 0.2s ease;
}

.atria-form input:focus,
.atria-form select:focus,
.atria-form textarea:focus {
	outline: none;
	border-color: #1a1a1a;
	background: #fff;
}

.atria-form input[type="file"] {
	display: block;
	width: 100%;
	padding: 10px 0;
	font-size: 0.9rem;
}

.atria-form-legal {
	font-size: 0.8rem;
	color: #777;
}

.atria-btn-enviar {
	display: inline-block;
	padding: 14px 34px;
	background: #1a1a1a;
	color: #fff;
	border: none;
	border-radius: 6px;
	font-weight: 600;
	letter-spacing: 0.03em;
	cursor: pointer;
	transition: opacity 0.2s ease;
}

.atria-btn-enviar:hover {
	opacity: 0.85;
}

/* Avisos de resultado */
.atria-form-aviso {
	padding: 14px 18px;
	border-radius: 8px;
	margin-bottom: 20px;
	font-size: 0.95rem;
}

.atria-form-ok {
	background: #eef7ee;
	border: 1px solid #bcdcbc;
	color: #205020;
}

.atria-form-error {
	background: #fbeeee;
	border: 1px solid #e6bcbc;
	color: #7a1f1f;
}

/* Honeypot antispam: invisible para humanos, presente para bots */
.atria-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

@media (max-width: 640px) {
	.atria-form {
		padding: 20px;
	}
	.atria-form-grid {
		grid-template-columns: 1fr;
	}
}
/* ============================================================
 * Modo oscuro del sitio: los formularios se mantienen claros,
 * así que fijamos el color del texto dentro de la tarjeta
 * para que no herede el blanco de los encabezados globales.
 * ============================================================ */

.atria-form .atria-form-titulo,
.atria-form label,
.atria-form legend,
.atria-form h1,
.atria-form h2,
.atria-form h3,
.atria-form h4 {
	color: #0F172A !important;
}

/* Texto que escribe el usuario dentro de los campos */
.atria-form input[type="text"],
.atria-form input[type="tel"],
.atria-form input[type="email"],
.atria-form select,
.atria-form textarea {
	color: #0F172A;
}

.atria-form ::placeholder {
	color: #94A3B8; /* gris azulado, misma familia que #0F172A */
	opacity: 1;
}

/* ============================================================
 * Teléfono internacional (Paso 8): desplegable de prefijo
 * (bandera + código, España preseleccionada) + número nacional.
 * ============================================================ */

.atria-tel-grupo {
	display: flex;
	gap: 8px;
}

.atria-tel-grupo .atria-tel-prefijo {
	flex: 0 0 auto;
	width: auto;
	min-width: 104px;
	cursor: pointer;
}

.atria-tel-grupo input.atria-tel {
	flex: 1 1 auto;
	min-width: 0; /* evita desbordes del flex en móvil */
}

/* ============================================================
 * Consentimiento RGPD (Bloque C): checkbox + enlace a la política
 * (formularios de venta y contacto; el modal de la ficha lleva
 * sus propios estilos inline en single-propiedades.php)
 * ============================================================ */

.atria-form .atria-consent {
	margin: 14px 0 4px;
}

.atria-form .atria-consent label {
	display: flex;
	gap: 10px;
	align-items: flex-start;
	cursor: pointer;
	font-weight: 400;
	font-size: 0.88rem;
	color: #334155;
}

.atria-form .atria-consent input[type="checkbox"] {
	margin-top: 3px;
	flex: 0 0 auto;
	width: 16px;
	height: 16px;
	accent-color: #1a1a1a;
}

.atria-form .atria-consent a {
	color: #1a1a1a;
	text-decoration: underline;
}