.siemens-login-nav {
    height: 60px;
}
.siemens-login-nav .nav-link{
    color: #ffffff;
}
.siemens-login-nav .nav-link.active{
    color: #ffffff;
    font-family: var(--Title-font);
    font-weight: 700;
}
.siemens-login-nav .navbar-nav{
    display: flex;
    flex-direction: row;
    gap: 10px;
}
.home-banner.auth-banner .small-title{
    font-family: var(--Main-font);
    font-weight: 400;
    color: var(--color-white);
    font-size: 1.5rem;
}
.login-footer{
    padding: 0px 15px;
    height: 60px;
    display: flex;
    justify-content: center;
    width: 100%;
    flex-direction: column;
}
.login-footer .footer-legal{
    margin-top: 0px;
    padding: 0px;
    border: 0px;
}
.login-footer .footer-legal nav{
    margin-left: 0px;
}
.sec-login{
    background-color: var(--color-blue-dark);
    color: var(--color-white);
    /* min-height: calc(100vh - 60px - 60px); */
    display: flex;
    /* justify-content: center; */
    align-items: center;
    flex-direction: column;
    border-bottom: 1px solid rgba(255, 255, 255, .4);
}
.sec-login.center{
    min-height: calc(100vh - 60px - 60px);
    justify-content: center;
}
.login-box{
    display: flex;
    flex-direction: column;
    height: auto;
    white-space: normal;
    background-color: var(--widget-background-color);
    border-radius: 5px;
    border-radius: var(--border-radius-outer);
    max-width: 440px;
    min-height: 350px;
    margin: 0px auto;
    padding: 30px 35px;
    justify-content: center;
    color: #ffffff;
}
.login-box .sub-title{
    font-size: 1.5rem;
    font-family: var(--Title-font);
    font-weight: 700;
    color: var(--color-white);
}
.siemens-auth-form .field-wrapper{
    position: relative;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    border-radius: 2px;
    transition: box-shadow .2s ease-in-out, border-color .2s ease-in-out;
    margin-top: 16px;
}
.siemens-auth-form .form-control, .siemens-auth-form .form-select{
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    font-family: inherit;
    font-size: 16px;
    font-size: 1rem;
    height: 52px;
    height: 50px;
    line-height: 1.1;
    outline: none;
    padding: 0 16px;
    width: 100%;
    color: #FFFFFF;
    background-color: #00183B;
    transition: box-shadow .2s ease-in-out, border-color .2s ease-in-out;
    border-radius: 2px;
    border: 1px solid #B3B3BE;
}
.siemens-auth-form .form-select{
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23B3B3BE' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
}
.siemens-auth-form label{
    font-size: 0.875rem;
    line-height: 1.3;
    color: #ffffff;
}
.siemens-auth-form .form-label{
    position: absolute;
    left: 16px;
    color: #B3B3BE;
    background-color: #00183B;
    z-index: 1;
    padding: 1px 6px;
    top: 26px;
    transform: translateY(-50%);
    transition: transform .15s ease-in-out, top .15s ease-in-out, padding .15s ease-in-out;
    transform-origin: 0;
    max-width: 90%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    font-size: 0.875rem;
    line-height: 1.1;
}
.siemens-auth-form  .form-check-input{
    background: transparent;
    width: 1.2rem;
    height: 1.2rem;
    border-radius: 2px;
}
.siemens-auth-form  .form-check-input:checked {
    background-color: var(--color-medium-grey);
    border-color: var(--color-medium-grey);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%23fff' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}

.siemens-auth-form .field-wrapper:focus-within .form-label, .siemens-auth-form .field-wrapper.is-active .form-label{
    top: -2px;
    transform: scale(.88) translateX(-8px) translateY(-50%);
    overflow: visible;
    white-space: normal;
}
.siemens-auth-form .form-control:focus, .siemens-auth-form .form-select:focus{
    border-color: #B3B3BE;
    outline: 0;
    box-shadow: 0 0 0 1px #B3B3BE;
}
.siemens-auth-form .form-error .form-control:focus, .siemens-auth-form .error.form-control:focus, 
.siemens-auth-form .error.form-select:focus, .siemens-auth-form .form-error .form-select:focus{
    box-shadow: 0 0 0 1px var(--error-color);
}
.siemens-auth-form .error, .siemens-auth-form .text-danger{
    margin-top: 4px;
    margin-bottom: 0px;
    display: flex;
    font-size: 12px;
    line-height: 1.4;
    text-align: left;
    color: #d00e17;
    color: var(--error-color);
}
.siemens-auth-form .form-error .form-control, 
.siemens-auth-form .form-error .form-label,
.siemens-auth-form .form-control.error,
.siemens-auth-form .form-label.error{
    border-color: var(--error-color);
    color: var(--error-color);
}
.siemens-auth-form .btn{
    width: 100%;
    margin-top: 16px;
}
.login-box p{
    color: var(--color-white);
    font-size: 0.875rem;
}
.login-box .alternate-option{
    margin-bottom: 0px;
    margin-top: 16px;
}
.login-box a{
    color: var(--link-color-dark);
}
.login-box a:hover{
    color: var(--hover-link-color-dark);
}
.login-box a.btn, .login-box a.btn-secondary{
    color: #000000;
}
.siemens-auth-form{
    margin-top: 16px;
}
.password-verification-box-wrapper{
    margin-top: 16px;
}
.password-verification-box{
    position: relative;
    padding: 14px 16px;
    padding: 14px 8px;
    border: 1px solid #c2c8d0;
    border: 1px solid #B3B3BE;
    margin-top: 12px;
    margin-top: 16px;
    border-radius: 3px;
    border-radius: 2px;
    text-align: left;
    line-height: 20px;
}
.password-verification-box{
    font-size: 0.875rem;
}
.password-verification-box .password-condition{
    padding-bottom: 5px;
    padding-left: 20px;
    position: relative;
    color: var(--color-white);
    font-size: 0.875rem;
}
.password-verification-box .verification-list {
    list-style: none;
    margin-bottom: 0px;
    padding-left: 0px;
}
.password-verification-box p {
    font-size: 0.875rem;
    margin-bottom: 10px;
    color: var(--color-white);
}
.password-verification-box .verification-list .password-condition::before {
    position: absolute;
    content: "•";
    font-size: 1.1rem;
    color: var(--color-white);
    border-radius: 0;
    top: -5px;
    left: 0px;
}
.password-verification-box .verification-list .password-condition.success{
	color: var(--success-color);
}
.password-verification-box .verification-list .password-condition.success::before{
	content: "✓";
	color: var(--success-color);
	font-size: 1rem;
	top: 0px;
}
.password-field .form-control{
    padding-right: 40px;
}
.toggle-password{
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23ffffff"><path d="M480.18-353.85q60.97 0 103.47-42.68t42.5-103.65q0-60.97-42.68-103.47t-103.65-42.5q-60.97 0-103.47 42.68t-42.5 103.65q0 60.97 42.68 103.47t103.65 42.5ZM480-392q-45 0-76.5-31.5T372-500q0-45 31.5-76.5T480-608q45 0 76.5 31.5T588-500q0 45-31.5 76.5T480-392Zm.11 152q-129.96 0-236.88-70.73Q136.31-381.46 83.08-500q53.23-118.54 160.04-189.27T479.89-760q129.96 0 236.88 70.73Q823.69-618.54 876.92-500q-53.23 118.54-160.04 189.27T480.11-240ZM480-500Zm0 220q113 0 207.5-59.5T832-500q-50-101-144.5-160.5T480-720q-113 0-207.5 59.5T128-500q50 101 144.5 160.5T480-280Z"/></svg>');
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
    top: 26px;
}
.toggle-password.active{
    content: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" height="24px" viewBox="0 -960 960 960" width="24px" fill="%23FFFFFF"><path d="M617.85-454.15 586-486q9-52.38-29.69-90.69Q517.62-615 466-606l-31.85-31.85q10.08-4.15 21.04-6.23 10.96-2.07 24.81-2.07 61.15 0 103.65 42.5 42.5 42.5 42.5 103.65 0 13.85-2.07 25.58-2.08 11.73-6.23 20.27Zm126.46 122.92L714-358q38-29 67.5-63.5T832-500q-50-101-143.5-160.5T480-720q-29 0-57 4t-55 12l-31.23-31.23q34.85-13.15 70.92-18.96Q443.77-760 480-760q130.23 0 238.23 71.58 108 71.57 158.69 188.42-21.46 48.23-54.34 90.65-32.89 42.43-78.27 78.12Zm44.61 216.77L633.23-269.69q-26.54 11.77-65.88 20.73Q528-240 480-240q-131 0-238.23-71.58Q134.54-383.15 83.08-500q23.3-53 61.46-99.27 38.15-46.27 81.46-77.65l-111.54-112 28.31-28.31 674.46 674.46-28.31 28.31ZM254.31-648.62q-34.39 24.47-70.31 64.31-35.92 39.85-56 84.31 50 101 143.5 160.5T480-280q34.62 0 69.77-6.73t52.85-13.58L537.38-366q-9.46 5.31-26.38 8.73-16.92 3.42-31 3.42-61.15 0-103.65-42.5-42.5-42.5-42.5-103.65 0-13.31 3.42-29.85 3.42-16.53 8.73-27.53l-91.69-91.24ZM541-531Zm-112.54 56.54Z"/></svg>');
}
input:-webkit-autofill {
    background-color: #00183B !important;
    color: #FFFFFF !important;
    -webkit-box-shadow: 0 0 0px 1000px #00183B inset !important; 
    box-shadow: 0 0 0px 1000px #00183B inset !important; 
    -webkit-text-fill-color: #FFFFFF !important;
}
.siemens-auth-form  .edit-email-wrapper{
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 8px;
    margin-bottom: 16px;
    height: auto;
    min-height: 50px;
    border: 1px solid #686868;
    border: 1px solid #B3B3BE;
    border-radius: 2px;
    font-size: 16px;
    font-size: 1rem;
    transition: box-shadow .1s ease-in-out;
    padding: 0 16px;
    padding-right: 50px;
}
.siemens-auth-form  .edit-email-wrapper .ulp-authenticator-selector-text{
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    display: -webkit-box;
    overflow-y: hidden;
    word-break: break-word;
    font-size: 1rem;
    color: #FFFFFF;
}
.siemens-auth-form  .edit-email-wrapper .btn-edit-email{
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    background-color: transparent;
    border: none;
    cursor: pointer;
}
.siemens-auth-form  .edit-email-wrapper input{
    display: none;
}
.notification-box .notification-icon{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 150px;
    height: 150px;
    margin: 0 auto;
    margin-bottom: 16px;
}
.notification-box .notification-icon.circle-icon{
    border: 4px solid var(--success-color);
    border-radius: 100%;
    padding: 10px;
}
.notification-box.success .notification-icon.circle-icon{
    border-color: var(--success-color);
}
.notification-box.error .notification-icon.circle-icon{
    border-color: var(--error-color);
}
.notification-box .notification-icon img{
    width: 100%;
    height: 100%;
}
.notification-box .notification-icon svg{
    width: 100%;
    height: 100%;
}
.notification-box .notification-title{
    font-size: 1.8rem;
    font-family: var(--Main-font);
    font-weight: 400;
    color: var(--color-white);
    margin-bottom: 16px;
}
.notification-box .notification-message{
    font-size: 1.125rem;
    font-family: var(--Main-font);
    font-weight: 400;
    color: var(--color-white);
    margin-bottom: 0px;
}
.notification-box  .btn{
    margin-top: 16px;
}
.phone-field-wrapper{
    display: flex;
    align-items: flex-start;
    margin-top: 16px;
}
.phone-field-wrapper .phone-filed{
    flex: 0 0 75%;
    max-width: 75%;
    margin-top: 0px;
}
.phone-field-wrapper .phone-filed.country{
    flex: 0 0 25%;
    max-width: 25%;
    margin-top: 0px;
}
.login-box .disclimer{
    color: var(--color-white);
    font-size: 0.9rem;
    margin-top: 10px;
    margin-bottom: 16px;
    line-height: 1rem;
}
@media only screen and (min-width: 0px) and (max-width: 767px) {
    .phone-field-wrapper .phone-filed{
        flex: 0 0 70%;
        max-width: 70%;
    }
    .phone-field-wrapper .phone-filed.country{
        flex: 0 0 30%;
        max-width: 30%;
    }
}
