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

.auth-page{

    padding:80px 20px;

    background:#FFF8FB;

}

.auth-box{

    max-width:520px;

    margin:auto;

    background:#FFFFFF;

    border-radius:24px;

    padding:40px;

    box-shadow:0 15px 40px rgba(236,72,153,.12);

    border:1px solid #F3D3E2;

}

.auth-box h1{

    text-align:center;

    font-size:34px;

    color:#222;

    margin-bottom:10px;

}

.auth-box p{

    text-align:center;

    color:#777;

    margin-bottom:30px;

}

.auth-box label{

    display:block;

    margin-bottom:8px;

    margin-top:18px;

    font-weight:600;

    color:#444;

}

.auth-box label span{

    color:#999;

    font-size:13px;

    font-weight:400;

}

.auth-box input{

    width:100%;

    height:48px;

    border:1px solid #F3D3E2;

    border-radius:12px;

    padding:0 15px;

    font-size:15px;

    outline:none;

    transition:.3s;

}

.auth-box input:focus{

    border-color:#EC4899;

    box-shadow:0 0 0 3px rgba(236,72,153,.12);

}

.auth-box button{

    width:100%;

    height:50px;

    margin-top:30px;

    border:none;

    border-radius:12px;

    background:#EC4899;

    color:#FFFFFF;

    font-size:16px;

    font-weight:700;

    cursor:pointer;

    transition:.3s;

}

.auth-box button:hover{

    background:#DB2777;

}

.auth-link{

    text-align:center;

    margin-top:25px;

    color:#666;

}

.auth-link a{

    color:#EC4899;

    font-weight:700;

}

.auth-alert{

    background:#FEE2E2;

    color:#B91C1C;

    padding:12px 15px;

    border-radius:10px;

    margin-bottom:20px;

}

/* ==========================
   LINK LOGIN / DAFTAR
========================== */

.auth-box p{
    margin-top:20px;
    text-align:center;
    color:#666;
}

.auth-box p a{
    color:#EC4899;
    font-weight:700;
    text-decoration:none;
    transition:.3s;
}

.auth-box p a:hover{
    color:#DB2777;
    text-decoration:underline;
}

.auth-box p{
    position:relative;
    z-index:10;
}

.auth-box p a{
    color:#EC4899;
    font-weight:700;
    text-decoration:none;
    position:relative;
    z-index:20;
    cursor:pointer;
}

.auth-success{

    background:#DCFCE7;

    color:#15803D;

    padding:15px;

    border-radius:10px;

    margin-bottom:20px;

}

.auth-description{
    margin:0 0 22px;
    color:#666666;
    font-size:14px;
    line-height:1.7;
    text-align:center;
}

.auth-success{
    margin-bottom:18px;
    padding:12px 15px;

    background:#ECFDF5;
    border:1px solid #A7F3D0;
    border-radius:10px;

    color:#047857;
    font-size:14px;
    line-height:1.5;
}

.forgot-password-link{
    margin:12px 0 0;
    text-align:right;
}

.forgot-password-link a{
    color:#EC4899;
    font-size:13px;
    text-decoration:none;
}

.forgot-password-link a:hover{
    color:#DB2777;
    text-decoration:underline;
}

.otp-input{
    text-align:center;
    font-size:24px;
    font-weight:700;
    letter-spacing:10px;
}

.otp-input::placeholder{
    font-size:13px;
    font-weight:400;
    letter-spacing:0;
}