.elementor-1459 .elementor-element.elementor-element-b26be28{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-1459 .elementor-element.elementor-element-3402060 .pf-free-phone-1{color:#FF0202;}.elementor-1459 .elementor-element.elementor-element-3402060 .pf-free-phone-1 b{color:#FF0202;}.elementor-1459 .elementor-element.elementor-element-3402060 .tx-header ul li a{color:#FFFFFF;font-size:13px;}.elementor-1459 .elementor-element.elementor-element-3402060 .tx-logo img{max-width:276px;}body.elementor-page-1459 .page-wrapper{overflow:hidden;}@media(max-width:767px){.elementor-1459 .elementor-element.elementor-element-b26be28{--width:100%;}}/* Start custom CSS for tx_headers, class: .elementor-element-3402060 *//* HIDE HEADER BUTTON ONLY ON MOBILE (English & Arabic) */
@media (max-width: 767px) {
    /* 1. Target the button specifically inside the header ID */
    #nm-header .nm-pr-btn-2,
    #nm-header .btn-split-right,
    #nm-header .ar-button-fix {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        height: 0 !important;
        width: 0 !important;
        padding: 0 !important;
        margin: 0 !important;
    }

    /* 2. Force hide for the Arabic/RTL version specifically in the header */
    html[lang="ar"] #nm-header .nm-pr-btn-2,
    html[dir="rtl"] #nm-header .nm-pr-btn-2 {
        display: none !important;
    }
}










@media (max-width: 767px) {
    /* 1. Target the specific menu button from your screenshot */
    html[lang="ar"] .elementor-1459 .elementor-element.elementor-element-3402060 .nm-offcanvas-toggle,
    html[lang="ar"] .elementor-1459 .elementor-element.elementor-element-3402060 .nm-mobile-menu-button {
        display: flex !important;      /* Force it to exist */
        visibility: visible !important; /* Make it visible */
        opacity: 1 !important;          /* No transparency */
        
        /* 2. PUSH IT TO THE RIGHT */
        /* We use position relative to slide it back into the frame */
        position: relative !important;
        right: -80px !important; /* This "pulls" it from the left into the center/right */
        
        /* 3. Ensure it stays on top of all other layers */
        z-index: 99999 !important;
    }

    /* 4. Hide that extra "Contact" button that was bothering you */
    html[lang="ar"] .elementor-1459 .elementor-element.elementor-element-3402060 .nm-pr-btn-2 {
        display: none !important;
    }
}















/* 1. Target the button ONLY when it is inside the header in Arabic mode */
html[lang="ar"] header .nm-pr-btn-2,
html[lang="ar"] #nm-header .nm-pr-btn-2 {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    direction: rtl !important;
    font-size: 0 !important; /* Hides the 'shredded' English */
    position: relative;
    min-width: 120px;
    vertical-align: middle;
}

/* 2. Kill the 'shredded' divs ONLY inside the header button */
html[lang="ar"] header .nm-pr-btn-2 div, 
html[lang="ar"] header .nm-pr-btn-2 span:not(.icon),
html[lang="ar"] #nm-header .nm-pr-btn-2 div,
html[lang="ar"] #nm-header .nm-pr-btn-2 span:not(.icon) {
    display: none !important;
}

/* 3. Inject the Arabic text safely for the header only */
html[lang="ar"] header .nm-pr-btn-2::before,
html[lang="ar"] #nm-header .nm-pr-btn-2::before {
    content: "تواصل معنا" !important;
    font-size: 14px !important; 
    visibility: visible !important;
    display: inline-block !important;
    letter-spacing: 0 !important;
    margin-left: 10px !important; /* Space between text and icon */
    order: 1; /* Puts text first in RTL */
    line-height: 1 !important;
}

/* 4. Ensure the header button icon stays centered and visible */
html[lang="ar"] header .nm-pr-btn-2 .icon,
html[lang="ar"] header .nm-pr-btn-2 i,
html[lang="ar"] #nm-header .nm-pr-btn-2 .icon,
html[lang="ar"] #nm-header .nm-pr-btn-2 i {
    font-size: 14px !important;
    visibility: visible !important;
    display: flex !important;
    align-items: center !important;
    order: 2; /* Puts icon after text in RTL */
    margin: 0 !important;
}/* End custom CSS */