/* ==========================================================================
   GLOBAL RTL FIXES
   ========================================================================== */
html[dir="rtl"],
body[dir="rtl"],
body.rtl {
    direction: rtl !important;
    unicode-bidi: bidi-override;
    font-family: 'Tajawal', sans-serif !important;
}

/* If you want most text right aligned by default */
body[dir="rtl"] {
    text-align: right;
}

/* Utility: force LTR inside RTL (emails, phones, etc.) */
.text-ltr {
    direction: ltr;
    text-align: left !important;
}

/* ==========================================================================
   BOOTSTRAP FLIPS (margin/padding logical fix)
   ========================================================================== */
[dir="rtl"] .ms-1 { margin-right: .25rem !important; margin-left: 0 !important; }
[dir="rtl"] .ms-2 { margin-right: .5rem !important; margin-left: 0 !important; }
[dir="rtl"] .ms-3 { margin-right: 1rem !important; margin-left: 0 !important; }
[dir="rtl"] .ms-4 { margin-right: 1.5rem !important; margin-left: 0 !important; }
[dir="rtl"] .ms-5 { margin-right: 3rem !important; margin-left: 0 !important; }

[dir="rtl"] .me-1 { margin-left: .25rem !important; margin-right: 0 !important; }
[dir="rtl"] .me-2 { margin-left: .5rem !important; margin-right: 0 !important; }
[dir="rtl"] .me-3 { margin-left: 1rem !important; margin-right: 0 !important; }
[dir="rtl"] .me-4 { margin-left: 1.5rem !important; margin-right: 0 !important; }
[dir="rtl"] .me-5 { margin-left: 3rem !important; margin-right: 0 !important; }

/* Padding flip */
[dir="rtl"] .ps-0 { padding-right: 0 !important; }
[dir="rtl"] .ps-1 { padding-right: .25rem !important; padding-left: 0 !important; }
[dir="rtl"] .ps-2 { padding-right: .5rem !important; padding-left: 0 !important; }
[dir="rtl"] .ps-3 { padding-right: 1rem !important; padding-left: 0 !important; }
[dir="rtl"] .ps-4 { padding-right: 1.5rem !important; padding-left: 0 !important; }
[dir="rtl"] .ps-5 { padding-right: 3rem !important; padding-left: 0 !important; }

[dir="rtl"] .pe-0 { padding-left: 0 !important; }
[dir="rtl"] .pe-1 { padding-left: .25rem !important; padding-right: 0 !important; }
[dir="rtl"] .pe-2 { padding-left: .5rem !important; padding-right: 0 !important; }
[dir="rtl"] .pe-3 { padding-left: 1rem !important; padding-right: 0 !important; }
[dir="rtl"] .pe-4 { padding-left: 1.5rem !important; padding-right: 0 !important; }
[dir="rtl"] .pe-5 { padding-left: 3rem !important; padding-right: 1.5rem !important; }

/* ==========================================================================
   TEXT ALIGNMENT FIXES
   ========================================================================== */
[dir="rtl"] .text-start { text-align: right !important; }
[dir="rtl"] .text-end   { text-align: left !important; }

/* ==========================================================================
   NAVBAR & HEADER FIXES
   ========================================================================== */
[dir="rtl"] .navbar-nav {
    padding-right: 0;
}

[dir="rtl"] .navbar-nav .nav-item .dropdown-menu {
    text-align: right;
    left: auto;
    right: 0;
}

[dir="rtl"] .offcanvas.offcanvas-top {
    direction: rtl;
}

/* Language switcher alignment */
[dir="rtl"] .lang-switcher span {
    margin: 0 5px;
}

/* ==========================================================================
   BUTTONS & SVG ICONS (only arrows, not every svg)
   ========================================================================== */
/* Keep this ONLY for arrows you know should flip.
   If some icons look wrong, remove this block. */
[dir="rtl"] .btn .icon-arrow,
[dir="rtl"] .btn .arrow-icon svg {
    transform: scaleX(-1);
}

/* Small arrow icons (next/prev etc.) */
[dir="rtl"] svg[width="24"][height="14"] {
    transform: scaleX(-1) !important;
}

/* ==========================================================================
   SWIPER RTL SUPPORT
   ========================================================================== */
/* Let Swiper handle RTL via JS. Do NOT force direction here.
   In JS, when you init Swiper, use:
   direction: document.documentElement.dir === 'rtl' ? 'rtl' : 'ltr'
*/

/* ==========================================================================
   HERO, CTA, FEATURES SECTIONS
   ========================================================================== */
[dir="rtl"] .section-cta-7,
[dir="rtl"] .section-cta-8,
[dir="rtl"] .section-cta-9,
[dir="rtl"] .section-project-2,
[dir="rtl"] .section-features {
    text-align: right;
}

/* ==========================================================================
   TEAMS & CARDS
   ========================================================================== */
[dir="rtl"] .card-team .fs-6,
[dir="rtl"] .card-team p {
    text-align: right !important;
}

/* NOTE: we removed the global .position-absolute flip
   so overlays (badges, hover cards) keep their designed position */

/* ==========================================================================
   FAQ SECTION
   ========================================================================== */
[dir="rtl"] .accordion .card-header a {
    text-align: right !important;
}

[dir="rtl"] .accordion .arrow {
    transform: rotate(180deg);
}

/* ==========================================================================
   TESTIMONIALS
   ========================================================================== */
[dir="rtl"] .card-testimonial-3 {
    text-align: right !important;
}

[dir="rtl"] .card-testimonial-3 img.avatar-lg {
    margin-left: 1rem;
    margin-right: 0;
}

/* ==========================================================================
   BLOG SECTION FIXES
   ========================================================================== */
[dir="rtl"] .section-blog-1 .card-team {
    text-align: right !important;
}

[dir="rtl"] .section-blog-1 .icon-shape {
    margin-left: 10px;
    margin-right: 0;
}

[dir="rtl"] .section-blog-1 .content {
    margin-right: 30px !important;
    margin-left: 0 !important;
}

/* ==========================================================================
   CONTACT FORM
   ========================================================================== */
[dir="rtl"] .input-group .icon-input {
    border-left: 0 !important;
    border-right: 1px solid #fff !important;
}

[dir="rtl"] .input-group .form-control {
    border-right: 0 !important;
}

[dir="rtl"] textarea {
    text-align: right;
    direction: rtl;
}

/* ==========================================================================
   FOOTER
   ========================================================================== */
[dir="rtl"] footer .text-start {
    text-align: right !important;
}

[dir="rtl"] footer .social-icons a {
    margin-left: 0.5rem;
}

/* ==========================================================================
   LISTS
   ========================================================================== */
[dir="rtl"] ul,
[dir="rtl"] li {
    text-align: right;
}

[dir="rtl"] ul.phase-items li img {
    margin-left: 10px !important;
    margin-right: 0 !important;
}