/* ===========================
   ALUSIYES ACADEMY
   Forgot Password CSS
=========================== */

*{
    margin:0;
    padding:0;
    box-sizing:border-box;
    font-family:'Poppins',sans-serif;
}

body{
    min-height:100vh;
    display:flex;
    justify-content:center;
    align-items:center;
    background:linear-gradient(135deg,#0b2d73,#2f56b8);
    overflow:hidden;
}

.card{
    width:500px;
    padding:50px;
    background:rgba(255,255,255,.12);
    backdrop-filter:blur(20px);
    border-radius:25px;
    border:1px solid rgba(255,255,255,.15);
    box-shadow:0 20px 50px rgba(0,0,0,.35);
    color:white;
    animation:fadeIn .6s ease;
}

@keyframes fadeIn{

from{
opacity:0;
transform:translateY(30px);
}

to{
opacity:1;
transform:translateY(0);
}

}

h1{

font-size:42px;
margin-bottom:15px;
font-weight:700;

}

p{

font-size:17px;
line-height:28px;
margin-bottom:35px;
opacity:.9;

}

input{

width:100%;
height:58px;

border:none;
outline:none;

border-radius:14px;

padding:0 20px;

font-size:17px;

margin-bottom:25px;

background:white;

color:#222;

transition:.3s;

}

input:focus{

box-shadow:0 0 0 4px rgba(255,255,255,.25);

}

button{

width:100%;
height:58px;

border:none;

border-radius:14px;

font-size:18px;

font-weight:600;

cursor:pointer;

background:#ffffff;

color:#2145c8;

transition:.3s;

}

button:hover{

transform:translateY(-3px);

box-shadow:0 12px 30px rgba(0,0,0,.3);

}

a{

display:block;

text-align:center;

margin-top:28px;

font-size:17px;

color:white;

text-decoration:none;

transition:.3s;

}

a:hover{

color:#d7e5ff;

text-decoration:underline;

}

.flash{

margin-bottom:20px;

padding:15px;

border-radius:10px;

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

}

@media(max-width:600px){

.card{

width:92%;

padding:35px;

}

h1{

font-size:34px;

}

}