/* EFS Accounts — the join form and the holding page. */

.efs-register { max-width: 520px; }

.efs-reg-form label {
	display: block;
	margin-bottom: 16px;
	font-size: 13.5px;
	font-weight: 600;
	color: var(--ink, #1e2432);
}
/* Text-like inputs only. This used to say `.efs-reg-form input`, which was fine while these
   forms held nothing else — then a checkbox appeared inside one and was stretched to the full
   width of the form, sitting underneath its own label. Name the types rather than assuming. */
.efs-reg-form input[type="text"],
.efs-reg-form input[type="email"],
.efs-reg-form input[type="password"],
.efs-reg-form input[type="number"],
.efs-reg-form input[type="search"],
.efs-reg-form input[type="tel"],
.efs-reg-form input[type="url"],
.efs-reg-form input[type="date"],
.efs-reg-form input[type="file"] {
	display: block;
	width: 100%;
	margin-top: 5px;
	padding: 9px 11px;
	border: 1px solid #d0d5dd;
	border-radius: 7px;
	font-size: 15px;
	font-weight: 400;
	box-sizing: border-box;
}

.efs-reg-form input[type="checkbox"],
.efs-reg-form input[type="radio"] {
	display: inline-block;
	width: auto;
	margin: 0;
	padding: 0;
}
.efs-reg-form input:focus {
	outline: none;
	border-color: var(--green,#1F6FD6);
}
.efs-reg-optional {
	font-weight: 400;
	color: var(--muted, #667085);
	font-size: 12.5px;
}
.efs-reg-hint {
	display: block;
	margin-top: 4px;
	font-size: 12.5px;
	font-weight: 400;
	color: var(--muted, #667085);
	line-height: 1.5;
}
.efs-reg-error {
	padding: 10px 13px;
	margin-bottom: 16px;
	border-radius: 7px;
	background: #fdeceb;
	color: #a3222b;
	font-size: 14px;
}
.efs-reg-done { max-width: 560px; }
.efs-reg-done h2 { margin: 0 0 10px; }
.efs-reg-note { font-size: 13.5px; color: var(--muted, #667085); }

/* ---- Waiting-account banner ---- */

.efs-pending-banner {
	padding: 11px 18px;
	background: #fff8e6;
	border-bottom: 1px solid #f0dca8;
	color: #6b4e08;
	font-size: 13.5px;
	line-height: 1.55;
	text-align: center;
}
.efs-pending-banner strong { color: #533c06; }

.efs-signup { margin: 24px 0; }
.efs-signup h2 { margin: 0 0 6px; font-size: 20px; }
.efs-reg-done-line {
	padding: 10px 13px;
	margin-bottom: 16px;
	border-radius: 7px;
	background: #e7f6ec;
	color: #17683a;
	font-size: 14px;
}

/* ---- A rep's own invite codes ---- */

.efs-myinvites { max-width: 680px; margin: 24px 0; }
.efs-myinvites h2 { margin: 0 0 6px; font-size: 20px; }

.efs-invite-form {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 12px;
	margin: 16px 0 20px;
	padding: 14px;
	background: #f7f8fa;
	border: 1px solid var(--line, #e4e7ec);
	border-radius: 8px;
}
.efs-invite-form label { margin: 0; font-size: 12.5px; font-weight: 600; }
.efs-invite-form input,
.efs-invite-form select {
	display: block;
	margin-top: 4px;
	padding: 7px 9px;
	border: 1px solid #d0d5dd;
	border-radius: 6px;
	font-size: 14px;
	font-weight: 400;
}
.efs-invite-form button { align-self: flex-end; }

.efs-invite-new {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	padding: 14px 16px;
	margin-bottom: 16px;
	background: #e7f6ec;
	border: 1px solid #b7e0c6;
	border-radius: 8px;
}
.efs-invite-new span { font-size: 13px; color: #17683a; font-weight: 600; }
.efs-invite-new code {
	font-size: 26px;
	letter-spacing: 0.1em;
	font-weight: 700;
	color: #0f5132;
	background: none;
}

.efs-invite-table {
	width: 100%;
	border-collapse: collapse;
	border: 1px solid var(--line, #e4e7ec);
	border-radius: 8px;
	overflow: hidden;
	font-size: 13.5px;
}
.efs-invite-table th {
	text-align: left;
	padding: 8px 10px;
	background: #f7f8fa;
	font-size: 11.5px;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--muted, #667085);
}
.efs-invite-table td {
	padding: 8px 10px;
	border-top: 1px solid #f0f2f5;
}
.efs-invite-table code { font-size: 14px; letter-spacing: 0.06em; }

@media (max-width: 600px) {
	.efs-invite-table thead { display: none; }
	.efs-invite-table, .efs-invite-table tbody,
	.efs-invite-table tr, .efs-invite-table td { display: block; width: 100%; }
	.efs-invite-table tr { padding: 6px 0; border-top: 1px solid var(--line, #e4e7ec); }
	.efs-invite-table td::before {
		content: attr(data-label) ": ";
		font-size: 11px;
		text-transform: uppercase;
		color: var(--muted, #667085);
	}
}

/* ---- A rep's own customers ---- */

.efs-mycustomers { max-width: 680px; margin: 30px 0 0; padding-top: 22px; border-top: 1px solid var(--line, #e4e7ec); }
.efs-mycustomers h2 { margin: 0 0 6px; font-size: 20px; }
.efs-cust-waiting {
	display: inline-block;
	margin-left: 6px;
	padding: 1px 7px;
	border-radius: 20px;
	background: #fff8e6;
	color: #6b4e08;
	font-size: 11px;
	font-style: normal;
}

/* ---- /my-account/ ---- */

.efs-account { max-width: 720px; }
.efs-account h1 { margin: 0 0 14px; }
.efs-account-links { display: flex; gap: 10px; flex-wrap: wrap; margin: 0 0 8px; }
.efs-account-out {
	margin: 30px 0 0;
	padding-top: 18px;
	border-top: 1px solid var(--line, #e4e7ec);
	font-size: 13.5px;
}
.efs-account-out a { color: var(--muted, #667085); }
