@import url('https://fonts.googleapis.com/css2?family=Tajawal&display=swap');
/* Arabic RTL Layout Styles */
body {
    direction: rtl;
    text-align: right;
    font-family: "Tajawal", sans-serif !important;
}

h1, h2, h3, h4, h5, h6, p, a, span, input, textarea, select, option, label,div {
    font-family: "Tajawal", sans-serif !important;
}
.service-item .tooltip-content {
    right: -153px;
    left:unset;
}
.tooltip-content:before { 
    left: unset; 
    right: -10px;
}

/* Navbar RTL */
.navbar-nav {
    padding-right: 0;
}

.navbar-nav .nav-item {
    margin-right: 0;
    margin-left: 1rem;
}

/* Services Section RTL */
.service-details {
    flex-direction: row-reverse;
}

.service-number {
    margin-right: 0;
    margin-left: 1rem;
}

/* Projects Section RTL */
.carousel-nav {
    flex-direction: row-reverse;
}

.carousel-prev {
    margin-left: 1rem;
    margin-right: 0;
}

/* Footer RTL */
.footer-container {
    direction: rtl;
}

.menu-links,
.legals-links {
    padding-right: 0;
}

.office .bottom {
    direction: rtl;
}

/* Service Box RTL */
.service-box {
    direction: rtl;
}

.service-slider-nav {
    /* flex-direction: row-reverse; */
}

/* Info Icons RTL */
.info-icon {
    margin-right: 0;
    margin-left: 0.5rem;
}

/* Mobile Menu RTL */
.mobile-menu-icons {
    flex-direction: row-reverse;
}

.mobile-menu-icons i {
    margin-right: 0;
    margin-left: 1rem;
}

/* Search Overlay RTL */
.search-container {
    direction: rtl;
}


/* Hero Section RTL */
.hero-text {
    text-align: right;
}

/* Tailored Space Section RTL */
.tailored-space .row {
    direction: rtl;
}

/* Sectors Section RTL */
.service-categories {
    direction: rtl;
}

/* General RTL Fixes */
.ml-40 {
    margin-left: 0 !important;
    margin-right: 2.5rem !important;
}

.text-left {
    text-align: right !important;
}

.text-right {
    text-align: left !important;
}

/* Bootstrap RTL Overrides */
.me-auto {
    margin-left: auto !important;
    margin-right: 0 !important;
}

.ms-auto {
    margin-right: auto !important;
    margin-left: 0 !important;
}

.me-5 {
    margin-left: 3rem !important;
    margin-right: 0 !important;
}

.ms-5 {
    margin-right: 3rem !important;
    margin-left: 0 !important;
}

/* For top right icons in navbar */
html[dir="rtl"] .mobile-menu-icons2,
html[dir="rtl"] .mobile-menu-icons {
    left: 16px;
    right: unset;
}

html[dir="rtl"] .navbar-toggler.menu-button {
    right: 16px;
    left: unset;
}

html[dir="rtl"] .mobile-dropdown-icon {
    margin-right: auto;
    margin-left: unset;
}

html[dir="rtl"] .navbar .navbar-nav .nav-item a {
    text-align: right;
}

html[dir="rtl"] #services .service-details {
    flex-direction: row;
}

html[dir="rtl"] .service-item .info-icon {
    margin-right: 5px;
    margin-left: unset;
}

#services .service-details.planningSec,
#services .service-details.installationSec {
    padding-left: 0 !important;
}

@media screen and (max-width: 991px) {
    #services .execution-symbol {
        width: 23vw;
        height: 26vw;
        right: 0vw !important;
    }

    #services .design-symbol {
        width: 22.38vw;
        height: 22.38vw;
        right: 0 !important;
    }

    #services .planning-symbol {
        width: 22.38vw;
        height: 22.38vw;
        right: 0;
    }
}


.custom-timeline {
    padding-right: 30px;
    border-right: 4px solid #d8d8d8;
    margin-right: 10px;
    border-left: none;
}

.custom-timeline .dot {
    right: -48px;
}

.cusomtimeline-image {
    width: 24%;
    height: 300px;
}

.custom-timeline .timeline-progress {
    left: unset;
    right: -6px;
}

@media only screen and (max-width: 600px) {
    .masked-text {
        text-align: right;
        padding-right: 10px;
    }

    #services .installation-symbol {
        width: 29.25vw;
        height: 29.25vw;
        right: 12px;
    }
}

.timeline-item:nth-child(2) .timeline-content {
    order: 2;
    text-align: right;
}

.timeline-item:nth-child(3) .timeline-content {
    order: 1;
    text-align: left;
}

.timeline-item:nth-child(4) .timeline-content {
    order: 2;
    text-align: right;
}

.timeline-item:nth-child(5) .timeline-content {
    order: 1;
    text-align: left;
}

.dropdown-menu[data-bs-popper] {
    left: unset;
    right: 0;
}

.arabicLeft {
    text-align: left !important;
}

.masked-text,
.section-title,
.hero-text-medium {
    line-height: 1.4;
}

.text-left-xs {
    text-align: right !important;
}

.text-right-xs {
    text-align: left !important;
}

.text-theme {
    color: #9F7E39 !important;
}

.contact-details__info li .text {
    margin-left: unset;
    margin-right: 20px;
}