/* ==========================================================================
   CODEX PRO - RTL Stylesheet (Arabic Specific Overrides)
   ========================================================================== */

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

html[dir="rtl"] body {
  font-family: var(--font-ar);
  letter-spacing: 0;
}

/* Titles and Typography in Arabic */
html[dir="rtl"] .hero-title,
html[dir="rtl"] .section-title,
html[dir="rtl"] .service-title,
html[dir="rtl"] .value-title,
html[dir="rtl"] .step-title,
html[dir="rtl"] .why-banner-title {
  letter-spacing: normal;
  line-height: 1.35;
}

/* Code card stays LTR for proper syntax display */
html[dir="rtl"] .code-editor,
html[dir="rtl"] .code-line {
  direction: ltr;
  text-align: left;
  font-family: var(--font-mono);
}

/* Floating Badges Alignment */
html[dir="rtl"] .floating-badge.badge-1 {
  right: auto;
  left: -20px;
}

html[dir="rtl"] .floating-badge.badge-2 {
  left: auto;
  right: -20px;
}

/* Back to top button in RTL moves to bottom-left */
html[dir="rtl"] .back-to-top {
  right: auto;
  left: 25px;
}

/* Form Controls */
html[dir="rtl"] .form-control {
  text-align: right;
}

html[dir="rtl"] select.form-control {
  background-position: left 1rem center;
}

/* Footer link hover animation */
html[dir="rtl"] .footer-link:hover {
  transform: translateX(-4px);
}

/* Stats Separator Border */
html[dir="rtl"] .stat-item:not(:last-child)::after {
  right: auto;
  left: 0;
}

/* Icons within buttons */
html[dir="rtl"] .btn i {
  order: 2;
}

html[dir="rtl"] .btn span {
  order: 1;
}

/* Step numbering */
html[dir="rtl"] .step-num {
  right: auto;
  left: 1.25rem;
}

/* Mobile Nav Drawer */
html[dir="rtl"] .mobile-nav {
  right: auto;
  left: -340px;
  border-left: none;
  border-right: 1px solid #e2e8f0;
  box-shadow: 15px 0 35px rgba(0, 0, 0, 0.15);
  transition: left var(--transition-normal), visibility var(--transition-normal);
}

html[dir="rtl"] .mobile-nav.active {
  left: 0;
  right: auto;
}

/* Service link arrows & breadcrumbs in RTL */
html[dir="rtl"] .btn-service-link i,
html[dir="rtl"] .breadcrumb-separator i {
  transform: scaleX(-1);
}

/* WhatsApp Widget RTL */
html[dir="rtl"] .wa-tooltip-close {
  left: auto;
  right: 6px;
}

html[dir="rtl"] .wa-tooltip-content {
  padding-left: 0;
  padding-right: 12px;
}

html[dir="rtl"] .wa-badge-unread {
  right: auto;
  left: -2px;
}

/* RTL Mobile Responsive Rules */
@media (max-width: 768px) {
  /* Ensure all dividers are removed in RTL on tablet/mobile */
  html[dir="rtl"] .stat-item::after,
  html[dir="rtl"] .stat-item:not(:last-child)::after {
    display: none !important;
  }

  /* Kill floating badges in RTL */
  html[dir="rtl"] .floating-badge {
    display: none !important;
  }
}

@media (max-width: 480px) {
  /* Back-to-top in RTL mobile sits cleanly on bottom-left, while WhatsApp sits on bottom-right */
  html[dir="rtl"] .back-to-top {
    left: 16px;
    right: auto;
    bottom: 18px;
    width: 42px;
    height: 42px;
  }

  html[dir="rtl"] .codex-wa-widget {
    right: 16px;
    left: auto;
    bottom: 18px;
  }

  /* WhatsApp Popup centered with 12px margin on both sides */
  html[dir="rtl"] .wa-chat-popup {
    left: 12px !important;
    right: 12px !important;
  }
}