/* =============================================================
   RTL.CSS — Right-to-Left Layout Overrides
   Al Buraimi Ministry eServices Web Portal
   ============================================================= */

/* ─────────────────────────────────────────
   Global RTL Body
   ───────────────────────────────────────── */

[dir="rtl"] body {
  font-family: var(--font-arabic);
  letter-spacing: 0; /* Arabic doesn't use letter-spacing */
}

[dir="rtl"] h1,
[dir="rtl"] h2,
[dir="rtl"] h3,
[dir="rtl"] h4,
[dir="rtl"] h5 {
  font-family: var(--font-arabic);
  font-weight: 700;
}

/* ─────────────────────────────────────────
   Arrow Icon Flip
   ───────────────────────────────────────── */

[dir="rtl"] .icon-arrow,
[dir="rtl"] .arrow-icon,
[dir="rtl"] .login-step__back::before,
[dir="rtl"] .back-btn::before {
  transform: scaleX(-1);
  display: inline-block;
}

/* ─────────────────────────────────────────
   Navbar RTL
   ───────────────────────────────────────── */

[dir="rtl"] .navbar__inner {
  flex-direction: row-reverse;
}

[dir="rtl"] .navbar__link::after {
  inset-inline-start: auto;
  inset-inline-end: 0;
}

[dir="rtl"] .mobile-menu__link:hover {
  padding-inline-start: 0;
  padding-inline-end: var(--space-2);
}

/* ─────────────────────────────────────────
   Footer RTL
   ───────────────────────────────────────── */

[dir="rtl"] .footer__links a::before {
  content: '‹';
}

/* ─────────────────────────────────────────
   Step Progress RTL
   ───────────────────────────────────────── */

[dir="rtl"] .step-progress__item::after {
  inset-inline-end: auto;
  inset-inline-start: -12px;
  border-inline-start: none;
  border-inline-end: 12px solid var(--color-white);
}

[dir="rtl"] .step-progress__item--active::after {
  border-inline-end-color: var(--color-accent-green);
}

[dir="rtl"] .step-progress__item--completed::after {
  border-inline-end-color: var(--color-primary);
}

/* ─────────────────────────────────────────
   Toast RTL
   ───────────────────────────────────────── */

[dir="rtl"] .toast-container {
  inset-inline-end: auto;
  inset-inline-start: var(--space-6);
}

[dir="rtl"] .toast {
  animation-name: slideInLeft;
}

/* ─────────────────────────────────────────
   Select Arrow RTL
   ───────────────────────────────────────── */

[dir="rtl"] .input-field--select {
  background-position: left var(--space-3) center;
  padding-inline-end: var(--space-4);
  padding-inline-start: var(--space-8);
}

/* ─────────────────────────────────────────
   Hero Section RTL
   ───────────────────────────────────────── */

[dir="rtl"] .hero__text {
  text-align: end;
}

[dir="rtl"] .hero__actions {
  justify-content: flex-end;
}

[dir="rtl"] .hero__eyebrow::before {
  margin-inline-end: var(--space-2);
  margin-inline-start: 0;
}

/* ─────────────────────────────────────────
   Login Card RTL
   ───────────────────────────────────────── */

[dir="rtl"] .login-card {
  text-align: end;
}

[dir="rtl"] .login-card__title {
  text-align: center;
}

/* ─────────────────────────────────────────
   Service Cards RTL
   ───────────────────────────────────────── */

[dir="rtl"] .service-category-card {
  text-align: center;
}

/* ─────────────────────────────────────────
   Accessibility Panel RTL
   ───────────────────────────────────────── */

[dir="rtl"] .accessibility-panel {
  inset-inline-start: auto;
  inset-inline-end: var(--space-4);
}

/* ─────────────────────────────────────────
   Data Table RTL
   ───────────────────────────────────────── */

[dir="rtl"] .data-table thead th,
[dir="rtl"] .data-table tbody td {
  text-align: end;
}

/* ─────────────────────────────────────────
   Form RTL
   ───────────────────────────────────────── */

[dir="rtl"] .form-label {
  text-align: end;
}

[dir="rtl"] .file-upload-area {
  direction: rtl;
}

[dir="rtl"] .form-actions {
  flex-direction: row-reverse;
}

/* ─────────────────────────────────────────
   Stats Section RTL
   ───────────────────────────────────────── */

[dir="rtl"] .stat-card {
  text-align: end;
}

/* ─────────────────────────────────────────
   Logos Bar RTL
   ───────────────────────────────────────── */

[dir="rtl"] .logos-bar__tagline {
  text-align: start;
}

/* ─────────────────────────────────────────
   Topbar RTL
   ───────────────────────────────────────── */

[dir="rtl"] .topbar {
  flex-direction: row-reverse;
}

/* ─────────────────────────────────────────
   Dashboard RTL
   ───────────────────────────────────────── */

[dir="rtl"] .dashboard-card__label {
  font-family: var(--font-arabic);
}

/* ─────────────────────────────────────────
   Record Search RTL
   ───────────────────────────────────────── */

[dir="rtl"] .record-search__title {
  flex-direction: row-reverse;
}

[dir="rtl"] .record-search__actions {
  justify-content: flex-start;
}

/* ─────────────────────────────────────────
   Service Detail RTL
   ───────────────────────────────────────── */

[dir="rtl"] .service-detail__title {
  flex-direction: row-reverse;
}
