// ============================================================================
// :: HUBSPOT FORM
// ============================================================================
.sc-hubspot {

	.hs-richtext {
		margin-bottom: 2rem;
	}

	.hs-form {

		h2 {
			margin-bottom: 2rem;
		}

		ul {
			padding-left: 0;

			list-style-type: none;
		}

		.inputs-list {
			display: flex;

			li {

				&::before {
					display: none;
				}
			}
		}

		.multi-container {
			display: block;
		}

		.hs-form-field {
			margin-bottom: 2rem !important; /* stylelint-disable-line */
		}

		.hs-fieldtype-textarea {

			.hs-input {
				height: auto;
				min-height: 20rem;

				border-radius: 1.2rem !important; /* stylelint-disable-line */
			}
		}

		label {
			margin-left: 0.5rem;

			font-family: $font-family-roboto;
			font-weight: $font-weight-bold;
			font-size: $font-size;
			line-height: $line-height-2x-large;

			color: $text-color;
		}

		.hs-form-booleancheckbox-display,
		.hs-form-checkbox-display {
			display: flex;
			margin-top: 1rem;

			.hs-input {
				display: none;

				&:checked {

					& + span {

						&::after {
							opacity: 1;
						}
					}
				}
			}

			> span {
				@extend %__icon-checkmark;

				position: relative;

				margin-left: 0;
				padding-left: 3rem;

				&::before {
					position: absolute;
					top: 0;
					left: 0;
					z-index: 10;

					display: block;
					min-width: 2rem;
					height: 2rem;

					border: $border-default-m;
					border-radius: $border-radius-s;
					background-color: transparent;
					color: $text-color-white;
				}

				&::after {
					content: "";

					position: absolute;
					top: 0;
					left: 0;
					z-index: 0;

					display: block;
					min-width: 2rem;
					height: 2rem;

					opacity: 0;

					background: $gradient-primary;
					border-radius: $border-radius-s;

					transform-origin: center;

					transition: opacity 0.3s ease-in-out;
				}
			}
		}

		.hs-form-radio-display {

			span {
				margin-left: 1rem;
			}
		}

		.hs-input:not([type="radio"]) {
			@include input_field();
			width: 100% !important; /* stylelint-disable-line */
			margin-top: 0.5rem;
			padding: 1.2rem 2rem !important; /* stylelint-disable-line */

			border: 1px solid transparent !important; /* stylelint-disable-line */

			background-color: $background-color-grey-extra-light !important; /* stylelint-disable-line */
		}

		fieldset {
			max-width: 100% !important; /* stylelint-disable-line */
			padding-bottom: 10px !important; /* stylelint-disable-line */
		}

		.o-form__section__title {
			display: block;
			margin-bottom: 1.5rem;
		}

		.hs-error-msgs {

			label {
				font-weight: $font-weight-normal;

				color: $ui-color-error;
			}

			li {

				&::before {
					content: "";
				}
			}
		}
	}
}

// ============================================================================
// :: MODIFIERS
// ============================================================================
.sc-hubspot-white {

	.hs-form {

		.hs-input:not([type="radio"]) {
			background-color: $background-color-white !important; /* stylelint-disable-line */
		}
	}
}