/*
 * LogicMonitor frontend treatment for Gravity Forms.
 *
 * These selectors are intentionally scoped to Gravity Forms so the theme's
 * existing form styles and unrelated WordPress forms are left unchanged.
 */

.gform_wrapper {
	--unicorn-form-blue: #1a31ff;
	--unicorn-form-midnight: #060f4b;
	--unicorn-form-text: #2f3662;
	--unicorn-form-muted: #667085;
	--unicorn-form-border: #d0d5dd;
	--unicorn-form-error: #f04438;
	color: var(--unicorn-form-text);
	font-family: "DM Sans", sans-serif;
}

.gform_wrapper .gform_fields {
	column-gap: 24px;
	row-gap: 24px;
}

.gform_wrapper .gfield {
	margin-bottom: 0;
}

.gform_wrapper .gfield_label {
	margin: 0 0 6px;
	color: var(--unicorn-form-text);
	font-family: "DM Sans", sans-serif;
	font-size: 14px;
	font-style: normal;
	font-weight: 600;
	line-height: 20px;
}

.gform_wrapper .gfield_required {
	color: var(--unicorn-form-error);
}

.gform_wrapper input[type="email"],
.gform_wrapper input[type="number"],
.gform_wrapper input[type="password"],
.gform_wrapper input[type="search"],
.gform_wrapper input[type="tel"],
.gform_wrapper input[type="text"],
.gform_wrapper input[type="url"],
.gform_wrapper select,
.gform_wrapper textarea {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	min-height: 48px;
	margin: 0 !important;
	padding: 12px 6px !important;
	border: 0 !important;
	border-bottom: 1.5px solid var(--unicorn-form-border) !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--unicorn-form-text) !important;
	font-family: "DM Sans", sans-serif;
	font-size: 16px;
	font-style: normal;
	font-weight: 500;
	line-height: 19.2px;
}

.gform_wrapper textarea {
	height: 104px;
	resize: vertical;
}

.gform_wrapper select {
	cursor: pointer;
}

.gform_wrapper input::placeholder,
.gform_wrapper textarea::placeholder {
	color: var(--unicorn-form-muted);
	font-family: "DM Sans", sans-serif;
	font-size: 16px;
	font-weight: 400;
	opacity: 1;
}

.gform_wrapper input:focus,
.gform_wrapper select:focus,
.gform_wrapper textarea:focus {
	border-bottom: 2px solid var(--unicorn-form-blue) !important;
	background: rgba(26, 49, 255, 0.05) !important;
	box-shadow: none !important;
	color: var(--unicorn-form-blue) !important;
	outline: 0 !important;
}

.gform_wrapper .gfield_error input,
.gform_wrapper .gfield_error select,
.gform_wrapper .gfield_error textarea {
	border-bottom-color: var(--unicorn-form-error) !important;
}

.gform_wrapper .gfield_description,
.gform_wrapper .gfield_validation_message,
.gform_wrapper .gform_fileupload_rules,
.gform_wrapper .gform_confirmation_message {
	color: var(--unicorn-form-text);
	font-family: "DM Sans", sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 20px;
}

.gform_wrapper .gfield_description {
	padding-top: 6px;
}

.gform_wrapper .gfield_checkbox,
.gform_wrapper .gfield_radio {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin: 0;
	padding: 0;
}

.gform_wrapper .gfield_checkbox li,
.gform_wrapper .gfield_radio li {
	display: flex;
	align-items: flex-start;
	margin: 0 !important;
	padding: 0;
}

.gform_wrapper .gfield_checkbox input[type="checkbox"],
.gform_wrapper .gfield_radio input[type="radio"] {
	flex: 0 0 16px;
	width: 16px !important;
	height: 16px !important;
	min-height: 16px;
	margin: 2px 8px 0 0 !important;
	padding: 0 !important;
	border: 1px solid var(--unicorn-form-border) !important;
	background: #fff !important;
	box-shadow: none !important;
	cursor: pointer;
	appearance: none;
}

.gform_wrapper .gfield_checkbox input[type="checkbox"] {
	border-radius: 4px !important;
}

.gform_wrapper .gfield_radio input[type="radio"] {
	border-radius: 50% !important;
}

.gform_wrapper .gfield_checkbox input[type="checkbox"]:checked {
	border-color: var(--unicorn-form-blue) !important;
	background: var(--unicorn-form-blue) !important;
	box-shadow: inset 0 0 0 3px #fff !important;
}

.gform_wrapper .gfield_radio input[type="radio"]:checked {
	border: 5px solid var(--unicorn-form-blue) !important;
	background: #fff !important;
}

.gform_wrapper .gfield_checkbox label,
.gform_wrapper .gfield_radio label {
	margin: 0 !important;
	color: var(--unicorn-form-text);
	font-family: "DM Sans", sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 20px;
}

.gform_wrapper .gform_footer {
	margin: 24px 0 0;
	padding: 0;
}

.gform_wrapper .gform_button,
.gform_wrapper input[type="submit"],
.gform_wrapper button[type="submit"] {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 45px;
	margin: 0 !important;
	padding: 10px 22px 10px 20px;
	border: 1px solid #8fb5ff !important;
	border-radius: 8px !important;
	background: var(--unicorn-form-blue) !important;
	box-shadow: none !important;
	color: #e8ff26 !important;
	cursor: pointer;
	font-family: "SharpGrotesk", sans-serif;
	font-size: 18px;
	font-style: normal;
	font-weight: 500;
	line-height: 25px;
	text-align: center;
}

.gform_wrapper .gform_button:hover,
.gform_wrapper input[type="submit"]:hover,
.gform_wrapper button[type="submit"]:hover {
	border-color: #8fb5ff !important;
	background: var(--unicorn-form-midnight) !important;
	color: #e8ff26 !important;
}

.gform_wrapper .gform_button:focus-visible,
.gform_wrapper input[type="submit"]:focus-visible,
.gform_wrapper button[type="submit"]:focus-visible {
	outline: 4px solid rgba(26, 49, 255, 0.28);
	outline-offset: 1px;
}

.gform_wrapper .gform_validation_errors {
	margin: 0 0 24px;
	border: 1px solid var(--unicorn-form-error);
	border-radius: 6px;
	background: #fff;
	box-shadow: none;
	color: var(--unicorn-form-error);
}

.gform_wrapper .gform_validation_errors h2,
.gform_wrapper .validation_message {
	color: var(--unicorn-form-error);
	font-family: "DM Sans", sans-serif;
	font-size: 14px;
	line-height: 20px;
}

/*
 * Dark variant.
 * Add gravity-form--dark to the Gravity Forms CSS Class Name field or to a
 * parent section/block. The two selector forms support both placements.
 */
.gform_wrapper.gravity-form--dark,
.gravity-form--dark .gform_wrapper {
	--unicorn-form-text: #fff;
	--unicorn-form-muted: #fff;
	--unicorn-form-border: #fff;
	--unicorn-form-error: #ffb4b0;
	color: #fff;
}

.gform_wrapper.gravity-form--dark .gfield_required,
.gravity-form--dark .gform_wrapper .gfield_required {
	color: #ffb4b0;
}

.gform_wrapper.gravity-form--dark input:focus,
.gform_wrapper.gravity-form--dark select:focus,
.gform_wrapper.gravity-form--dark textarea:focus,
.gravity-form--dark .gform_wrapper input:focus,
.gravity-form--dark .gform_wrapper select:focus,
.gravity-form--dark .gform_wrapper textarea:focus {
	background: rgba(232, 255, 38, 0.15) !important;
	border-bottom: 2px solid #e8ff26 !important;
	box-shadow: none !important;
	color: #e8ff26 !important;
	outline: 0 !important;
}

.gform_wrapper.gravity-form--dark .gform_button,
.gform_wrapper.gravity-form--dark input[type="submit"],
.gform_wrapper.gravity-form--dark button[type="submit"],
.gravity-form--dark .gform_wrapper .gform_button,
.gravity-form--dark .gform_wrapper input[type="submit"],
.gravity-form--dark .gform_wrapper button[type="submit"] {
	border-color: #e8ff26 !important;
	background: #e8ff26 !important;
	color: #060f4b !important;
}

.gform_wrapper.gravity-form--dark .gform_button:hover,
.gform_wrapper.gravity-form--dark .gform_button:focus-visible,
.gform_wrapper.gravity-form--dark input[type="submit"]:hover,
.gform_wrapper.gravity-form--dark input[type="submit"]:focus-visible,
.gform_wrapper.gravity-form--dark button[type="submit"]:hover,
.gform_wrapper.gravity-form--dark button[type="submit"]:focus-visible,
.gravity-form--dark .gform_wrapper .gform_button:hover,
.gravity-form--dark .gform_wrapper .gform_button:focus-visible,
.gravity-form--dark .gform_wrapper input[type="submit"]:hover,
.gravity-form--dark .gform_wrapper input[type="submit"]:focus-visible,
.gravity-form--dark .gform_wrapper button[type="submit"]:hover,
.gravity-form--dark .gform_wrapper button[type="submit"]:focus-visible {
	border-color: #8fb5ff !important;
	background: #1a31ff !important;
	color: #e8ff26 !important;
}

.gform_wrapper.gravity-form--dark .gform_button:focus-visible,
.gform_wrapper.gravity-form--dark input[type="submit"]:focus-visible,
.gform_wrapper.gravity-form--dark button[type="submit"]:focus-visible,
.gravity-form--dark .gform_wrapper .gform_button:focus-visible,
.gravity-form--dark .gform_wrapper input[type="submit"]:focus-visible,
.gravity-form--dark .gform_wrapper button[type="submit"]:focus-visible {
	outline-color: rgba(232, 255, 38, 0.4);
}

.gform_wrapper.gravity-form--dark .gfield_checkbox input[type="checkbox"],
.gform_wrapper.gravity-form--dark .gfield_radio input[type="radio"],
.gravity-form--dark .gform_wrapper .gfield_checkbox input[type="checkbox"],
.gravity-form--dark .gform_wrapper .gfield_radio input[type="radio"] {
	border-color: #fff !important;
	background: transparent !important;
}

.gform_wrapper.gravity-form--dark .gfield_checkbox input[type="checkbox"]:checked,
.gravity-form--dark .gform_wrapper .gfield_checkbox input[type="checkbox"]:checked {
	border-color: #e8ff26 !important;
	background: #e8ff26 !important;
	box-shadow: inset 0 0 0 3px #060f4b !important;
}

.gform_wrapper.gravity-form--dark .gfield_radio input[type="radio"]:checked,
.gravity-form--dark .gform_wrapper .gfield_radio input[type="radio"]:checked {
	border-color: #e8ff26 !important;
	background: #060f4b !important;
}

.gform_wrapper.gravity-form--dark .gform_validation_errors,
.gravity-form--dark .gform_wrapper .gform_validation_errors {
	background: transparent;
	color: var(--unicorn-form-error);
}

.gform_wrapper.gravity-form--dark .gform_validation_errors h2,
.gform_wrapper.gravity-form--dark .validation_message,
.gravity-form--dark .gform_wrapper .gform_validation_errors h2,
.gravity-form--dark .gform_wrapper .validation_message {
	color: var(--unicorn-form-error);
}

@media (max-width: 640px) {
	.gform_wrapper .gform_fields {
		row-gap: 20px;
	}

	.gform_wrapper .gform_button,
	.gform_wrapper input[type="submit"],
	.gform_wrapper button[type="submit"] {
		font-size: 17px;
	}
}