.abalone-zn-form {
	--abalone-zn-bg: #8DBEE0;
	--abalone-zn-border: #F3E77A;
	--abalone-zn-text: #FFFFFF;
	--abalone-zn-btn-bg: #F3E77A;
	--abalone-zn-btn-text: #1B3A57;

	max-width: 640px;
	margin: 0 auto;
	font-family: inherit;
}

.abalone-zn-field {
	display: flex;
	align-items: center;
	justify-content: space-between;
	background-color: var(--abalone-zn-bg);
	border: 2px solid var(--abalone-zn-border);
	border-radius: 999px;
	padding: 6px 6px 6px 24px;
	gap: 12px;
}

.abalone-zn-input {
	flex: 1 1 auto;
	background: transparent;
	border: 0;
	outline: none;
	color: var(--abalone-zn-text);
	font-size: 16px;
	font-weight: 600;
	min-width: 0;
}

.abalone-zn-input::placeholder {
	color: var(--abalone-zn-text);
	opacity: 0.9;
}

.abalone-zn-input:-webkit-autofill {
	-webkit-text-fill-color: var(--abalone-zn-text);
	transition: background-color 5000s ease-in-out 0s;
}

/* Piège à bots : invisible pour un visiteur humain, toujours présent dans le DOM. */
.abalone-zn-hp {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	opacity: 0;
	pointer-events: none;
	left: -9999px;
}

.abalone-zn-submit {
	flex: 0 0 auto;
	background-color: var(--abalone-zn-btn-bg);
	color: var(--abalone-zn-btn-text);
	border: 0;
	border-radius: 999px;
	padding: 14px 28px;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	white-space: nowrap;
	transition: filter 0.15s ease, transform 0.1s ease;
}

.abalone-zn-submit:hover {
	filter: brightness(0.96);
}

.abalone-zn-submit:active {
	transform: scale(0.98);
}

.abalone-zn-submit:disabled {
	cursor: default;
	opacity: 0.7;
}

.abalone-zn-message {
	margin: 10px 4px 0;
	font-size: 14px;
	min-height: 1.2em;
}

.abalone-zn-form.is-success .abalone-zn-message {
	color: #1a7a3c;
}

.abalone-zn-form.is-error .abalone-zn-message {
	color: #b3261e;
}

@media (max-width: 480px) {
	.abalone-zn-field {
		flex-wrap: wrap;
		border-radius: 24px;
		padding: 16px;
	}

	.abalone-zn-input {
		flex-basis: 100%;
		padding: 8px 4px;
	}

	.abalone-zn-submit {
		flex-basis: 100%;
		text-align: center;
	}
}