/**
 * Styles CSS pour le système CAPTCHA - MédiaCSE
 * Extrait de captcha.js pour résoudre les problèmes CSP
 */

@keyframes captcha-shake {
	0%, 100% { transform: translateX(0); }
	25% { transform: translateX(-5px); }
	75% { transform: translateX(5px); }
}

.captcha-field-error {
	animation: captcha-shake 0.5s ease-in-out;
}

/* Amélioration du hover sur les images CAPTCHA */
#captcha-image, [id$="captcha-image"] {
	cursor: pointer;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* Style pour les boutons refresh */
[class*="captcha-refresh"] {
	transition: transform 0.3s ease, background-color 0.3s ease;
	cursor: pointer;
}

[class*="captcha-refresh"]:hover {
	background-color: #0d47a1 !important;
}

/* Style pour les champs en erreur */
input.error {
	border-color: #f44336 !important;
	box-shadow: 0 0 0 3px rgba(244, 67, 54, 0.1) !important;
}

/* Style pour les messages d'erreur des champs */
.captcha-field-error {
	color: #f44336;
	font-size: 0.9em;
	margin-top: 5px;
	display: flex;
	align-items: center;
	gap: 5px;
}