/* VH Forms - impresion sobre papel. Hereda las tintas del tema si existen. */
.vh-form-wrap {
	--vhf-paper: var(--paper, #F0F7FE);
	--vhf-edge: var(--paper-edge, #C2DEF9);
	--vhf-ink: var(--ink, #132862);
	--vhf-soft: var(--ink-soft, #455A88);
	--vhf-accent: var(--blue-deep, #1A5AB3);
	--vhf-sun: var(--sun, #F7CD3A);
	--vhf-error: #B3123A;
	--vhf-ok: #17624A;
	--vhf-rule: 2px solid var(--vhf-ink);
	--vhf-ease: cubic-bezier(0.22, 1, 0.36, 1);
	color: var(--vhf-ink);
}

.vh-form__grid {
	display: grid;
	grid-template-columns: repeat(6, minmax(0, 1fr));
	gap: 1.15rem 1rem;
}
.vh-field--full { grid-column: span 6; }
.vh-field--half { grid-column: span 3; }
.vh-field--third { grid-column: span 2; }

.vh-field { display: flex; flex-direction: column; gap: 0.35rem; min-width: 0; }

.vh-field__label {
	font-size: 0.75rem; font-weight: 700;
	letter-spacing: 0.12em; text-transform: uppercase;
	color: var(--vhf-soft);
}
.vh-field__req { color: var(--vhf-accent); }

.vh-field__heading {
	margin: 1.4rem 0 0; padding-top: 0.9rem;
	border-top: var(--vhf-rule);
	font-size: 1.0625rem; letter-spacing: 0;
}

.vh-field__input {
	width: 100%;
	padding: 0.72rem 0.85rem;
	font: inherit; font-size: 1rem;
	color: var(--vhf-ink); background: var(--vhf-paper);
	border: var(--vhf-rule); border-radius: 3px;
	transition: box-shadow 140ms var(--vhf-ease), background-color 140ms var(--vhf-ease);
}
.vh-field__input::placeholder { color: color-mix(in oklch, var(--vhf-soft) 65%, transparent); }
.vh-field__input:hover { background: color-mix(in oklch, var(--vhf-edge) 45%, var(--vhf-paper)); }
.vh-field__input:focus {
	outline: none;
	background: var(--vhf-paper);
	box-shadow: 3px 3px 0 var(--vhf-accent);
}
textarea.vh-field__input { min-height: 8.5rem; resize: vertical; line-height: 1.55; }

select.vh-field__input {
	appearance: none; padding-right: 2.4rem;
	background-image:
		linear-gradient(45deg, transparent 50%, currentColor 50%),
		linear-gradient(135deg, currentColor 50%, transparent 50%);
	background-position: calc(100% - 1.15rem) 55%, calc(100% - 0.85rem) 55%;
	background-size: 6px 6px;
	background-repeat: no-repeat;
}

/* Opciones como fichas troqueladas. */
.vh-field__choices { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.vh-choice {
	display: inline-flex; align-items: center; gap: 0.5rem;
	min-height: 2.75rem;
	padding: 0.5rem 0.9rem;
	font-size: 0.9375rem; line-height: 1.3;
	background: var(--vhf-paper);
	border: var(--vhf-rule); border-radius: 3px;
	cursor: pointer;
	transition: background-color 140ms var(--vhf-ease), box-shadow 140ms var(--vhf-ease);
}
.vh-choice:hover { background: var(--vhf-edge); }
.vh-choice input { accent-color: var(--vhf-accent); width: 1.05rem; height: 1.05rem; flex: none; }
.vh-choice:has(input:checked) { background: var(--vhf-ink); color: var(--vhf-paper); box-shadow: 3px 3px 0 var(--vhf-sun); }
.vh-choice:has(input:focus-visible) { outline: 3px solid var(--vhf-accent); outline-offset: 2px; }

.vh-choice--consent {
	align-items: flex-start;
	padding: 0.8rem 0.9rem;
	font-size: 0.875rem; color: var(--vhf-soft);
	background: transparent; border-style: dashed;
}
.vh-choice--consent:hover { background: transparent; }
.vh-choice--consent:has(input:checked) { background: transparent; color: var(--vhf-ink); box-shadow: none; border-style: solid; }
.vh-choice--consent input { margin-top: 0.15rem; }

.vh-field__help { margin: 0; font-size: 0.8125rem; color: var(--vhf-soft); }
.vh-field__error {
	display: flex; align-items: center; gap: 0.35rem;
	margin: 0; font-size: 0.8125rem; font-weight: 650; color: var(--vhf-error);
}
.vh-field__error::before { content: "!"; display: grid; place-content: center; width: 1.1rem; height: 1.1rem; border: 2px solid currentColor; border-radius: 50%; font-size: 0.7rem; }
.vh-field--error .vh-field__input { border-color: var(--vhf-error); box-shadow: 3px 3px 0 var(--vhf-error); }

.vh-form__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Boton de envio: mismo troquel que los botones del tema. */
.vh-form__actions { margin: 1.75rem 0 0; }
.vh-form__submit {
	display: inline-flex; align-items: center; justify-content: center; gap: 0.6rem;
	width: 100%; min-height: 3.25rem;
	padding: 0.95rem 1.8rem;
	font: inherit; font-size: 0.9375rem; font-weight: 700;
	letter-spacing: 0.08em; text-transform: uppercase;
	color: var(--vhf-ink); background: var(--vhf-sun);
	border: var(--vhf-rule); border-radius: 3px;
	box-shadow: 5px 5px 0 var(--vhf-ink);
	cursor: pointer;
	transition: transform 140ms var(--vhf-ease), box-shadow 140ms var(--vhf-ease);
}
.vh-form__submit:hover { transform: translate(2px, 2px); box-shadow: 3px 3px 0 var(--vhf-ink); }
.vh-form__submit:active { transform: translate(5px, 5px); box-shadow: 0 0 0 var(--vhf-ink); }
.vh-form__submit[disabled] { cursor: progress; opacity: 0.75; transform: none; }
.vh-form__submit::after {
	content: ""; display: none;
	width: 1rem; height: 1rem;
	border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%;
	animation: vh-spin 700ms linear infinite;
}
.vh-form.is-sending .vh-form__submit::after { display: block; }
@keyframes vh-spin { to { transform: rotate(360deg); } }

/* Mensajes */
.vh-form-message {
	margin: 0 0 1.25rem;
	padding: 0.9rem 1rem;
	border: var(--vhf-rule); border-radius: 3px;
	font-size: 0.9375rem;
}
.vh-form-message--ok {
	background: var(--vhf-sun); color: var(--vhf-ink);
	box-shadow: 4px 4px 0 var(--vhf-ink);
	font-weight: 600;
}
.vh-form-message--error { background: transparent; border-color: var(--vhf-error); color: var(--vhf-error); font-weight: 600; }
.vh-form-error { padding: 1rem; background: var(--vhf-sun); border: var(--vhf-rule); }

@media (max-width: 640px) {
	.vh-form__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.vh-field--full, .vh-field--half, .vh-field--third { grid-column: span 2; }
	.vh-field--third { grid-column: span 1; }
}

@media (prefers-reduced-motion: reduce) {
	.vh-form__submit, .vh-field__input, .vh-choice { transition: none; }
}
