/**
 * FormFinn front-end styles.
 *
 * Deliberately minimal and mostly inherit-from-theme: WPForms shipped with
 * `disable-css: 1` on these sites, i.e. the theme already styles the form. This
 * only adds what the markup genuinely needs — layout, the honeypot's
 * invisibility, and error/confirmation states.
 */

.ff-form .ff-field {
	margin-bottom: 1.25em;
}

.ff-form label {
	display: block;
	margin-bottom: 0.35em;
	font-weight: 600;
}

.ff-form input[type="text"],
.ff-form input[type="email"],
.ff-form input[type="tel"],
.ff-form textarea,
.ff-form select {
	width: 100%;
	max-width: 100%;
	box-sizing: border-box;
}

.ff-form .ff-req {
	color: #b32d2e;
}

/* Checkbox rows read as one line, label beside the box. */
.ff-form .ff-check {
	display: flex;
	align-items: flex-start;
	gap: 0.6em;
	font-weight: 400;
}

.ff-form .ff-check input[type="checkbox"] {
	margin-top: 0.25em;
	flex: 0 0 auto;
}

/*
 * The honeypot must be invisible to humans but NOT display:none — some bots
 * skip hidden fields on purpose. Push it out of the viewport instead, and take
 * it out of the tab order and the accessibility tree.
 */
.ff-form .ff-hp {
	position: absolute !important;
	left: -9999px !important;
	top: auto;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.ff-form .ff-error {
	display: block;
	margin-top: 0.3em;
	color: #b32d2e;
	font-size: 0.9em;
}

.ff-form .ff-message:not(:empty) {
	margin-top: 1em;
	padding: 0.75em 1em;
	border-left: 4px solid #b32d2e;
	background: rgba( 179, 45, 46, 0.06 );
}

.ff-confirmation {
	padding: 1em 1.25em;
	border-left: 4px solid #1a7f37;
	background: rgba( 26, 127, 55, 0.07 );
}

.ff-form .ff-submit[disabled] {
	opacity: 0.6;
	cursor: progress;
}

.ff-admin-warning {
	padding: 0.75em 1em;
	border-left: 4px solid #dba617;
	background: rgba( 219, 166, 23, 0.1 );
}