/* ==========================================================
   Rayhan Academy - Auth Pages
========================================================== */

.rayhan-auth-page{

    min-height:calc(100vh - 180px);
    display:flex;
    justify-content:center;
    align-items:flex-start;
    padding:35px 20px;
    direction:rtl;
    box-sizing:border-box;

}

.rayhan-auth-card{

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

    background:#ffffff;

    border-radius:22px;

    padding:30px 40px;

    border:1px solid #eceff5;

    box-shadow:0 12px 35px rgba(0,0,0,.08);

    box-sizing:border-box;

}

.rayhan-auth-title{

    margin:0;

    text-align:center;

    font-size:38px;

    font-weight:800;

    color:#0b2d63;

}

.rayhan-auth-subtitle{

    margin:10px 0 25px;

    text-align:center;

    font-size:18px;

    color:#666;

    line-height:1.7;

}

.rayhan-auth-card form{

    margin:0;

}

.rayhan-auth-card label{

    display:block;

    margin-bottom:8px;

    font-size:17px;

    font-weight:700;

    color:#0b2d63;

}

.rayhan-auth-card input[type="text"],
.rayhan-auth-card input[type="email"],
.rayhan-auth-card input[type="password"]{

    width:100%;

    height:50px;

    border:1px solid #d8dde6;

    border-radius:12px;

    padding:0 16px;

    font-size:17px;

    margin-bottom:18px;

    box-sizing:border-box;

}

.rayhan-auth-card input:focus{

    outline:none;

    border-color:#18c29c;

    box-shadow:0 0 0 3px rgba(24,194,156,.12);

}

.rayhan-auth-card .button,
.rayhan-auth-card input[type="submit"]{

    width:100%;

    height:52px;

    border:none;

    border-radius:12px;

    background:#18c29c;

    color:#fff;

    font-size:18px;

    font-weight:700;

    cursor:pointer;

}

.rayhan-auth-card .button:hover,
.rayhan-auth-card input[type="submit"]:hover{

    background:#15b18f;

}

.rayhan-forgot-password{

    margin-top:18px;

    text-align:center;

}

.rayhan-forgot-password a{

    color:#18c29c;

    text-decoration:none;

    font-weight:700;

}

.rayhan-forgot-password a:hover{

    text-decoration:underline;

}

@media(max-width:768px){

.rayhan-auth-page{

    padding:20px 15px;

}

.rayhan-auth-card{

    max-width:100%;

    padding:24px 20px;

    border-radius:18px;

}

.rayhan-auth-title{

    font-size:30px;

}

.rayhan-auth-subtitle{

    font-size:16px;

}

}