/* Body and overall login page styling */
body.login {
	display: flex;
	align-items: center;
	justify-content: center;
	background: #f0f0f0;
	min-height: 100vh;
}

/* Login form container */
#login,
.woocommerce-lost-password form.woocommerce-ResetPassword {
	margin: auto !important;
	padding: 5% 0 0;
	width: 520px;
}

.woocommerce-lost-password form.woocommerce-ResetPassword,
.login #login {
	margin-top: 20px;
	margin-left: 0;
	padding: 20px;
	background: #fff;
	border: none;
	border-radius: 6px;
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
}

.login #login form {
    margin: 0;
    padding: 0;
    font-weight: 400;
    overflow: hidden;
    background: #fff;;
    border: none;
    box-shadow: none;
}

.login #login #backtoblog {
	display: none;
}

.login.login-action-lostpassword #login #backtoblog,
.login-action-checkemail #login #backtoblog {
	display: block;
}

/* Hide unnecessary elements */
#login h1:not(.wp-login-logo) a,
.login h1:not(.wp-login-logo) a,
.login .forgetmenot,
.login .privacy-policy-page-link,
.login-action-lostpassword .notice-info,
.login-action-lostpassword p#nav {
	display: none;
}

.login form::before,
.login .custom-signup-text,
.login .custom-signup-text a,
.login .login-terms-text,
.login .login-terms-text a,
.login #nav,
.login #nav .wp-login-lost-password:hover,
.login #nav .wp-login-lost-password:focus,
.login form#lostpasswordform #backtoblog a,
.login form#lostpasswordform .login-support-text,
.login form#lostpasswordform .login-support-text a {
	color: #2a2a2a;
}

/* Login Form */
.login form#loginform::before,
.login form#lostpasswordform::before {
	display: block;
	font-size: 42px;
	font-weight: 700;
	text-align: center;
}

.login h1 a,
.woocommerce-lost-password main .woocommerce .wp-login-logo a {
    background-image: url(../images/impark-logo.png);
	background-size: 165px;
	margin-bottom: 0;
	width: 165px !important;
}

.woocommerce-lost-password main .woocommerce .wp-login-logo {
	margin: 0 auto;
}

.login form#loginform::before {
	content: 'Welcome back';
}

.login form#lostpasswordform::before {
	content: 'Forgot password?';
}

/* Sign up text */
.login .custom-signup-text,
.login .lost-password-description,
form.woocommerce-ResetPassword > p:first-of-type {
	font-size: 16px;
	text-align: center;
	margin-top: 12px;
	margin-bottom: 50px !important;
}

.login .custom-signup-text a,
.login input[type='text'],
.login input[type='password'],
.login label,
form.woocommerce-ResetPassword label,
form.woocommerce-ResetPassword .woocommerce-Button,
.login #nav + p a,
.login .button-primary,
.login form#lostpasswordform #backtoblog,
.login form#lostpasswordform .login-support-text,
.login form#lostpasswordform .login-support-text a {
	font-size: 14px;
}

.login .login-terms-text {
	margin-top: 12px;
}

.login .custom-signup-text a,
.login .login-terms-text a,
.login form#lostpasswordform #backtoblog,
.login form#lostpasswordform .login-support-text a,
.login-action-checkemail #backtoblog a {
	font-weight: 600;
}

/* Input fields */
.login input[type='text'],
.login input[type='password'],
form.woocommerce-ResetPassword input[type='text'],
form.woocommerce-ResetPassword input[type='password'] {
	border: 1px solid #cacaca;
	border-radius: 6px;
	padding: 8px 16px !important;
	color: #777777;
	box-shadow: none;
}

.login input[type='text']:focus,
.login input[type='password']:focus,
form.woocommerce-ResetPassword input[type='text']:focus,
form.woocommerce-ResetPassword input[type='password']:focus {
	border-color: #2a2a2a !important;
	outline: none;
	box-shadow: 0 0 0 3px rgba(42, 42, 42, 0.1);
	transform: translateY(-1px);
}

/* Labels */
.login label,
form.woocommerce-ResetPassword label {
	color: #434343;
	font-weight: 500;
	margin-bottom: 12px !important;
}

/* Forgot password link */
.login #nav {
	font-size: 16px;
	font-weight: 600;
	padding: 0;
	margin-top: 0;
	text-align: left;
}

.login #nav + p a {
	color: #1a1a1a;
	font-weight: 500;
	text-decoration: none;
}

/* Log In button */
.login .submit {
	display: flex;
}

.login .button-primary,
form.woocommerce-ResetPassword .woocommerce-Button {
	width: 100%;
	background: var(--bpn-theme-primary) !important;
	box-shadow: 0 4px 12px rgba(245, 200, 37, 0.3);
	border: 0;
	border-radius: 6px;
	padding: 10px 12px !important;
	margin-top: 24px;
	font-weight: 500;
	color: var(--bpn-theme-background-white) !important;
	line-height: normal !important;
	min-height: auto !important;
}

.wp-core-ui .button-primary:hover,
.wp-core-ui .button-primary:focus {
	transform: translateY(-2px);
}

/* Terms & Privacy text */
.login form + p {
	text-align: center;
	font-size: 12px;
	color: #999;
	margin-top: 16px;
}

.login form + p a {
	color: #1a1a1a;
	text-decoration: none;
}

/* Forgot Password Page */
.login form#lostpasswordform .lost-password-description {
	margin-bottom: 25px !important;
}

.login form#lostpasswordform #backtoblog,
.login-action-checkemail #backtoblog {
	padding: 0;
	text-align: center;
}

.login form#lostpasswordform #backtoblog a,
.login-action-checkemail #backtoblog a {
	display: flex;
	justify-content: center;
	gap: 8px;
}

.login form#lostpasswordform #backtoblog a img,
.login-action-checkemail #backtoblog a img {
	width: 15px;
	height: 15px;
	align-self: center;
}

.login form#lostpasswordform .login-support-text {
	border-top: 1px solid #e5e5e5;
	margin-top: 25px;
	padding-top: 25px;
	text-align: center;
}

.login form#lostpasswordform .login-support-text a {
	text-decoration: none;
}

.login-action-checkemail #login #login-message {
	border: none;
	box-shadow: none;
	text-align: center;
}

/* Sign In Page */
.woocommerce-lost-password #page {
	display: flex;
}

.woocommerce-lost-password #content {
	display: flex;
	align-items: center;
	justify-content: center;
}

.woocommerce-lost-password main .woocommerce {
	display: block !important;
}

.woocommerce-lost-password form.woocommerce-ResetPassword .woocommerce-form-row {
	margin-bottom: 0;
	width: 100%;
}

.woocommerce-lost-password form.woocommerce-ResetPassword .woocommerce-form-row.form-row-first {
	margin: 0 6px 16px 0;
}

.woocommerce-lost-password main .woocommerce .wp-login-logo a {
	background-position: center top;
    background-repeat: no-repeat;
    color: #3c434a;
    height: 84px;
    font-size: 20px;
    font-weight: 400;
    line-height: 1.3;
    margin: 0 auto 24px;
    padding: 0;
    text-decoration: none;
    width: 84px;
    text-indent: -9999px;
    outline: 0;
    overflow: hidden;
    display: block;
}

@media screen and (max-width: 480px) {
	.login form#loginform::before,
	.login form#lostpasswordform::before {
		font-size: 28px;
	}
}