/*
 This file is used to style the Gravity Forms forms.
 The Section block's style variations are used to style the form.
 Custom styling is added here first for common styles and then section block Pairing 1 has overrides at the bottom.
*/

/* Inputs */
div.gform_wrapper[data-form-theme='gravity-theme'] .gfield input,
div.gform_wrapper[data-form-theme='gravity-theme'] .gfield textarea,
div.gform_wrapper[data-form-theme='gravity-theme'] .gfield select {
	background: rgba(255, 255, 255, 0.1);
	border: 1px solid transparent;
	border-radius: var(--wp--custom--border--rounded-small);
	color: rgba(255, 255, 255, 0.85);

	&::placeholder {
		color: var(--wp--preset--color--theme-02);
	}
}

div.gform_wrapper[data-form-theme='gravity-theme'] .gfield textarea {
	height: 80px !important;
}

/* Time Select height fix */
div.gform_wrapper[data-form-theme='gravity-theme'] .gfield_time_ampm select {
	padding: 0.75rem 0.5rem;
}

/* "Fill" button style */
div.gform_wrapper[data-form-theme='gravity-theme']
	.gform-footer
	input.gform_button[type='submit'],
div.gform_wrapper[data-form-theme='gravity-theme']
	.gfield.gfield--type-fileupload
	.button {
	background: var(--wp--preset--color--theme-04) !important;
	color: var(--wp--preset--color--theme-02) !important;
	border-radius: var(--wp--custom--border--rounded-full);
	border-width: 0;
	color: var(--wp--custom--color--button-text);
	cursor: pointer;
	font-size: var(--wp--preset--font-size--medium);
	font-weight: 600;
	line-height: 1;
	padding-top: var(--wp--custom--spacing--12);
	padding-right: var(--wp--custom--spacing--24);
	padding-bottom: var(--wp--custom--spacing--12);
	padding-left: var(--wp--custom--spacing--24);
}

/* Section Style: Pairing 1 (Default) */
.is-style-default
	div.gform_wrapper[data-form-theme='gravity-theme']
	.gfield
	input,
.is-style-default
	div.gform_wrapper[data-form-theme='gravity-theme']
	.gfield
	textarea,
.is-style-default
	div.gform_wrapper[data-form-theme='gravity-theme']
	.gfield
	select {
	background: transparent !important;
	border-color: var(--wp--custom--color--button-bg) !important;
	color: var(--wp--preset--color--theme-03) !important;
}

/* Button Style: Pairing 1 (Default) */
.is-style-default
	div.gform_wrapper[data-form-theme='gravity-theme']
	.gform-footer
	input.gform_button[type='submit'],
.is-style-default
	div.gform_wrapper[data-form-theme='gravity-theme']
	.gfield.gfield--type-fileupload
	.button {
	background-color: var(--wp--preset--color--theme-04) !important;
	color: var(--wp--preset--color--theme-02) !important;
}

/* Hover: Pairing 1 (Default) */
.is-style-default
	div.gform_wrapper[data-form-theme='gravity-theme']
	.gform-footer
	input.gform_button[type='submit']:hover,
.is-style-default
	div.gform_wrapper[data-form-theme='gravity-theme']
	.gfield.gfield--type-fileupload
	.button:hover {
	background-color: var(--wp--preset--color--theme-05) !important;
	color: var(--wp--preset--color--theme-02) !important;
}

.gform_wrapper.gravity-theme .gform_fields {
	grid-column-gap: var(--wp--preset--spacing--30) !important;
	grid-row-gap: var(--wp--preset--spacing--30) !important;
}

/* Form block style (not Section) */
.wp-block-matchbox-section
	.wp-block-matchbox-section.is-style-section-4
	div.gform_wrapper[data-form-theme='gravity-theme']
	.gfield
	input,
.wp-block-matchbox-section
	.wp-block-matchbox-section.is-style-section-4
	div.gform_wrapper[data-form-theme='gravity-theme']
	.gfield
	textarea,
.wp-block-matchbox-section
	.wp-block-matchbox-section.is-style-section-4
	div.gform_wrapper[data-form-theme='gravity-theme']
	.gfield
	select {
	background: var(--wp--preset--color--theme-01) !important;
	border-color: rgba(14, 32, 48, 0.1) !important;
	color: var(--wp--preset--color--theme-02) !important;
}

.gfield--input-type-fileupload {
	.gfield_description {
		display: none !important;
		font-weight: 700;
		padding-bottom: var(--wp--custom--spacing--4) !important;
	}

	.gform_fileupload_rules {
		margin-top: 0 !important;
	}

	input {
		width: 100% !important;
		padding: var(--wp--custom--spacing--12);
	}
}

/* Hide form labels */
.wp-block-matchbox-section .gform-field-label,
.wp-block-matchbox-section .gform_required_legend {
	display: none !important;
}

.wp-block-matchbox-section.has-border-radius {
	border-radius: var(--wp--custom--border--rounded-large);
}

.wp-block-matchbox-section.has-transparent-background {
	background-color: rgba(229, 226, 226, 0.403) !important;
}