/* ==============================
   KNMA Forms Agreement — Consent checkbox
   ============================== */

.knma-fa-agreement {
	display: block !important;
	width: 100% !important;
	clear: both;
	margin: 12px 0 !important;
	padding: 0 !important;
	border: none !important;
	background: none !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	float: none !important;
	box-sizing: border-box;
	position: static !important;
}

.knma-fa-label {
	display: inline-flex !important;
	align-items: flex-start !important;
	gap: 8px;
	cursor: pointer;
	font-size: 13px;
	line-height: 1.4;
	color: inherit;
	font-weight: normal !important;
	margin: 0 !important;
	padding: 0 !important;
	border: none !important;
	background: none !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	text-transform: none;
	letter-spacing: normal;
	max-width: 100%;
	box-sizing: border-box;
	position: static !important;
}

/* Reset pseudo-elements that themes may inject on labels near checkboxes */
.knma-fa-label::before,
.knma-fa-label::after {
	content: none !important;
	display: none !important;
}

.knma-fa-checkbox {
	flex-shrink: 0;
	margin: 2px 0 0 !important;
	width: 16px !important;
	height: 16px !important;
	min-width: 16px !important;
	min-height: 16px !important;
	max-width: 16px !important;
	cursor: pointer;
	appearance: auto !important;
	-webkit-appearance: checkbox !important;
	border: none !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	background: none !important;
	padding: 0 !important;
	position: static !important;
	opacity: 1 !important;
}

.knma-fa-text {
	user-select: none;
	color: inherit;
	font-size: inherit;
	line-height: inherit;
	font-weight: inherit;
	border: none !important;
	background: none !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	padding: 0 !important;
	margin: 0 !important;
	display: inline !important;
	position: static !important;
}

.knma-fa-text a {
	text-decoration: underline;
	color: inherit;
}

.knma-fa-text a:hover {
	opacity: 0.8;
}

/* ---- Inline form modifier (absolute-positioned button) ---- */
/* The block is placed after the form but must not push flex-items
   around, so we position it absolutely below the form. */
.knma-fa-agreement--inline {
	position: absolute !important;
	left: 0;
	top: 100%;
	width: 100% !important;
	/* margin: 4px 0 0 !important; */
	margin: 10px 0 0 20px !important;
	z-index: 1;
}

/* ---- Dark background auto-detection modifier ---- */
.knma-fa-agreement--on-dark .knma-fa-label,
.knma-fa-agreement--on-dark .knma-fa-text,
.knma-fa-agreement--on-dark .knma-fa-text a {
	color: rgba(255, 255, 255, 0.85) !important;
}

.knma-fa-agreement--on-dark .knma-fa-text a:hover {
	color: #fff !important;
	opacity: 1;
}

/* Disabled submit button visual indication */
form button[type="submit"]:disabled,
form input[type="submit"]:disabled,
form button:disabled {
	opacity: 0.5;
	cursor: not-allowed;
}

/* ---- Mobile ---- */
@media (max-width: 600px) {
	.knma-fa-agreement {
		margin: 10px 0 !important;
	}

	/* On mobile the theme resets the button to normal flow
	   (position: unset), so the --inline block must also return
	   to normal flow to stay inside the visible area. */
	.knma-fa-agreement--inline {
		position: static !important;
		margin: 8px 0 0 !important;
	}

	.knma-fa-label {
		font-size: 12px;
		gap: 6px;
	}

	.knma-fa-checkbox {
		width: 18px !important;
		height: 18px !important;
		min-width: 18px !important;
		min-height: 18px !important;
		max-width: 18px !important;
		margin-top: 1px !important;
	}
}