/* ==========================================================================
   Gloservices RTL Stylesheet (for Arabic language)
   ========================================================================== */

/* Base direction */
html[dir="rtl"] body {
    direction: rtl;
    text-align: right;
}

/* ===================== NAVBAR ===================== */
/* Logo stays on LEFT even in RTL */
html[dir="rtl"] .navbar .navbar-brand {
    margin-right: 0 !important;
    margin-left: auto !important;
    border-right: none !important;
    border-left: none !important;
    flex-direction: row !important;
    order: 0 !important;
}

/* Nav items aligned to right (normal RTL) */
html[dir="rtl"] .navbar-nav {
    padding-right: 0;
}
html[dir="rtl"] .navbar-nav.ms-auto {
    margin-left: 0 !important;
    margin-right: auto !important;
}
html[dir="rtl"] .navbar-expand-lg .navbar-nav {
    padding-right: 0;
}
html[dir="rtl"] .navbar-expand-lg .navbar-collapse {
    flex-direction: row !important;
}
html[dir="rtl"] .navbar-toggler {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

/* Language selector stays on RIGHT side, keep LTR direction */
html[dir="rtl"] .language-selector {
    direction: ltr;
    order: 99 !important;
    margin-right: auto !important;
    margin-left: 0 !important;
}

/* ===================== MARGINS (Bootstrap override) ===================== */
html[dir="rtl"] .me-0 { margin-right: 0 !important; margin-left: 0 !important; }
html[dir="rtl"] .me-1 { margin-right: 0 !important; margin-left: 0.25rem !important; }
html[dir="rtl"] .me-2 { margin-right: 0 !important; margin-left: 0.5rem !important; }
html[dir="rtl"] .me-3 { margin-right: 0 !important; margin-left: 1rem !important; }
html[dir="rtl"] .me-4 { margin-right: 0 !important; margin-left: 1.5rem !important; }
html[dir="rtl"] .me-5 { margin-right: 0 !important; margin-left: 3rem !important; }

html[dir="rtl"] .ms-0 { margin-left: 0 !important; margin-right: 0 !important; }
html[dir="rtl"] .ms-1 { margin-left: 0 !important; margin-right: 0.25rem !important; }
html[dir="rtl"] .ms-2 { margin-left: 0 !important; margin-right: 0.5rem !important; }
html[dir="rtl"] .ms-3 { margin-left: 0 !important; margin-right: 1rem !important; }
html[dir="rtl"] .ms-4 { margin-left: 0 !important; margin-right: 1.5rem !important; }
html[dir="rtl"] .ms-5 { margin-left: 0 !important; margin-right: 3rem !important; }
html[dir="rtl"] .ms-auto { margin-left: 0 !important; margin-right: auto !important; }
html[dir="rtl"] .me-auto { margin-right: 0 !important; margin-left: auto !important; }

/* ===================== PADDINGS (Bootstrap override) ===================== */
html[dir="rtl"] .pe-0 { padding-right: 0 !important; padding-left: 0 !important; }
html[dir="rtl"] .pe-1 { padding-right: 0 !important; padding-left: 0.25rem !important; }
html[dir="rtl"] .pe-2 { padding-right: 0 !important; padding-left: 0.5rem !important; }
html[dir="rtl"] .pe-3 { padding-right: 0 !important; padding-left: 1rem !important; }
html[dir="rtl"] .pe-4 { padding-right: 0 !important; padding-left: 1.5rem !important; }
html[dir="rtl"] .pe-5 { padding-right: 0 !important; padding-left: 3rem !important; }

html[dir="rtl"] .ps-0 { padding-left: 0 !important; padding-right: 0 !important; }
html[dir="rtl"] .ps-1 { padding-left: 0 !important; padding-right: 0.25rem !important; }
html[dir="rtl"] .ps-2 { padding-left: 0 !important; padding-right: 0.5rem !important; }
html[dir="rtl"] .ps-3 { padding-left: 0 !important; padding-right: 1rem !important; }
html[dir="rtl"] .ps-4 { padding-left: 0 !important; padding-right: 1.5rem !important; }
html[dir="rtl"] .ps-5 { padding-left: 0 !important; padding-right: 3rem !important; }

/* ===================== TEXT ALIGNMENT ===================== */
html[dir="rtl"] .text-start { text-align: right !important; }
html[dir="rtl"] .text-end { text-align: left !important; }

/* ===================== BORDERS ===================== */
html[dir="rtl"] .border-end {
    border-right: none !important;
    border-left: 1px solid #dee2e6 !important;
}
html[dir="rtl"] .border-start {
    border-left: none !important;
    border-right: 1px solid #dee2e6 !important;
}

/* ============================================================
   ICONS - Enhanced RTL
   ============================================================ */
html[dir="rtl"] .fa-arrow-right:before { content: "\f060"; }
html[dir="rtl"] .fa-arrow-left:before { content: "\f061"; }
html[dir="rtl"] .fa-chevron-right:before { content: "\f053"; }
html[dir="rtl"] .fa-chevron-left:before { content: "\f054"; }
html[dir="rtl"] .back-to-top { right: auto !important; left: 24px !important; }
html[dir="rtl"] .back-to-top i { transform: none !important; }
html[dir="rtl"] .fa-angle-right:before { content: "\f104"; }
html[dir="rtl"] .fa-angle-left:before { content: "\f105"; }

html[dir="rtl"] .check-list-icon {
    margin-right: 0;
    margin-left: 10px;
}

html[dir="rtl"] .feature-icon-box {
    margin-right: 0;
    margin-left: 12px;
}

html[dir="rtl"] .counter-icon {
    margin-right: 0;
    margin-left: 12px;
}

/* ============================================================
   MARGINS (Bootstrap override)
   ============================================================ */
html[dir="rtl"] .me-0 { margin-right: 0 !important; margin-left: 0 !important; }
html[dir="rtl"] .me-1 { margin-right: 0 !important; margin-left: 0.25rem !important; }
html[dir="rtl"] .me-2 { margin-right: 0 !important; margin-left: 0.5rem !important; }
html[dir="rtl"] .me-3 { margin-right: 0 !important; margin-left: 1rem !important; }
html[dir="rtl"] .me-4 { margin-right: 0 !important; margin-left: 1.5rem !important; }
html[dir="rtl"] .me-5 { margin-right: 0 !important; margin-left: 3rem !important; }

html[dir="rtl"] .ms-0 { margin-left: 0 !important; margin-right: 0 !important; }
html[dir="rtl"] .ms-1 { margin-left: 0 !important; margin-right: 0.25rem !important; }
html[dir="rtl"] .ms-2 { margin-left: 0 !important; margin-right: 0.5rem !important; }
html[dir="rtl"] .ms-3 { margin-left: 0 !important; margin-right: 1rem !important; }
html[dir="rtl"] .ms-4 { margin-left: 0 !important; margin-right: 1.5rem !important; }
html[dir="rtl"] .ms-5 { margin-left: 0 !important; margin-right: 3rem !important; }
html[dir="rtl"] .ms-auto { margin-left: 0 !important; margin-right: auto !important; }
html[dir="rtl"] .me-auto { margin-right: 0 !important; margin-left: auto !important; }

/* ============================================================
   PADDINGS (Bootstrap override)
   ============================================================ */
html[dir="rtl"] .pe-0 { padding-right: 0 !important; padding-left: 0 !important; }
html[dir="rtl"] .pe-1 { padding-right: 0 !important; padding-left: 0.25rem !important; }
html[dir="rtl"] .pe-2 { padding-right: 0 !important; padding-left: 0.5rem !important; }
html[dir="rtl"] .pe-3 { padding-right: 0 !important; padding-left: 1rem !important; }
html[dir="rtl"] .pe-4 { padding-right: 0 !important; padding-left: 1.5rem !important; }
html[dir="rtl"] .pe-5 { padding-right: 0 !important; padding-left: 3rem !important; }

html[dir="rtl"] .ps-0 { padding-left: 0 !important; padding-right: 0 !important; }
html[dir="rtl"] .ps-1 { padding-left: 0 !important; padding-right: 0.25rem !important; }
html[dir="rtl"] .ps-2 { padding-left: 0 !important; padding-right: 0.5rem !important; }
html[dir="rtl"] .ps-3 { padding-left: 0 !important; padding-right: 1rem !important; }
html[dir="rtl"] .ps-4 { padding-left: 0 !important; padding-right: 1.5rem !important; }
html[dir="rtl"] .ps-5 { padding-left: 0 !important; padding-right: 3rem !important; }

/* ============================================================
   TEXT ALIGNMENT
   ============================================================ */
html[dir="rtl"] .text-start { text-align: right !important; }
html[dir="rtl"] .text-end { text-align: left !important; }

/* ============================================================
   BORDERS
   ============================================================ */
html[dir="rtl"] .border-end {
    border-right: none !important;
    border-left: 1px solid #dee2e6 !important;
}
html[dir="rtl"] .border-start {
    border-left: none !important;
    border-right: 1px solid #dee2e6 !important;
}

/* ============================================================
   BREADCRUMB
   ============================================================ */
html[dir="rtl"] .breadcrumb-item + .breadcrumb-item::before {
    content: "\\";
}
html[dir="rtl"] .breadcrumb-item + .breadcrumb-item {
    padding-left: 0;
    padding-right: 0.5rem;
}

/* ============================================================
   LIST INLINE
   ============================================================ */
html[dir="rtl"] .list-inline-item:not(:last-child) {
    margin-left: 0.5rem;
    margin-right: 0;
}

/* ============================================================
   FORMS
   ============================================================ */
html[dir="rtl"] .form-control {
    text-align: right;
}

/* ============================================================
   CAROUSEL (images) - keep LTR
   ============================================================ */
html[dir="rtl"] .owl-carousel .owl-stage,
html[dir="rtl"] .owl-carousel,
html[dir="rtl"] .owl-carousel .owl-item {
    direction: ltr;
}

/* ============================================================
   HERO CAROUSEL CONTENT (RTL)
   ============================================================ */
/* Force text direction and alignment inside the hero slide content
   even though the Owl carousel wrapper is LTR */
html[dir="rtl"] .hero-slide .hero-content {
    direction: rtl;
    text-align: right;
}

html[dir="rtl"] .hero-slide .row.justify-content-start {
    justify-content: flex-end !important;
}

html[dir="rtl"] .hero-content .hero-badge {
    direction: rtl;
    justify-content: flex-end;
}

html[dir="rtl"] .hero-content h1 {
    text-align: right;
}

html[dir="rtl"] .hero-content p {
    text-align: right;
    margin-right: 0;
    margin-left: auto;
}

html[dir="rtl"] .hero-content .hero-buttons {
    direction: rtl;
    justify-content: flex-start;
}

html[dir="rtl"] .hero-content .hero-buttons .btn i {
    margin-left: 0;
    margin-right: 8px;
}

/* Miniatures (dots) du carousel héro : déplacées à gauche en RTL */
html[dir="rtl"] .hero-carousel .owl-dots {
    right: auto !important;
    left: 40px !important;
}


/* ============================================================
   POSITION UTILITIES
   ============================================================ */
html[dir="rtl"] .position-absolute.top-0.end-0 {
    left: 0 !important;
    right: auto !important;
}

/* ============================================================
   FOOTER
   ============================================================ */
html[dir="rtl"] .footer .text-start {
    text-align: right !important;
}

/* ============================================================
   SERVICES BLUEPRINT (RTL)
   ============================================================ */

/* Accent line slides from right */
html[dir="rtl"] .service-archi-card .archi-card-accent {
    transform-origin: right;
}

/* Laser scan animation direction reversed for RTL */
html[dir="rtl"] .archi-drawing-canvas::after {
    animation: blueprintScanRTL 1.6s ease-in-out infinite;
}

@keyframes blueprintScanRTL {
    0% { left: 150%; }
    100% { left: -100%; }
}

/* Learn-more hover animation reversed */
html[dir="rtl"] .archi-learn-more:hover i {
    transform: translateX(-4px);
}

/* Corner marks are naturally mirrored by RTL borders */

/* Decorative elements repositioning */
html[dir="rtl"] .deco-protractor {
    right: auto;
    left: -20px;
    transform: scaleX(-1); /* mirror protractor */
}

html[dir="rtl"] .deco-dimensions {
    left: auto;
    right: -30px;
    transform: scaleX(-1); /* mirror dimensions */
}

html[dir="rtl"] .deco-angle {
    left: auto;
    right: 5%;
    transform: scaleX(-1); /* mirror angle */
}

html[dir="rtl"] .deco-cross-1 { right: auto; left: 22%; }
html[dir="rtl"] .deco-cross-2 { right: auto; left: 10%; }
html[dir="rtl"] .deco-cross-3 { left: auto; right: 15%; }

/* ============================================================
   BUTTONS
   ============================================================ */
html[dir="rtl"] .btn .ms-3 {
    margin-left: 0 !important;
    margin-right: 1rem !important;
}

html[dir="rtl"] .portfolio-btn .btn-lg-square {
    margin-left: 0;
    margin-right: 5px;
}

html[dir="rtl"] .portfolio-btn .btn-lg-square:last-child {
    margin-right: 0;
}

/* ============================================================
   CORRECTIONS DU FOOTER (RTL)
   ============================================================ */

/* Alignement à droite de la ligne verte d'accentuation sous les titres */
html[dir="rtl"] .footer-title::after {
    left: auto;
    right: 0;
}

/* Inversion du décalage au survol des liens (vers la gauche au lieu de la droite) */
html[dir="rtl"] .footer-links li a:hover,
html[dir="rtl"] .footer-contact-list li a:hover {
    transform: translateX(-6px) !important;
}

/* Alignement de la barre de copyright sur écran large */
@media (min-width: 768px) {
    html[dir="rtl"] .text-md-start {
        text-align: right !important;
    }
    html[dir="rtl"] .text-md-end {
        text-align: left !important;
    }
}

/* ============================================================
   NOS ENGAGEMENTS (RTL)
   ============================================================ */
html[dir="rtl"] .engagement-num {
    right: auto !important;
    left: 24px !important;
}

html[dir="rtl"] .engagement-card {
    text-align: right !important;
}

html[dir="rtl"] .engagement-card:hover .engagement-icon-box,
html[dir="rtl"] .engagement-card.auto-hover .engagement-icon-box {
    transform: scale(1.08) rotate(4deg) !important;
}

/* ============================================================
   TÉMOIGNAGES SLIDER (RTL)
   ============================================================ */
html[dir="rtl"] .tc-testimonials-dark {
    direction: rtl !important;
    text-align: right !important;
}

html[dir="rtl"] .testimonial-img-controls {
    left: auto !important;
    right: 20px !important;
}

html[dir="rtl"] .testimonial-quote-text {
    text-align: right !important;
}

html[dir="rtl"] .testimonial-avatar-wrap {
    margin-right: 0 !important;
    margin-left: 1rem !important;
}

/* RTL navigation arrows flip inside dark slider */
html[dir="rtl"] .tc-testimonials-dark .fa-chevron-left:before {
    content: "\f054" !important;
}
html[dir="rtl"] .tc-testimonials-dark .fa-chevron-right:before {
    content: "\f053" !important;
}

/* ============================================================
   PROJECT CARDS & PAGINATION (RTL)
   ============================================================ */
html[dir="rtl"] .project-badge-tag {
    right: auto !important;
    left: 15px !important;
}

html[dir="rtl"] .btn-project-cta i {
    margin-left: 0 !important;
    margin-right: 0.5rem !important;
    transform: scaleX(-1);
}

html[dir="rtl"] .project-meta-pill i {
    margin-right: 0 !important;
    margin-left: 0.25rem !important;
}

/* ============================================================
   ARABIC FIXES: LOGO BORDER & SVG DRAWINGS
   ============================================================ */
/* Remove vertical/horizontal border line next to the logo in RTL */
html[dir="rtl"] .navbar-brand,
html[dir="rtl"] .navbar .navbar-brand {
    border: none !important;
    border-right: none !important;
    border-left: none !important;
}

/* Force LTR direction on technical drawings in RTL to prevent text alignment/shifting bugs */
html[dir="rtl"] .service-single-drawing-wrap,
html[dir="rtl"] .service-single-drawing-wrap svg,
html[dir="rtl"] .archi-svg-drawing,
html[dir="rtl"] .archi-svg-drawing text {
    direction: ltr !important;
    text-align: left !important;
}