/* =========================================================
   NUJIZ EN INFO PAGES — FINAL MOBILE MENU
   ========================================================= */

.en-info-menu-toggle{
    display:none;
}

@media (max-width:850px){

    html[lang="en"] body .site-header{
        position:relative !important;
        overflow:visible !important;
        z-index:999999 !important;
    }

    html[lang="en"] body .site-header .header-inner{
        position:relative !important;
        display:flex !important;
        align-items:center !important;
        justify-content:space-between !important;
        min-height:64px !important;
        overflow:visible !important;
        padding-inline:12px !important;
    }

    /* الشعار */
    

    /* الاجراءات */
    html[lang="en"] body .site-header .header-actions{
        position:relative !important;
        display:flex !important;
        flex:1 1 auto !important;
        align-items:center !important;
        width:auto !important;
        gap:8px !important;
        padding:0 !important;
        margin:0 !important;
        direction:ltr !important;
        order:2 !important;
    }

    /* العربية في الجهة المقابلة */
    html[lang="en"] body .site-header .header-actions .lang-link{
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        min-height:44px !important;
        padding:0 14px !important;
        margin-left:auto !important;
        margin-right:0 !important;
        order:3 !important;
        direction:rtl !important;
    }

    html[lang="en"] body .site-header .header-cta{
        display:none !important;
    }

    /*
     * زرنا الخاص
     * لا يعتمد على mobile-header.js
     */
    html[lang="en"] body .site-header .en-info-menu-toggle{
        display:flex !important;
        visibility:visible !important;
        opacity:1 !important;

        position:relative !important;
        inset:auto !important;
        transform:none !important;

        width:44px !important;
        height:44px !important;
        min-width:44px !important;
        min-height:44px !important;

        padding:0 !important;
        margin:0 0 0 8px !important;

        flex:0 0 44px !important;
        flex-direction:column !important;
        align-items:center !important;
        justify-content:center !important;
        gap:5px !important;

        border:0 !important;
        border-radius:12px !important;

        background:#14243d !important;
        box-shadow:0 7px 20px rgba(17,30,55,.20) !important;

        cursor:pointer !important;
        pointer-events:auto !important;

        order:2 !important;
        z-index:2147483646 !important;
    }

    html[lang="en"] body .site-header .en-info-menu-toggle span{
        display:block !important;
        width:21px !important;
        height:2px !important;
        min-height:2px !important;
        border:0 !important;
        border-radius:10px !important;
        background:#fff !important;
        opacity:1 !important;
        transition:transform .18s ease,opacity .18s ease !important;
    }

    html[lang="en"] body .site-header
    .en-info-menu-toggle.is-open span:nth-child(1){
        transform:translateY(7px) rotate(45deg) !important;
    }

    html[lang="en"] body .site-header
    .en-info-menu-toggle.is-open span:nth-child(2){
        opacity:0 !important;
    }

    html[lang="en"] body .site-header
    .en-info-menu-toggle.is-open span:nth-child(3){
        transform:translateY(-7px) rotate(-45deg) !important;
    }

    /*
     * اخفاء nav بالوضع الطبيعي
     */
    html[lang="en"] body .site-header .main-nav{
        display:none !important;
    }

    /*
     * القائمة المفتوحة
     * نتغلب هنا على mobile-header.css القديم
     */
    html[lang="en"] body .site-header
    .main-nav.en-info-nav-open{
        display:flex !important;
        visibility:visible !important;
        opacity:1 !important;

        position:absolute !important;
        top:calc(100% + 7px) !important;
        left:10px !important;
        right:10px !important;

        width:auto !important;
        height:auto !important;

        padding:10px !important;
        margin:0 !important;

        flex-direction:column !important;
        align-items:stretch !important;
        gap:4px !important;

        border:1px solid #e5e1f0 !important;
        border-radius:16px !important;

        background:rgba(255,255,255,.98) !important;
        backdrop-filter:blur(18px) !important;
        -webkit-backdrop-filter:blur(18px) !important;

        box-shadow:0 20px 45px rgba(20,28,52,.18) !important;

        pointer-events:auto !important;
        z-index:2147483645 !important;
    }

    html[lang="en"] body .site-header
    .main-nav.en-info-nav-open > a{
        display:flex !important;
        visibility:visible !important;
        opacity:1 !important;

        width:100% !important;
        min-height:44px !important;

        align-items:center !important;

        padding:0 13px !important;
        box-sizing:border-box !important;

        border-radius:10px !important;

        color:#14243d !important;
        -webkit-text-fill-color:#14243d !important;

        background:transparent !important;

        font-size:13px !important;
        font-weight:800 !important;
        text-decoration:none !important;
    }

    html[lang="en"] body .site-header
    .main-nav.en-info-nav-open > a:hover{
        background:#f2efff !important;
        color:#6847ef !important;
        -webkit-text-fill-color:#6847ef !important;
    }
}

/* =========================================================
   EN INFO PAGES — ACCOUNT / LOGIN
   ========================================================= */

@media (max-width:850px){

    html[lang="en"] body .site-header .nujiz-account-slot{
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        flex:0 0 auto !important;
        order:1 !important;

        min-width:0 !important;
        margin:0 !important;
        padding:0 !important;
    }

    html[lang="en"] body .site-header
    .nujiz-account-slot .nujiz-account-button,
    html[lang="en"] body .site-header
    .nujiz-account-slot button,
    html[lang="en"] body .site-header
    .nujiz-account-slot a{
        min-height:44px !important;
    }

    html[lang="en"] body .site-header
    .header-actions .en-info-menu-toggle{
        order:2 !important;
    }

    html[lang="en"] body .site-header
    .header-actions .lang-link{
        order:3 !important;
    }
}

/* =========================================================
   EN INFO PAGES — HOMEPAGE BRAND
   Do not redesign the logo here
   ========================================================= */

@media (max-width:850px){

    html[lang="en"] body .site-header .brand{
        min-width:0 !important;
        display:flex !important;
        align-items:center !important;
        gap:12px !important;

        position:static !important;
        inset:auto !important;
        transform:none !important;

        margin:0 !important;
    }

    html[lang="en"] body .site-header .brand-mark{
        width:41px !important;
        height:41px !important;
        min-width:41px !important;
        min-height:41px !important;

        display:grid !important;
        place-items:center !important;

        border-radius:13px !important;
        background:var(--navy) !important;
    }

    html[lang="en"] body .site-header .brand-mark svg{
        width:29px !important;
        height:29px !important;
        max-width:29px !important;
        max-height:29px !important;
    }

    html[lang="en"] body .site-header .brand-copy strong{
        display:block !important;
        font-size:21px !important;
        line-height:1 !important;
        font-weight:900 !important;
    }

    /* مثل الرئيسية على الجوال */
    html[lang="en"] body .site-header .brand-copy small{
        display:none !important;
    }

}