/* Body and General RTL Layout */
body {
    direction: rtl;

}

html[dir="rtl"] #header {
   
    text-align: right;
}

html[dir="rtl"] #navigation {
    float: right;
}
.mmenu-trigger {
    margin-right:25px;
}
/* Main Navigation */
#navigation {
    display: flex;
    justify-content: flex-end;
}

    #navigation ul {
        display: flex;
        flex-direction: row-reverse;
        padding: 0;
        list-style: none;
        justify-content: flex-end;
    }

        #navigation ul li {
            margin: 0 10px;
            white-space: nowrap;
            position: relative; /* لتطبيق السهم */
        }

            /* Adjust order of items in the main menu */
            #navigation ul li:nth-child(1) {
                order: 4;
            }

            #navigation ul li:nth-child(2) {
                order: 3;
            }

            #navigation ul li:nth-child(3) {
                order: 2;
            }

            #navigation ul li:nth-child(4) {
                order: 1;
            }

/* Dropdown Menu */
#navigation ul li ul {
    display: none;
    position: absolute;
    right: 0; /* تبدأ القائمة الفرعية من اليمين */
    top: 100%;
    list-style: none;
    background-color: #f1f1f1;
    z-index: 1000; /* لضمان ظهور القائمة فوق العناصر الأخرى */
    padding: 0;
    border: 1px solid #ddd;
    min-width: 200px; /* لضمان عرض مناسب للقائمة */
    box-sizing: border-box; /* لحساب الحواف ضمن العرض */
}

/* عرض القائمة الفرعية عند التمرير */
#navigation ul li:hover > ul {
    display: block;
}
.mb-4, .my-4 {
   
    float: right;
}
h3 {
    
    float: right;
    margin-left:25px;
}
/* Dropdown List Items */
#navigation ul li ul li {
    background-color: #f1f1f1;
    padding: 10px;
    text-align: right; /* النص على اليمين */
    box-sizing: border-box; /* لضمان تناسق الحواف */
    width: 100%; /* يغطي العنصر كامل العرض */
}
.mb-5 {
    margin-bottom: 5rem !important;
}
p {
    line-height: 20px;
}
#navigation ul li ul li a {
    display: flex; /* لضبط النص والسهم */
    justify-content: space-between; /* النص على اليمين والسهم على اليسار */
    align-items: center; /* محاذاة النص والسهم عموديًا */
    direction: rtl; /* لضمان ترتيب النص والسهم */
    padding: 10px;
    color: #000;
    text-decoration: none;
    width: 100%; /* يغطي الرابط عرض العنصر بالكامل */
    box-sizing: border-box; /* لحساب الحواف بشكل صحيح */
    background-color: transparent; /* افتراضي */
}

        /* تعديل السهم ليظهر بعد النص */
 #navigation ul li ul li a::after {
            content: "◀"; /* رمز السهم الذي يشير إلى اليسار */
            margin-left: 10px; /* مسافة بين النص والسهم */
            color: #333; /* لون السهم */
            display: inline-block;
        }

        /* تأثير التمرير على العناصر */
        #navigation ul li ul li a:hover {
            background-color: #ddd; /* لون الخلفية عند التمرير */
            color: #000; /* تغيير لون النص */
        }

    /* القائمة الفرعية الثانية */
    #navigation ul li ul li ul {
        display: none;
        position: absolute;
        right: 100%; /* تبدأ القائمة الفرعية الثانية من اليسار */
        top: 0;
        list-style: none;
        background-color: #f1f1f1;
        z-index: 1000;
        padding: 0;
        border: 1px solid #ddd;
        min-width: 300px; /* عرض القائمة الفرعية */
        box-sizing: border-box;
    }

    /* عرض القائمة الفرعية الثانية عند التمرير */
    #navigation ul li ul li:hover > ul {
        display: block;
    }

    /* عناصر القائمة الفرعية الثانية */
    #navigation ul li ul li ul li {
        padding: 10px;
        text-align: right; /* النص على اليمين */
        box-sizing: border-box;
        background-color: #f1f1f1;
    }

        #navigation ul li ul li ul li a {
            display: flex;
            justify-content: space-between;
            align-items: center;
            direction: rtl;
            padding: 10px;
            color: #000;
            text-decoration: none;
            width: 100%;
        }

            #navigation ul li ul li ul li a:hover {
                background-color: #ddd; /* لون الخلفية عند التمرير */
            }

.mm-listview > li > a, .mm-listview > li > span {
    color: inherit;
    display: block;
    padding: 14px 10px 14px 20px;
    margin-right: 150px;
}
.mm-listview .mm-next.mm-fullsubopen + a, .mm-listview .mm-next.mm-fullsubopen + span {
    padding-right: 50px;
    margin-right: 150px;
}
[dir="rtl"] .hide-navigation {
    display: none !important;
}


@media (max-width: 991px) {
    .clearfix {
        display: none; /* Hide mobile menu trigger on larger screens */
    }
    #navigation {
        display: none;
    }
   
}
    .mm-menu.mm-offcanvas {
            z-index: 0;
            display: none;
            position: fixed;
            width: 100%;
            min-width: 140px;
            max-width: 1140px;
        }
.navigation {
    margin-left: 55px;
    margin-top: 120px;
}
.nav-footer {
    margin-left: 55px;
}
.first-footer h3 {
    margin-top: -55px;
    margin-left: -115px;
}
.widget h3 {
    margin-top: -55px;
    margin-left: -115px;
}
.twitter-area {
    margin-top: 115px;
    margin-left: 1305px;
}

@media screen and (max-width: 991px) {
    .first-footer .newsletters h3, .first-footer .widget h3 {
        margin-top: -4rem;
    }
    .left-side {
        width: 20%;
    }
    .first-footer .navigation h3 {
        margin-top: -55px;
    }
}