/* SG Security - captcha field (RTL-safe, keyboard accessible, dark-mode aware) */

.sg-sec-captcha {
	margin: 1em 0;
	direction: inherit;
}

.sg-sec-captcha label {
	display: block;
	margin-bottom: .35em;
	font-weight: 600;
}

.sg-sec-captcha-row {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: .5em;
}

.sg-sec-captcha-row input[type="text"] {
	flex: 0 1 14em;
	margin-bottom: 0;
	min-width: 0;
}

.sg-sec-captcha-box {
	border: 1px solid rgba(127, 127, 127, .4);
	display: inline-flex;
	align-items: center;
	gap: .25em;
	padding: 4px;
	vertical-align: middle;
}

.sg-sec-captcha-image {
	cursor: pointer;
	display: block;
}

.sg-sec-captcha-refresh {
	background: none;
	border: none;
	color: inherit;
	cursor: pointer;
	font-size: 20px;
	line-height: 1;
	padding: 4px 6px;
}

.sg-sec-captcha-image:focus-visible,
.sg-sec-captcha-refresh:focus-visible {
	outline: 2px solid #2271b1;
	outline-offset: 2px;
}

.sg-sec-captcha-noscript {
	font-size: .85em;
	opacity: .8;
}

.sg-sec-captcha-error {
	color: #b32d2e;
	font-size: .9em;
	margin: .35em 0 0;
}

/* Honeypot: visually hidden but at its natural position — off-screen
   offsets (left: -9999px) cause horizontal scroll on RTL pages. */
.sg-sec-hp {
	border: 0 !important;
	clip-path: inset(50%) !important;
	height: 1px !important;
	opacity: 0;
	overflow: hidden;
	padding: 0 !important;
	position: absolute !important;
	white-space: nowrap;
	width: 1px !important;
}

@media (prefers-color-scheme: dark) {
	.sg-sec-captcha-box {
		border-color: rgba(255, 255, 255, .3);
	}

	.sg-sec-captcha-image {
		background: #fff; /* keep the rendered image readable */
	}
}

/* Login page: match WordPress form styling. */
body.login .sg-sec-captcha {
	margin: 1rem 0;
}
