/* ==================================
   RTL OVERRIDES
   Arabic-specific adjustments for RTL layout
   ================================== */

/* Font Override for Arabic */
body {
  font-family: "Cairo", "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
}

/* Feature Text Underline - Flip Position */
.feature-text h3::after {
  right: auto;
  left: 0;
}

/* Feature Number - Flip Position */
.feature-number {
  right: auto;
  left: -1rem;
}

/* Control Item Border - Flip to Left */
.control-item {
  border-right: none;
  border-left: 3px solid var(--accent-gold);
}

.control-item:hover {
  border-left-width: 5px;
}

.control-item::before {
  right: auto;
  left: 0;
}

/* Form Elements - Right Align */
.form-group label {
  text-align: right;
}

.form-group input,
.form-group select,
.form-group textarea {
  text-align: right;
  direction: rtl;
}

/* FAQ Question - Reverse Layout */
.faq-question {
  flex-direction: row;
  text-align: right;
}

/* Client Info - Reverse Layout */
.client-info {
  flex-direction: row-reverse;
}

/* Quote Marks - Flip Position */
.quote::before {
  left: auto;
  right: -1rem;
}

/* Navigation Links - RTL Direction */
.nav-links {
  direction: rtl;
}

/* Contact Methods - RTL Direction */
.contact-methods {
  direction: rtl;
}

/* Portfolio Meta - RTL Direction */
.portfolio-meta {
  direction: rtl;
}

/* Social Links - RTL Direction */
.social-links {
  direction: rtl;
}

/* Steps Grid - Already set to RTL in layout.css */
/* Maintain RTL direction for steps */

/* Value Grid Items - Text Alignment */
.value-item {
  text-align: center;
}

/* Testimonial Text Alignment */
.testimonial-card {
  text-align: right;
}

/* Portfolio Content Alignment */
.portfolio-content {
  text-align: right;
}

/* Stat Card Alignment */
.stat-card {
  text-align: center;
}

/* Mobile Menu RTL - slides from left instead of right */
@media (max-width: 768px) {
  nav {
    right: auto;
    left: -100%;
    border-left: none;
    border-right: 1px solid var(--border-medium);
  }

  nav.active {
    right: auto;
    left: 0;
  }

  .nav-links {
    text-align: right;
  }
}
