@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&display=swap");

:root {
	--gf-green: #083d2e;
	--gf-green-2: #0d5a44;
	--gf-lemon: #fff200;
	--gf-black: #0a0a0a;
	--gf-white: #f7fbf5;
	--gf-muted: #5b6b63;
	--gf-line: #d7e2db;
	--gf-radius: 12px;
}

/* Hide default website chrome on login */
body[data-path="login"] .navbar,
body[data-path="login"] .page-header,
body[data-path="login"] .web-footer,
body[data-path="login"] footer,
body[data-path="login"] .breadcrumb,
.navbar,
.page-header,
.web-footer,
footer.web-footer,
.breadcrumb {
	display: none !important;
}

body[data-path="login"],
body[data-path="login"] .main-section,
body[data-path="login"] .page_content,
body[data-path="login"] .page-content-wrapper,
body[data-path="login"] .container,
body[data-path="login"] .container.page-body {
	max-width: none !important;
	width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
}

body[data-path="login"] {
	background: var(--gf-white);
	font-family: "Poppins", sans-serif;
	color: var(--gf-black);
}

body[data-path="login"] .page-content-wrapper {
	min-height: 100vh !important;
}

.naeva-login {
	display: grid;
	grid-template-columns: minmax(0, 1.1fr) minmax(340px, 0.9fr);
	min-height: 100vh;
	width: 100%;
}

/* Brand panel: deep green with lemon glow */
.naeva-login-brand {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: clamp(2rem, 6vw, 5rem);
	background:
		radial-gradient(ellipse 60% 50% at 15% 8%, rgba(255, 242, 0, 0.16), transparent 60%),
		radial-gradient(ellipse 70% 60% at 100% 100%, rgba(13, 90, 68, 0.9), transparent 62%),
		linear-gradient(160deg, #0a4a37 0%, var(--gf-green) 55%, #052a20 100%);
	color: #fff;
	overflow: hidden;
	animation: gf-fade 0.7s ease both;
}

.naeva-login-brand::before {
	content: "";
	position: absolute;
	inset: -20%;
	background: repeating-linear-gradient(
		-22deg,
		transparent 0,
		transparent 26px,
		rgba(255, 255, 255, 0.03) 26px,
		rgba(255, 255, 255, 0.03) 27px
	);
	pointer-events: none;
	animation: gf-drift 20s linear infinite;
}

.naeva-login-brand-inner {
	position: relative;
	z-index: 1;
	max-width: 34rem;
	width: 100%;
	animation: gf-rise 0.65s ease 0.12s both;
}

.gf-lockup {
	display: flex;
	align-items: center;
	gap: clamp(0.9rem, 2vw, 1.4rem);
}

.gf-lockup-mark {
	width: clamp(64px, 9vw, 96px);
	height: auto;
	flex: none;
	filter: drop-shadow(0 14px 28px rgba(0, 0, 0, 0.35));
}

.gf-lockup-name {
	margin: 0;
	font-weight: 600;
	font-size: clamp(2.2rem, 5vw, 3.4rem);
	line-height: 1;
	letter-spacing: -0.02em;
	color: #fff;
}

.gf-lockup-name sup {
	font-size: 0.28em;
	font-weight: 400;
	vertical-align: super;
	margin-left: 0.15em;
	opacity: 0.8;
}

.gf-lockup-tag {
	margin: 0.55rem 0 0;
	font-size: clamp(0.62rem, 1.2vw, 0.78rem);
	font-weight: 500;
	letter-spacing: 0.32em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.88);
}

.gf-bar {
	display: block;
	width: 64px;
	height: 4px;
	border-radius: 2px;
	background: var(--gf-lemon);
	margin: clamp(1.6rem, 4vw, 2.4rem) 0 1.2rem;
}

.naeva-login-tagline {
	margin: 0;
	font-size: clamp(1.05rem, 2vw, 1.35rem);
	line-height: 1.45;
	font-weight: 300;
	color: #fff;
	max-width: 22rem;
}

.gf-steps {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem 1.4rem;
	margin: clamp(1.4rem, 3vw, 2rem) 0 0;
	padding: 0;
	font-size: 0.72rem;
	font-weight: 500;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, 0.7);
}

.gf-steps li + li::before {
	content: "•";
	color: var(--gf-lemon);
	margin-right: 1.4rem;
}

/* Form panel */
.naeva-login-panel {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: clamp(2rem, 5vw, 3.5rem) clamp(1.5rem, 5vw, 4.5rem);
	background: var(--gf-white);
	animation: gf-panel-in 0.55s ease both;
}

.naeva-login-panel section {
	width: 100%;
	max-width: 400px;
	margin: 0 auto;
}

.naeva-form-head {
	text-align: left !important;
	margin-bottom: 1.75rem !important;
	padding: 0 !important;
}

.naeva-form-head .gf-form-mark {
	display: block;
	width: 52px;
	height: auto;
	margin: 0 0 1.25rem;
}

.naeva-form-head h4 {
	font-family: "Poppins", sans-serif;
	font-size: 1.8rem;
	font-weight: 600;
	color: var(--gf-black);
	margin: 0 0 0.35rem !important;
	letter-spacing: -0.02em;
}

.naeva-form-head h4::after {
	content: "";
	display: block;
	width: 44px;
	height: 4px;
	border-radius: 2px;
	background: var(--gf-lemon);
	margin-top: 0.7rem;
}

.naeva-form-sub {
	margin: 0.9rem 0 0;
	color: var(--gf-muted);
	font-size: 0.9rem;
	line-height: 1.5;
	max-width: 22rem;
}

.naeva-login .page-card {
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	background: transparent !important;
	border: none !important;
	border-radius: 0 !important;
	box-shadow: none !important;
}

.naeva-login .page-card form {
	max-width: none !important;
	margin: 0 !important;
}

.naeva-login .page-card-body input[type="text"],
.naeva-login .page-card-body input[type="email"],
.naeva-login .page-card-body input[type="password"],
.naeva-login .form-control {
	border: 1px solid var(--gf-line) !important;
	border-radius: var(--gf-radius) !important;
	background: #fff !important;
	color: var(--gf-black) !important;
	min-height: 3.15rem;
	padding: 0.75rem 2.5rem 0.75rem 2.7rem !important;
	font-family: "Poppins", sans-serif;
	font-size: 0.95rem !important;
	box-shadow: none !important;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.naeva-login .page-card-body input:focus,
.naeva-login .form-control:focus {
	border-color: var(--gf-green) !important;
	outline: none;
	box-shadow: 0 0 0 3px rgba(255, 242, 0, 0.55) !important;
}

.naeva-login .forgot-password-message {
	text-align: right;
	margin: -0.2rem 0 0.35rem;
}

.naeva-login .forgot-password-message a,
.naeva-login .sign-up-message a,
.naeva-login a {
	color: var(--gf-green);
	font-weight: 500;
	text-decoration: none;
}

.naeva-login .forgot-password-message a:hover,
.naeva-login .sign-up-message a:hover {
	color: var(--gf-green-2);
	text-decoration: underline;
}

/* Primary button: lemon on black text, the brand's signature pairing */
.naeva-login .btn-primary,
.naeva-login .btn-login:not(.btn-default):not(.btn-login-option),
.naeva-login .btn-forgot,
.naeva-login button.btn-login-with-email-link {
	background: var(--gf-lemon) !important;
	border: 1px solid var(--gf-lemon) !important;
	color: var(--gf-black) !important;
	border-radius: var(--gf-radius) !important;
	min-height: 3.15rem;
	font-family: "Poppins", sans-serif;
	font-weight: 600;
	font-size: 0.98rem !important;
	letter-spacing: 0.02em;
	box-shadow: 0 10px 22px rgba(8, 61, 46, 0.18);
	transition: transform 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
}

.naeva-login .btn-primary:hover,
.naeva-login .btn-login:not(.btn-default):not(.btn-login-option):hover,
.naeva-login .btn-forgot:hover,
.naeva-login button.btn-login-with-email-link:hover {
	background: var(--gf-green) !important;
	border-color: var(--gf-green) !important;
	color: var(--gf-lemon) !important;
	transform: translateY(-1px);
	box-shadow: 0 14px 28px rgba(8, 61, 46, 0.28);
}

.naeva-login .btn-default,
.naeva-login .btn-login-option {
	border-radius: var(--gf-radius) !important;
	min-height: 2.9rem;
	border: 1px solid var(--gf-line) !important;
	background: #fff !important;
	color: var(--gf-black) !important;
	font-weight: 500;
	box-shadow: none !important;
	transition: border-color 0.15s ease;
}

.naeva-login .btn-default:hover,
.naeva-login .btn-login-option:hover {
	border-color: var(--gf-green) !important;
}

.naeva-login .page-card-actions {
	margin-top: 1.35rem !important;
}

.naeva-login .sign-up-message {
	margin-top: 1.35rem;
	color: var(--gf-muted);
}

.naeva-login .login-divider {
	margin: 1.15rem 0;
	color: var(--gf-muted);
}

.naeva-login .toggle-password {
	color: var(--gf-muted) !important;
	font-size: 0.85rem;
}

.naeva-login .for-forgot,
.naeva-login .for-login-with-email-link,
.naeva-login .for-signup,
.naeva-login .for-email-login {
	display: none;
}

@keyframes gf-fade {
	from { opacity: 0; }
	to { opacity: 1; }
}

@keyframes gf-panel-in {
	from { opacity: 0; transform: translateX(12px); }
	to { opacity: 1; transform: none; }
}

@keyframes gf-rise {
	from { opacity: 0; transform: translateY(16px); }
	to { opacity: 1; transform: none; }
}

@keyframes gf-drift {
	from { transform: translate3d(0, 0, 0); }
	to { transform: translate3d(24px, -18px, 0); }
}

@media (prefers-reduced-motion: reduce) {
	.naeva-login-brand,
	.naeva-login-brand::before,
	.naeva-login-brand-inner,
	.naeva-login-panel {
		animation: none;
	}
}

@media (max-width: 900px) {
	.naeva-login {
		grid-template-columns: 1fr;
	}

	.naeva-login-brand {
		padding: 2rem 1.5rem 1.75rem;
	}

	.gf-steps,
	.naeva-login-tagline {
		display: none;
	}

	.gf-bar {
		margin: 1.2rem 0 0;
	}

	.naeva-login-panel {
		padding: 2rem 1.35rem 2.75rem;
		animation: gf-rise 0.55s ease 0.08s both;
	}
}

/* Back to website */
.naeva-login-panel { position: relative; }
.gf-back {
	position: absolute;
	top: clamp(1rem, 3vw, 1.75rem);
	left: clamp(1.5rem, 5vw, 4.5rem);
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
	padding: 0.45rem 0.9rem 0.45rem 0.6rem;
	border: 1px solid var(--gf-line);
	border-radius: 999px;
	background: #fff;
	color: var(--gf-green) !important;
	font: 500 0.85rem "Poppins", sans-serif;
	text-decoration: none !important;
	transition: border-color 0.15s ease, background 0.15s ease, transform 0.15s ease;
}
.gf-back:hover { border-color: var(--gf-green); background: #f1f7f3; transform: translateX(-2px); }
.gf-back:focus-visible, .gf-lockup-link:focus-visible { outline: 3px solid var(--gf-lemon); outline-offset: 3px; }
.gf-lockup-link { color: inherit !important; text-decoration: none !important; display: block; }
@media (max-width: 900px) {
	.gf-back { top: 0.9rem; left: 1.35rem; }
	.naeva-login-panel { padding-top: 4.2rem; }
}