/**
 * Визуал ошибок валидации форм (класс _form-error из app.min.js).
 * Только подсветка, без текстовых подписей.
 */

:root {
	--color-form-error: #e07070;
	--color-form-error--rgb: 224, 112, 112;
}

/* Текстовые поля */
.input._form-error input,
.input input._form-error {
	border-bottom-color: var(--color-form-error);
}

.input._form-error label {
	color: var(--color-form-error);
}

/* Чекбоксы согласия */
.checkbox._form-error {
	animation: form-error-shake 0.35s ease;
}

.checkbox._form-error .checkbox__label:before {
	border-color: var(--color-form-error);
	box-shadow: 0 0 0 3px rgba(var(--color-form-error--rgb), 0.25);
}

.checkbox._form-error .checkbox__text {
	color: var(--color-form-error);
}

.checkbox._form-error .checkbox__text a {
	color: inherit;
}

/* Подписи ошибок не показываем */
.form__error {
	display: none !important;
}

@keyframes form-error-shake {
	0%,
	100% {
		transform: translateX(0);
	}
	20% {
		transform: translateX(-4px);
	}
	40% {
		transform: translateX(4px);
	}
	60% {
		transform: translateX(-3px);
	}
	80% {
		transform: translateX(3px);
	}
}

@media (prefers-reduced-motion: reduce) {
	.checkbox._form-error {
		animation: none;
	}
}