/**
 * Indicateurs de vérification de l'identifiant d'entreprise et du numéro de TVA.
 *
 * La couleur ne porte jamais l'information seule : chaque état a sa forme (points, croix,
 * sablier, coche) et son texte. Un daltonien lit le même message qu'un autre, et un lecteur
 * d'écran l'entend par la zone aria-live.
 */

.olnyris-etat {
	display: flex;
	align-items: flex-start;
	gap: .5em;
	margin-top: .5em;
	font-size: .875em;
	line-height: 1.45;
	min-height: 1.4em;
	transition: color .15s ease;
}

.olnyris-etat--vide { display: none; }

.olnyris-etat__icone {
	flex: 0 0 auto;
	width: 1.15em;
	height: 1.15em;
	margin-top: .1em;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-weight: 700;
	line-height: 1;
}

.olnyris-etat__denomination {
	display: inline-block;
	margin-top: .15em;
	font-weight: 600;
}

/* Saisie en cours — trois points qui respirent, sans dramatiser un champ à moitié rempli.
   C'est l'état de loin le plus fréquent : quelqu'un qui tape ses quatorze chiffres le voit
   quatorze fois. Il doit donc être calme, et informer (« encore 6 chiffres ») plutôt que
   reprocher. Un rouge à la sixième frappe fait abandonner un formulaire. */
.olnyris-etat--saisie,
.olnyris-etat--incomplet { color: #50575e; }
.olnyris-etat--saisie .olnyris-etat__icone::before,
.olnyris-etat--incomplet .olnyris-etat__icone::before {
	content: "•••";
	letter-spacing: .05em;
	animation: olnyris-respire 1.4s ease-in-out infinite;
}

/* Note de contexte : ce qui sera vérifié, dit avant qu'on le demande. Aucun jugement. */
.olnyris-etat--note { color: #50575e; }
.olnyris-etat--note .olnyris-etat__icone::before { content: "ℹ"; font-weight: 400; }

/* Régime annoncé sous le choix du pays. */
.olnyris-regime {
	margin: .4em 0 0;
	font-size: .8125em;
	line-height: 1.45;
	color: #50575e;
	opacity: .9;
}

/* Vérification en cours. */
.olnyris-etat--verification { color: #50575e; }
.olnyris-etat--verification .olnyris-etat__icone::before {
	content: "";
	width: .9em;
	height: .9em;
	border: 2px solid currentColor;
	border-right-color: transparent;
	border-radius: 50%;
	animation: olnyris-tourne .7s linear infinite;
}

/* Incorrect — bloque l'envoi. */
.olnyris-etat--invalide { color: #b32d2e; }
.olnyris-etat--invalide .olnyris-etat__icone::before { content: "✕"; }

/* Vérification différée — n'empêche pas l'envoi. */
.olnyris-etat--differe { color: #996800; }
.olnyris-etat--differe .olnyris-etat__icone::before { content: "◐"; }

/* Vérifié. */
.olnyris-etat--verifie { color: #007017; }
.olnyris-etat--verifie .olnyris-etat__icone::before { content: "✓"; }

/* Le champ lui-même porte l'état, pour qui ne lit que le champ. */
.olnyris-champ--invalide {
	border-color: #b32d2e !important;
	box-shadow: 0 0 0 1px #b32d2e33;
}
.olnyris-champ--verifie {
	border-color: #007017 !important;
	box-shadow: 0 0 0 1px #00701733;
}

/* Rappel visuel au clic sur un envoi bloqué. */
.olnyris-etat--secoue { animation: olnyris-secoue .5s ease; }

@keyframes olnyris-respire {
	0%, 100% { opacity: .35; }
	50%      { opacity: 1; }
}

@keyframes olnyris-tourne {
	to { transform: rotate(360deg); }
}

@keyframes olnyris-secoue {
	10%, 90% { transform: translateX(-2px); }
	20%, 80% { transform: translateX(3px); }
	30%, 50%, 70% { transform: translateX(-4px); }
	40%, 60% { transform: translateX(4px); }
}

/* Le mouvement est un confort, pas une information : on le retire à qui n'en veut pas. */
@media (prefers-reduced-motion: reduce) {
	.olnyris-etat--saisie .olnyris-etat__icone::before,
	.olnyris-etat--incomplet .olnyris-etat__icone::before,
	.olnyris-etat--verification .olnyris-etat__icone::before,
	.olnyris-etat--secoue {
		animation: none;
	}
}
