/* ============================================================
   Hawasly — Mobile Language Switcher v1.2
   mkelevator.com — Polylang + Elementor Pro + Hello Biz
   ============================================================ */

.hawasly-lang-wrap {
    display: none;
}

@media (max-width: 1024px) {

    /* ── الـ wrapper ── */
    .hawasly-lang-wrap {
        display:         flex;
        align-items:     center;
        position:        relative;
        z-index:         9999;
    }

    /* ── تموضع الزر بجانب الهامبرغر مباشرة ── */
    /* LTR: يظهر على يسار الهامبرغر */
    .elementor-nav-menu--toggle .hawasly-lang-wrap,
    .elementor-menu-toggle .hawasly-lang-wrap,
    .e-n-menu-toggle .hawasly-lang-wrap {
        margin-right: 8px;
    }

    /* RTL: يظهر على يمين الهامبرغر */
    html[dir="rtl"] .elementor-nav-menu--toggle .hawasly-lang-wrap,
    html[dir="rtl"] .elementor-menu-toggle .hawasly-lang-wrap,
    html[dir="rtl"] .e-n-menu-toggle .hawasly-lang-wrap {
        margin-right: 0;
        margin-left:  8px;
    }

    /* ── زر اللغة — متناسق مع هوية MK Elevator ── */
    .hawasly-lang-btn {
        display:          flex;
        align-items:      center;
        gap:              4px;
        background:       rgba(255, 255, 255, 0.10);
        border:           1px solid rgba(255, 255, 255, 0.28);
        color:            #ffffff;
        border-radius:    6px;
        padding:          4px 9px;
        font-size:        11px;
        font-weight:      700;
        letter-spacing:   0.8px;
        cursor:           pointer;
        transition:       background 0.2s, border-color 0.2s;
        white-space:      nowrap;
        user-select:      none;
        line-height:      1;
        height:           30px;
        -webkit-tap-highlight-color: transparent;
    }

    .hawasly-lang-btn:hover,
    .hawasly-lang-btn:focus {
        background:   rgba(255, 255, 255, 0.20);
        border-color: rgba(255, 255, 255, 0.50);
        outline:      none;
    }

    /* أيقونة الكرة */
    .hawasly-lang-btn svg {
        width:      13px;
        height:     13px;
        flex-shrink: 0;
        opacity:    0.85;
    }

    /* ── القائمة المنسدلة ── */
    .hawasly-lang-dropdown {
        display:       none;
        position:      absolute;
        top:           calc(100% + 6px);
        background:    #ffffff;
        border-radius: 8px;
        box-shadow:    0 8px 28px rgba(0, 0, 0, 0.18);
        overflow:      hidden;
        min-width:     120px;
        z-index:       99999;
        animation:     hwFade 0.15s ease;
    }

    /* LTR: القائمة تنبثق من اليسار */
    .hawasly-lang-dropdown {
        left:  0;
        right: auto;
    }

    /* RTL: القائمة تنبثق من اليمين */
    html[dir="rtl"] .hawasly-lang-dropdown {
        right: 0;
        left:  auto;
    }

    .hawasly-lang-dropdown.hw-open {
        display: block;
    }

    @keyframes hwFade {
        from { opacity: 0; transform: translateY(-5px); }
        to   { opacity: 1; transform: translateY(0); }
    }

    /* عناصر القائمة */
    .hawasly-lang-dropdown a {
        display:         flex;
        align-items:     center;
        gap:             8px;
        padding:         9px 13px;
        font-size:       12px;
        font-weight:     500;
        color:           #1a2340;
        text-decoration: none;
        transition:      background 0.15s;
        white-space:     nowrap;
    }

    .hawasly-lang-dropdown a:hover {
        background: #f0f4ff;
    }

    /* اللغة الحالية — لون MK Elevator الذهبي/الأزرق */
    .hawasly-lang-dropdown a.hw-current {
        color:       #1a2340;
        font-weight: 700;
        background:  #f5f7ff;
    }

    .hawasly-lang-dropdown a.hw-current::after {
        content:            '✓';
        margin-inline-start: auto;
        padding-inline-start: 8px;
        font-size:          11px;
        color:              #1a2340;
    }

    .hawasly-lang-dropdown a + a {
        border-top: 0.5px solid #eef0f5;
    }
}
