/*======================================
    MY ACCOUNT
======================================*/

.marangy-account-page{
    background:#f5f7fa;
    padding:80px 20px;
}

.marangy-account-container{
    max-width:1300px;
    width:100%;
    margin:0 auto;
}

#customer_login{
    display:flex !important;
    gap:40px;
    align-items:flex-start;
    justify-content:space-between;
    width:100%;
}

#customer_login .u-column1,
#customer_login .u-column2{

    width:50% !important;
    max-width:none !important;
    flex:1 !important;

    background:#fff;
    padding:40px;
    border-radius:15px;
    box-shadow:0 10px 30px rgba(0,0,0,.08);

}

#customer_login form{

    width:100% !important;

}

#customer_login h2{

    text-align:center;
    font-size:32px;
    margin-bottom:30px;

}

#customer_login input{

    width:100%;
    box-sizing:border-box;
    height:50px;
    margin-bottom:20px;

}

#customer_login button{

    width:100%;
    height:55px;

}

@media(max-width:768px){

    #customer_login{

        flex-direction:column;

    }

    #customer_login .u-column1,
    #customer_login .u-column2{

        width:100% !important;

    }

}
/*======================================
    PASSWORD FIELD
======================================*/

.password-wrapper{
    position:relative;
    width:100%;
}

.password-wrapper input{
    width:100%;
    height:52px;
    padding:0 50px 0 15px !important;
    box-sizing:border-box;
}

.password-wrapper .toggle-password{

    position:absolute;

    top:50%;

    right:15px;

    transform:translateY(-50%);

    width:24px;
    height:24px;

    display:flex;
    align-items:center;
    justify-content:center;

    cursor:pointer;

    color:#777;

    z-index:100;

    line-height:1;
}

.password-wrapper .toggle-password i{

    font-size:18px;
    pointer-events:none;

}

.password-wrapper .toggle-password:hover{

    color:#c89b2c;

}
/*======================================
    ACCOUNT BUTTONS
======================================*/

.woocommerce-form-login__submit,
.woocommerce-form-register__submit{

    width:100% !important;

    height:55px;

    background:#c89b2c !important;

    color:#fff !important;

    border:none !important;

    border-radius:8px;

    font-size:16px;

    font-weight:600;

    cursor:pointer;

    transition:.35s ease;

    letter-spacing:.5px;

    text-transform:uppercase;

}

.woocommerce-form-login__submit:hover,
.woocommerce-form-register__submit:hover{

    background:#a67c00 !important;

    transform:translateY(-2px);

    box-shadow:0 10px 25px rgba(200,155,44,.35);

}
/*======================================
    WOOCOMMERCE PASSWORD FIELD
======================================*/

.password-input{
    position:relative !important;
    display:block !important;
    width:100% !important;
}

.password-input input{
    width:100% !important;
    height:52px;
    padding:0 45px 0 15px !important;
    box-sizing:border-box;
}

.password-input .show-password-input{

    position:absolute !important;

    top:50% !important;
    right:15px !important;
    left:auto !important;

    transform:translateY(-50%) !important;

    margin:0 !important;
    padding:0 !important;

    width:20px !important;
    height:20px !important;

    display:flex !important;
    justify-content:center;
    align-items:center;

    border:none !important;
    background:transparent !important;
    box-shadow:none !important;

    cursor:pointer;

    z-index:999;

}

.password-input .show-password-input::after{

    margin:0 !important;

}