/* RTL Overrides for Alamer Theme */
body {
    direction: rtl;
    text-align: right;
    font-family: 'Open Sans', sans-serif; /* Ensure font supports Arabic if needed, or use a specific Arabic font */
}

/* Bootstrap Grid RTL */

/* Floats */
.pull-left {
    float: right !important;
}
/* Text Alignment */
.text-left {
    text-align: right;
}
.text-right {
    text-align: left;
}

/* Navbar */
.navbar-nav {
    float: left; /* In LTR it's float: left usually, but we want it on the left side? No, usually right side in LTR. */
    margin: 0;
}
/* Header/Logo */
.navbar-header {
    float: right;
}

/* Carousel/Slider */
.carousel-control.left {
    right: 0;
    left: auto;
    background-image: linear-gradient(to right,rgba(0,0,0,.0001) 0,rgba(0,0,0,.5) 100%);
}
.carousel-control.right {
    left: 0;
    right: auto;
    background-image: linear-gradient(to right,rgba(0,0,0,.5) 0,rgba(0,0,0,.0001) 100%);
}

/* Service Items */
.service-item .img-service {
    float: none; /* Reset float if it was set, though it shouldn't be needed if we don't set it */
    margin: 0;
}

.service-item .service-text {
    text-align: right;
}

.service-item .more {
    text-align: right; /* Align "Read More" to the right (start of line in RTL) */
    float: none;
}

.service-item .more i {
    margin-right: 0;
    margin-left: 5px; /* Flip margin for icon */
}

/* Footer */
.footer-col {
    float: right;
}

/* Icons */
.fa-arrow-right:before {
    content: "\f060"; /* Replace right arrow with left arrow content if needed, or rotate */
}
/* Actually, user asked for SAME icons. So I won't change the icon content, but maybe the rotation? 
   If I use fa-arrow-right in RTL, it points to the "back" direction visually (left). 
   Usually in RTL you want the arrow to point left for "next/more". 
   The user specifically asked for "same icons", so I will leave it as is unless it looks broken.
   Wait, fa-arrow-right points right. In RTL, "forward" is left. 
   So I should probably rotate it 180deg.
*/
.fa-arrow-right {
    transform: rotate(180deg);
    display: inline-block;
}

/* Margins and Paddings Flip */
.margin-left-10 { margin-right: 10px; margin-left: 0; }
.margin-right-10 { margin-left: 10px; margin-right: 0; }
.padding-left-10 { padding-right: 10px; padding-left: 0; }
.padding-right-10 { padding-left: 10px; padding-right: 0; }

/* Specific Theme Overrides */
.home-title .title-style {
    margin-left: 10px;
    margin-right: 0;
}

.home-title, .home-text {
    text-align: right;
}

/* Owl Carousel RTL Support */
.owl-carousel.owl-rtl {
    direction: rtl;
}
.owl-carousel.owl-rtl .owl-item {
    float: right;
}

/* Menu alignment */
.navbar-nav > li > a {
    padding-top: 15px;
    padding-bottom: 15px;
}
@media (min-width: 992px) {
    .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
        float: right;
    }
}