/* Interpal B2B login — same photo + card language as logistic frontend */

BODY.login-frontend
{
	--ip-radius-sm: 6px;
	--ip-radius-md: 8px;
	--ip-radius-lg: 12px;
	--ip-radius-xl: 14px;
	--primary: #79bb1c;
	--secondary: #5f9614;
	--background-light: #ffffff;
	--background: #f7f8f4;
	--font-color: #333333;
	--lines: #d2d2d2;
	--shadow-ink: #1a1a1a;
	--ip-page-wash: #eef1e8;
	--ip-page-bg-photo-opacity: 0.58;
	--ip-page-bg-photo-filter: brightness( 1.08 ) saturate( 0.78 );
	--ip-page-bg-photo-mask: linear-gradient( to left, rgba( 0, 0, 0, 1 ) 28%, rgba( 0, 0, 0, 0 ) 78% );
	--ip-shadow-card: 0 6px 20px rgba( 26, 26, 26, 0.07 ), 0 2px 8px rgba( 121, 187, 28, 0.08 );
	position: relative !important;
	min-height: 100vh !important;
	background-color: var( --ip-page-wash ) !important;
	background-image: none !important;
}

BODY.login-frontend::before
{
	content: "" !important;
	display: block !important;
	position: fixed !important;
	inset: 0 !important;
	z-index: 0 !important;
	pointer-events: none !important;
	background-image: url( "/javax.faces.resource/BG_APPLICATION.png.xhtml?ln=images" ) !important;
	background-size: cover !important;
	background-position: top right !important;
	background-repeat: no-repeat !important;
	opacity: var( --ip-page-bg-photo-opacity ) !important;
	filter: var( --ip-page-bg-photo-filter ) !important;
	-webkit-mask-image: var( --ip-page-bg-photo-mask ) !important;
	mask-image: var( --ip-page-bg-photo-mask ) !important;
	-webkit-mask-size: 100% 100% !important;
	mask-size: 100% 100% !important;
	-webkit-mask-repeat: no-repeat !important;
	mask-repeat: no-repeat !important;
}

BODY.login-frontend::after
{
	content: "" !important;
	display: block !important;
	position: fixed !important;
	inset: 0 !important;
	z-index: 0 !important;
	pointer-events: none !important;
	background-image:
		radial-gradient( ellipse 70% 55% at 18% 82%, rgba( 121, 187, 28, 0.06 ) 0%, transparent 58% ),
		linear-gradient( to right, var( --ip-page-wash ) 0%, var( --ip-page-wash ) 24%, rgba( 238, 241, 232, 0.48 ) 42%, rgba( 238, 241, 232, 0.18 ) 78%, transparent 96% ),
		linear-gradient( to top, var( --ip-page-wash ) 0%, rgba( 238, 241, 232, 0.45 ) 34%, transparent 80% ) !important;
}

BODY.login-frontend .menu-toggler,
BODY.login-frontend .backstretch
{
	display: none !important;
}

BODY.login-frontend .content
{
	position: relative !important;
	z-index: 1 !important;
	width: 400px !important;
	max-width: calc( 100% - 32px ) !important;
	margin: 48px auto 16px auto !important;
	padding: 0 !important;
	overflow: hidden !important;
	background: var( --background-light ) !important;
	background-image: none !important;
	border: 1px solid color-mix( in srgb, var( --lines ) 85%, transparent ) !important;
	border-radius: var( --ip-radius-xl ) !important;
	box-shadow: var( --ip-shadow-card ) !important;
}

BODY.login-frontend .login-logo
{
	background: var( --background-light ) !important;
	text-align: center !important;
	padding: 28px 28px 18px 28px !important;
	margin: 0 28px !important;
	border-bottom: 1px solid var( --lines ) !important;
}

BODY.login-frontend .login-logo .logo-default
{
	width: auto !important;
	max-width: 280px !important;
	height: auto !important;
}

BODY.login-frontend .login-form
{
	padding: 8px 28px 28px 28px !important;
}

BODY.login-frontend .content h3,
BODY.login-frontend .content h4,
BODY.login-frontend .content p,
BODY.login-frontend .content label,
BODY.login-frontend .content .form-title
{
	color: var( --font-color ) !important;
}

BODY.login-frontend .content .form-title
{
	margin-top: 8px !important;
	margin-bottom: 12px !important;
	font-weight: 600 !important;
}

BODY.login-frontend .content .form-control
{
	height: 40px !important;
	border-radius: var( --ip-radius-md ) !important;
	border: 1px solid var( --lines ) !important;
}

BODY.login-frontend .content .form-actions
{
	padding: 8px 0 16px 0 !important;
	margin: 0 !important;
}

BODY.login-frontend .content .form-actions .btn,
BODY.login-frontend .content .btn.blue,
BODY.login-frontend .content .btn.yellow
{
	width: 100% !important;
	height: 42px !important;
	border: none !important;
	border-radius: var( --ip-radius-md ) !important;
	background-color: var( --primary ) !important;
	background-image: none !important;
	color: #ffffff !important;
	font-weight: 600 !important;
	text-shadow: none !important;
	box-shadow: none !important;
}

BODY.login-frontend .content .form-actions .btn:hover,
BODY.login-frontend .content .btn.blue:hover
{
	background-color: var( --secondary ) !important;
}

BODY.login-frontend .login-help,
BODY.login-frontend .content .forget-password
{
	background-color: var( --background ) !important;
	opacity: 1 !important;
	margin: 8px 0 0 0 !important;
	padding: 16px !important;
	border: 1px solid var( --lines ) !important;
	border-radius: var( --ip-radius-md ) !important;
}

BODY.login-frontend .content .forget-password + .form-group
{
	margin-top: 22px !important;
}

BODY.login-frontend .login-help A,
BODY.login-frontend .content .forget-password A
{
	color: var( --font-color ) !important;
	text-decoration: none !important;
}

BODY.login-frontend .login-help H4,
BODY.login-frontend .content .forget-password H4
{
	color: var( --primary ) !important;
	margin: 0 0 4px 0 !important;
}

BODY.login-frontend .content .form-group
{
	border-top: 0 !important;
}

BODY.login-frontend .copyright
{
	position: relative !important;
	z-index: 1 !important;
	color: #555555 !important;
}

@media ( max-width: 480px )
{
	BODY.login-frontend .content
	{
		width: calc( 100% - 24px ) !important;
		margin-top: 24px !important;
	}
}