.payshepherd_theme {
	/* font */
	--body-font        : 'Inter', sans-serif;
	--title-font-size  : 2rem;
	--default-font-size: 1rem;
	--small-font-size  : .875rem;
	--smaller-font-size: .75rem;

	--font-medium   : 400;
	--font-semi-bold: 600;
	--font-bold     : 700;

	/* default font colors*/
	--title-font-color      : #080707;
	--default-font-color    : #020203;
	--font-darkgrey-color   : #666;
	--font-medium-grey-color: #646464;
	--font-grey-color       : #B0B0B0;
	--font-white-color      : #fff;

	--font-green-color  : #3F916B;
	--font-lt-blue-color: #4496FF;
	--font-blue-color   : #1D7ED5;
	--font-red-color    : #E2445C;
	--font-yellow-color : #F6C23E;

	/* tab font color*/
	--tab-font-selected: #3F916B;
	--tab-font-default : #979797;

	/* button color*/
	--active-button-color  : #0F253A;
	--inactive-button-color: #C4C4C4;

	/* background colors*/
	--tab-background-hover  : #F7FBF9;
	--tab-background-default: #F4F5F7;
	--passed-color          : #3BC83B;
	--border-color-1        : #EDEDED;  /* privacy bottom border*/
	--border-color-2        : #DCDEE2;  /* input box */
	--border-color-3        : #ECECEC;  /* tab border */
	--border-color-4        : #E4E4E4;  /* ghost button border*/
	--container-color       : #fff;

	/* border radius*/
	--small-radius  : .25rem;
	--regular-radius: .5rem;
	--big-radius: 1rem;

	/* margin 8px / 16px / 24px / 28px / 40px */
	--mb-0-5 : .5rem;
	--mb-1   : 1rem;
	--mb-1-25: 1.25rem;
	--mb-1-5 : 1.5rem;
	--mb-1-75: 1.75rem;
	--mb-2-5 : 2.5rem;
}

/* #region base */
* {
	margin : 0;
	padding: 0;
}

html, body {
	margin     : 0;
	height     : 100%;
	font-family: var(--body-font);
	font-size  : var(--default-font-size);
	color      : var(--default-font-color);
}

h4 {
	margin-bottom: var(--mb-0-5);
	font-weight  : var(--font-semi-bold);
}

ul, li {
	list-style: none;
}

a {
	text-decoration: none;
}

/*  temporary background image holder */
#body_wrap {
	position       : relative;
	display        : flex;
	justify-content: center;
	align-items    : center;
	width          : 100vw;
	height         : 100vh;
	background     : var(--img-bg) no-repeat center center;
	background-size: cover;
}
/* #endregion base */

.login.account_kind {
	display       : grid;
	grid-auto-flow: column;
	height        : 52px;
}

.login.account_kind a {
	display        : flex;
	width          : 264.5px;
	height         : 52px;
	justify-content: center;
	align-items    : center;
	text-align     : center;
}

.login.account_kind a {
	border-bottom: solid 1px var(--border-color-3);

	color           : var(--tab-font-default);
	font-size       : var(--default-font-size);
	font-weight     : var(--font-medium);
	background-color: var(--tab-background-default);
}

.login.account_kind a#approver {
	border-right          : solid 0.5px var(--border-color-3);
	border-top-left-radius: var(--regular-radius);
}

.login.account_kind a#vendor {
	border-left            : solid 0.5px var(--border-color-3);
	border-top-right-radius: var(--regular-radius);
}

.login.account_kind a#approver[data-account="true"] {
	border-bottom         : none;
	color                 : var(--tab-font-selected);
	font-weight           : var(--font-semi-bold);
	background-color      : var(--container-color);
	border-top-left-radius: var(--regular-radius);
}

.login.account_kind a#vendor[data-account="true"] {
	border-bottom          : none;
	color                  : var(--tab-font-selected);
	font-weight            : var(--font-semi-bold);
	background-color       : var(--container-color);
	border-top-right-radius: var(--regular-radius);
}

#login_container_body_wrapper {
	width: 450px;
	overflow: hidden;
}
#login_container_body {
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	gap: 10px;
	transition: height 0.3s ease, transform 0.3s ease, opacity 0.3s ease
}
#login_container_body.body_visible {
	transform: translateX(0);
}
#login_container_body.body_hidden {
	transform: translateX(-100%);
}
.sso_login_btn {
	width:450px;
	margin-bottom:15px;
	margin-top: 45px;
}
.sso_info {
	font-size: 12px;
	margin-top: 26px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}
.continue_email {
	text-align: center;
	font-size: 14px;
	color: #1D7AFC;
	margin-top: 90px;
}
.back_to_sso {
	display:flex;
	align-items: center;
	gap: 20px;
	/* margin: 45px 0px; */
	margin-bottom: 45px;
	font-size: 18px;
	font-weight: 600;
}
.type_login_btn {
	cursor: pointer;
}
.footer_list {
	height: 56px !important;
}
.agreement_form_wrap {
	height: 70px !important;
}
.footer_list li a {
	font-size: 11px;
}

.login_input_form.password, button#btn_login {
	margin-top: 12px !important;
}
.login_input.remember{
	margin-bottom: 16px !important;
}

.login.ps_main .logo {
	display        : flex;
	padding        : var(--mb-2-5) 0 var(--mb-1-5) 0;
	justify-content: center;
}

.login_input_container {
	width : 450px;
	height: auto;

	display       : flex;
	flex-direction: column;
	align-items   : flex-start;
	gap           : 16px;
}

label,
.input_title {
	font-size    : var(--small-font-size);
}

.login_input_form {
	position: relative;
}

.login_input_form input::-webkit-inner-spin-button, 
.login_input_form input::-webkit-outer-spin-button {
	-webkit-appearance: none; 
	margin: 0; 
}

input[type=number] {
    -moz-appearance:textfield; /* Firefox */
}

.login_input_form input {
	width        : 100%;
	height       : 44px;
	padding-left : .75rem;
	box-sizing   : border-box;
	font-family  : var(--body-font);
	border       : solid 1px var(--border-color-2);
	border-radius: var(--small-radius);
}

.login_input_form input[data-visible="true"] {
	border-color: var(--font-red-color);
}

.login_input_form .icon[data-visible="true"].warning {
	position  : absolute;
	right     : 40px;
	padding   : 13px;
	width     : 20px;
	height    : 20px;
	display   : inline-block;

	background         : url(/assets/img/ps_images/ps_icons_v3.svg) no-repeat 0 0px transparent;
	background-position: -87px -208px;
	background-size    : 155px auto;
}

.show_pwd[data-visible="false"] {
	position  : absolute;
	right     : 0;
	padding   : 10px;
	/* margin-top: 3px; */
	width     : 20px;
	height    : 20px;
	display   : inline-block;
	cursor    : pointer;

	background         : url(/assets/img/ps_images/ps_icons_v3.svg) no-repeat 0 0px transparent;
	background-position: 0px -696px;
	background-size    : 142px auto;
}

.show_pwd[data-visible="true"] {
	position  : absolute;
	right     : 0;
	padding   : 10px;
	width     : 20px;
	height    : 20px;
	display   : inline-block;
	cursor    : pointer;

	background         : url(/assets/img/ps_images/ps_icons_v3.svg) no-repeat 0 0px transparent;
	background-position: -38px -696px;
	background-size    : 142px auto;
}

.login_input_form .input_error[data-visible="false"],
.login_input_form.error[data-visible="false"] {
	display: none;
}

.login_input_form .input_error[data-visible="true"] {
	margin-top  : var(--mb-0-5);
	color       : var(--font-red-color);
	font-size   : var(--smaller-font-size);
	font-weight : var(--font-semi-bold);
	padding-left: var(--mb-0-5);
}

.login_input_form.error[data-visible="true"] .error_msg {
	position        : relative;
	padding         : var(--mb-0-5) var(--mb-1) var(--mb-0-5) var(--mb-2-5);
	font-size       : 13px;
	font-weight     : 400;
	color           : var(--font-red-color);
	border-radius   : var(--small-radius);
	background-color: #FFF5F7;
}

.login_input_form.error[data-visible="true"] .error_msg .icon_inbox {
	position: absolute;
	left    : 10px;
}

.login_input_form.error[data-visible="true"] .error_msg .icon_inbox.inbox {
	width              : 20px;
	height             : 20px;
	background         : url(/assets/img/ps_images/ps_icons_v3.svg) no-repeat 0 0px transparent;
	background-position: -91px -203px;
	background-size    : 142px auto;
}
.login_input_form.error[data-visible="true"] .error_msg a {
	color          : var(--font-red-color);
	text-decoration: underline;
}

.login_input_form input:-webkit-autofill {
	-webkit-box-shadow: 0 0 0 1000px transparent inset;
 }

/* .err_holder {
	height: 32px;
	margin-bottom: 10px;
} */
.err_holder a {
	text-decoration-line: underline;
	color: var(--font-red-color);
}
#submit_err {
	position        : relative;
	padding         : var(--mb-0-5) var(--mb-1) var(--mb-0-5) var(--mb-2-5);
	font-size       : 13px;
	font-weight     : 400;
	color           : var(--font-red-color);
	border-radius   : var(--small-radius);
	background-color: #FFF5F7;
	display         : none;
}
#submit_err .icon_inbox {
	position           : absolute;
	left               : 10px;
	width              : 20px;
	height             : 20px;
	background         : url(/assets/img/ps_images/ps_icons_v3.svg) no-repeat 0 0px transparent;
	background-position: -91px -203px;
	background-size    : 142px auto;
}

.user_option_tool {
	display        : flex;
	flex-direction : row;
	justify-content: space-between;
	align-items    : center;
	font-size      : var(--small-font-size);
}

.login_input.remember {
	display     : inline-flex;
	padding-left: 3px;
}

input[type="checkbox"] {
	zoom: 1.5;
}

#text_remeber_me {
	margin-left: .5rem;

	color: var(--font-darkgrey-color);
}
.login_input.pwd_reset #pwd_reset {
	color: var(--font-blue-color);
}

button#btn_login,
button.button_group {
	width     : -webkit-fill-available;
	height    : 56px;
	margin-top: var(--mb-0-5);
	
	cursor          : pointer;
	border          : none;
	border-radius   : 4px;
	font-family     : var(--body-font);
	font-size       : var(--default-font-size);
	color           : var(--font-white-color);
	background-color: var(--active-button-color);
}

footer .footer ul.footer_list {
	display        : grid;
	width          : 530px;
	height         : 48px;
	grid-auto-flow : column;
	grid-column-gap: 24px;
	place-items    : center;
	border-bottom-left-radius : var(--regular-radius);
	border-bottom-right-radius: var(--regular-radius);

	color           : var(--font-grey-color);
	font-size       : var(--small-font-size);
	background-color: var(--tab-background-default);
}

footer .footer ul.footer_list li a {
	color : var(--font-grey-color);
	cursor: pointer;
}

footer .footer ul.footer_list li:first-child {
	justify-self: end;
}
footer .footer ul.footer_list li:last-child {
	justify-self: start;
}

.login_container {
	position        : absolute;
	display         : flex;
	flex-direction  : column;
	align-items     : center;
	font-family     : var(--body-font);
	background-color: var(--container-color);
}

main .popup {
	display: none;
}

main .popup_wrap[data-visible="true"] {
	position        : fixed;
	width           : 100vw;
	height          : 100vh;
	left            : 0;
	top             : 0;
	background-color: rgba(0,0,0,.6)
}

main .popup[data-visible="true"] {
	position : fixed;
	top      : 50%;
	left     : 50%;
	transform: translate(-50%,-50%);

	width           : 800px;
	height          : 560px;
	display         : flex;
	flex-direction  : column;
	align-items     : center;
	justify-content : space-between;
	border-radius   : var(--regular-radius);
	background-color: var(--container-color);
	/* z-index: 5 */
}

main .popup header {
	width          : 100%;
	display        : flex;
	flex-direction : row;
	justify-content: space-between;

	padding         : var(--mb-1) var(--mb-1-5);
	color           : var(--title-font-color);
	font-family     : var(--body-font);
	font-size       : var(--default-font-size);
	font-weight     : var(--font-bold);
	background-color: var(--tab-background-default);

	border-top-left-radius : var(--regular-radius);
	border-top-right-radius: var(--regular-radius);

	box-sizing: border-box;
}

main .popup header h1 {
	font-size: var(--default-font-size);
}

main .popup header button:hover {
	border-radius   : 16px;
	background-color: #e7e8e9;
}

main .popup header button {
	width : 24px;
	height: 24px;

	border             : none;
	background         : url(/assets/img/ps_images/ps_icons_v3.svg) no-repeat transparent;
	background-position: -94px -27px;
}
main .popup article {
	position     : initial;
	border-radius: var(--regular-radius);
	padding      : var(--mb-1-5) var(--mb-2-5);
	max-height   : 560px;
	height       : fill-available;
	height       : -webkit-fill-available;

	color           : var(--font-darkgrey-color);
	font-size       : var(--smaller-font-size);
	overflow        : auto;
	background-color: var(--container-color);
}

main .popup article h5 {
	padding: 6px 0;
	font-size: var(--small-font-size);
}

/* #endregion approver login css */

/* #region agreement css*/
.agreement_container {
	position : absolute;
	top      : 40%;
	left     : 50%;
	transform: translate(-50%,-50%);

	width           : 800px;
	height          : 560px;
	display         : flex;
	flex-direction  : column;
	align-items     : center;
	justify-content : space-between;
	background-color: var(--container-color);
	border-radius   : var(--regular-radius);
}

.agreement_container header {
	display        : flex;
	flex-direction : row;
	justify-content: space-between;
	width          : 100%;

	padding         : var(--mb-1) var(--mb-1-5);
	color           : var(--default-font-color);
	font-family     : var(--body-font);
	font-size       : var(--default-font-size);
	font-weight     : var(--font-bold);
	background-color: var(--tab-background-default);

	border-top-left-radius : var(--regular-radius);
	border-top-right-radius: var(--regular-radius);

	box-sizing: border-box;
}

.agreement_container header h1 {
	font-size: var(--default-font-size);
}

.agreement_container header button:hover {
	border-radius   : var(--big-radius);
	background-color: #e7e8e9;
}

.agreement_container header button {
	width : 24px;
	height: 24px;

	border             : none;
	background         : url(/assets/img/ps_images/ps_icons_v3.svg) no-repeat transparent;
	background-position: -94px -27px;
}

.agreement_container article {
	position  : initial;
	padding   : var(--mb-1) var(--mb-2-5);
	max-height: 428px;
	height    : fill-available;
	height    : -webkit-fill-available;

	color           : var(--font-darkgrey-color);
	font-family     : var(--body-font);
	font-size       : var(--smaller-font-size);
	overflow        : auto;
	background-color: var(--container-color);
}

.agreement_container footer form a#btn_decline h3 {
	line-height: 44px;
	font-family: var(--body-font);
}

.agreement_container article h5 {
	padding  : 6px 0;
	font-size: var(--small-font-size);
}

.agreement.button_group {
	height         : 76px;
	width          : 800px;
	display        : flex;
	justify-content: center;
	align-items    : center;

	background-color          : var(--tab-background-default);
	border-bottom-left-radius : var(--regular-radius);
	border-bottom-right-radius: var(--regular-radius);
} 

footer {
	position: initial;
	bottom  : 0;
}

footer .footer_list form{
	display        : grid;
	grid-auto-flow : column;
	grid-column-gap: 478px;
}

footer .footer_list form #btn_decline,
footer .footer_list form #btn_accept {
	margin       : 16px 0;
	height       : 44px;
	border       : none;
	border-radius: 6px;

	cursor     : pointer;
	font-size  : var(--small-font-size);
	font-family: var(--body-font);
	font-weight: var(--font-semi-bold);
}

footer .footer_list form #btn_decline {
	width           : 114px;
	border          : solid 1px var(--border-color-4);
	color           : var(--font-grey-color);
	background-color: var(--container-color);
}

footer .footer_list form #btn_accept {
	width           : 128px;
	color           : var(--font-white-color);
	background-color: var(--active-button-color);
}
/* #endregion agreement css */

/* #region forgot password*/
.ps_theme_1 .login_container.forgotpwd_container {
	height : 434px;
}

.forgotpwd_container.send_link {
	/* display: none; */
}

.forgotpwd_container.sent_msg {
	display: none;
}

.forgotpwd_container.sent_msg .title_subtitle #msg_line{
	display        : flex;
	flex-direction : column;
	justify-content: center;
	align-items    : center;
	width          : 435px;
	line-height    : 19px;
}

.forgotpwd_container.sent_msg #title {
	display        : flex;
	align-items    : center;
	justify-content: center;
}
.forgotpwd_container.sent_msg #subtitle {
	text-align: center;
}

.forgotpwd_form {
	padding: 0;
}

.title_subtitle {
	margin-bottom: 6px;
	display: grid;
	justify-items: center;
}

.title_subtitle #title {
	margin: 60px 0 var(--mb-0-5) 0;

	color      : var(--big-title-font-color);
	font-weight: var(--font-bold);
	font-size  : var(--title-font-size);
}

.title_subtitle #subtitle {
	margin-bottom: var(--mb-1-75);
	display        : flex;
	align-items    : center;
	justify-content: center;
	
	color      : var(--font-medium-grey-color);
	font-size  : var(--default-font-size);
	font-weight: var(--font-medium);
}

.input_container {
	height: auto;

	display       : flex;
	flex-direction: column;
	align-items   : center;
}

.input_container form {
	width  : 450px;
	display: grid;
	gap    : var(--mb-1);
}

button:disabled {
	color           : var(--font-white-color);
	background-color: var(--inactive-button-color);
}

.forgotpwd.back_to_login #do_you {
	text-align: center;
	color     : var(--font-grey-color);
}

.forgotpwd.back_to_login a {
	cursor: pointer;
}

#back_to_login {
	text-decoration: underline;
	cursor         : pointer;
	color          : var(--font-green-color );
}
/* #endregion forgot password*/

/* #region two factor css */
.title_subtitle #icon_check {
	background         : url(/assets/img/ps_images/ps_icons_v3.svg) no-repeat 0 0px transparent;
	width              : 48px;
	height             : 48px;
	background-position: -56px -220px;
	background-size    : 248px auto;
}

.title_subtitle.with_icon #title {
	margin: 0 0 var(--mb-1) 0;
}

.title_subtitle #subtitle {
	width: 433px;
	text-align: center;
}

.countdown {
	position: fixed;
	padding : 12px;
	display : inline-block;
}

.countdown[data-active="false"] {
	color: var(--font-grey-color);
}

.countdown[data-active="true"] {
	color: var(--font-red-color);
}

.verifydevice.input.code_resend #code_resend {
	text-decoration: none;
	color          : var(--font-blue-color);
}

button#btn_verify {
	display: flex;
	justify-content: center;
	align-items: center;
}

button#btn_verify .button_group.loading {
	display: flex;
}

/*  Haesun: css for loadgin icon -> HOLD */
button#btn_verify .button_group[data-visible="false"],
button#btn_verify .icon.loading[data-visible="false"] {
	display: none;
}

button#btn_verify img {
	width       : 24px;
	height      : 24px;
	margin-right: var(--mb-0-5);

	animation          : loading 1.5s linear infinite;
	animation-direction: normal;
}
@keyframes loading {
	100% {
        transform: rotate(360deg);
    }
} 

.back_to_login.center {
	display: flex;
	place-content: center;
}
/* #endregion two factor css */

/* #region reset password css */
.complexity_lvl {
	width       : 444px;
	display     : grid;
	justify-self: center;
	align-items : center;
}

.complexity_lvl .pwd_status {
	margin-left   : var(--mb-0-5);
	padding-bottom: var(--mb-0-5);
	color         : var(--font-grey-color);
}

.complexity_lvl[data-count="1"] .pwd_status {
	color: var(--font-red-color);
} 
.complexity_lvl[data-count="2"] .pwd_status {
	color: var(--font-yellow-color);
} 
.complexity_lvl[data-count="3"] .pwd_status {
	color: var(--font-lt-blue-color);
} 
.complexity_lvl[data-count="4"] .pwd_status {
	color: var(--passed-color);
} 
.complexity_lvl[data-count="1"] .validation_lvl_bar > div:nth-child(-n+1) {
	background-color: var(--font-red-color);
}
.complexity_lvl[data-count="2"] .validation_lvl_bar > div:nth-child(-n+2) {
	background-color: var(--font-yellow-color);
}
.complexity_lvl[data-count="3"] .validation_lvl_bar > div:nth-child(-n+3) {
	background-color: var(--font-lt-blue-color);
}
.complexity_lvl[data-count="4"] .validation_lvl_bar > div:nth-child(-n+4) {
	background-color: var(--passed-color);
}

.pwd_complexity[data-visible="false"] {
	display: none;
}

.validation_lvl_bar {
	margin         : 4px 0 10px 0;
	display        : flex;
	justify-content: space-evenly;
	align-items    : center;
}

.validation_lvl_bar div {
	width           : 99.25px;
	height          : 3px;
	border-radius   : 3px;
	background-color: #D9D9D9;
}

.check_list_group {
	display    : grid;
	margin-left: 6px;
}

.check_list_group li {
	display       : inline-flex;
	padding-bottom: var(--mb-0-5);
}

.check_list_group li label {
	margin-left: 8px;
}

.icon_valid_check[data-is_check="true"] {
	width              : 19px;
	height             : 19px;
	background         : url(/assets/img/ps_images/ps_icons_v3.svg) no-repeat 0 0px transparent;
    background-position: -6px -705px;
}

.icon_valid_check[data-is_check="false"] {
	width              : 19px;
	height             : 19px;
	background         : url(/assets/img/ps_images/ps_icons_v3.svg) no-repeat 0 0px transparent;
	background-position: -34px -705px;
}

.confirm_pwd input#confirm_password[data-pass="true"] {
	border-color: var(--passed-color);
}
.confirm_pwd input#confirm_password[data-pass="false"] {
	border-color: var(--font-red-color);
}

.confirm_pwd button {
	margin-bottom: var(--mb-2-5);
}
/* #endregion reset password css */

/* ----------THEME 1 CSS---------- */
/* #region login css */
body .ps_theme_1 .login_container {
	width : 530px;
	height: auto;

	border: solid 1px var(--border-color-3);
	border-radius   : var(--regular-radius);
}
.ps_theme_1 footer {
	position: initial;
}
/* #endregion approver login css */

/* #region two factor css */
.ps_theme_1 main .form-container[data-visible='true'] {
	/* display: none; */
}
.ps_theme_1 main .form-container[data-visible='false'] {
	display: none;
	height : 409px;
}
.ps_theme_1 main {
	margin-bottom: 40px;
}

.ps_theme_1 #form_verifydevice .icon.warning[data-visible="true"] {
	position: absolute;
	right   : 40px;
}

.ps_theme_1 .countdown {
	position: absolute;
	right   : 0;
}
/* #endregion two factor css */

/* #region reset password css */
.ps_theme_1 .login_input_form .icon[data-visible="true"].warning {
	right: 30px;
}
.ps_theme_1 .sent .title_subtitle #icon_check {
	margin : 52px 0 var(--mb-1) 0;
}
.ps_theme_1 .login_container.resetpwd_container.create_pwd {
	/* display: none; */
	height: 626px;
}

.ps_theme_1 .login_container.resetpwd_container.create_pwd_done {
	display: none;
}
/* #endregion reset password css */

/* ----------THEME 2 CSS---------- */
/* #region login page css */
body .ps_theme_2 .login_container {
	right : 0;
	width : 590px;
	height: 100vh;
}

.ps_theme_2 .login_container main {
	display: flex;
	flex-direction: column;
	justify-content: center;

	height: fill-available;
	height: -webkit-fill-available;
}
/* #endregion login css */

.ps_theme_2 main .form-container[data-visible='true'] {
	/* display: none; */
}

.ps_theme_2 main .form-container[data-visible='false'] {
	display: none;
}

.ps_theme_2 .wrapping {
	display        : flex;
	flex-direction : column;
	align-items    : center;
	justify-content: space-between;
}

.ps_theme_2 .login.account_kind a {
	width: 224px;
}

.ps_theme_2 .login.account_kind a#approver {
	border                   : solid 0.5px var(--border-color-3);
	border-top-left-radius   : var(--regular-radius);
	border-bottom-left-radius: var(--regular-radius);
}

.ps_theme_2 .login.account_kind a#vendor {
	border                    : solid 0.5px var(--border-color-3);
	border-top-right-radius   : var(--regular-radius);
	border-bottom-right-radius: var(--regular-radius);
}

.ps_theme_2 .login_input_form .icon {
	right: 70px;
}

.ps_theme_2 .show_pwd {
	position  : absolute;
	right     : 6px;
	padding   : 10px;
	/* margin-top: 3px; */
	width     : 24px;
	height    : 24px;
	display   : inline-block;
	cursor    : pointer;

	background         : url(/assets/img/ps_images/ps_icons_v3.svg) no-repeat 0 0px transparent;
	background-size    : 157px auto;
}

.ps_theme_2 .show_pwd[data-visible="false"] {
	background-position: 0px -773px;
}

.ps_theme_2 .show_pwd[data-visible="true"] {
	background-position: -42px -773px;
}
.ps_theme_2 .login_input_form.error[data-visible="true"] .error_msg .icon_inbox {
	left: 10px;
}
.ps_theme_2 footer {
	background-color: var(--tab-background-color-default);
}

.ps_theme_2 footer .footer ul.footer_list {
	width        : 590px;
	border-radius: 0;
}
/* #endregion login page css */

/* #region forgot password css */
.ps_theme_2 .title_subtitle {
	display       : inline-flex;
	gap           : var(--mb-0-5);
	flex-direction: column;
	align-items   : center;
}

.ps_theme_2 .title_subtitle #title {
    margin: 0;
}
/* #endregion forgot password css */

/* #region reset password css */

.ps_theme_2 .login_input_form.email .icon[data-visible="true"].warning {
	right: 0;
}
.ps_theme_2 .login_input_form.confirm_pwd .icon[data-visible="true"].warning {
	right: 36px;
}
.ps_theme_2 .resetpwd_container.create_pwd {
	/* display: none; */
	height: inherit;
}

.ps_theme_2 .resetpwd_container.create_pwd .wrapping {
	margin-top: 100px;
}
/* #endregion reset password css */

/* #region two factor css */

.ps_theme_2 #form_verifydevice .icon.warning[data-visible="true"] {
	right: 40px;
}

.ps_theme_2 .countdown {
	right: 70px;
}
/* #endregion reset password css */



#login_main .login_container .logo_area {
	width: 100%;
	height: 69px;
	background-color: #EBEEF2;
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 8px 8px 0px 0px;
	margin-bottom: 44px;
}
#login_main .login_container .logo_area img {
	max-width: 180px;
	max-height: 60px;
}
#login_main .login_container .user_type {
	display        : flex;
	flex-direction : row;
	justify-content: center;
	align-items    : center;
	gap: 16px;
	margin-bottom: 33px;
}
#login_main .login_container .user_type .user_type_selector {
	display        : flex;
	flex-direction : row;
	justify-content: center;
	align-items    : center;
	padding: 22px 22px 23px 22px;
	position: relative;
	cursor: pointer;
}
#login_main .login_container .user_type .user_type_selector .user_type_icon {
	width: 40px;
	height: 40px;
	margin-right: 11px;
}
#login_main .login_container .user_type .user_type_selector .user_type_detail div {
	width: 115px;
	height: 17px;
}
#login_main .login_container .user_type .user_type_selector .user_type_detail .user_type_title {
	font-size: 14px;
	font-weight: 600;
	color: #515F73;
}
#login_main .login_container .user_type .user_type_selector .user_type_detail .user_type_description {
	font-size: 11px;
	font-weight: 400;
	color: #515F73;
	margin-top: 4px;
}
#login_main .login_container .user_type .user_type_selector .user_type_detail .user_type_title.selected,
#login_main .login_container .user_type .user_type_selector .user_type_detail .user_type_description.selected {
	color: #121923;
}
#login_main .login_container .user_type .user_type_check_layer {
	position:absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 100%;
	border: 1px solid #A7B1C1;
	border-radius: 4px;
	box-sizing: border-box;
}
#login_main .login_container .user_type .user_type_check_layer.selected{
	border: 2px solid #00263A;
}
#login_main .login_container .user_type .user_type_check_layer .user_type_checker {
	position: absolute;
	right: -1px;
	bottom: -1px;
	width: 24px;
	height: 24px;
}

#login_main .input_container form {
	gap: 0px !important;
}
#login_main .login_input_form.email {
	margin-bottom: 26px !important;
}
#login_main .login_input_form.password {
	margin-bottom: 23px !important;
}
#login_main .login_input_form.error {
	margin-bottom: 23px !important;
}
#login_main .login.user_option_tool {
	margin-bottom: 10px;
}
#login_main .input_container form {
	width: 436px !important;
}

#login_main #btn_login {
	font-size: 18px !important;
	font-weight: 500;
}
#login_main .ps_theme_1 main {
	margin-bottom: 34px !important;
}
#login_main .ps_footer_box .footer .footer_list {
	height: 56px !important;
	color: #EBEEF2;
}
#login_main .ps_footer_box .footer ul.footer_list {
	font-size: 11px;
	width: 500px !important;
	background-color: #EBEEF2 !important;
}

#login_main .ps_theme_1 .login_container {
	width: 500px !important;
}

#login_main .login_container .input_title h4 {
	color: #121923 !important;
	opacity: 0.8;
}

#saml_login {
	width: 100%;
}