[x-component="XForm"] {
	&.submitting {
		filter: blur(1px);
		opacity: 0.6;
		pointer-events: none;
	}

	.error {
		border: 1px solid red !important;
		background-color: #ffe6e6 !important;
	}

	.formMessages ul {
		padding: 0;
	}

	.formMessages.formError li {
		border: 1px solid red;
		background-color: #ffe6e6;
		display: block;
		color: red;
		margin-bottom: 10px;
		padding: 10px;
		border-radius: 10px;
	}

	.formMessages.formSuccess li {
		border: 1px solid green;
		background-color: #e6ffe6;
		display: block;
		color: green;
		margin-bottom: 10px;
		padding: 10px;
		border-radius: 10px;
	}

	.formMessages.formError,
	.formMessages.formSuccess {
		padding: 10px;
		margin-top: 10px;
		display: none;
	}

	.formMessages.show {
		display: block;
	}

	.loader {
		width: 48px;
		height: 48px;
		border: 5px solid #fff;
		border-bottom-color: #ff3d00;
		border-radius: 50%;
		box-sizing: border-box;
		animation: FormX-Animation-Rotation 1s linear infinite;
		position: absolute;
		top: calc(50% - 24px);
		left: calc(50% - 24px);
		display: none;
	}

	.loader.show {
		display: inline-block;
	}
}

@keyframes FormX-Animation-Rotation {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(360deg);
	}
}