/* =====================================================
   KHAMEN — MOBILE HEADER CLEAN V1
   Mobile only. Desktop untouched.
   ===================================================== */


/* =====================================================
   PRIMARY NAVBAR
   ===================================================== */

@media (max-width: 767.98px) {

    .kh-navbar{
        background:#fff !important;
        border-bottom:1px solid #eee8ef !important;
        box-shadow:none !important;
    }

    .kh-navbar > .container-fluid{
        min-height:64px !important;
        height:64px !important;

        padding:7px 12px !important;

        flex-wrap:nowrap !important;
        gap:8px !important;
    }


    /* ---------- Logo ---------- */

    .kh-navbar .kh-logo{
        min-width:44px !important;

        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        margin:0 !important;
        padding:0 !important;
    }

    .kh-navbar .kh-logo img{
        width:auto !important;
        height:40px !important;
        max-height:40px !important;

        object-fit:contain !important;
    }


    /* ---------- Left/mobile controls ---------- */

    .kh-navbar .kh-actions{
        display:flex !important;
        align-items:center !important;

        gap:6px !important;

        margin:0 !important;

        min-width:0 !important;
    }


    /* اللغة تختفي من الصف العلوي على الموبايل */
    .kh-navbar .kh-lang{
        display:flex !important;
        align-items:center !important;
        gap:3px !important;
        padding:3px !important;
        border:1px solid #eee7ef !important;
        border-radius:12px !important;
        background:#faf8fb !important;
        flex-shrink:0 !important;
    }

    .kh-navbar .kh-lang a{
        width:27px !important;
        height:27px !important;
        padding:0 !important;
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
        border-radius:8px !important;
        background:transparent !important;
        color:#746b77 !important;
        font-size:.62rem !important;
        font-weight:800 !important;
        text-decoration:none !important;
    }

    .kh-navbar .kh-lang a.active{
        background:#771080 !important;
        color:#fff !important;
    }


    /* الحساب */

    .kh-navbar .nav-profile{
        margin:0 !important;
    }

    .kh-navbar .nav-profile-link{
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        width:38px !important;
        height:38px !important;

        padding:0 !important;

        border:1px solid #e9dfeb !important;
        border-radius:12px !important;

        background:#fff !important;

        color:#74107d !important;

        box-shadow:none !important;
    }

    .kh-navbar .nav-profile-avatar{
        width:auto !important;
        height:auto !important;

        padding:0 !important;

        border:0 !important;
        background:transparent !important;

        font-size:1rem !important;
    }


    /* ---------- Notification ---------- */

    .kh-navbar .kh-bell{
        position:relative !important;

        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        width:38px !important;
        height:38px !important;

        padding:0 !important;

        border:1px solid #eee7ef !important;
        border-radius:12px !important;

        background:#faf8fb !important;
        color:#74107d !important;

        box-shadow:none !important;
    }

    .kh-navbar .kh-bell i{
        font-size:.95rem !important;
    }

    .kh-navbar .kh-bell-badge{
        position:absolute !important;

        top:-4px !important;
        right:-4px !important;

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

        padding:0 4px !important;

        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        border:2px solid #fff !important;
        border-radius:999px !important;

        font-size:.55rem !important;
        line-height:1 !important;
    }


    /* ---------- Theme ---------- */

    .kh-navbar .kh-theme-toggle{
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;

        width:38px !important;
        height:38px !important;

        padding:0 !important;

        border:1px solid #eee7ef !important;
        border-radius:12px !important;

        background:#faf8fb !important;
        color:#74107d !important;

        box-shadow:none !important;
    }

    .kh-navbar .kh-theme-toggle i{
        font-size:.9rem !important;
    }


    /* ---------- Hamburger ---------- */

    .kh-navbar .kh-hamburger{
        width:38px !important;
        height:38px !important;

        padding:0 !important;

        display:flex !important;
        flex-direction:column !important;
        align-items:center !important;
        justify-content:center !important;

        gap:4px !important;

        border:1px solid #eee7ef !important;
        border-radius:12px !important;

        background:#fff !important;

        box-shadow:none !important;
    }

    .kh-navbar .kh-hamburger span{
        width:18px !important;
        height:2px !important;

        margin:0 !important;

        background:#332c35 !important;

        border-radius:3px !important;
    }


    /* منع أي عنصر من توسيع الهيدر */

    .kh-navbar .nav-profile-name{
        display:none !important;
    }

}


/* =====================================================
   ACCOUNT MOBILE NAV
   اللوحة / الإشعارات / ألعابي / لعبة جديدة ...
   ===================================================== */

@media (max-width: 991.98px) {

    .kh-account-side{
        position:relative !important;

        top:auto !important;

        width:100% !important;
        height:auto !important;

        margin:0 !important;
        padding:7px 9px !important;

        overflow:hidden !important;

        border:0 !important;
        border-bottom:1px solid #eee8ef !important;

        background:#fff !important;

        box-shadow:none !important;
    }


    .kh-side-head{
        display:none !important;
    }


    .kh-side-nav{
        width:100% !important;

        display:flex !important;
        flex-direction:row !important;
        flex-wrap:nowrap !important;

        align-items:center !important;

        gap:5px !important;

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

        overflow-x:auto !important;
        overflow-y:hidden !important;

        scrollbar-width:none !important;

        scroll-snap-type:x proximity !important;

        -webkit-overflow-scrolling:touch !important;
    }

    .kh-side-nav::-webkit-scrollbar{
        display:none !important;
    }


    .kh-side-nav > a,
    .kh-side-nav > form{
        flex:0 0 auto !important;

        margin:0 !important;

        scroll-snap-align:start !important;
    }


    .kh-side-nav a,
    .kh-side-nav button{
        min-width:73px !important;
        height:54px !important;

        padding:6px 9px !important;

        display:flex !important;
        flex-direction:column !important;

        align-items:center !important;
        justify-content:center !important;

        gap:3px !important;

        white-space:nowrap !important;

        border:0 !important;
        border-inline-start:0 !important;
        border-bottom:0 !important;

        border-radius:12px !important;

        background:transparent !important;

        color:#827884 !important;

        font-family:inherit !important;
        font-size:.66rem !important;
        font-weight:700 !important;
        line-height:1.05 !important;

        box-shadow:none !important;

        transition:
            background .15s ease,
            color .15s ease !important;
    }


    .kh-side-nav .ic{
        width:auto !important;
        height:auto !important;

        margin:0 !important;

        display:block !important;

        font-size:1rem !important;
        line-height:1 !important;
    }


    /* Active tab */

    .kh-side-nav a.active{
        border:0 !important;

        background:#f8eff9 !important;

        color:#771080 !important;

        box-shadow:none !important;
    }


    /* إزالة أي خطوط قديمة للحالة النشطة */

    .kh-side-nav a.active::before,
    .kh-side-nav a.active::after{
        display:none !important;
    }


    /* Logout */

    .kh-side-nav form button{
        color:#d6525e !important;
    }
}


/* =====================================================
   VERY SMALL PHONES
   ===================================================== */

@media (max-width: 390px) {

    .kh-navbar > .container-fluid{
        padding-inline:8px !important;
    }

    .kh-navbar .kh-logo img{
        height:35px !important;
    }

    .kh-navbar .nav-profile-link,
    .kh-navbar .kh-bell,
    .kh-navbar .kh-theme-toggle,
    .kh-navbar .kh-hamburger{
        width:35px !important;
        height:35px !important;

        border-radius:10px !important;
    }

    .kh-navbar .kh-actions{
        gap:4px !important;
    }

    .kh-side-nav a,
    .kh-side-nav button{
        min-width:68px !important;
        height:51px !important;

        font-size:.62rem !important;
    }

}