/**
 * EmailOctopus Network form styles.
 *
 * Deliberately minimal: only layout, state and the visually hidden helpers the
 * markup depends on. Every rule is namespaced with .eonw- and every value is
 * exposed as a custom property, so a theme can override the look by redefining
 * the properties instead of fighting specificity.
 */

.eonw-form-wrap {
	--eonw-gap: 0.75em;
	--eonw-radius: 3px;
	--eonw-border: 1px solid currentColor;
	--eonw-success: #1a7f5a;
	--eonw-error: #b32d2e;

	max-width: 32em;
}

.eonw-form {
	display: flex;
	flex-direction: column;
	gap: var(--eonw-gap);
}

.eonw-field {
	display: block;
}

.eonw-label {
	display: block;
	margin-bottom: 0.25em;
}

.eonw-required {
	color: var(--eonw-error);
}

.eonw-input {
    background-color: rgba(250,250,250, 0.8);
	box-sizing: border-box;
	width: 100%;
	padding: 0.5em 0.75em;
	border: var(--eonw-border);
	border-radius: var(--eonw-radius);
	font: inherit;
	color: inherit;
}

.eonw-button {
	padding: 0.6em 1.4em;
	border: var(--eonw-border);
	border-radius: var(--eonw-radius);
	font: inherit;
	cursor: pointer;
	color: #a93f0a;
    font-size: 16px;
    background: #fcf6c6;
    background: -moz-linear-gradient(top, #fcf6c6 0%, #f5ca1f 80%);
    background: -webkit-linear-gradient(top, #fcf6c6 0%, #f5ca1f 80%);
    background: linear-gradient(to bottom, #fcf6c6 0%, #f5ca1f 80%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fcf6c6', endColorstr='#f5ca1f',GradientType=0 );
    border: 1px solid #a93c2e;
	width: 100%;
}

.eonw-button[disabled] {
	cursor: progress;
	opacity: 0.6;
}

.eonw-form.is-loading .eonw-input {
	opacity: 0.7;
}

/* Challenge widget or question, sitting between the fields and the button. */
.eonw-challenge {
	max-width: 100%;
	overflow-x: auto;
}

.eonw-field-challenge .eonw-input {
	max-width: 8em;
}

.eonw-message {
	margin: 0;
}

.eonw-message--success {
	color: var(--eonw-success);
}

.eonw-message--error {
	color: var(--eonw-error);
}

/* Honeypot: kept in the accessibility tree only as a hidden decoy. */
.eonw-hp {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

@media (prefers-reduced-motion: reduce) {
	.eonw-form,
	.eonw-button {
		transition: none;
	}
}