/*
 * Forms — one look for every Gravity Form on the site (Danny, 2026-09-18).
 *
 * "Not a fan of the fully radiused form elements, they always look weird."
 * The pill inputs came from Foundation's $input-radius: 99px in the compiled
 * theme.css; this file sits after it and squares everything to the 4px the
 * rest of the 2026 system uses: inputs, selects, textareas, and the submit
 * button inside a form (site buttons and the header CTA keep their pill).
 *
 * Plain CSS on purpose, outside the gulp build, like process.css and
 * tfp-faq.css. Enqueued site-wide by functions/function-gravity-forms.php.
 * 16px field text is deliberate: anything smaller makes iOS zoom the page on
 * focus. No box-shadows; focus is an outline.
 *
 * Every rule is written `body .gform_wrapper.gravity-theme[class][class][class][class] …` so it outranks
 * Gravity Forms' own basic.css (`.gform_wrapper.gravity-theme …`) whichever of
 * the two stylesheets the page happens to print first.
 */

.gform_wrapper {
	--tff-ink: #0B1E32; --tff-steel: #44546A; --tff-muted: #6B7785; --tff-line: #C9D0D8; --tff-line-strong: #8E9AA8;
	--tff-blue: #005B97; --tff-yellow: #FAC410; --tff-yellow-press: #E0AC00; --tff-error: #B42318; --tff-field: #FFFFFF;
	--tff-radius: 4px;
}

/* ---- grid: two columns from 640px, one below --------------------------- */
body .gform_wrapper.gravity-theme[class][class][class][class] .gform_fields { grid-column-gap: 16px; grid-row-gap: 18px; }
@media (max-width: 639px) {
	body .gform_wrapper.gravity-theme[class][class][class][class] .gform_fields .gfield { grid-column: 1 / -1 !important; }
}

/* ---- labels ------------------------------------------------------------ */
body .gform_wrapper.gravity-theme[class][class][class][class] .gfield_label,
body .gform_wrapper.gravity-theme[class][class][class][class] legend.gfield_label {
	display: block; margin: 0 0 7px; padding: 0;
	font-size: 13px; line-height: 18px; font-weight: 700; letter-spacing: .005em;
}
/* Required is the default here; the exception is what gets marked. The fields
 * keep aria-required, so nothing is lost to a screen reader. */
body .gform_wrapper.gravity-theme[class][class][class][class] .gfield_required { display: none !important; }
body .gform_wrapper.gravity-theme[class][class][class][class] .gfield_optional { margin-left: 6px; font-weight: 400; color: var(--tff-muted); }
body .gform_wrapper.gravity-theme[class][class][class][class] .gfield_description,
body .gform_wrapper.gravity-theme[class][class][class][class] .ginput_complex label,
body .gform_wrapper.gravity-theme[class][class][class][class] .gform-field-label--type-sub { font-size: 13px; line-height: 18px; color: var(--tff-muted); }
body .gform_wrapper.gravity-theme[class][class][class][class] .gfield_description { margin-top: 6px; padding: 0; }

/* ---- fields ------------------------------------------------------------ */
body .gform_wrapper.gravity-theme[class][class][class][class] input[type="text"],
body .gform_wrapper.gravity-theme[class][class][class][class] input[type="email"],
body .gform_wrapper.gravity-theme[class][class][class][class] input[type="tel"],
body .gform_wrapper.gravity-theme[class][class][class][class] input[type="url"],
body .gform_wrapper.gravity-theme[class][class][class][class] input[type="number"],
body .gform_wrapper.gravity-theme[class][class][class][class] input[type="date"],
body .gform_wrapper.gravity-theme[class][class][class][class] input[type="password"],
body .gform_wrapper.gravity-theme[class][class][class][class] select,
body .gform_wrapper.gravity-theme[class][class][class][class] textarea {
	display: block; width: 100%; max-width: 100%; box-sizing: border-box;
	height: 48px; margin: 0; padding: 0 14px;
	font-size: 16px; line-height: 24px; font-weight: 400; color: var(--tff-ink);
	background-color: var(--tff-field);
	border: 1px solid var(--tff-line);
	border-radius: var(--tff-radius) !important;
	box-shadow: none;
	transition: border-color .15s ease-out;
}
body .gform_wrapper.gravity-theme[class][class][class][class] textarea { height: auto; min-height: 112px; padding: 12px 14px; resize: vertical; }
body .gform_wrapper.gravity-theme[class][class][class][class] .gfield textarea.small { min-height: 88px; height: 88px; }
body .gform_wrapper.gravity-theme[class][class][class][class] .gfield textarea.medium { min-height: 112px; height: 112px; }
body .gform_wrapper.gravity-theme[class][class][class][class] .gfield textarea.large { min-height: 176px; height: 176px; }

body .gform_wrapper.gravity-theme[class][class][class][class] select {
	-webkit-appearance: none; appearance: none;
	padding-right: 40px;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1.5l5 5 5-5' fill='none' stroke='%2344546A' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/></svg>");
	background-repeat: no-repeat; background-position: right 14px center; background-size: 12px 8px;
	background-origin: border-box;
}
body .gform_wrapper.gravity-theme[class][class][class][class] select:has(option.gf_placeholder:checked) { color: var(--tff-muted); }
body .gform_wrapper.gravity-theme[class][class][class][class] ::placeholder { color: #8A96A3; opacity: 1; }

body .gform_wrapper.gravity-theme[class][class][class][class] input:hover, body .gform_wrapper.gravity-theme[class][class][class][class] select:hover, body .gform_wrapper.gravity-theme[class][class][class][class] textarea:hover { border-color: var(--tff-line-strong); }
body .gform_wrapper.gravity-theme[class][class][class][class] input:focus, body .gform_wrapper.gravity-theme[class][class][class][class] select:focus, body .gform_wrapper.gravity-theme[class][class][class][class] textarea:focus {
	border-color: var(--tff-blue); box-shadow: none;
	outline: 2px solid var(--tff-blue); outline-offset: 1px;
}

/* ---- choices ----------------------------------------------------------- */
body .gform_wrapper.gravity-theme[class][class][class][class] .gchoice { display: flex; align-items: flex-start; gap: 10px; margin: 0 0 8px; }
body .gform_wrapper.gravity-theme[class][class][class][class] .gchoice label, body .gform_wrapper.gravity-theme[class][class][class][class] .ginput_container_consent label { margin: 0; font-size: 14px; line-height: 20px; font-weight: 400; }
body .gform_wrapper.gravity-theme[class][class][class][class] input[type="checkbox"], body .gform_wrapper.gravity-theme[class][class][class][class] input[type="radio"] {
	flex: none; width: 18px; height: 18px; margin: 1px 0 0; accent-color: var(--tff-blue);
}
body .gform_wrapper.gravity-theme[class][class][class][class] .ginput_container_consent { display: flex; align-items: flex-start; gap: 10px; }

/* ---- file upload ------------------------------------------------------- */
body .gform_wrapper.gravity-theme[class][class][class][class] input[type="file"] { font-size: 14px; max-width: 100%; }
body .gform_wrapper.gravity-theme[class][class][class][class] .gform_drop_area { border: 1px dashed var(--tff-line-strong); border-radius: var(--tff-radius); background: #F7F8FA; }

/* ---- submit ------------------------------------------------------------ */
body .gform_wrapper.gravity-theme[class][class][class][class] .gform_footer, body .gform_wrapper.gravity-theme[class][class][class][class] .gform_page_footer { margin: 22px 0 0; padding: 0; }
body .gform_wrapper.gravity-theme[class][class][class][class] .gform_footer .gform_button.button,
body .gform_wrapper.gravity-theme[class][class][class][class] .gform_page_footer .button {
	min-height: 52px; margin: 0;
	padding: 14px 24px !important;                     /* the parent theme nudges padding on hover */
	font-size: 16px; line-height: 24px; font-weight: 700;
	color: var(--tff-ink); background-color: var(--tff-yellow);
	border: 1px solid var(--tff-yellow);
	border-radius: var(--tff-radius) !important;
	transition: background-color .15s ease-out, border-color .15s ease-out;
}
body .gform_wrapper.gravity-theme[class][class][class][class] .gform_footer .gform_button.button:hover,
body .gform_wrapper.gravity-theme[class][class][class][class] .gform_footer .gform_button.button:focus-visible,
body .gform_wrapper.gravity-theme[class][class][class][class] .gform_page_footer .button:hover { background-color: var(--tff-yellow-press); border-color: var(--tff-yellow-press); color: var(--tff-ink); }
body .gform_wrapper.gravity-theme[class][class][class][class] .gform_footer .gform_button.button:focus-visible { outline: 2px solid var(--tff-blue); outline-offset: 2px; }
body .gform_wrapper.gravity-theme[class][class][class][class] .gform_footer .gform_button.button::before { content: none !important; }   /* theme arrow */
body .gform_wrapper.gravity-theme[class][class][class][class] .gform_footer .gform_button.button::after { display: none !important; }     /* theme underline sweep */
@media (max-width: 639px) { body .gform_wrapper.gravity-theme[class][class][class][class] .gform_footer .gform_button.button { width: 100%; } }

/* ---- validation -------------------------------------------------------- */
body .gform_wrapper.gravity-theme[class][class][class][class] .gfield_error input, body .gform_wrapper.gravity-theme[class][class][class][class] .gfield_error select, body .gform_wrapper.gravity-theme[class][class][class][class] .gfield_error textarea { border-color: var(--tff-error); }
body .gform_wrapper.gravity-theme[class][class][class][class] .gfield_validation_message, body .gform_wrapper.gravity-theme[class][class][class][class] .validation_message {
	margin-top: 6px; padding: 0; border: 0; background: none;
	font-size: 13px; line-height: 18px; color: var(--tff-error);
}
body .gform_wrapper.gravity-theme[class][class][class][class] .gform_validation_errors {
	margin: 0 0 20px; padding: 12px 14px; box-shadow: none;
	border: 1px solid var(--tff-error); border-radius: var(--tff-radius); background: #FEF3F2;
}
body .gform_wrapper.gravity-theme[class][class][class][class] .gform_validation_errors h2 { margin: 0; font-size: 14px; line-height: 20px; color: var(--tff-error); }

/* ---- a form on navy (solution / application prefooters: .dark-form) ------ */
/* Labels already inherit white there; the muted greys need lifting too. */
body .dark-form .gform_wrapper.gravity-theme[class][class][class][class] .gfield_optional,
body .dark-form .gform_wrapper.gravity-theme[class][class][class][class] .gfield_description,
body .dark-form .gform_wrapper.gravity-theme[class][class][class][class] .gform-field-label--type-sub,
body .prefooter .gform_wrapper.gravity-theme[class][class][class][class] .gfield_optional,
body .prefooter .gform_wrapper.gravity-theme[class][class][class][class] .gfield_description { color: rgba(255, 255, 255, .74); }
body .dark-form .gform_wrapper.gravity-theme[class][class][class][class] input:focus,
body .dark-form .gform_wrapper.gravity-theme[class][class][class][class] select:focus,
body .dark-form .gform_wrapper.gravity-theme[class][class][class][class] textarea:focus { outline-color: var(--tff-yellow); border-color: var(--tff-yellow); }
