/* The log-in step of the guest create post widget. Colours are inherited from
   the page, so it matches whatever the site's form and login widget look like. */

.cvcpfg-login[hidden],
.cvcpfg-login [hidden] {
	display: none !important;
}

.cvcpfg-login {
	max-width: 520px;
	margin: 0 auto;
}

.cvcpfg-login-head {
	margin-bottom: 20px;
}

/* Voxel's secondary button (.ts-btn-1.form-btn) owns the look, so the widget's
   "Form: Secondary button" controls style it. Only the width is ours: Voxel's
   buttons fill their row, and this one sits above the title. */
.cvcpfg-login-back.ts-btn {
	display: inline-flex;
	width: auto;
	margin-bottom: 16px;
}

.cvcpfg-login-title {
	margin: 0 0 6px;
}

.cvcpfg-login-text {
	margin: 0;
	opacity: .8;
}

.cvcpfg-login-status {
	margin: 12px 0;
}

/* The email code step. .ts-form is only there so the widget's input styles
   reach the code box; Voxel's search forms make .ts-form a flex row, so the
   step keeps a plain column. */
.cvcpfg-verify.ts-form {
	display: block;
}

.cvcpfg-verify-form {
	display: flex;
	flex-direction: column;
	gap: 16px;
	margin-top: 16px;
}

.cvcpfg-verify-form .cvcpfg-login-status {
	margin: 0;
}

.cvcpfg-verify-resend-line {
	margin: 12px 0 0;
}