/* ==========================================================
   IOTUPS Warranty System
   Login CSS
========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@300;400;500;600;700;800&display=swap');

:root{

    --primary:#0d6efd;
    --primary-dark:#0a58ca;

    --success:#198754;
    --danger:#dc3545;

    --bg:#f5f7fb;

    --card:#ffffff;

    --text:#212529;

    --muted:#6c757d;

    --border:#dee2e6;

    --radius:18px;

    --shadow:0 20px 45px rgba(0,0,0,.08);

}

*{

    margin:0;

    padding:0;

    box-sizing:border-box;

}

body{

    font-family:'Vazirmatn',sans-serif;

    direction:rtl;

    background:linear-gradient(135deg,#edf4ff,#f7f9fc);

    min-height:100vh;

    color:var(--text);

}

.login-page{

    min-height:100vh;

}

.login-card{

    border:none;

    border-radius:var(--radius);

    overflow:hidden;

    background:var(--card);

    box-shadow:var(--shadow);

    transition:.3s;

}

.login-card:hover{

    transform:translateY(-4px);

}

.login-card .card-body{

    padding:45px;

}

.login-card img{

    max-height:80px;

}

.login-card h3{

    font-weight:700;

    margin-top:10px;

}

.login-card p{

    color:var(--muted);

}

.form-label{

    font-weight:600;

    margin-bottom:8px;

}

.form-control{

    height:52px;

    border-radius:12px;

    border:1px solid var(--border);

    transition:.25s;

}

.form-control:focus{

    border-color:var(--primary);

    box-shadow:0 0 0 .2rem rgba(13,110,253,.15);

}

.input-group .btn{

    border-radius:0 12px 12px 0;

}

.btn-primary{

    height:54px;

    border-radius:12px;

    font-weight:700;

}

.btn-primary:hover{

    background:var(--primary-dark);

}

.alert{

    border-radius:12px;

}

.form-check-label{

    cursor:pointer;

}

a{

    color:var(--primary);

    text-decoration:none;

}

a:hover{

    text-decoration:underline;

}

.small{

    color:var(--muted);

}

/* Footer */

.version{

    margin-top:20px;

    text-align:center;

    color:#888;

}

/* Mobile */

@media(max-width:768px){

.login-card .card-body{

padding:30px;

}

.login-card{

margin:20px;

}

}

/* Animation */

.login-card{

animation:fadeIn .5s ease;

}

@keyframes fadeIn{

from{

opacity:0;

transform:translateY(30px);

}

to{

opacity:1;

transform:none;

}

}