/**
 * Base WPML "legacy dropdown" collapse/reveal behaviour for the Polylang
 * fallback markup built by droix_render_wpml_language_selector()
 * (functions.php). WPML's own plugin stylesheet used to provide this —
 * position/visibility of .wpml-ls-sub-menu, list resets — and the theme's
 * cosmetic .wpml-ls-* rules (style.css ~838-865, ~3165-3243, ~3896-3914)
 * were built to sit on top of it. That base stylesheet is not loaded when
 * WPML is replaced by Polylang, so this file restores just enough of it.
 * Enqueued only when the Polylang fallback markup is actually rendered
 * (see shoptimizer_child_enqueue_scripts()).
 *
 * @package shoptimizer-child-theme-dx-eu
 */

.wpml-ls-legacy-dropdown {
    position: relative;
}

.wpml-ls-legacy-dropdown ul,
.wpml-ls-legacy-dropdown li {
    list-style: none;
    margin: 0;
    padding: 0;
}

.wpml-ls-legacy-dropdown > ul > li.wpml-ls-current-language > a.wpml-ls-item-toggle {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
    cursor: pointer;
}

.wpml-ls-legacy-dropdown .wpml-ls-sub-menu a.wpml-ls-link {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 14px;
}

.wpml-ls-legacy-dropdown img.wpml-ls-flag {
    width: 20px;
    height: auto;
    vertical-align: middle;
}

/* Hidden by default; revealed on hover, keyboard focus anywhere inside the
   dropdown (:focus-within, so Tabbing from the toggle into the sub-menu
   links keeps it open), or the .wpml-ls-open class the touch/tap JS toggle
   applies. */
.wpml-ls-legacy-dropdown .wpml-ls-sub-menu {
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    position: absolute;
    top: 100%;
    right: 0;
    left: auto;
    z-index: 60;
    min-width: 200px;
    max-height: 320px;
    overflow-y: auto;
    transition: opacity .15s ease;
}

.wpml-ls-legacy-dropdown:hover .wpml-ls-sub-menu,
.wpml-ls-legacy-dropdown:focus-within .wpml-ls-sub-menu,
.wpml-ls-legacy-dropdown.wpml-ls-open .wpml-ls-sub-menu {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}

/* The same render call is echoed a second time inside .col-full-nav
   (header.php) so it is reachable from the off-canvas mobile menu. Below
   the theme's hamburger breakpoint (style.css ~4142, max-width: 992px)
   .col-full-nav is a fixed off-canvas panel, so that second copy is not
   visible until the menu is opened — fine as-is. At and above the
   desktop breakpoint .col-full-nav is a normal inline row, so without
   this rule the second copy renders in the page flow next to the topbar
   copy. */
@media screen and (min-width: 993px) {
    .col-full-nav > .wpml-ls-legacy-dropdown {
        display: none;
    }
}