/* ==========================================================
   AUTH LAYOUT
========================================================== */

html,
body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    font-family: Figtree, sans-serif;
}

.auth-wrapper {
    position: relative;
    width: 100%;
    height: 100vh;
    overflow: hidden;
}

/* ==========================================================
   LOGIN CONTAINER
========================================================== */

.auth-overlay {
    position: relative;
    z-index: 20;

    width: 100%;
    height: 100vh;

    display: flex;
    align-items: center;
}

.auth-container {
    width: 100%;
    max-width: 1320px;

    margin: 0 auto;

    display: flex;
    align-items: center;

    padding-left: 70px;
    padding-right: 70px;
}

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

.auth-container > div {
    width: 100%;
    max-width: 470px;
}

.auth-container .rounded-\[32px\] {
    background: rgba(255,255,255,.95);

    border-radius: 32px;

    box-shadow:
        0 25px 60px rgba(0,0,0,.18);

    backdrop-filter: blur(12px);
}

/* ==========================================================
   INPUT
========================================================== */

.auth-container input[type=email],
.auth-container input[type=password]{
    height:56px;
}

/* ==========================================================
   BUTTON
========================================================== */

.auth-container button{
    height:56px;
}

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

@media (max-width:1024px){

    html,
    body{
        overflow:auto;
    }

    .auth-wrapper{
        height:auto;
        min-height:100vh;
    }

    .auth-overlay{
        height:auto;
        min-height:100vh;

        padding:30px 15px;
    }

    .auth-container{

        justify-content:center;

        padding-left:0;
        padding-right:0;
    }

    .auth-container>div{

        max-width:100%;
    }

}
