/*
 * NMCSAP — Gravity Forms (Orbital theme) styling.
 * Design: Figma NMCSAP-QA, Contact form (1300:17209).
 *
 * Mostly done through Orbital's own CSS variables so every field type
 * (text, email, phone, select, textarea, name, radio, checkbox, consent…)
 * picks it up consistently.
 */

body .gform_wrapper.gform-theme--framework {
	/* Layout */
	--gf-form-gap-y: 32px;
	--gf-form-gap-x: 15px;
	--gf-field-gap-x: 15px;
	--gf-label-space-primary: 6px;
	--gf-label-space-tertiary: 6px;

	/* Controls */
	--gf-ctrl-size-md: 54px;
	--gf-ctrl-radius: 99999px;
	--gf-radius-max-md: 99999px;
	--gf-ctrl-padding-x: 21px;
	--gf-ctrl-select-padding-x: 21px;
	--gf-ctrl-shadow: none;
	--gf-ctrl-font-family: "Public Sans", sans-serif;
	--gf-ctrl-font-size: 14px;
	--gf-ctrl-color: #111111;
	--gf-ctrl-border-color: #BBBBBB;
	--gf-ctrl-border-color-hover: #888888;
	--gf-ctrl-border-color-focus: #E0AB25;
	--gf-ctrl-outline-color-focus: rgba(224, 171, 37, 0.35);
	--gf-ctrl-outline-width-focus: 2px;
	--gf-ctrl-placeholder-color: #808080;
	--gf-ctrl-placeholder-opacity: 1;
	--gf-ctrl-placeholder-font-family: "Public Sans", sans-serif;
	--gf-ctrl-placeholder-font-size: 14px;
	--gf-ctrl-textarea-height: 191px;
	--gf-ctrl-textarea-radius: 6px;
	--gf-ctrl-textarea-padding-y: 23px;

	/* Labels (field label, choice text, required mark); name sub-labels are styled below */
	--gf-ctrl-label-font-family-primary: "Avenir LT Pro", "Avenir", sans-serif;
	--gf-ctrl-label-font-size-primary: 16px; /* BugHerd #39 */
	--gf-ctrl-label-font-weight-primary: 800;
	--gf-ctrl-label-line-height-primary: 24px;
	--gf-ctrl-label-color-primary: #111111;
	/* secondary = radio / checkbox choice text */
	--gf-ctrl-label-font-family-secondary: "Public Sans", sans-serif;
	--gf-ctrl-label-font-size-secondary: 14px;
	--gf-ctrl-label-font-weight-secondary: 400;
	--gf-ctrl-label-line-height-secondary: 20px;
	--gf-ctrl-label-color-secondary: #111111;
	--gf-ctrl-label-font-family-tertiary: "Public Sans", sans-serif;
	--gf-ctrl-label-font-size-tertiary: 14px;
	--gf-ctrl-label-color-tertiary: #111111;
	--gf-ctrl-label-font-family-req: "Avenir LT Pro", "Avenir", sans-serif;
	--gf-ctrl-label-font-size-req: 16px;
	--gf-ctrl-label-font-weight-req: 800;
	--gf-ctrl-label-color-req: #111111;

	/* Submit button — white pill with gold outline */
	--gf-ctrl-btn-font-family: "Avenir LT Pro", "Avenir", sans-serif;
	/* GF sets --gf-ctrl-btn-size / -font-size / -padding-x inline on #gform_wrapper_N
	   pointing at the -md variants, so the -md variants are what we override. */
	--gf-ctrl-btn-font-size-md: 18px; /* BugHerd #40 — matches the kit Button global */
	--gf-ctrl-btn-font-weight: 800;
	--gf-ctrl-btn-line-height: 20px;
	--gf-ctrl-btn-size-md: 53px;
	--gf-ctrl-btn-padding-x-md: 43px;
	--gf-ctrl-btn-radius: 99999px;
	--gf-ctrl-btn-shadow: none;
	--gf-ctrl-btn-shadow-hover: none;
	--gf-ctrl-btn-shadow-focus: none;
	--gf-ctrl-btn-bg-color-primary: #FFFFFF;
	--gf-ctrl-btn-color-primary: #111111;
	--gf-ctrl-btn-border-width-primary: 1px;
	--gf-ctrl-btn-border-style-primary: solid;
	--gf-ctrl-btn-border-color-primary: #E0AB25;
	--gf-ctrl-btn-bg-color-hover-primary: #E0AB25;
	--gf-ctrl-btn-color-hover-primary: #111111;
	--gf-ctrl-btn-border-color-hover-primary: #E0AB25;
	--gf-ctrl-btn-bg-color-focus-primary: #E0AB25;
	--gf-ctrl-btn-color-focus-primary: #111111;
	--gf-ctrl-btn-border-color-focus-primary: #E0AB25;
}

/* Sub-labels (Name → First / Last, Address parts) look like field labels in the design. */
body .gform_wrapper.gform-theme--framework .gform-field-label--type-sub {
	font-family: "Avenir LT Pro", "Avenir", sans-serif;
	font-size: 16px;
	font-weight: 800;
	line-height: 24px;
	color: #111111;
}

/* Required mark is a plain "*" right after the label text. */
body .gform_wrapper.gform-theme--framework .gfield_required {
	margin-inline-start: 0;
	padding-inline-start: 0;
}

/* Select arrow sits where the design puts it (21px from the right edge). */
body .gform_wrapper.gform-theme--framework select.gfield_select,
body .gform_wrapper.gform-theme--framework .ginput_container_select select {
	background-position: right 21px center;
	padding-inline-end: 44px;
}

/* Placeholder option in selects reads like a placeholder until a value is picked. */
body .gform_wrapper.gform-theme--framework select.gfield_select:has(option[value=""]:checked) {
	color: #808080;
}

/* Submit button hugs its text (design), full width on phones. */
body .gform_wrapper.gform-theme--framework .gform_footer,
body .gform_wrapper.gform-theme--framework .gform_page_footer {
	margin-block-start: 32px;
}

body .gform_wrapper.gform-theme--framework .gform_footer input[type="submit"],
body .gform_wrapper.gform-theme--framework .gform_footer button[type="submit"],
body .gform_wrapper.gform-theme--framework .gform_page_footer .gform_button,
body .gform_wrapper.gform-theme--framework .gform_page_footer .gform_next_button,
body .gform_wrapper.gform-theme--framework .gform_page_footer .gform_previous_button {
	min-width: 180px !important; /* beats GF's #gform_wrapper_N rules */
	transition: background-color .2s, border-color .2s, color .2s;
}

/* Legislative Priorities signup card (GF form 6, M27): 18px labels (BugHerd #59). */
@media (min-width: 768px) {
	body #gform_wrapper_6.gform-theme--framework {
		--gf-ctrl-label-font-size-primary: 18px;
		--gf-ctrl-label-font-size-req: 18px;
	}

	body #gform_wrapper_6.gform-theme--framework .gform-field-label--type-sub {
		font-size: 18px;
	}
}

/* Footer newsletter form keeps a 20px submit (BugHerd #28). */
@media (min-width: 768px) {
	body .elementor-location-footer .gform_wrapper.gform-theme--framework {
		--gf-ctrl-btn-font-size-md: 20px;
	}
}

/* Radio / checkbox choices (e.g. Donation form) use the brand gold. */
body .gform_wrapper.gform-theme--framework .gfield-choice-input:checked,
body .gform_wrapper.gform-theme--framework input[type="radio"]:checked,
body .gform_wrapper.gform-theme--framework input[type="checkbox"]:checked {
	border-color: #E0AB25;
}

/* Validation */
body .gform_wrapper.gform-theme--framework .gfield_error input,
body .gform_wrapper.gform-theme--framework .gfield_error select,
body .gform_wrapper.gform-theme--framework .gfield_error textarea {
	border-color: #C02B0A;
}

body .gform_wrapper.gform-theme--framework .gform_validation_errors {
	border-radius: 6px;
	box-shadow: none;
}

/* Confirmation message */
body .gform_confirmation_message {
	font-family: "Public Sans", sans-serif;
	font-size: 18px;
	line-height: 1.5;
	color: #111111;
}

@media (max-width: 767px) {
	body .gform_wrapper.gform-theme--framework {
		--gf-form-gap-y: 24px;
		--gf-ctrl-size-md: 50px;
		--gf-ctrl-btn-font-size-md: 16px;
	}

	body .gform_wrapper.gform-theme--framework .gform_footer input[type="submit"],
	body .gform_wrapper.gform-theme--framework .gform_footer button[type="submit"] {
		width: 100%;
	}
}

/* =========================================================================
 * Donation form (form CSS class "nmcsap-donate") — Givebutter widget look
 * from Figma M09 (1254:14305): segmented One-time / Monthly toggle, 3×2
 * amount pills, "$ Other USD" field, note toggle, full-width Continue.
 * ====================================================================== */

body .gform_wrapper.nmcsap-donate_wrapper {
	--gf-form-gap-y: 16px;
	--gf-ctrl-size-md: 46px;
}

body .gform_wrapper.nmcsap-donate_wrapper .gform_fields {
	row-gap: 16px;
}

/* Hidden field labels stay available to screen readers. */
body .gform_wrapper.nmcsap-donate_wrapper .hidden_label > .gfield_label {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
}

/* "Choose amount" heading with shield icon */
body .gform_wrapper.nmcsap-donate_wrapper .nmd-choose {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 0;
	font-family: "Public Sans", sans-serif;
	font-size: 14px;
	font-weight: 700;
	line-height: 20px;
	color: #111111;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-choose::before {
	content: "";
	width: 20px;
	height: 20px;
	background: url("../img/icon-shield.svg") center / contain no-repeat;
}

/* Radio choices become buttons: the input covers its label, invisible. */
body .gform_wrapper.nmcsap-donate_wrapper .nmd-toggle .gchoice,
body .gform_wrapper.nmcsap-donate_wrapper .nmd-amounts .gchoice {
	position: relative;
	display: block;
	margin: 0;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-toggle .gfield-choice-input,
body .gform_wrapper.nmcsap-donate_wrapper .nmd-amounts .gfield-choice-input {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
	z-index: 1;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-toggle .gform-field-label--type-inline,
body .gform_wrapper.nmcsap-donate_wrapper .nmd-amounts .gform-field-label--type-inline {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	margin: 0;
	padding: 0 8px;
	font-family: "Public Sans", sans-serif;
	font-size: 14px;
	font-weight: 600;
	line-height: 20px;
	text-transform: capitalize;
	border-radius: 9999px;
	transition: background-color .15s, border-color .15s, color .15s;
}

/* One-time / Monthly segmented toggle */
body .gform_wrapper.nmcsap-donate_wrapper .nmd-toggle .gfield_radio {
	display: flex;
	flex-direction: row; /* GF's vertical choice alignment would stack them */
	gap: 4px;
	padding: 4px;
	background: #F0F0F0;
	border-radius: 999px;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-toggle .gchoice {
	flex: 1 1 0;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-toggle .gform-field-label--type-inline {
	height: 38px;
	border: 1px solid transparent;
	color: #888888;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-toggle .gfield-choice-input:checked + label {
	background: #FFFFFF;
	border-color: #DDDDDD;
	color: #111111;
	box-shadow: 0 1px 1.5px rgba(224, 171, 37, .25), 0 1px 1px rgba(224, 171, 37, .27);
}

/* Amount pills, 3 per row */
body .gform_wrapper.nmcsap-donate_wrapper .nmd-amounts .gfield_radio {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 8px 17px;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-amounts .gform-field-label--type-inline {
	height: 46px;
	background: #F7F7F7;
	border: 1px solid #E5E5E5;
	color: #444444;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-amounts .gchoice:hover .gform-field-label--type-inline {
	border-color: #BBBBBB;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-amounts .gfield-choice-input:checked + label {
	background: #F0F0F0;
	border-color: #111111;
	color: #111111;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-toggle .gfield-choice-input:focus-visible + label,
body .gform_wrapper.nmcsap-donate_wrapper .nmd-amounts .gfield-choice-input:focus-visible + label {
	outline: 2px solid #E0AB25;
	outline-offset: 2px;
}

/* "$ Other USD" */
body .gform_wrapper.nmcsap-donate_wrapper .nmd-other .ginput_container_number {
	position: relative;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-other .ginput_container_number::before,
body .gform_wrapper.nmcsap-donate_wrapper .nmd-other .ginput_container_number::after {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	pointer-events: none;
	font-family: "Public Sans", sans-serif;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-other .ginput_container_number::before {
	content: "$";
	left: 17px;
	font-size: 14px;
	font-weight: 600;
	color: #888888;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-other .ginput_container_number::after {
	content: "USD";
	right: 17px;
	font-size: 12px;
	color: #AAAAAA;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-other input[type="number"] {
	height: 46px;
	padding-inline: 33px 52px;
	background: #F7F7F7;
	border-color: #E5E5E5;
	background-image: none !important; /* GF draws its own number spinner icon */
	-moz-appearance: textfield;
	appearance: textfield;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-other input[type="number"]::-webkit-outer-spin-button,
body .gform_wrapper.nmcsap-donate_wrapper .nmd-other input[type="number"]::-webkit-inner-spin-button {
	-webkit-appearance: none !important;
	display: none !important;
	margin: 0;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-other input[type="number"]::placeholder {
	color: #AAAAAA;
}

/* Note toggle checkbox */
body .gform_wrapper.nmcsap-donate_wrapper .nmd-note-toggle .gchoice {
	display: flex;
	align-items: center;
	gap: 10px;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-note-toggle input[type="checkbox"] {
	width: 16px;
	height: 16px;
	border: 1px solid #CCCCCC;
	border-radius: 4px;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-note-toggle .gform-field-label--type-inline {
	font-family: "Public Sans", sans-serif;
	font-size: 14px;
	font-weight: 600;
	color: #444444;
}

body .gform_wrapper.nmcsap-donate_wrapper .nmd-note textarea {
	--gf-ctrl-textarea-height: 110px;
	padding-block: 14px;
}

/* Continue — full width */
body .gform_wrapper.nmcsap-donate_wrapper .gform_footer {
	margin-block-start: 8px;
}

body .gform_wrapper.nmcsap-donate_wrapper .gform_footer input[type="submit"],
body .gform_wrapper.nmcsap-donate_wrapper .gform_footer button[type="submit"] {
	width: 100% !important; /* beats GF's #gform_wrapper_N button rules */
	--gf-ctrl-btn-size-md: 54px;
}

@media (max-width: 767px) {
	body .gform_wrapper.nmcsap-donate_wrapper .nmd-amounts .gfield_radio {
		gap: 8px;
	}
}