/* =========================================================
   GAMA HEADER - FINAL DESKTOP FIX
   Full Width + No Overlap + Bigger Nav Font
   ========================================================= */

@media screen and (min-width: 1200px) {

    /* =========================================
       1. إجبار الهيدر نفسه على Full Width
       ========================================= */

    #site-header {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

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

        box-sizing: border-box !important;
    }


    /* أهم جزء:
       إلغاء 1170px و max-width القديم نهائياً
    */
    #site-header > #site-header-inner.bauer-container,
    #site-header #site-header-inner.bauer-container {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        margin-left: 0 !important;
        margin-right: 0 !important;

        padding-left: 30px !important;
        padding-right: 30px !important;

        box-sizing: border-box !important;

        height: auto !important;
        min-height: 100px !important;
    }


    /* =========================================
       2. Header row
       NAVBAR        | gap | LOGO
       ========================================= */

    #site-header #site-header-inner > .wrap-inner {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        height: 100px !important;
        min-height: 100px !important;

        display: flex !important;

        flex-direction: row !important;

        align-items: center !important;

        justify-content: flex-start !important;

        direction: rtl !important;

        gap: 18px !important;

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

        position: relative !important;

        box-sizing: border-box !important;
    }


    /* إلغاء clearfix أو أي عناصر وهمية */
    #site-header #site-header-inner > .wrap-inner::before,
    #site-header #site-header-inner > .wrap-inner::after {
        content: none !important;
        display: none !important;
    }


    /* =========================================
       3. Logo
       ========================================= */

    #site-header #site-logo {
        float: none !important;

        flex: 0 0 215px !important;

        width: 215px !important;
        max-width: 215px !important;
        min-width: 215px !important;

        height: auto !important;

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

        position: relative !important;

        order: 1 !important;

        z-index: 10 !important;

        line-height: normal !important;
    }


    #site-header #site-logo-inner {
        width: 100% !important;
        max-width: 215px !important;

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

        line-height: normal !important;
    }


    #site-header #site-logo a {
        display: flex !important;

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

        width: 100% !important;

        height: auto !important;

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

        line-height: normal !important;
    }


    #site-header #site-logo img {
        display: block !important;

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

        max-width: 210px !important;
        max-height: 72px !important;

        margin: 0 auto !important;

        padding: 0 !important;

        object-fit: contain !important;

        line-height: normal !important;
    }


    /* =========================================
       4. Main Navigation
       يأخذ كل المساحة الباقية فقط
       ========================================= */

    #site-header #main-nav {
        float: none !important;

        flex: 1 1 0 !important;

        width: auto !important;
        max-width: none !important;
        min-width: 0 !important;

        height: 100px !important;
        min-height: 100px !important;

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

        position: relative !important;

        order: 2 !important;

        display: flex !important;

        align-items: center !important;

        /* وسط المساحة المتاحة */
        justify-content: center !important;

        direction: rtl !important;

        line-height: normal !important;

        box-sizing: border-box !important;

        z-index: 5 !important;
    }


    /* =========================================
       5. Menu UL
       ========================================= */

    #site-header #main-nav > ul.menu {
        display: flex !important;

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

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

        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        height: 100px !important;

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

        direction: rtl !important;

        text-align: center !important;

        list-style: none !important;

        line-height: normal !important;

        box-sizing: border-box !important;
    }


    /* =========================================
       6. Menu items
       ========================================= */

    #site-header #main-nav > ul.menu > li {
        float: none !important;

        display: flex !important;

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

        flex: 0 1 auto !important;

        width: auto !important;
        min-width: 0 !important;

        height: 100px !important;

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

        position: relative !important;

        line-height: normal !important;

        list-style: none !important;

        box-sizing: border-box !important;
    }


    /* =========================================
       7. Menu Links
       خط أكبر + منع line-height القديم
       ========================================= */

    #site-header #main-nav > ul.menu > li > a {
        display: flex !important;

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

        width: auto !important;

        height: 100px !important;
        min-height: 100px !important;

        margin: 0 !important;

        padding-top: 0 !important;
        padding-bottom: 0 !important;

        padding-left: 7px !important;
        padding-right: 7px !important;

        /* تكبير الخط */
        font-size: 16px !important;
        font-weight: 600 !important;

        letter-spacing: 0 !important;

        /* مهم جداً */
        line-height: 1.35 !important;

        text-align: center !important;

        white-space: nowrap !important;

        box-sizing: border-box !important;
    }


    #site-header #main-nav > ul.menu > li > a > span {
        display: inline-flex !important;

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

        height: auto !important;

        margin: 0 !important;

        line-height: 1.35 !important;

        white-space: nowrap !important;
    }


    /* =========================================
       8. Dropdown arrow
       ========================================= */

    #site-header #main-nav > ul.menu >
    li.menu-item-has-children > a > span {
        position: relative !important;

        padding-right: 15px !important;
    }


    #site-header #main-nav > ul.menu >
    li.menu-item-has-children > a > span::after {
        line-height: 1 !important;
    }


    /* =========================================
       9. Dropdowns
       ========================================= */

    #site-header #main-nav .sub-menu {
        display: block !important;

        position: absolute !important;

        top: 100% !important;

        width: 250px !important;
        min-width: 250px !important;

        height: auto !important;

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

        direction: rtl !important;

        line-height: normal !important;

        z-index: 999999 !important;
    }


    #site-header #main-nav .sub-menu li {
        display: block !important;

        float: none !important;

        width: 100% !important;

        height: auto !important;
        min-height: 0 !important;

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

        line-height: normal !important;
    }


    #site-header #main-nav .sub-menu li a {
        display: block !important;

        width: 100% !important;

        height: auto !important;
        min-height: 0 !important;

        padding: 10px 20px !important;

        font-size: 15px !important;

        line-height: 1.6 !important;

        white-space: normal !important;

        text-align: right !important;
    }


    /* =========================================
       10. العناصر غير المطلوبة
       ========================================= */

    #site-header .nav-extend {
        display: none !important;
    }

    #site-header .mobile-button {
        display: none !important;
    }
}


/* =========================================================
   شاشة كبيرة مثل الصورة الحالية
   ========================================================= */

@media screen and (min-width: 1700px) {

    #site-header #main-nav > ul.menu > li > a {
        font-size: 17px !important;

        padding-left: 9px !important;
        padding-right: 9px !important;
    }

}


/* =========================================================
   Laptop
   لا نسمح بتداخل القائمة مع اللوجو
   ========================================================= */

@media screen and (min-width: 1200px) and (max-width: 1499px) {

    #site-header > #site-header-inner.bauer-container {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    #site-header #site-header-inner > .wrap-inner {
        gap: 10px !important;
    }

    #site-header #site-logo {
        flex-basis: 170px !important;

        width: 170px !important;
        max-width: 170px !important;
        min-width: 170px !important;
    }

    #site-header #site-logo-inner {
        max-width: 170px !important;
    }

    #site-header #site-logo img {
        max-width: 165px !important;
    }

    #site-header #main-nav > ul.menu > li > a {
        font-size: 14px !important;

        padding-left: 4px !important;
        padding-right: 4px !important;
    }

}