/* ==========================================================================
   Formulario contacto — Figma 6501:22120 (ficha venta / sidebar).
   ========================================================================== */

.wp-block-nerjavillas-formulario-contacto {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

/* --- Card --- */

.formulario-contacto {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	gap: 24px;
	padding: 24px;
	width: 100%;
	box-sizing: border-box;
	border: 1px solid var(--wp--preset--color--accent);
	border-radius: 12px;
	background-color: var(--wp--preset--color--tertiary);
}

.formulario-contacto__title-heading {
	margin: 0;
	font-family: var(--wp--preset--font-family--heading);
	font-size: var(--wp--preset--font-size--x-large);
	font-weight: 400;
	line-height: 1.3;
	color: var(--wp--preset--color--corporativo-01);
}

/* Precio — mismos tokens que booking-card (6501:21876) */

.formulario-contacto__price {
	display: flex;
	flex-direction: column;
	gap: 8px;
	line-height: 1;
	color: var(--wp--preset--color--accent);
}

.formulario-contacto__price-label {
	font-family: var(--wp--preset--font-family--body);
	font-weight: 300;
	font-size: var(--wp--preset--font-size--medium);
	letter-spacing: -0.01em;
	margin: 0;
}

.formulario-contacto__price-row {
	display: flex;
	align-items: flex-end;
	flex-wrap: wrap;
	gap: 12px;
}

.formulario-contacto__price-amount {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 400;
	font-size: var(--wp--preset--font-size--heading-2);
	letter-spacing: -0.01em;
	margin: 0;
	line-height: 1;
}

.formulario-contacto__price-period {
	font-family: var(--wp--preset--font-family--heading);
	font-weight: 400;
	font-size: var(--wp--preset--font-size--large);
	letter-spacing: -0.01em;
	margin: 0;
	line-height: 1;
}

/* Título sección solicitud */

.formulario-contacto__lead {
	margin: 0;
	padding: 0;
	font-family: var(--wp--preset--font-family--body);
	font-weight: 400;
	font-size: 1rem;
	line-height: 1.3;
	letter-spacing: -0.01em;
	text-transform: uppercase;
	color: var(--wp--preset--color--foreground);
}

/* Agrupación campos interior (gap 24px respecto máqueta 02) */

.formulario-contacto__fields {
	display: flex;
	flex-direction: column;
	gap: 24px;
	width: 100%;
}

.formulario-contacto__row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	width: 100%;
}

.formulario-contacto__cell {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 8px 12px;
	box-sizing: border-box;
	min-width: 0;
	width: 100%;
	border: 1px solid var(--wp--preset--color--secondary);
	border-radius: 6px;
	background-color: var(--wp--preset--color--tertiary);
}

.formulario-contacto__cell--block {
	grid-column: 1 / -1;
}

.formulario-contacto__cell-label {
	display: flex;
	align-items: center;
	min-height: 15px;
	font-family: var(--wp--preset--font-family--body);
	font-size: 12px;
	font-weight: 300;
	color: var(--wp--preset--color--accent);
	margin: 0;
	line-height: 1.25;
}

.formulario-contacto__cell-input {
	width: 100%;
	box-sizing: border-box;
	min-height: 20px;
	margin: 0;
	padding: 0;
	border: none;
	outline: none;
	background: transparent;
	font-family: var(--wp--preset--font-family--body);
	font-size: 1rem;
	font-weight: 400;
	color: var(--wp--preset--color--foreground);
	line-height: 1.25;
	border-radius: 0;
	box-shadow: none;
}

.formulario-contacto__cell-input:focus,
.formulario-contacto__cell-input:focus-visible {
	outline: none;
	box-shadow: none;
}

.formulario-contacto__textarea {
	min-height: 52px;
	resize: vertical;
}

.formulario-contacto__cell-input::placeholder {
	font-weight: 400;
	color: var(--wp--preset--color--quaternary);
}

/* Checkbox + texto legal */

.formulario-contacto__consent {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0;
	cursor: pointer;
}

.formulario-contacto__checkbox {
	flex-shrink: 0;
	width: 20px;
	height: 20px;
	margin: 2px 0 0;
	accent-color: var(--wp--preset--color--accent);
	cursor: pointer;
}

.formulario-contacto__consent-text {
	flex: 1;
	min-width: 0;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: -0.01em;
	color: var(--wp--preset--color--quaternary);
}

.formulario-contacto__consent-text a {
	color: var(--wp--preset--color--accent);
	text-decoration: underline;
}

.formulario-contacto__consent-text a:hover {
	text-decoration: underline;
	opacity: 0.85;
}

/* CTA — misma animación que booking-card (6501:21876 / CTA enviar) */

.formulario-contacto__submit {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 62px;
	background-color: var(--wp--preset--color--accent);
	border-radius: 6px;
	overflow: hidden;
	border: none;
	padding: 0;
	cursor: pointer;
}

.formulario-contacto__submit-shadow {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 100%;
	background-color: var(--wp--preset--color--tertiary);
	border-radius: 6px;
	transition: width 0.4s ease;
	z-index: 1;
	pointer-events: none;
}

.formulario-contacto__submit:hover .formulario-contacto__submit-shadow,
.formulario-contacto__submit:focus-visible .formulario-contacto__submit-shadow {
	width: 100%;
}

.formulario-contacto__submit-link {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	gap: 12px;
	padding: 21px;
	width: 100%;
	box-sizing: border-box;
}

.formulario-contacto__submit-text {
	height: 20px;
	overflow: hidden;
}

.formulario-contacto__submit-text span {
	display: block;
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--normal);
	font-weight: 400;
	line-height: 20px;
	white-space: nowrap;
	transition: transform 0.4s ease;
}

.formulario-contacto__submit-text span:first-child {
	color: var(--wp--preset--color--tertiary);
}

.formulario-contacto__submit-text span:last-child {
	color: var(--wp--preset--color--accent);
}

.formulario-contacto__submit:hover .formulario-contacto__submit-text span,
.formulario-contacto__submit:focus-visible .formulario-contacto__submit-text span {
	transform: translateY(-20px);
}

.formulario-contacto__submit-icons {
	width: 20px;
	height: 20px;
	overflow: hidden;
	flex-shrink: 0;
}

.formulario-contacto__submit-icons svg {
	display: block;
	width: 20px;
	height: 20px;
	transition: transform 0.4s ease;
	flex-shrink: 0;
	stroke: currentColor;
	fill: none;
	color: inherit;
}

.formulario-contacto__submit-icons svg:first-child {
	color: var(--wp--preset--color--tertiary);
}

.formulario-contacto__submit-icons svg:last-child {
	color: var(--wp--preset--color--accent);
}

.formulario-contacto__submit:hover .formulario-contacto__submit-icons svg,
.formulario-contacto__submit:focus-visible .formulario-contacto__submit-icons svg {
	transform: translateY(-20px);
}

/* ---- Contact Form 7 (campos dentro de la cáscara) ---- */

.formulario-contacto--cf7 .formulario-contacto__cf7 {
	width: 100%;
}

.formulario-contacto--cf7 .wpcf7 {
	margin: 0;
}

.formulario-contacto--cf7 .wpcf7-form {
	display: flex;
	flex-direction: column;
	gap: 24px;
	margin: 0;
}

.formulario-contacto--cf7 .wpcf7-form p {
	margin: 0;
}

.formulario-contacto--cf7 .wpcf7-form-control-wrap {
	display: block;
	width: 100%;
}

.formulario-contacto--cf7 .wpcf7-not-valid-tip {
	font-size: 12px;
	margin-top: 4px;
	color: var(--wp--preset--color--accent);
}

.formulario-contacto--cf7 .wpcf7-response-output {
	margin: 0;
	padding: 12px;
	border-radius: 6px;
	font-size: 14px;
}

.formulario-contacto--cf7 .wpcf7-spinner {
	display: none !important;
}

.formulario-contacto--cf7 .formulario-contacto__consent .wpcf7-form-control-wrap,
.formulario-contacto--cf7 .formulario-contacto__consent .wpcf7-acceptance,
.formulario-contacto--cf7 .formulario-contacto__consent .wpcf7-list-item {
	margin: 0;
	display: block;
}

.formulario-contacto--cf7 .formulario-contacto__consent label {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0;
	cursor: pointer;
}

.formulario-contacto--cf7 .formulario-contacto__consent .wpcf7-list-item-label {
	flex: 1;
	min-width: 0;
	font-family: var(--wp--preset--font-family--body);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: -0.01em;
	color: var(--wp--preset--color--quaternary);
}

.formulario-contacto--cf7 textarea.formulario-contacto__cell-input,
.formulario-contacto--cf7 textarea.formulario-contacto__textarea {
	display: block;
	width: 100%;
	min-height: 52px;
	resize: vertical;
}

.formulario-contacto--cf7 .formulario-contacto__fields--stacked {
	display: flex;
	flex-direction: column;
	gap: 16px;
	width: 100%;
}

.formulario-contacto--cf7 select.formulario-contacto__cell-input,
.formulario-contacto--cf7 select.formulario-contacto__cell-select,
.formulario-contacto--cf7 input.formulario-contacto__cell-date {
	display: block;
	width: 100%;
	box-sizing: border-box;
	min-height: 20px;
	margin: 0;
	padding: 0;
	border: none;
	outline: none;
	background: transparent;
	font-family: var(--wp--preset--font-family--body);
	font-size: 1rem;
	font-weight: 400;
	color: var(--wp--preset--color--foreground);
	line-height: 1.25;
	appearance: none;
}

.formulario-contacto--cf7 .formulario-contacto__row--dates {
	display: grid;
	grid-template-columns: 1fr auto 1fr;
	align-items: center;
	gap: 12px;
	width: 100%;
}

.formulario-contacto--cf7 .formulario-contacto__cell--date {
	padding: 8px 12px;
	border: 1px solid var(--wp--preset--color--secondary);
	border-radius: 6px;
	background-color: var(--wp--preset--color--tertiary);
}

.formulario-contacto--cf7 .formulario-contacto__dates-sep {
	font-family: var(--wp--preset--font-family--body);
	font-size: 1rem;
	color: var(--wp--preset--color--quaternary);
}

.formulario-contacto--cf7 .formulario-contacto__check-row .wpcf7-list-item {
	margin: 0;
}

.formulario-contacto--cf7 .formulario-contacto__check-row label {
	display: flex;
	align-items: flex-start;
	gap: 12px;
	margin: 0;
	cursor: pointer;
	font-family: var(--wp--preset--font-family--body);
	font-size: 14px;
	font-weight: 400;
	line-height: 1.3;
	color: var(--wp--preset--color--quaternary);
}

.formulario-contacto--cf7 .formulario-contacto__consent .wpcf7-list-item-label a {
	color: var(--wp--preset--color--accent);
	text-decoration: underline;
}

.formulario-contacto--cf7 input.wpcf7-submit.formulario-contacto__submit,
.formulario-contacto--cf7 .wpcf7-submit.formulario-contacto__submit {
	display: block;
	width: 100%;
	min-height: 62px;
	margin: 0;
	padding: 21px;
	border: none;
	border-radius: 6px;
	background-color: var(--wp--preset--color--accent);
	font-family: var(--wp--preset--font-family--body);
	font-size: var(--wp--preset--font-size--normal);
	font-weight: 400;
	line-height: 1.25;
	color: var(--wp--preset--color--tertiary);
	cursor: pointer;
	box-sizing: border-box;
	transition: background-color 0.2s ease, opacity 0.2s ease, transform 0.15s ease, color 0.2s ease;
}

.formulario-contacto--cf7 input.wpcf7-submit.formulario-contacto__submit:hover:not(:disabled):not([aria-disabled="true"]),
.formulario-contacto--cf7 input.wpcf7-submit.formulario-contacto__submit:focus-visible:not(:disabled):not([aria-disabled="true"]),
.formulario-contacto--cf7 .wpcf7-submit.formulario-contacto__submit:hover:not(:disabled):not([aria-disabled="true"]),
.formulario-contacto--cf7 .wpcf7-submit.formulario-contacto__submit:focus-visible:not(:disabled):not([aria-disabled="true"]) {
	opacity: 0.92;
}

.formulario-contacto--cf7 input.wpcf7-submit.formulario-contacto__submit:active:not(:disabled):not([aria-disabled="true"]),
.formulario-contacto--cf7 .wpcf7-submit.formulario-contacto__submit:active:not(:disabled):not([aria-disabled="true"]) {
	transform: translateY(1px);
}

.formulario-contacto--cf7 input.wpcf7-submit.formulario-contacto__submit:disabled,
.formulario-contacto--cf7 input.wpcf7-submit.formulario-contacto__submit[aria-disabled="true"],
.formulario-contacto--cf7 .wpcf7-submit.formulario-contacto__submit:disabled,
.formulario-contacto--cf7 .wpcf7-submit.formulario-contacto__submit[aria-disabled="true"],
.formulario-contacto--cf7 .wpcf7-form.submitting input.wpcf7-submit.formulario-contacto__submit,
.formulario-contacto--cf7 .wpcf7-form.submitting .wpcf7-submit.formulario-contacto__submit {
	opacity: 1;
	cursor: not-allowed;
	background-color: var(--wp--preset--color--secondary);
	color: var(--wp--preset--color--tertiary);
	transform: none;
}

/* ---- Responsive ---- */

@media (max-width: 600px) {
	.formulario-contacto {
		padding: 16px;
		gap: 24px;
	}

	.formulario-contacto__row {
		grid-template-columns: 1fr;
	}
}