/* ============================================================
   RTL SUPPORT FOR ARABIC
   ============================================================ */
/* This file is kept minimal as the main RTL rules are in animations.css for layout shifts. 
   When Arabic is active, document dir="rtl" is set automatically by i18n.js.
*/
[dir="rtl"] {
  /* Ensure correct text alignment across all text blocks */
  text-align: right;
}

[dir="rtl"] .hero-inner,
[dir="rtl"] .about-inner,
[dir="rtl"] .grid,
[dir="rtl"] .process-grid,
[dir="rtl"] .footer-main {
  direction: rtl;
}

/* Fix mobile drawer sliding direction */
[dir="rtl"] .nav-drawer__panel {
  transform: translateX(100%);
  border-right: none;
  border-left: 1px solid rgba(255, 255, 255, 0.08);
}
[dir="rtl"] .nav-drawer.open .nav-drawer__panel {
  transform: translateX(0);
}

/* Fix numbered stats so symbols like %, + stay on the right side */
[dir="rtl"] .hero-stat__num,
[dir="rtl"] .stat-card__number {
  direction: ltr;
  display: inline-block;
}

/* Flip directional icons (like arrows) */
[dir="rtl"] i[data-lucide*="arrow-right"],
[dir="rtl"] svg[data-lucide*="arrow-right"] {
  transform: scaleX(-1);
}

/* Fix timeline lines for RTL */
[dir="rtl"] .timeline::before {
  left: auto;
  right: 20px;
}

[dir="rtl"] .timeline-item::before {
  left: auto;
  right: -32px;
}
