/**
 * Polish layer, module "forms" (docs.ia/build/polish-design.md §16.2,
 * design §8.6, §13 R3, R4). Contact Form 7 finish, disabled state (H5),
 * notice card (R3), form air (R4), X3, X4. Needs the base module (tokens).
 * X3 (icon tiles) is one selector shared by the contact page and the about
 * page: with this module disabled the about page's icon tiles also lose
 * the fix, even though "about" is a separate module.
 */

/* R7.2: the contact form's columns (the form card and the office card) sit
   bare, a direct child of the page content, with no colour band and no
   space of their own below them — unlike the careers candidacy section,
   which is its own group with padding-bottom: 6xl. A margin gives the same
   space without touching stored content; 6xl is fluid, so one rule covers
   desktop and phones together, no separate media query needed. Scoped to
   the contact page: :first-of-type would also catch a bare first-child
   columns block on another page that doesn't have this gap. */
.page-id-24 .entry-content > .wp-block-columns {
	margin-bottom: var(--wp--preset--spacing--6-xl);
}

/* R3: "¿Eres ya cliente?" card on /contacto/. !important: inline stored border. */
.wp-block-group.has-accent-soft-background-color.has-border-color[style*="border-color:var(--wp--preset--color--accent)"] {
	border-color: transparent !important;
}

/* R4: forms have too much air. Replaces §8.6's fieldset/legend rows. */
form.wpcf7-form fieldset {
	border: 0;
	padding: 0;
	margin: 0;
	min-width: 0;
}
form.wpcf7-form legend {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
form.wpcf7-form p {
	margin: 0;
}
form.wpcf7-form label {
	display: block;
	margin-block-end: 6px;
	font-weight: 500;
	color: var(--wp--preset--color--ink-soft);
}
form.wpcf7-form .form-group + .form-group {
	margin-block-start: 20px;
}
form.wpcf7-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
form.wpcf7-form textarea,
form.wpcf7-form select {
	min-height: 44px;
}
@media (max-width: 781px) {
	/* !important: card padding is an inline style. Round 5: the direct-child
	   combinator never matched — the Contact Form 7 block wraps .wpcf7 in
	   its own .wp-block-contact-form-7-contact-form-selector div first, so
	   .wpcf7 is a grandchild of the card, not a child. */
	.wp-block-group.has-border-color:has(.wpcf7) {
		padding: var(--wp--preset--spacing--lg) !important;
	}
	form.wpcf7-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
	form.wpcf7-form textarea,
	form.wpcf7-form select {
		font-size: 16px;
	}
}
@media (min-width: 782px) {
	form.wpcf7-form fieldset {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 20px 24px;
	}
	/* Pairs telefono+emailcontacto (design render shows this pair); both forms
	   place them adjacent, so one rule fits both. Everything else spans. */
	form.wpcf7-form .form-group:not(:has([data-name="telefono"])):not(:has([data-name="emailcontacto"])) {
		grid-column: 1 / -1;
	}
}

/* §8.6 Forms: field states, checkbox, file button, submit, messages, anchor. */
form.wpcf7-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
form.wpcf7-form textarea,
form.wpcf7-form select {
	transition: border-color var(--precoin-t-1) var(--precoin-ease-out), background-color var(--precoin-t-1) var(--precoin-ease-out);
}
@media (hover: hover) {
	form.wpcf7-form input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]):hover,
	form.wpcf7-form textarea:hover,
	form.wpcf7-form select:hover {
		border-color: var(--wp--preset--color--ink-faint);
	}
}
form.wpcf7-form input[type="checkbox"] {
	width: 18px;
	height: 18px;
	accent-color: var(--wp--preset--color--accent);
}
form.wpcf7-form input[type="file"]::file-selector-button {
	font: inherit;
	padding: var(--wp--preset--spacing--2-xs) var(--wp--preset--spacing--md);
	border: 1px solid var(--wp--preset--color--line);
	border-radius: var(--wp--custom--radius--pill);
	background: transparent;
	color: var(--wp--preset--color--ink);
	cursor: pointer;
	transition: background-color var(--precoin-t-1) var(--precoin-ease-out);
}
@media (hover: hover) {
	form.wpcf7-form input[type="file"]::file-selector-button:hover {
		background: var(--precoin-ink-06);
	}
}
form.wpcf7-form .wpcf7-submit {
	transition: background-color var(--precoin-t-1) var(--precoin-ease-out), scale var(--precoin-t-press) var(--precoin-ease-out);
}
form.wpcf7-form .wpcf7-submit:focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
}
form.wpcf7-form .wpcf7-submit:active {
	scale: .98;
}
form.wpcf7-form.submitting .wpcf7-submit {
	opacity: .6;
	cursor: progress;
}
/* Owner review 3, H5: Contact Form 7 disables the button until the visitor
   accepts the conditions. Without this rule the button looks active. */
form.wpcf7-form .wpcf7-submit:disabled {
	opacity: .45;
	box-shadow: none;
	cursor: not-allowed;
	translate: none;
	scale: none;
}
form.wpcf7-form .wpcf7-submit:not(:disabled) {
	cursor: pointer;
}
form.wpcf7-form .wpcf7-not-valid-tip {
	color: var(--wp--preset--color--accent-deep);
	font-size: var(--wp--preset--font-size--sm);
}
form.wpcf7-form .wpcf7-response-output {
	border-radius: var(--wp--custom--radius--md);
}

/* Anchor: #candidatura confirms the arrival at the careers form (§8.6). The
   ring is the non-motion rest state; part 2 fades it out. */
#candidatura:target {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 4px;
}

/* X3: icon tiles on about and contact render as full-width bars. */
.wp-block-group.has-accent-soft-background-color:has(> figure.wp-block-image > svg) {
	width: fit-content;
}

/* X4: links in the dark office card. Accent on ink is 3.34 to 1; on-dark
   with an underline replaces the theme's default link colour, which this
   paragraph does not already override (a paragraph that does gets
   has-link-color, like the FAQ sidebar's own dark card). */
.has-ink-background-color p.has-on-dark-color:not(.has-link-color) a {
	color: var(--wp--preset--color--on-dark);
	text-decoration: underline;
}

/* R6.5: the privacy summary (build/migrate-cf7-privacy-details.php wraps it
   in a <details class="wp-block-details precoin-privacy">) gets the
   baseline chevron and open/close motion for free from theme.json's own
   .wp-block-details rules — only the label's own size/colour are this
   module's job. The open content is not touched: it inherits the 14px ink
   text it already had, "the same size it has today". */
.precoin-privacy > summary {
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--ink-soft);
	cursor: pointer;
}
/* R7.3: a little more air between the submit button and the summary. */
.precoin-privacy {
	margin-top: var(--wp--preset--spacing--lg);
}

@media screen and (prefers-reduced-motion: no-preference) {
	/* A message rises in; the careers anchor ring fades out. */
	form.wpcf7-form .wpcf7-response-output {
		animation: precoin-message-rise var(--precoin-t-2) var(--precoin-ease-out) both;
	}
	@keyframes precoin-message-rise {
		from {
			opacity: 0;
			translate: 0 var(--precoin-shift-1);
		}
	}
	#candidatura:target {
		animation: precoin-target-fade 800ms var(--precoin-ease-out) forwards;
	}
	@keyframes precoin-target-fade {
		from { outline-color: var(--wp--preset--color--accent); }
		to { outline-color: transparent; }
	}
}