.telegram{
    max-width: 76px;
    margin: 112px auto;
    border: none;
    position: fixed;
    right: 20px;
    bottom: -100px;
    z-index: 564;
}

/* Login Box */
        .login-box {
            width: 400px;
            background: rgba(255, 255, 255, 0.9);
            padding: 30px;
            border-radius: 12px;
            box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
        }

        .card {
            border-radius: 10px;
            background-color: #2c18d6;
            padding: 20px;
        }

        h4 {
            color: #3a0938;
            font-family: Cambria, serif;
            font-weight: bold;
            text-align: center;
        }

        /* Form Input Styling */
        .form-control {
            border-radius: 8px;
            padding: 12px;
            border: 1px solid #ccc;
            transition: 0.3s ease-in-out;
        }

        .form-control:focus {
            border-color: #3a0938;
            box-shadow: 0 0 8px rgba(58, 9, 56, 0.4);
        }

        /* Input Group */
        .input-group-text {
            background: #3a0938;
            color: #fff;
            border-radius: 8px 0 0 8px;
        }

        /* Buttons */
        .btn-custom {
            background: #0e0b50;
            color: #fff;
            padding: 12px;
            font-weight: bold;
            border-radius: 8px;
            transition: 0.3s;
        }

        .btn-custom:hover {
            background: #1a1a9f;
        }

        /* Sign-up and Forgot Password Links */
        .extra-links a {
            color: #ffcc00;
            font-weight: bold;
            text-decoration: none;
        }

        .extra-links a:hover {
            text-decoration: underline;
        }