/****************************
 * Language Switcher
*****************************/
.vii-language-switcher-item {
    color:var(--vii-header-color);font-size:var(--vii-cta-size);
    transition:var(--vii-transition);
}
img.vii-language-switcher-item__flag {width:22px; height:auto; background-color:var(--vii-color-gray-light);}
a.vii-language-switcher-item:hover,
a.vii-language-switcher-item:focus {color:var(--vii-header-color-hover);}


/****************************
 * Language Switcher > Hover
*****************************/
/* hover */
.vii-language-switcher.hover {position:relative;}
.vii-language-switcher.hover:not(:hover) .vii-language-switcher-dropdown {opacity:0; visibility:hidden;}

.vii-language-switcher.hover > .vii-language-switcher-item:after {
    content:"\e931"; font-family:var(--vii-font-icomoon);
    font-size:.6em;
    margin-left:5px; display:inline-block;
    transition:transform .3s ease;
}
.vii-language-switcher.hover:hover > .vii-language-switcher-item:after {transform:rotate(180deg);}

/* dropdown */
.vii-language-switcher-dropdown {
    position:absolute; top:100%; left:-5px; padding-top:5px;
    transition:all .3s ease; min-width:100%;
}
.vii-language-switcher-dropdown ul {
    background:var(--vii-color-white);
    border-radius:4px;box-shadow:0 -3px 15px 5px rgb(0 0 0 / 10%);
}
.vii-language-switcher-dropdown ul li:not(:last-child) {border-bottom:1px solid var(--vii-color-gray-light);}
.vii-language-switcher-dropdown ul .vii-language-switcher-item {padding:5px;}

/* layout */
.vii-language-switcher.hover .vii-language-switcher-item.has-flag + .vii-language-switcher-dropdown {min-width:35px;}
.vii-language-switcher.hover .vii-language-switcher-dropdown ul > li:first-child a {border-radius:3px 3px 0 0;}
.vii-language-switcher.hover .vii-language-switcher-dropdown ul > li:last-child a {border-radius:0 0 3px 3px;}
.vii-language-switcher.hover .vii-language-switcher-dropdown ul > li:only-child a {border-radius:3px;}
.vii-language-switcher.hover .vii-language-switcher-dropdown ul .vii-language-switcher-item {color:var(--vii-color-dark-gray)}
.vii-language-switcher.hover .vii-language-switcher-dropdown ul .vii-language-switcher-item.text-code {
    padding:12px 16px;
}
.vii-language-switcher.hover .vii-language-switcher-dropdown ul .vii-language-switcher-item:hover {
    color:var(--vii-color-primary);
}
.vii-language-switcher.hover .vii-language-switcher-dropdown ul .vii-language-switcher-item.has-flag:hover {
    background:var(--vii-color-gray);
}

/****************************
 * Responsive Language Switcher
*****************************/
@media screen and (min-width:1181px) {
    /* language switcher has cta-buttons before it */
    .vii-header-cta-buttons + .vii-language-switcher {padding-left:12px;}
    .vii-header-cta-buttons + .vii-language-switcher::before {
        content:"";
        display:block;height:12px;width:1px;
        position:absolute;left:0;top:50%;
        transform:translateY(-50%);
        background:var(--vii-header-color);
    }
    .vii-header-cta-buttons + .vii-language-switcher .vii-language-switcher-dropdown {left:7px;}
}
@media screen and (max-width:1180px) {
    .vii-has-sep > *:not(:last-child) {
        position:relative;
        padding-right:16px
    }
    .vii-has-sep > *:not(:last-child):before {
        content:"";
        display:block;
        height:12px;width:1px;
        position:absolute;right:0;top:50%;
        transform:translateY(-50%);background:var(--vii-color-gray-light);
    }
    .vii-has-sep--slash {
        gap:8px;
    }
    .vii-has-sep--slash > *:not(:last-child) {padding-right:8px}
    .vii-has-sep--slash > *:not(:last-child):before {
        width:2px;
        transform:translate(1px, -50%) rotate(15deg);border-radius:2px;
    }
    .vii-language-switcher.list .vii-language-switcher-item {padding:0 4px;}
}