/* Language-specific layout fixes for the translated interface
   (javascript/i18n.js sets <html lang>, and dir="rtl" for Arabic). */

/* ---------- right-to-left (Arabic) ---------- */

/* Math reads left to right in every language: KaTeX, typed math and the
   problem box would otherwise come out mirrored ("110 = 90 + 5x"). */
html[dir="rtl"] .katex,
html[dir="rtl"] .katex-display,
html[dir="rtl"] math,
html[dir="rtl"] .math-render,
html[dir="rtl"] .math-display,
html[dir="rtl"] #givenProblemCardText,
html[dir="rtl"] #challengePanelProblem,
html[dir="rtl"] #dailyChallengeProblem {
  direction: ltr;
  unicode-bidi: isolate;
}

/* The whiteboard keeps its left-to-right layout (canvas, toolbars, work
   bar, Math Chat beside it) so pointer and pen positions, shortcuts and the
   board's scroll bars behave exactly as in English. Its words still read
   right to left: each line takes its direction from its own text, so the
   tutor's English replies stay left to right next to Arabic labels. */
html[dir="rtl"] .app-shell {
  direction: ltr;
}
html[dir="rtl"] .app-shell :is(p, li, label, h1, h2, h3, h4, small, .chat-bubble, button, summary, option, select) {
  unicode-bidi: plaintext;
}
html[dir="rtl"] .chat-bubble {
  unicode-bidi: plaintext;
  text-align: start;
}

/* Inputs where the student writes math or English stay left to right; the
   placeholder follows the field. */
html[dir="rtl"] input[type="text"],
html[dir="rtl"] input[type="email"],
html[dir="rtl"] input[type="password"],
html[dir="rtl"] input[type="number"],
html[dir="rtl"] textarea {
  unicode-bidi: plaintext;
}
html[dir="rtl"] input[type="email"],
html[dir="rtl"] input[type="password"] {
  direction: ltr;
  text-align: right;
}

/* Keyboard shortcuts ("Ctrl + Z") are written left to right. */
html[dir="rtl"] kbd {
  direction: ltr;
  unicode-bidi: isolate;
}