/* Loaded only when lang=ar (see templates/base.html). Logical properties
   (text-align: start, margin-inline-start, inset-inline-*) in style.css
   already flip correctly under dir="rtl" — this file only overrides the
   handful of touches that don't make sense in Arabic. Cairo (the site's
   only font, see base.html) has full Arabic + Latin support, so no
   font-family swap is needed here. */

.panel-title {
  text-transform: none;
  letter-spacing: 0;
}

th,
thead th {
  text-transform: none;
}

.panel-title > .report-links {
  float: left;
}

/* Mirror the custom select chevron (style.css) to the visual right edge
   in RTL, same side padding-inline-end already flips to automatically. */
[dir="rtl"] select {
  background-position: left 0.9rem center;
}

[dir="rtl"] .wo-school-filter select,
[dir="rtl"] .report-field select {
  background-position: left 0.85rem center;
}

/* The logout icon's arrow points right (exiting) — mirror it under RTL so
   it still reads as "exiting" rather than "entering". */
[dir="rtl"] .logout-icon {
  transform: scaleX(-1);
}

/* Report dialog: keep the date value next to the calendar picker icon. */
[dir="rtl"] .report-field input[type="date"] {
  direction: ltr;
  text-align: right;
}

[dir="rtl"] .report-field input[type="date"]::-webkit-calendar-picker-indicator {
  margin-inline-start: 0.35rem;
  margin-inline-end: 0;
}

/* Same fix as the date input above, same root cause: the Schools/
   Maintenance picker row grids (dashboard.html's .school-row-grid,
   maintenance.html's .wo-row-grid) and numeric table cells mark their
   values dir="ltr" so digit runs and units shape correctly, but that also
   resets those cells' own text-align to left -- so under RTL they sit
   at the left edge of their column while the Arabic header sits at the
   right edge of that same column, reading as misaligned even though
   both are in the correct track. Pin them back to the right. */
[dir="rtl"] .school-field-label,
[dir="rtl"] .school-table-head {
  text-transform: none;
  letter-spacing: 0;
}

[dir="rtl"] .school-row-grid > [dir="ltr"],
[dir="rtl"] .wo-row-grid > [dir="ltr"],
[dir="rtl"] .wo-ticket > [dir="ltr"],
[dir="rtl"] .school-field [dir="ltr"],
[dir="rtl"] #schoolBenchmarkTable td[dir="ltr"] {
  text-align: right;
}

@media (min-width: 801px) {
  [dir="rtl"] .school-list--rows .school-field:not(.school-col-name) [dir="ltr"] {
    text-align: center;
  }
}

[dir="rtl"] .report-dialog-actions .btn,
[dir="rtl"] .report-dialog-close,
[dir="rtl"] .report-dialog-title,
[dir="rtl"] .report-field,
[dir="rtl"] .report-field select,
[dir="rtl"] input[type="search"],
[dir="rtl"] .schools-search-input,
[dir="rtl"] .schools-search-input::placeholder,
[dir="rtl"] .user-filter,
[dir="rtl"] .user-edit-field select,
[dir="rtl"] .settings-form-grid input,
[dir="rtl"] .settings-form-grid select,
[dir="rtl"] .audit-action,
[dir="rtl"] .audit-meta,
[dir="rtl"] .audit-details,
[dir="rtl"] .audit-time,
[dir="rtl"] .alerts-count,
[dir="rtl"] .alerts-table th,
[dir="rtl"] .alerts-table td {
  font-family: var(--font);
}

/* The send arrow points the way text runs. */
[dir="rtl"] .wo-chat-send svg {
  transform: scaleX(-1);
}
