html[dir="rtl"] {
  font-family: 'Cairo', sans-serif;
}

html[dir="rtl"] .hero h1 {
  font-size: 4.5rem; /* Adjust for Arabic */
}

/* Specific LTR -> RTL overrides */
html[dir="rtl"] .ride-date {
  left: auto;
  right: 1rem;
}

html[dir="rtl"] .ride-arrow {
  right: auto;
  left: 1.5rem;
  transform: scaleX(-1); /* Flip arrow for RTL */
}

html[dir="rtl"] .ride-card:hover .ride-arrow {
  transform: scaleX(-1) translateY(-2px);
}

html[dir="rtl"] .btn-primary svg, html[dir="rtl"] .btn-outline svg {
  transform: scaleX(-1);
}

/* Reset margin directions */
html[dir="rtl"] .nav-links {
  margin-right: auto;
  margin-left: 0;
}

@media (max-width: 768px) {
  html[dir="rtl"] .nav-links {
    right: -100%;
    left: auto;
  }
  html[dir="rtl"] .nav-links.active {
    right: 0;
    left: auto;
  }
}