/* ============================================
   Custom Language Switcher
   ============================================ */

/* Container / Wrapper */
ul.menu-right-content li.custom-lang-switch {
    position: relative;
    display: flex !important;
    align-items: center;
    cursor: pointer;
    padding: 0 !important;
    margin: 0 !important;
    height: 100%;
}

/* Toggle button (icon + text + arrow) */
ul.menu-right-content li.custom-lang-switch .lang-toggle {
    display: flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    padding: 0 10px;
    color: #ffffff;
    font-size: 14px;
    font-weight: 600;
    letter-spacing: 0.5px;
    white-space: nowrap;
    line-height: 1;
    transition: color 300ms ease;
    user-select: none;
}

/* Globe icon color */
ul.menu-right-content li.custom-lang-switch .lang-toggle i.flaticon-global {
    font-size: 18px;
    color: var(--theme-color, #00a1d1);
    line-height: 1;
}

/* Chevron icon */
ul.menu-right-content li.custom-lang-switch .lang-toggle i.fa-angle-down {
    font-size: 11px;
    transition: transform 300ms ease;
    color: rgba(255, 255, 255, 0.7);
}

/* Current language badge */
ul.menu-right-content li.custom-lang-switch .lang-toggle .current-lang {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--theme-color, #00a1d1);
    color: #ffffff !important;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.5px;
    padding: 3px 7px;
    border-radius: 4px;
    min-width: 26px;
    text-transform: uppercase;
}

/* When sticky header (white background) */
.sticky-header ul.menu-right-content li.custom-lang-switch .lang-toggle {
    color: #333333;
}

.sticky-header ul.menu-right-content li.custom-lang-switch .lang-toggle i.fa-angle-down {
    color: rgba(51, 51, 51, 0.6);
}

/* Dropdown panel */
ul.menu-right-content li.custom-lang-switch .lang-dropdown {
    position: absolute;
    top: calc(100% + 8px);
    right: 0;
    min-width: 145px;
    background: #ffffff;
    border-radius: 8px;
    box-shadow: 0 8px 30px rgba(0, 0, 0, 0.12);
    border: 1px solid rgba(0, 0, 0, 0.06);
    padding: 6px 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(8px);
    transition: opacity 250ms ease, transform 250ms ease, visibility 250ms ease;
    z-index: 9999;
    list-style: none !important;
    margin: 0 !important;
}

/* Show dropdown on click (.open toggled by JS) */
ul.menu-right-content li.custom-lang-switch.open .lang-dropdown {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

/* Rotate arrow when open */
ul.menu-right-content li.custom-lang-switch.open .lang-toggle i.fa-angle-down {
    transform: rotate(180deg);
}

/* Dropdown items */
ul.menu-right-content li.custom-lang-switch .lang-dropdown li {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
    background: none !important;
    list-style: none !important;
}

/* Dropdown links */
ul.menu-right-content li.custom-lang-switch .lang-dropdown li a {
    display: flex !important;
    align-items: center;
    gap: 8px;
    padding: 9px 16px !important;
    color: #555555 !important;
    font-size: 13px !important;
    font-weight: 500 !important;
    text-decoration: none !important;
    transition: background 200ms ease, color 200ms ease;
    white-space: nowrap;
    border-radius: 0;
}

/* Dropdown link hover + active */
ul.menu-right-content li.custom-lang-switch .lang-dropdown li a:hover,
ul.menu-right-content li.custom-lang-switch .lang-dropdown li a.active {
    background: rgba(0, 161, 209, 0.08) !important;
    color: var(--theme-color, #00a1d1) !important;
}