/* Przelacznik jezyka WPML.
   Pozycje doklejane do <ul> menu glownego przez filtr wp_nav_menu_items
   w functions.php - dzieki temu siedza w tym samym wierszu co reszta menu
   i nie zawijaja sie do drugiego rzedu.

   Osobny plik, zeby nie ruszac skompilowanego style.css (zrodla sa w sass/).
   Kolor dziedziczony z menu (currentColor), zeby dzialalo na jasnym
   i ciemnym wariancie naglowka. */

nav .lang-item {
    font-size: 13px;
    letter-spacing: 0.06em;
}

/* Odstep od ostatniej zwyklej pozycji menu i kreska oddzielajaca jezyki */
nav .lang-item.lang-item:first-of-type {
    margin-left: 6px;
}

nav .lang-item + .lang-item {
    position: relative;
}

nav .lang-item + .lang-item::before {
    content: "";
    position: absolute;
    left: -7px;
    top: 50%;
    width: 1px;
    height: 11px;
    margin-top: -5px;
    background: currentColor;
    opacity: 0.3;
}

nav .lang-item > a {
    text-transform: uppercase;
    opacity: 0.5;
    transition: opacity 0.2s ease;
}

nav .lang-item > a:hover,
nav .lang-item > a:focus-visible {
    opacity: 1;
}

nav .lang-item--active > a {
    opacity: 1;
    font-weight: 700;
}

/* W menu mobilnym pozycje ukladaja sie w kolumnie - wtedy kreska miedzy
   jezykami nie ma sensu, a same przelaczniki moga byc mniejsze. */
@media (max-width: 991px) {
    nav .lang-item + .lang-item::before {
        display: none;
    }

    nav .lang-item.lang-item:first-of-type {
        margin-left: 0;
    }
}