/* Authentication panels use the same tokens as the native login screens. */
.site-2fa-panel {
	box-sizing: border-box;
	width: 100%;
	max-width: 460px;
	margin-block: var(--space-s);
	padding: var(--space-m);
	border: 1px solid var(--neutral-light);
	border-radius: var(--radius-m);
	background: var(--white);
	color: var(--neutral-dark);
	font-family: var(--font-body);
	font-size: var(--text-s);
	line-height: 1.5;
	box-shadow: var(--box-shadow-s);
}
.site-2fa-panel *, .site-2fa-panel *::before, .site-2fa-panel *::after { box-sizing: border-box; }
.site-2fa-panel h2 {
	margin: 0 0 var(--space-xs);
	color: var(--primary-dark);
	font-family: var(--font-heading);
	font-size: var(--text-xl);
	font-weight: 600;
	line-height: 1.1;
}
.site-2fa-panel .site-2fa-description { margin: 0 0 var(--space-s); }
.site-2fa-panel label { display: block; margin: var(--space-s) 0; }
.site-2fa-panel label span { display: block; margin-bottom: var(--space-xxs); font-size: var(--text-s); font-weight: 400; }
.site-2fa-panel input.site-2fa-code,
.ohso-login #login .site-2fa-panel input.site-2fa-code {
	display: block;
	width: 100%;
	min-height: 52px;
	margin: 0;
	padding: 12px 16px;
	border: 1px solid var(--neutral-light);
	border-radius: var(--radius-s);
	background: var(--white);
	color: var(--black);
	font-family: var(--font-body);
	font-size: var(--text-s);
	line-height: 1.5;
	box-shadow: none;
	transition: border-color var(--transition), box-shadow var(--transition);
}
.site-2fa-panel input.site-2fa-code:focus,
.ohso-login #login .site-2fa-panel input.site-2fa-code:focus { border-color: var(--primary); box-shadow: 0 0 0 2px var(--primary-ultra-light); outline: 2px solid transparent; }
.site-2fa-panel .button-primary {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	float: none;
	width: 100%;
	min-height: 52px;
	padding: var(--space-xs) var(--space-s);
	border: 0;
	border-radius: var(--radius-m);
	background: var(--accent-light);
	color: var(--accent-dark);
	font-family: var(--font-decorative);
	font-size: var(--text-s);
	font-weight: 700;
	line-height: 1.375;
	text-decoration: none;
	text-shadow: none;
	box-shadow: none;
	cursor: pointer;
	transition: background-color var(--transition), color var(--transition);
}
.site-2fa-panel .button-primary:hover { background: var(--accent-semi-light); color: var(--accent-dark); text-decoration: none; }
.site-2fa-panel .button-primary:focus-visible { outline: 2px solid var(--accent-dark); outline-offset: 4px; }
.site-2fa-panel .button-primary:disabled,
.ohso-login #login .site-2fa-panel .button-primary:disabled { background: var(--accent-light); color: var(--accent-dark); opacity: .6; cursor: default; }
.site-2fa-panel input.site-2fa-code:disabled { background: var(--primary-ultra-light); opacity: .6; }
.site-2fa-panel .site-2fa-error { min-height: 0; margin: var(--space-s) 0 0; padding: var(--space-xs); border-inline-start: 3px solid var(--accent-dark); border-radius: var(--radius-s); background: var(--accent-ultra-light); color: var(--neutral-dark); overflow-wrap: anywhere; }
.site-2fa-panel .site-2fa-error:empty { display: none; }
.site-2fa-panel .site-2fa-enrollment { margin: var(--space-s) 0; padding: var(--space-xs); border: 1px solid var(--neutral-light); border-radius: var(--radius-s); background: var(--primary-ultra-light); }
.site-2fa-panel .site-2fa-enrollment p { margin: 0 0 var(--space-xs); }
.site-2fa-panel .site-2fa-enrollment img { display: block; width: 220px; max-width: 100%; height: auto; margin: var(--space-xs) auto; border-radius: 4px; background: var(--white); }
.site-2fa-panel .site-2fa-enrollment code { display: block; max-width: 100%; margin-block: var(--space-xs); padding: var(--space-xs); border: 1px solid var(--neutral-light); border-radius: var(--radius-s); background: var(--white); color: var(--primary-dark); font-size: var(--text-xs); line-height: 1.8; overflow-wrap: anywhere; user-select: all; }
.site-2fa-panel .site-2fa-enrollment strong { display: block; font-weight: 600; }
.site-2fa-panel .site-2fa-enrollment br { display: none; }
.site-2fa-panel.site-2fa-modal { width: min(460px, calc(100vw - var(--section-gutter) * 2)); max-height: calc(100dvh - var(--space-s) * 2); margin: 0; overflow-y: auto; box-shadow: var(--box-shadow-m); }
.ohso-login #login .site-2fa-panel { max-width: none; margin: 0; padding: 0; border: 0; border-radius: 0; box-shadow: none; }
.ohso-login #login .site-2fa-panel label { display: block; width: 100%; margin: var(--space-s) 0; }
.ohso-login .ohso-two-factor-restart { margin: var(--space-s) 0 0; text-align: center; font-size: var(--text-xs); }
@media(max-width:480px) { .site-2fa-panel { padding: var(--space-s); } }
@media(prefers-reduced-motion:reduce) { .site-2fa-panel input.site-2fa-code, .site-2fa-panel .button-primary { transition: none; } }