/* =====================================================
   PRAXIA LOGIN SCREEN
===================================================== */

#login-screen{

    position:fixed;
    inset:0;

    display:flex;

    overflow:hidden;

    background:linear-gradient(
        135deg,
        #01122f 0%,
        #011937 35%,
        #032040 70%,
        #041d3b 100%
    );

}

/* =====================================================
   LEFT PANEL
===================================================== */

.auth-left{

    position:relative;

    flex:1;

    display:flex;

    flex-direction:column;

    justify-content:center;

    align-items:flex-start;

    padding:80px 100px;

    color:#fff;

    z-index:2;

}


/* =====================================================
   BRAND
===================================================== */

.login-brand{

    position:relative;
    z-index:5;

    margin-bottom:60px;

}

.login-brand-logo{

    width:260px;

    height:auto;

    display:block;

}

.login-tagline{

    color:rgba(101, 113, 237, 0.92);

    font-size:19px;

    line-height:1.9;

}

/* =====================================================
   RIGHT PANEL
===================================================== */

.auth-right{

    position:relative;

    width:520px;

    margin-left:auto;

    display:flex;

    justify-content:center;

    align-items:center;

    padding:50px;

    z-index:5;

}



/* =====================================================
   LOGIN CARD
===================================================== */

.login-card{

    width:100%;
    max-width:430px;

    padding:48px;

    border-radius:22px;

    background:rgba(17, 63, 133, 0.45);

    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);

    border:1px solid rgba(52, 128, 243, 0.18);

    box-shadow:
        0 20px 45px rgba(0,0,0,.35);

}



/* =====================================================
   TYPOGRAPHY
===================================================== */

.auth-right h2{
    font-family:var(--head);
    font-size:28px;
    color:#3f3f7b;
    margin-bottom:10px;
}

.auth-right p{
    color:rgba(52, 53, 87, 0.75);
    font-size:15px;
    margin-bottom:34px;
}


/* =====================================================
   ERROR
===================================================== */

#l-error{

    display:none;

    background:#FFF5F5;

    border:1px solid #F3C5C5;

    border-radius:8px;

    padding:10px 12px;

    margin-bottom:18px;

    color:#C62828;

}

/* =====================================================
   SUPPORT CARD
===================================================== */

.login-footer-box{

    margin-top:28px;

    padding:18px;

    border-radius:14px;

    background:#0760cc;

    border:1px solid #136ed5;

}

/* =====================================================
   MOBILE
===================================================== */

@media(max-width:980px){

    #login-screen{

        justify-content:center;

        align-items:center;

        padding:30px;

    }

    .auth-left{

        display:none;

    }

    .auth-right{

        width:100%;

        padding:0;

    }

    .login-card{

        max-width:460px;

        width:100%;

    }

}