body {
    min-height: 100vh;
    background-color: #3D4E4D !important;
}

.login-box {
    width: 100%;
    max-width: 500px;
    margin: 5% auto;
}

.card, .card-body {
    width: 100%;
    max-width: 500px;
    box-shadow: #3D4E4D 0px 0px 4px;
    border-radius: 30px;
    padding: 30px;
    background: #fff;
}

/* زر تسجيل الدخول */
.btn {
    margin-top: 30px;
    background-color: #3D4E4D !important;
    color: white;
    border-radius: 30px;
    transition: all 0.3s ease-in-out;
}

.btn:hover {
    background-color: #fff !important;
    color: #3D4E4D;
    box-shadow: #3D4E4D 0px 0px 8px;
}

/* ستايل الحقول */
input {
    color: #3D4E4D !important;
}

/* أيقونات الإدخال */
.login-icon {
    color: #3D4E4D;
}

/* Responsive adjustments */
@media (max-width: 576px) {
    .login-box {
        padding: 15px;
        margin: 10% auto;
    }

    .card, .card-body {
        padding: 20px;
        border-radius: 20px;
    }

    .btn {
        margin-top: 20px;
        font-size: 16px;
    }
}