/* Language Switcher Styles for Auth Pages */

/* Auth page specific adjustments */
.auth-language-switcher {
    position: fixed;
    top: 1rem;
    right: 1rem;
    z-index: 50;
}

/* Mobile responsive positioning */
@media (max-width: 640px) {
    .auth-language-switcher {
        top: 0.5rem;
        right: 0.5rem;
    }
    
    .auth-language-switcher .language-toggle {
        padding: 6px 10px;
        font-size: 13px;
    }
    
    .auth-language-switcher .language-toggle svg {
        width: 16px;
        height: 16px;
    }
}

/* Dark mode support for auth pages */
@media (prefers-color-scheme: dark) {
    .auth-language-switcher .language-toggle {
        background: rgba(31, 41, 55, 0.8);
        border-color: rgba(75, 85, 99, 0.5);
        color: rgba(243, 244, 246, 1);
    }
    
    .auth-language-switcher .language-toggle:hover {
        background: rgba(31, 41, 55, 1);
        border-color: rgba(14, 166, 101, 0.5);
    }
    
    .auth-language-switcher .language-menu {
        background: rgb(31, 41, 55);
        border-color: rgb(55, 65, 81);
    }
    
    .auth-language-switcher .language-item {
        color: rgb(243, 244, 246);
    }
    
    .auth-language-switcher .language-item:hover {
        background: rgba(55, 65, 81, 0.5);
    }
    
    .auth-language-switcher .language-item.active {
        background: rgba(55, 65, 81, 0.8);
    }
}

/* Ensure proper contrast on auth pages */
.auth-language-switcher .language-toggle {
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

/* Animation for smooth appearance */
.auth-language-switcher {
    animation: fadeInDown 0.3s ease-out;
}

@keyframes fadeInDown {
    from {
        opacity: 0;
        transform: translateY(-10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}