/*
 * Gravity Forms (Orbital theme) styles for thejdhd.com.
 * Colours, borders and button colours come from the gform_default_styles filter in functions.php.
 * Forms opt in to floating labels with the form CSS class "jdhd-float-labels".
 */

.gform-theme--framework .jdhd-float-labels {
	--jdhd-float-label-color: #6b6b6b;
}

.gform-theme--framework .jdhd-float-labels input:not([type="checkbox"], [type="radio"], [type="submit"], [type="button"]),
.gform-theme--framework .jdhd-float-labels textarea {
	font-family: "Roboto", sans-serif;
	font-size: 14px;
	min-block-size: 52px;
	padding-block: 22px 6px;
	padding-inline: 15px;
}

.gform-theme--framework .jdhd-float-labels textarea {
	padding-block-start: 26px;
}

/* Floating labels: the label sits inside the field, then shrinks to the top once focused or filled. */
.gform-theme--framework .jdhd-float-labels :is(.gfield--type-email, .gfield--type-phone, .gfield--type-text, .gfield--type-textarea),
.gform-theme--framework .jdhd-float-labels .ginput_complex > span {
	position: relative;
}

.gform-theme--framework .jdhd-float-labels :is(.gfield--type-email, .gfield--type-phone, .gfield--type-text, .gfield--type-textarea) > .gfield_label,
.gform-theme--framework .jdhd-float-labels .ginput_complex > span > .gform-field-label--type-sub {
	position: absolute;
	inset-block-start: 16px;
	inset-inline-start: 16px;
	z-index: 1;
	margin: 0;
	color: var(--jdhd-float-label-color);
	font-family: "Roboto", sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 20px;
	pointer-events: none;
	transition: inset-block-start 0.15s ease, font-size 0.15s ease;
}

/* Name columns carry GF's grid gutter as padding; offset by it so labels line up with the other fields. */
.gform-theme--framework .jdhd-float-labels .ginput_complex > span > .gform-field-label--type-sub {
	inset-inline-start: calc(var(--gf-field-gap-x) / 2 + 16px);
}

.gform-theme--framework .jdhd-float-labels :is(.gfield--type-email, .gfield--type-phone, .gfield--type-text, .gfield--type-textarea):is(:focus-within, .is-filled, :has(:autofill)) > .gfield_label,
.gform-theme--framework .jdhd-float-labels .ginput_complex > span:is(:focus-within, .is-filled, :has(:autofill)) > .gform-field-label--type-sub {
	inset-block-start: 6px;
	font-size: 11px;
	line-height: 14px;
}

@media (prefers-reduced-motion: reduce) {
	.gform-theme--framework .jdhd-float-labels .gfield_label,
	.gform-theme--framework .jdhd-float-labels .gform-field-label--type-sub {
		transition: none;
	}
}

.gform-theme.gform-theme--framework.gform_wrapper .jdhd-float-labels .gform_fields {
	row-gap: 20px;
}

/* Hide the mask hint (e.g. the phone format) until the field is focused, so it never sits under the label. */
.gform-theme--framework .jdhd-float-labels input:not(:focus)::placeholder {
	color: transparent;
}

/* Text that sits on the section background. Elementor widgets on dark sections carry the "jdhd-on-dark" class. */
.jdhd-on-dark .gform-theme--framework :is(.gform_required_legend, .gchoice .gform-field-label, .gform_description, .gfield_description, .gform_confirmation_message) {
	color: #ffffff;
}

/* Element + two classes on the button to outrank GF's own button selector (0,5,1). */
/* The old forms had no required-fields note: keep it for screen readers only. The asterisks stay on the fields. */
.jdhd-float-labels_wrapper .gform_required_legend {
	position: absolute;
	inline-size: 1px;
	block-size: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

/* Invisible interaction-only Turnstile: lift it out of the grid so its row and gap disappear (the iframe must stay rendered, so no display: none). */
.gform-theme.gform-theme--framework.gform_wrapper .gfield.jdhd-turnstile-collapsed {
	position: absolute;
	block-size: 0;
	overflow: hidden;
}

.elementor-popup-modal .gform-theme.gform-theme--framework.gform_wrapper .gform_footer {
	justify-content: center;
}

.elementor-popup-modal .dialog-message:has(.gform_wrapper) {
	max-block-size: calc(100vh - 40px);
	max-block-size: calc(100dvh - 40px);
	overflow-y: auto;
}

.gform-theme.gform-theme--framework.gform_wrapper .gform_footer button.gform_button.button {
	font-family: "Nunito", sans-serif;
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 1px;
	text-transform: uppercase;
	border-radius: 0;
	min-block-size: 50px;
	padding-inline: 40px;
}

.elementor-location-footer .gform-theme.gform-theme--framework.gform_wrapper .gform_footer button.gform_button.button,
.jdhd-btn-full .gform-theme.gform-theme--framework.gform_wrapper .gform_footer button.gform_button.button {
	flex-grow: 1;
}

.gform-theme.gform-theme--framework.gform_wrapper .jdhd-float-labels .gform_footer {
	margin-block-start: 20px;
}

.gform-theme.gform-theme--framework.gform_wrapper .jdhd-btn-yellow .gform_footer button.gform_button.button {
	background-color: #f8c600;
	color: #ffffff;
	font-size: 15px;
	border-radius: 5px;
	flex-grow: 1;
}

.gform-theme.gform-theme--framework.gform_wrapper .jdhd-btn-yellow .gform_footer button.gform_button.button:is(:hover, :focus-visible) {
	background-color: #e0b300;
	color: #ffffff;
}