/**
 * مبدّل اللغة: كرة SVG + قائمة بعرض مناسب دون فراغ جانبي
 */

.header-lang-svg {
    display: block;
    flex-shrink: 0;
}

.header-lang-trigger {
    display: inline-flex !important;
    align-items: center;
    gap: 8px;
    flex-wrap: nowrap;
    color: #ffffff !important;
}

.header-lang-globe {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
}

.header-lang-globe .header-lang-svg {
    color: #ffffff !important;
}

.header-lang-trigger .header-lang-code {
    display: inline-block;
    font-family: var(--primary-font, system-ui, -apple-system, 'Segoe UI', sans-serif);
    font-size: 12px;
    font-weight: 800;
    letter-spacing: 0.08em;
    line-height: 1.2;
    color: #ffffff !important;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
}

/* عرض القائمة يتبع أوسع خيار فقط — لا min-width عريض يترك فراغاً */
/* خلفية فاتحة دائماً: على الشاشات الكبيرة لا يُطبَّق قاعدة الموبايل فقط، فيبقى الهيدر الداكن فيفرض قائمة داكنة + نص داكن */
.header-lang-menu.dropdown-menu {
    background-color: #fff !important;
    color: #0f172a !important;
    border-radius: 12px !important;
    padding: 6px !important;
    min-width: unset !important;
    width: max-content !important;
    max-width: min(20rem, calc(100vw - 24px)) !important;
    border: 1px solid rgba(15, 23, 42, 0.12) !important;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.15) !important;
    overflow: hidden;
}

/* موضع القائمة تحت المبدّل على كل المقاسات (كانت محصورة بالموبايل فقط) */
.header_wrap .bottom_header .navbar-nav.attr-nav li.header-lang-dropdown {
    position: relative;
}

.header_wrap .bottom_header .navbar-nav.attr-nav li.header-lang-dropdown > .dropdown-menu {
    position: absolute !important;
    top: 100% !important;
    left: auto !important;
    right: 0 !important;
    float: none !important;
    margin: 0.35rem 0 0 !important;
    z-index: 100200 !important;
}

html[dir="rtl"] .header_wrap .bottom_header .navbar-nav.attr-nav li.header-lang-dropdown > .dropdown-menu {
    left: 0 !important;
    right: auto !important;
}

/*
 * الهيدر يستخدم bottom_header.light_skin — style.css يفرض:
 * .navbar-nav .dropdown-menu { background #252a2c } و .light_skin .navbar .navbar-nav .dropdown-item { color #fff }
 * نرفع الخصوصية ونربط بالهيكل الفعلي، وملف هذا يُحمَّل بعد modern-marketplace (وملفات RTL) لضمان الترتيب.
 */
.bottom_header.light_skin .navbar .navbar-nav.attr-nav li.header-lang-dropdown > .dropdown-menu.header-lang-menu,
.header_wrap .bottom_header.light_skin .navbar .navbar-nav.attr-nav li.header-lang-dropdown > .header-lang-menu.dropdown-menu,
.ahlmall-nova-marketplace .bottom_header.light_skin .navbar .navbar-nav.attr-nav li.header-lang-dropdown > .header-lang-menu.dropdown-menu {
    background-color: #fff !important;
    background-image: none !important;
    color: #0f172a !important;
    border-radius: 12px !important;
    padding: 6px !important;
    min-width: unset !important;
    width: max-content !important;
    max-width: min(20rem, calc(100vw - 24px)) !important;
    border: 1px solid rgba(15, 23, 42, 0.12) !important;
    box-shadow: 0 12px 32px rgba(15, 23, 42, 0.15) !important;
}

.bottom_header.light_skin .navbar .navbar-nav .header-lang-menu .dropdown-item.header-lang-item:not(.active) {
    color: #0f172a !important;
}

.bottom_header.light_skin .navbar .navbar-nav .header-lang-menu .dropdown-item.header-lang-item:not(.active) .header-lang-item-label {
    color: #0f172a !important;
}

.bottom_header.light_skin .navbar .navbar-nav .header-lang-menu .dropdown-item.header-lang-item:not(.active) .header-lang-item-globe .header-lang-svg {
    color: #64748b !important;
}

.bottom_header.light_skin .navbar .navbar-nav .header-lang-menu .dropdown-item.header-lang-item.active,
.bottom_header.light_skin .navbar .navbar-nav .header-lang-menu .dropdown-item.header-lang-item.active .header-lang-item-label {
    color: var(--color-1st, #ff324d) !important;
}

.bottom_header.light_skin .navbar .navbar-nav .header-lang-menu .dropdown-item.header-lang-item.active .header-lang-item-globe .header-lang-svg {
    color: var(--color-1st, #ff324d) !important;
}

.header-lang-menu .header-lang-item {
    display: flex !important;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    border-radius: 8px !important;
    color: #0f172a !important;
    font-family: var(--primary-font, system-ui, -apple-system, 'Segoe UI', sans-serif);
    font-size: 14px !important;
    font-weight: 600 !important;
    padding: 10px 12px !important;
    margin: 0 !important;
    white-space: nowrap;
    box-sizing: border-box;
}

/* نص ثم أيقونة بلا تمدد يترك فراغاً داخل الصف */
.header-lang-item-label {
    flex: 0 1 auto;
    text-align: start;
}

.header-lang-item-globe {
    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
}

.header-lang-item-globe .header-lang-svg {
    color: #64748b !important;
}

.header-lang-menu .header-lang-item:hover,
.header-lang-menu .header-lang-item:focus {
    background-color: #f1f5f9 !important;
    color: #020617 !important;
}

.header-lang-menu .header-lang-item.active {
    background-color: rgba(255, 50, 77, 0.1) !important;
    color: var(--color-1st, #ff324d) !important;
}

.header-lang-menu .header-lang-item.active .header-lang-item-globe .header-lang-svg {
    color: var(--color-1st, #ff324d) !important;
}

.header-lang-menu .header-lang-item:not(.active) .header-lang-item-label {
    color: #0f172a !important;
}

.header-lang-menu .header-lang-item.active .header-lang-item-label {
    color: var(--color-1st, #ff324d) !important;
    font-weight: 700 !important;
}

@media (max-width: 991px) {
    .header_wrap .bottom_header,
    .header_wrap .bottom_header .container,
    .header_wrap .bottom_header .navbar {
        overflow: visible !important;
    }
}
