/* Broker Portal — auth pages (login / register / forgot / reset) --------
 * Same canvas approach as the single community page: no theme header or
 * footer, just a clean split-screen layout. Typography uses
 * font-family: inherit + em sizing throughout, same as the rest of the
 * add-on, so it automatically matches the theme/Elementor base font.
 */

.bp-auth-wrap, .bp-auth-wrap * { box-sizing: border-box; }

.bp-auth-wrap {
	min-height: 100vh;
	display: flex;
}

/* ---------- Left: brand / visual panel --------------------------------- */
.bp-auth-visual {
	flex: 1 1 46%;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 4em 3.5em;
	position: relative;
	background:
		linear-gradient(160deg, rgba(35,35,35,.82), rgba(184,134,44,.55)),
		linear-gradient(160deg, #232323, #b8862c);
	background-blend-mode: multiply, normal;
}
.bp-auth-visual-inner { max-width: 30em; }
.bp-auth-brand {
	display: inline-block;
	font-family: inherit;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	font-size: .9375em;
	color: #fff;
	text-decoration: none;
	margin-bottom: 2.5em;
	opacity: .92;
}
.bp-auth-visual-inner h2 {
	font-family: inherit;
	font-weight: 600;
	line-height: 1.3;
	font-size: 1.875em;
	color: #fff;
	margin: 0 0 .625em;
}
.bp-auth-visual-inner p {
	font-family: inherit;
	font-size: 1.0625em;
	line-height: 1.7;
	color: rgba(255,255,255,.88);
	margin: 0;
}

/* ---------- Right: form panel ------------------------------------------ */
.bp-auth-panel {
	flex: 1 1 54%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #faf8f4;
	padding: 3em 2em;
}
.bp-auth-card { width: 100%; max-width: 26em; }
.bp-auth-card .bp-eyebrow {
	display: block;
	font-family: inherit;
	font-size: .75em;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #b8862c;
	margin-bottom: .6em;
}
.bp-auth-card h1 {
	font-family: inherit;
	font-weight: 600;
	font-size: 1.75em;
	color: #232323;
	margin: 0 0 .3em;
}
.bp-auth-sub {
	font-family: inherit;
	font-size: .9375em;
	color: #8a8a8a;
	margin: 0 0 1.75em;
}

.bp-alert {
	font-family: inherit;
	font-size: .875em;
	line-height: 1.5;
	border-radius: 4px;
	padding: .875em 1em;
	margin: 0 0 1.5em;
}
.bp-alert p { margin: 0 0 .35em; }
.bp-alert p:last-child { margin-bottom: 0; }
.bp-alert-error   { background: #fbeceb; color: #9a3530; border: 1px solid #f2cfcc; }
.bp-alert-success { background: #eaf3ea; color: #2f6a37; border: 1px solid #cfe6cf; }
.bp-alert-info    { background: #fdf3e3; color: #8a6415; border: 1px solid #f3e1b8; }

.bp-auth-form { display: flex; flex-direction: column; gap: 1.125em; }
.bp-field { display: flex; flex-direction: column; gap: .4em; }
.bp-field span {
	font-family: inherit;
	font-size: .8125em;
	font-weight: 600;
	letter-spacing: .02em;
	color: #4a4a4a;
}
.bp-field span em { font-weight: 400; font-style: normal; color: #a8a8a8; }
.bp-field input[type="text"],
.bp-field input[type="email"],
.bp-field input[type="password"] {
	font-family: inherit;
	font-size: 1em;
	color: #232323;
	background: #fff;
	border: 1px solid #e2dccd;
	border-radius: 4px;
	padding: .75em .875em;
	width: 100%;
	transition: border-color .15s ease, box-shadow .15s ease;
}
.bp-field input:focus {
	outline: none;
	border-color: #b8862c;
	box-shadow: 0 0 0 3px rgba(184,134,44,.15);
}
.bp-field-hint { font-family: inherit; font-size: .8125em; color: #a8a8a8; margin: -.75em 0 0; }

.bp-password-wrap { position: relative; display: flex; }
.bp-password-wrap input { padding-right: 2.6em; }
.bp-toggle-pass {
	position: absolute;
	top: 50%; right: .5em;
	transform: translateY(-50%);
	background: none;
	border: 0;
	cursor: pointer;
	color: #a8a8a8;
	padding: .3em;
	line-height: 0;
}
.bp-toggle-pass:hover { color: #b8862c; }
.bp-toggle-pass .dashicons { font-size: 18px; width: 18px; height: 18px; }

.bp-field-row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: .75em;
	margin: -.375em 0;
}
.bp-checkbox {
	display: inline-flex;
	align-items: center;
	gap: .5em;
	font-family: inherit;
	font-size: .875em;
	color: #6b6b6b;
	cursor: pointer;
}
.bp-checkbox input { accent-color: #b8862c; }

.bp-link { font-family: inherit; font-size: .875em; color: #2f6ea6; text-decoration: none; }
.bp-link:hover { text-decoration: underline; }

.bp-btn-primary {
	font-family: inherit;
	font-weight: 600;
	font-size: .9375em;
	letter-spacing: .02em;
	color: #fff;
	background: #b8862c;
	border: 0;
	border-radius: 4px;
	padding: .875em 1.25em;
	cursor: pointer;
	transition: background .15s ease, transform .1s ease;
	margin-top: .375em;
}
.bp-btn-primary:hover { background: #9c711f; }
.bp-btn-primary:active { transform: translateY(1px); }

.bp-auth-switch {
	font-family: inherit;
	font-size: .875em;
	color: #8a8a8a;
	text-align: center;
	margin: 1.75em 0 0;
}
.bp-auth-switch a { color: #b8862c; font-weight: 600; text-decoration: none; }
.bp-auth-switch a:hover { text-decoration: underline; }

@media (max-width: 860px) {
	.bp-auth-wrap { flex-direction: column; }
	.bp-auth-visual { flex: 0 0 auto; padding: 3em 1.75em; }
	.bp-auth-visual-inner h2 { font-size: 1.5em; }
	.bp-auth-panel { padding: 2.5em 1.75em 3.5em; }
}
