/* ==========================================================================
   RTL overrides for Arabic (ar/) pages
   Loaded after style.css — flips layout-critical directional properties
   for this Bootstrap-based template. Not exhaustive — focuses on
   navbar, icon lists, footer columns, floated images, cards, testimonials.
   ========================================================================== */

body {
    direction: rtl;
    text-align: right;
}

/* ======= Font (Alexandria / IBM Plex Sans Arabic replaces Outfit for Arabic) =======
   Excludes icon classes (fa-*, ti-*, flaticon-*) so FontAwesome / Themify /
   Flaticon glyphs -- which rely on their own font-family set directly on
   the icon element -- keep rendering correctly. */
body,
body *:not([class*="fa-"]):not([class*="ti-"]):not([class*="flaticon-"]) {
    font-family: "Alexandria", "IBM Plex Sans Arabic", sans-serif !important;
}

/* ======= Logo / Navbar ======= */
.logo-wrapper {
    float: right;
}
.ms-auto {
    margin-right: auto !important;
    margin-left: 0 !important;
}
@media screen and (max-width: 991px) {
    .navbar .logo {
        text-align: right;
        margin-right: 0px;
    }
    .navbar .navbar-collapse {
        text-align: right;
    }
    .navbar .dropdown-menu li a {
        padding: 0 15px;
    }
}

/* Dropdown menus */
.navbar .dropdown-menu {
    text-align: right;
}
.navbar .dropdown-menu .dropdown-item i {
    padding: 13px 5px 0 0;
    float: left;
}
.navbar .dropdown-menu li:hover {
    padding-left: 0;
    padding-right: 5px;
}
.navbar .dropdown-menu .dropdown-menu.pull-left {
    right: auto;
    left: 100%;
}
@media screen and (min-width: 992px) {
    .navbar .dropdown-menu .dropdown-menu {
        right: calc(100% + 5px);
        left: auto;
    }
}

/* ======= Section line title ======= */
.section-linetitle .line {
    margin-left: 0;
    margin-right: 40px;
}
.section-linetitle .title {
    margin-left: 0;
    margin-right: 100px;
}

/* ======= Page list (checkmark lists) ======= */
.page-list-icon {
    float: right;
    margin-left: 15px;
    margin-right: 0;
}
.page-list li {
    text-align: right;
}

/* ======= Section info (tag + desc) ======= */
.section-info .icons {
    margin-right: 0;
    margin-left: 10px;
}
.section-info .tag {
    margin-right: 0;
    margin-left: 15px;
}

/* ======= Icons / star rating / call center ======= */
.call-center .text {
    margin-left: 0;
    margin-right: 15px;
}
.icons {
    text-align: right;
}

/* ======= Author / testimonial cards ======= */
.author-img {
    margin-left: 15px;
    margin-right: 0;
}
.author-info {
    text-align: right;
}
.testimonials2 .info,
.testimonials2 .author-img,
.testimonials2 .author-info {
    flex-direction: row-reverse;
}

/* ======= Social icons / inline lists ======= */
.list-inline > li {
    margin-left: 10px;
    margin-right: 0;
}
.social-icons ul.list-inline {
    padding-right: 0;
}

/* ======= Footer ======= */
.footer .top .item.text-end-left,
.footer .item.text-end-left {
    text-align: left !important;
}
.footer .links ul {
    text-align: right;
}
.footer .bottom .text-end {
    text-align: left !important;
}
.footer .top .col-md-4 {
    text-align: right;
}

/* ======= Generic Bootstrap text utilities used in this template ======= */
.text-end {
    text-align: left !important;
}
.text-end-left {
    text-align: right !important;
}
.text-center {
    text-align: center !important;
}

/* ======= Floated images / items ======= */
.about-fact-item {
    text-align: right;
}
.faq-contact-item {
    text-align: right;
}
.contact-box .item {
    text-align: right;
}

/* ======= Accordion (FAQ) ======= */
.acc-btn .count {
    margin-left: 8px;
    margin-right: 0;
}
.accordion-box {
    text-align: right;
}

/* ======= Forms ======= */
.form-group .form-icon {
    left: auto;
    right: 25px;
}
.form-group input,
.form-group select,
.form-group textarea {
    padding-left: 16px !important;
    padding-right: 55px !important;
}

/* ======= WhatsApp floating button (mirror to left in RTL) ======= */
.whatsapp-float {
    right: auto;
    left: 25px;
}

/* ======= Owl carousel nav ======= */
.owl-theme .owl-prev {
    right: 10px !important;
    left: auto !important;
    float: right;
}
.owl-theme .owl-next {
    left: 10px !important;
    right: auto !important;
    float: left;
}

/* ======= Blockquote (post.html) ======= */
blockquote:before {
    right: auto;
    left: 45px;
}
blockquote cite {
    padding-left: 0;
    padding-right: 40px;
}
blockquote cite:before {
    left: auto;
    right: 0;
}

/* ======= Team / portfolio cards ======= */
.team .con,
.portfolio2 .item {
    text-align: right;
}

/* ======= Language toggle (keep "English" letters in correct LTR order) ======= */
.rolling-text[dir="ltr"] {
    direction: ltr;
    unicode-bidi: isolate;
}

/* ======= Phone numbers (keep digits in correct LTR order) ======= */
[dir="ltr"] {
    unicode-bidi: isolate;
}
.phone a[dir="ltr"],
.faq-contact-value[dir="ltr"] {
    display: inline-block;
}

/* ======= Post next/prev ======= */
.nex-prv .text-left {
    text-align: right !important;
}
.nex-prv .text-right {
    text-align: left !important;
}

/* ======= Feature/service card corner arrow (up-right -> up-left) =======
   The mirror transform is applied only to the icon glyph (::before), not
   the badge box itself -- otherwise it would also flip the badge's
   asymmetric border-radius/border-color shape below. */
.services .item .arrow {
    right: auto;
    left: 30px;
}
.services .item .arrow::before {
    display: inline-block;
    transform: scaleX(-1);
}
.services .item:hover .arrow {
    right: auto;
    left: 0;
    border-radius: 4px 0 50px 0;
    border-top: 1px solid transparent;
    border-bottom: 1px solid #c5a47e;
    border-left: 1px solid transparent;
    border-right: 1px solid #c5a47e;
}

/* ======= Process step connector arrow (points toward previous step) =======
   Desktop only: process-items sit in a flex row that RTL reverses visually,
   so the connector must move to the item's left edge and point left instead
   of right. On mobile the items stack in a column (unaffected by RTL), so
   the original downward-pointing connector is left untouched. */
@media screen and (min-width: 992px) {
    .process .process-area .process-item:not(:last-child)::after {
        right: auto;
        left: -40px;
        transform: translateY(-50%) scaleX(-1);
    }
}

/* ======= Scrolling services ticker =======
   The two duplicate .content blocks rely on plain left-to-right flex
   order to line up edge-to-edge for the seamless marquee loop. RTL
   reverses that flex order, breaking the loop and the scroll direction,
   so force ltr layout here; the Arabic phrases inside still render
   correctly RTL via the Unicode bidi algorithm. */
.scrolling.scrolling-ticker .wrapper {
    direction: ltr;
}