/*
 * By default GravityForms uses a CSS grid layout for forms. This works well.
 * The trouble comes when the conditional logic fires and changes uses jQuery
 * to show the field, which changes `display: grid` to `display: block`. The
 * gird layout then falls apart. To avoid this, we simple change the display
 * to a block display below.
 */
.gfield_checkbox .gchoice,
.gfield_radio .gchoice {
	display: block;
	position: relative; /* Keep display: block from jQuery */
}

.gfield_checkbox .gchoice input.gfield-choice-input,
.gfield_radio .gchoice input.gfield-choice-input {
	position: absolute;
	left: 0;
	margin: 0;
}

.gfield_checkbox .gchoice label,
.gfield_radio .gchoice label {
	display: block;
	padding-left: 30px; /* Adjust this value to control spacing between input and label */
	margin: 0;
}

/*
 * Fix for form container which has overflow set to hidden and which cuts off
 * the edges of the form.
 */
.swiper,
swiper-container {
	padding: 5px;
}

/*
 * Space the footer gap evenly to the row gaps.
 */
.gform-theme--foundation .gform_footer,
.gform-theme--foundation .gform_page_footer {
	margin-block-start: var(--gf-form-gap-y) !important;
}

/*
 * Tooltips should display inline with the label when there is
 * two lines of text in the label.
 */
.gfield_label.gform-field-label {
	display: inline-block;
	position: relative;
	max-width: 100%;
}

.gftt-icon {
	margin-left: 6px;
}