/*
 * US Now contact form ([usnow_contact_form]).
 * Uses the US Now theme's design tokens (so it follows the Customizer colors
 * and dark mode) with fallbacks for any other theme.
 */
.usnow-contact {
	--usnow-cf-border: #767f8c; /* 3.7:1 on the gray panel, 4:1 on white (form fields need 3:1). */
	margin: 1.5em 0 2em;
	color: var(--c-text, #111418);
	font-family: var(--font-head, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif);
	font-size: 1rem;
	line-height: 1.5;
}

.usnow-contact *,
.usnow-contact *::before,
.usnow-contact *::after {
	box-sizing: border-box;
}

.usnow-contact__form {
	display: grid;
	gap: 18px;
	margin: 0;
	padding: 20px;
	border: 1px solid var(--c-rule, #e0e3e8);
	border-top: 4px solid var(--c-accent, #d2232a);
	border-radius: var(--radius, 4px);
	background: var(--c-band, #f4f5f7);
}

@media (min-width: 640px) {
	.usnow-contact__form {
		padding: 24px 28px 28px;
	}

	.usnow-contact__row {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 18px;
	}
}

.usnow-contact__row {
	display: grid;
	gap: 18px;
}

.usnow-contact__field {
	min-width: 0;
	margin: 0;
}

.usnow-contact label {
	display: block;
	margin: 0 0 6px;
	color: var(--c-ink, #111418);
	font-size: 0.9375rem;
	font-weight: 700;
}

.usnow-contact input[type="text"],
.usnow-contact input[type="email"],
.usnow-contact select,
.usnow-contact textarea {
	display: block;
	width: 100%;
	min-height: 48px;
	margin: 0;
	padding: 10px 12px;
	border: 1px solid var(--usnow-cf-border);
	border-radius: var(--radius, 4px);
	background: var(--c-bg, #fff);
	color: var(--c-text, #111418);
	font: inherit;
	font-size: 1rem; /* 16px keeps phones from zooming in. */
	line-height: 1.4;
}

.usnow-contact textarea {
	min-height: 168px;
	resize: vertical;
}

.usnow-contact input:focus-visible,
.usnow-contact select:focus-visible,
.usnow-contact textarea:focus-visible {
	border-color: var(--c-focus, #1a5fd0);
	outline: 3px solid var(--c-focus, #1a5fd0);
	outline-offset: 1px;
}

.usnow-contact [aria-invalid="true"] {
	border: 2px solid var(--c-accent-text, #c41e25);
}

.usnow-contact__hint,
.usnow-contact__note {
	margin: 6px 0 0;
	color: var(--c-muted, #5b6370);
	font-size: 0.875rem;
}

.usnow-contact__form > .usnow-contact__note:first-child {
	margin: 0;
}

.usnow-contact__error {
	margin: 6px 0 0;
	color: var(--c-accent-text, #c41e25);
	font-size: 0.875rem;
	font-weight: 700;
}

.usnow-contact__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px 18px;
}

.usnow-contact__actions .usnow-contact__note {
	flex: 1 1 240px;
	margin: 0;
}

.usnow-contact__submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 48px;
	padding: 0 26px;
	border: 0;
	border-radius: var(--radius, 4px);
	background: var(--c-accent, #d2232a);
	color: var(--c-on-accent, #fff);
	font: 800 0.9375rem/1 var(--font-head, system-ui, sans-serif);
	letter-spacing: 0.04em;
	text-transform: uppercase;
	cursor: pointer;
}

.usnow-contact__submit:hover {
	background: var(--c-accent-dark, #a81c22);
}

.usnow-contact__submit:focus-visible {
	outline: 3px solid var(--c-focus, #1a5fd0);
	outline-offset: 2px;
}

/* Honeypot: off screen for people, still in the form for bots. */
.usnow-contact__hp {
	position: absolute !important;
	left: -10000px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.usnow-contact__notice {
	margin: 0 0 18px;
	padding: 16px 20px;
	border: 1px solid var(--c-rule, #e0e3e8);
	border-left: 5px solid var(--c-success, #1a7f37);
	border-radius: var(--radius, 4px);
	background: var(--c-bg, #fff);
	font-size: 1rem;
}

.usnow-contact__notice--error {
	border-left-color: var(--c-accent, #d2232a);
}

.usnow-contact__notice p,
.usnow-contact__notice ul {
	margin: 0 0 6px;
}

.usnow-contact__notice p:last-child,
.usnow-contact__notice ul:last-child {
	margin-bottom: 0;
}

.usnow-contact__notice ul {
	padding-left: 1.2em;
}

.usnow-contact__notice-title {
	color: var(--c-ink, #111418);
	font-size: 1.0625rem;
	font-weight: 800;
}

:root[data-theme="dark"] .usnow-contact {
	--usnow-cf-border: #6b7483;
}