/****************************
 * Language Switcher > Base
*****************************/
.px-language-switcher ul {list-style:none; margin:0; padding:0;}
.px-language-switcher ul > li {padding:0;}

.px-language-switcher-item {
    display:inline-flex; align-items:center;
    text-transform:uppercase; white-space:nowrap;
    transition:var(--px-transition);
}
a.px-language-switcher-item:hover,
a.px-language-switcher-item:focus-visible {color:var(--px-color-primary);}
.px-language-switcher-item.active {font-weight:600;}

/****************************
 * Language Switcher > List (mobile)
*****************************/
.px-language-switcher.list ul {display:flex; align-items:center; gap:12px;}
.px-language-switcher.list .px-language-switcher-item {padding:6px 4px;}
.px-language-switcher.list .px-language-switcher-item:not(.active) {opacity:.5;}
.px-language-switcher.list a.px-language-switcher-item:not(.active):hover,
.px-language-switcher.list a.px-language-switcher-item:not(.active):focus-visible {opacity:1;}

/****************************
 * Language Switcher > Hover (desktop)
*****************************/
.px-language-switcher.hover {position:relative;}

.px-language-switcher-trigger {
    display:inline-flex; align-items:center; gap:5px;
    background:none; border:0; padding:0; cursor:pointer;
    font:inherit; color:inherit;
}
.px-language-switcher-trigger .icon-chevron-down {
    font-size:7px; transition:transform .3s ease;
}
.px-language-switcher.hover:hover .icon-chevron-down,
.px-language-switcher.hover:focus-within .icon-chevron-down {transform:rotate(180deg);}

.px-language-switcher-dropdown {
    position:absolute; top:100%; left:0; padding-top:8px;
    min-width:100%;
    opacity:0; visibility:hidden;
    transition:opacity .2s ease, visibility .2s ease;
}
.px-language-switcher.hover:hover .px-language-switcher-dropdown,
.px-language-switcher.hover:focus-within .px-language-switcher-dropdown {
    opacity:1; visibility:visible;
}
.px-language-switcher-dropdown ul {
    background:#fff; border-radius:3px;
    box-shadow:0 0 0 1px var(--px-color-gray, #ccc);
}
.px-language-switcher-dropdown ul li:not(:last-child) {border-bottom:1px solid var(--px-color-gray, #ccc);}
.px-language-switcher-dropdown .px-language-switcher-item {display:block; padding:6px 12px;}
.px-language-switcher-dropdown .px-language-switcher-item:hover,
.px-language-switcher-dropdown .px-language-switcher-item:focus-visible {background:var(--px-color-gray, #f2f2f2);}