/* SMM Member Sign-up */

.smm-reg {
	--smm-reg-green: #4b7f3f;
	--smm-reg-pale: #eaf7e4;
	--smm-reg-line: rgba(0, 0, 0, .15);
	--smm-reg-radius: 6px;

	max-width: 520px;
	margin: 0 0 2em;
}

.smm-reg *,
.smm-reg *::before,
.smm-reg *::after {
	box-sizing: border-box;
}

.smm-reg-title {
	margin: 0 0 .6em;
}

.smm-reg-row {
	display: flex;
	flex-wrap: wrap;
	gap: 1em;
}

.smm-reg-row .smm-reg-field {
	flex: 1 1 180px;
}

.smm-reg-field {
	margin: 0 0 1.1em;
}

.smm-reg-field label {
	display: block;
	font-weight: 600;
	margin-bottom: .3em;
}

.smm-reg-field input {
	width: 100%;
	padding: .6em .7em;
	border: 1px solid #bbb;
	border-radius: var(--smm-reg-radius);
	font: inherit;
	background: #fff;
}

.smm-reg-field input:focus {
	outline: 2px solid var(--smm-reg-green);
	outline-offset: 1px;
	border-color: var(--smm-reg-green);
}

.smm-reg-req {
	color: #b3261e;
}

.smm-reg-hint {
	display: block;
	margin-top: .3em;
	font-size: .85em;
	opacity: .75;
}

.smm-reg-note {
	padding: .7em .9em;
	background: var(--smm-reg-pale);
	border-left: 4px solid var(--smm-reg-green);
	border-radius: 0 var(--smm-reg-radius) var(--smm-reg-radius) 0;
	font-size: .9em;
	margin: 0 0 1.2em;
}

.smm-reg-actions {
	margin: 0 0 1em;
}

.smm-reg .smm-reg-submit {
	font: inherit;
	font-weight: 600;
	cursor: pointer;
	padding: .65em 1.6em;
	border-radius: var(--smm-reg-radius);
	border: 1px solid #3d6a33;
	background: var(--smm-reg-green);
	color: #fff;
}

.smm-reg .smm-reg-submit:hover {
	background: #3d6a33;
}

.smm-reg-login-link {
	margin: 0;
	font-size: .9em;
}

.smm-reg-message {
	padding: .9em 1.1em;
	margin: 0 0 1.2em;
	border-radius: var(--smm-reg-radius);
	background: #e7f3e3;
	border-left: 4px solid var(--smm-reg-green);
}

.smm-reg-message.is-error {
	background: #fbeceb;
	border-left-color: #c9584c;
}

.smm-reg-message p {
	margin: 0 0 .4em;
}

.smm-reg-message ul {
	margin: 0;
	padding-left: 1.3em;
}

.smm-reg-message ul li {
	margin: .2em 0;
}

.smm-reg--in {
	padding: 1em 1.2em;
	background: var(--smm-reg-pale);
	border: 1px solid var(--smm-reg-line);
	border-radius: var(--smm-reg-radius);
}

.smm-reg--in p:last-child {
	margin-bottom: 0;
}

/* The honeypot must be reachable by bots reading the HTML but invisible and
   unreachable for anybody using the page. */
.smm-reg-pot {
	position: absolute !important;
	left: -9999px !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
}