body {
/*            background-image: url("<?=base_url().'assets/img/emoji.png'?>"); */
            background-size: cover;
            background-position: center; 
            display: flex;
            justify-content: center;
            align-items: center;
            height: 100vh;
            margin: 0;
        }

        .login-container {
            background-color: rgba(255, 255, 255, 0.8);
            padding: 20px;
            border-radius: 10px;
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
            animation: fadeIn 1s ease-in-out;
        }

        .login-container img {
            width: 120px;
            margin-bottom: 20px;
        }

        @keyframes fadeIn {
            from { opacity: 0; }
            to { opacity: 1; }
        }

        /* Button color based on the brick image */
        .brick-button {
            background-color: #9c4e27; /* Color based on the brick image */
            border: none;
            color: white;
            padding: 10px 20px;
            border-radius: 5px;
            transition: background-color 0.3s ease;
        }

        .brick-button:hover {
            background-color: #A93619; /* Darker shade for hover effect */
        }

        /*.brick-button:focus {
            background-color: #9c4e27; 
            border: none;
            color: white;
            padding: 10px 20px;
            border-radius: 5px;
            transition: background-color 0.3s ease
        }*/

        .change-password {
            color: #000000; /* Matching color for the "Change Password" link */
            text-decoration: none;
        }
        
        .change-password:hover {
            color: #A93619; /* Darker color on hover */
        }



/*   for password update */

/* Default styles for input */
input {
    border: 1px solid #ccc;
    padding: 8px;
    width: 100%;
}

/* Red border for non-matching passwords */
input.error {
    border-color: red;
}

/* Green border for matching passwords */
input.success {
    border-color: green;
}

/* Disabled button styling */
button:disabled {
    background-color: grey;
    cursor: not-allowed;
}