/* Style for the transparent square */
.vlt-login-button-container {
    position: relative;
    display: inline-block;
}

.vlt-login-button {
    background-color: transparent;
    border: 2px solid rgba(255, 255, 255, 0.5); /* Adjust the color and transparency as needed */
    color: #fff; /* Adjust the text color */
    padding: 10px 20px; /* Adjust the padding as needed */
    text-decoration: none;
    transition: background-color 0.3s, color 0.3s;
    display: inline-block;
}

.vlt-login-button:hover {
    background-color: rgba(255, 255, 255, 0.1); /* Adjust the hover background color and transparency */
    color: #fff; /* Adjust the hover text color */
}

/* Style for the language switcher hover effect */
.language-icon {
    position: relative;
    display: inline-block;
}

.language-flag {
    display: block;
    width: 30px;
    height: auto;
}

.language-icon::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 30px; /* Match the width of the flag */
    height: 15px; /* Match the height of the flag */
    background-color: rgba(255, 255, 255, 0.3); /* Red color with 50% transparency */
    opacity: 0;
    transition: opacity 0.3s;
    pointer-events: none;
}

.language-icon:hover::before {
    opacity: 1;
}