/* Translation Flags Language Switcher Styles */
/* Alle CSS-Styles für die Translation-Flags (Language-Switcher) müssen in dieser Datei definiert sein */
/* Siehe 011-ui-i18-flags-language-switcher.mdc für alle detaillierten Regeln */

.base-language-switcher {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-base);
    display: flex;
    flex-direction: row;
    gap: 2px;
    align-items: center;
    z-index: 10;
}

.base-language-flag-link {
    font-family: var(--font-family-primary);
    font-size: var(--font-size-base);
    display: flex;
    align-items: center;
    text-decoration: none;
    transition: opacity 0.2s ease;
}

.base-language-flag-link:hover {
    opacity: 0.8;
}

.base-language-flag-link.base-active {
    opacity: 1;
}

.base-flag-icon {
    width: 20px;
    height: 15px;
    border: none;
    display: block;
}

/* Desktop: language-switcher-mobile ausblenden (nur im Hamburger-Menü auf Mobile/Tablet sichtbar) */
@media (min-width: 1025px) {
    .base-language-switcher-mobile {
        display: none;
    }
}

/* Mobile/Tablet/iPad (Hamburger-Menü angezeigt): Flaggen IMMER aus dem Header entfernen, nur im Hamburger-Menü (eingeklappt oder ausgeklappt) */
@media (max-width: 1024px) {
    .base-header-actions .base-language-switcher {
        display: none;
    }
}