/* Language switcher: in a header menu it borrows the menu's type and colours
   through Elementor's own .elementor-item classes; standalone it inherits. */

.gv-lang-switch,
.gv-lang-switch__inner {
    display: inline-flex;
    align-items: center;
    gap: .45em;
}

li.gv-lang-switch { display: flex; align-items: center; }

.gv-lang-switch .gv-lang-switch__link {
    display: inline-flex;
    align-items: center;
    gap: .4em;
    padding-inline: 0 !important;
    color: inherit;
    text-decoration: none;
    cursor: pointer;
}

.gv-lang-switch--list .gv-lang-switch__link:not(.is-current) { opacity: .7; }
.gv-lang-switch .gv-lang-switch__link:hover,
.gv-lang-switch .gv-lang-switch__link:focus-visible { opacity: 1; }

.gv-lang-switch__sep { opacity: .5; }

/* Stronger than Elementor's `.elementor img` (auto height, max-width, no radius),
   which would otherwise shrink a lone flag to nothing. */
.gv-lang-switch img.gv-lang-switch__flag {
    display: block;
    flex: none;
    width: 1.5em;
    max-width: none;
    height: 1em;
    border-radius: 2px;
    box-shadow: 0 0 0 1px rgba(0, 0, 0, .12);
    object-fit: cover;
}

.gv-lang-switch img.gv-lang-switch__flag--round {
    width: 1.15em;
    height: 1.15em;
    border-radius: 50%;
}

/* Dropdown: a <details>, so it opens on tap and keyboard without a script. */
.gv-lang-switch__dropdown { position: relative; }
.gv-lang-switch__dropdown > summary { list-style: none; }
.gv-lang-switch__dropdown > summary::-webkit-details-marker { display: none; }
.gv-lang-switch__dropdown > summary::after {
    content: "";
    width: .4em;
    height: .4em;
    margin-left: .1em;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: translateY(-.15em) rotate(45deg);
    transition: transform .2s;
}
.gv-lang-switch__dropdown[open] > summary::after { transform: translateY(.1em) rotate(-135deg); }

.gv-lang-switch__menu {
    position: absolute;
    top: calc(100% + .5em);
    right: 0;
    z-index: 30;
    display: flex;
    flex-direction: column;
    gap: .55em;
    min-width: 100%;
    padding: .7em .9em;
    background: var(--gv-lang-menu-bg, var(--e-global-color-primary, #fff));
    box-shadow: 0 10px 24px rgba(0, 0, 0, .18);
    white-space: nowrap;
}

/* In the mobile menu the other languages simply follow underneath. */
.elementor-nav-menu--layout-vertical .gv-lang-switch__menu {
    position: static;
    padding: .5em 0 0;
    background: none;
    box-shadow: none;
}
