/*
|--------------------------------------------------------------------------
| BAKSO GEMOY
|--------------------------------------------------------------------------
| Custom Theme
| Author : Pandu + ChatGPT 😎
|--------------------------------------------------------------------------
*/

:root{

    --bg-primary:#b71c1c;
    --bg-secondary:#ff9800;

    --text-dark:#343a40;

    --white:#ffffff;

    --border-radius:18px;

}
body{

    background:#f5f5f5;

}
.login-left{

    background:
        linear-gradient(
            rgba(0,0,0,.55),
            rgba(0,0,0,.55)
        ),
        url("../images/bakso.png");

    background-size:cover;

    background-position:center;

}
.login-logo{

    width:130px;

    transition:.3s;

}

.login-logo:hover{

    transform:scale(1.05);

}
.login-title{

    font-size:42px;

    font-weight:700;

    letter-spacing:2px;

}
.login-subtitle{

    opacity:.9;

    font-size:18px;

}
.authincation-content{

    border-radius:25px;

    box-shadow:

        0 20px 50px rgba(0,0,0,.15);

    border:none;

}
.form-control{

    border-radius:12px;

    height:52px;

}
.form-control:focus{

    border-color:var(--bg-primary);

    box-shadow:

        0 0 0 .2rem rgba(183,28,28,.15);

}
.btn-login{

    height:52px;

    border-radius:12px;

    font-size:17px;

    font-weight:600;

    transition:.3s;

}
.btn-login:hover{

    transform:translateY(-2px);

}

.alert{

    border-radius:12px;

}

.auth-form{

    animation:fadeLogin .7s;

}
@keyframes fadeLogin{

    from{

        opacity:0;

        transform:translateY(30px);

    }

    to{

        opacity:1;

        transform:none;

    }

}
@media(max-width:992px){

.login-left{

display:none;

}

.authincation-content{

box-shadow:none;

}

}