/* Aligns Jetpack Forms with the theme's existing design tokens.
   Jetpack exposes its own look via CSS custom properties, but sets them
   inline on the block wrapper, so ours need !important to win. Jetpack's
   internal classes (jetpack-field-label__input, etc.) are also targeted
   directly for the few things the custom properties don't cover. */
.wp-block-jetpack-contact-form {
	--jetpack--contact-form--primary-color: var(--ink) !important;
	--jetpack--contact-form--background-color: transparent !important;
	--jetpack--contact-form--body-text-color: var(--ink) !important;
	--jetpack--contact-form--text-color: var(--ink) !important;
	--jetpack--contact-form--border: 1px solid #aaa !important;
	--jetpack--contact-form--border-color: #aaa !important;
	--jetpack--contact-form--border-size: 1px !important;
	--jetpack--contact-form--border-radius: 8px !important;
	--jetpack--contact-form--input-padding: 14px !important;
	--jetpack--contact-form--input-height: 49px !important;
	--jetpack--contact-form--font-size: 16px !important;
	--jetpack--contact-form--font-family: Inter, -apple-system, BlinkMacSystemFont, "SF Pro Display", sans-serif !important;
	--jetpack--contact-form--line-height: 1.4 !important;
	--jetpack--contact-form--button-primary--color: #fff !important;
	--jetpack--contact-form--button-primary--background-color: #181818 !important;
	--jetpack--contact-form--button-primary--border-color: #181818 !important;
	--jetpack--contact-form--button-primary--padding: 0 18px !important;
	gap: 24px !important;
}

.wp-block-jetpack-contact-form .jetpack-field-label__input {
	font: 500 10px var(--font-geist-mono), monospace !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase !important;
	color: #686868 !important;
}

.wp-block-jetpack-contact-form .jetpack-field-label .required {
	font: 500 10px var(--font-geist-mono), monospace !important;
	color: #999 !important;
}

.wp-block-jetpack-contact-form .wp-block-button {
	align-self: flex-start;
}

.wp-block-jetpack-contact-form .wp-block-button__link {
	min-width: 190px;
	min-height: 49px;
	border-radius: 12px !important;
}

@media (max-width: 680px) {
	.wp-block-jetpack-contact-form .wp-block-button__link {
		width: 100%;
	}
}
