.auth-page-wrapper{
    min-height:100vh;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:120px 20px;


}





/* =========================================================
   GLASS CARD
========================================================= */

.auth-glass-card{

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

    padding:50px 40px;

    background:rgba(255,255,255,.58);

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

    border:1px solid rgba(0,0,0,.08);

    box-shadow:
        0 10px 40px rgba(0,0,0,.06),
        inset 0 1px rgba(255,255,255,.6);

    position:relative;

    overflow:hidden;
}





/* =========================================================
   TITLES
========================================================= */

.auth-title{

    font-size:38px;
    font-weight:700;

    color:#111;

    margin-bottom:10px;
}

.auth-subtitle{

    font-size:15px;
    color:#666;

    margin-bottom:40px;
}





/* =========================================================
   FORM
========================================================= */

.auth-group{
    margin-bottom:24px;
}

.auth-label{

    display:block;

    margin-bottom:10px;

    font-size:14px;
    font-weight:600;

    color:#222;
}





/* =========================================================
   INPUTS
========================================================= */

.auth-input{
    text-align: left !important;

    width:100%;
    height:58px;

    padding:0 18px;

    border:1px solid rgba(0,0,0,.14);

    border-radius:0;

    background:rgba(255,255,255,.45);

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

    color:#111;
    font-size:15px;

    transition:.3s ease;
}

.auth-input:focus{

    outline:none;

    border-color:#111;

    background:rgba(255,255,255,.7);

    box-shadow:
        0 0 0 4px rgba(0,0,0,.04);
}

.auth-input::placeholder{
    color:#888;
}





/* =========================================================
   ERRORS
========================================================= */

.auth-error{

    margin-top:8px;

    font-size:13px;

    color:#d62828;
}





/* =========================================================
   CHECKBOX
========================================================= */

.auth-checkbox{

    display:flex;
    align-items:center;
    gap:10px;

    margin-top:8px;
    margin-bottom:30px;

    font-size:14px;

    color:#333;

    cursor:pointer;
}

.auth-checkbox input{

    width:18px;
    height:18px;

    accent-color:#111;
}





/* =========================================================
   FOOTER
========================================================= */

.auth-footer{

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;

    margin-top:10px;
}





/* =========================================================
   LINK
========================================================= */

.auth-link{

    font-size:14px;

    color:#444;

    transition:.3s ease;
}

.auth-link:hover{
    color:#000;
}





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

.auth-btn{

    height:56px;

    padding:0 34px;

    border:none;
    border-radius:0;

    background:#111;

    color:#fff;

    font-size:15px;
    font-weight:600;

    cursor:pointer;

    transition:.35s ease;
}

.auth-btn:hover{

    background:#000;

    transform:translateY(-2px);
}





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

@media(max-width:768px){

    .auth-page-wrapper{
        padding:100px 16px;
    }

    .auth-glass-card{
        padding:40px 24px;
    }

    .auth-title{
        font-size:30px;
    }

    .auth-footer{
        flex-direction:column;
        align-items:stretch;
    }

    .auth-btn{
        width:100%;
    }

}