/* FO right-to-left sheet, written by hand. Loaded after fo-rtl-generated.css
   (dev/rtl/build_rtl.R) on right-to-left pages only. Every rule starts with
   [dir="rtl"] so a page that switches back to left to right keeps the sheet,
   inert (test-rtl-assets.R checks it). Here go the rules the generator cannot
   make: CSS it never sees (inline <style> of app_ui()), Bootstrap's rtl:raw
   blocks, transforms it does not mirror, and what must stay left to right. */

/* Bootstrap's rtl:raw block: these fields hold Latin text and numbers. */
[dir="rtl"] :is([type="tel"], [type="url"], [type="email"], [type="number"]) {
  direction: ltr;
}

/* bslib's collapse chevron turns with rotateY(), which the generator does
   not mirror: under right to left the sidebar sits on the right, so the
   chevron takes the turn of a right-hand sidebar. */
[dir="rtl"] .bslib-sidebar-layout:not(.sidebar-right) > .collapse-toggle > .collapse-icon {
  transform: rotateY(var(--_toggle-right-transform));
}

/* app_ui()'s inline <style>: the floating sidebar button of narrow screens. */
[dir="rtl"] .mobile-sidebar-toggle {
  left: auto;
  right: 20px;
}

/* The Help Mode pill (custom.css, body::before, z-index 99999) and the
   notification panel (bslib, z-index 1090) both take the bottom-left corner
   under right to left, and the pill covered the lower edge of a notice. While
   the pill shows (signed in, the guide off: fo_guide.css hides it otherwise)
   the panel stands above it; with the guide on, the dock lifts itself over
   the panel (data-lifted) as before. */
[dir="rtl"] body[data-app-state="authenticated"]:not(.fo-guide-on) #shiny-notification-panel#shiny-notification-panel {
  bottom: calc(var(--bslib-spacer, 1rem) / 2 + 32px);
}

/* Icons that point the way a line runs turn round: back and forward, the
   previous and next month, signing out and a link that opens elsewhere
   (shiny::icon("sign-out-alt") draws fa-right-from-bracket). Spinners, the
   trend arrows (up and down), the turning arrows, checks and logos keep
   their drawing. */
[dir="rtl"] :is(.fa-arrow-right, .fa-arrow-left, .fa-chevron-right, .fa-chevron-left,
    .fa-angle-right, .fa-angle-left, .fa-right-from-bracket,
    .fa-up-right-from-square, .fa-arrow-up-right-from-square) {
  transform: scaleX(-1);
}

/* The guide's switches (the hub's Stop motion): off at the start side, on
   at the end side. */
[dir="rtl"] .fo-guide-switch[aria-pressed="true"] .fo-guide-switch__track::after {
  translate: -12px 0;
}

/* fo-rtl-generated.css gives the features marquee and the budget's loading
   lines their mirrored animation in a rule that outweighs the sheets' own:
   the second row still plays backwards, and a touch screen or reduced motion
   still stops them. */
[dir="rtl"] .landing-features-ribbon--reverse .landing-features-track {
  animation-direction: reverse;
}
@media (hover: none) {
  [dir="rtl"] .landing-features-track {
    animation: none;
  }
}
@media (prefers-reduced-motion: reduce) {
  [dir="rtl"] .landing-features-track,
  [dir="rtl"] .fo-budget-skel-line {
    animation: none;
  }
}

/* Numbers stay left to right where they are drawn, so a sign or a unit
   keeps its side ("-$1,234.56", "+3.4%"). Their columns stay right-aligned
   (dev/rtl/ignore.txt), so decimals and units line up as before. */
[dir="rtl"] :is(td.dt-right, td.dt-body-right, .value-box-value,
  .fo-bs-table td.fo-bs-debit, .fo-bs-table td.fo-bs-credit,
  .fo-bs-table td.fo-bs-balance, .fo-bs-table td.fo-bs-balance-cmp,
  table.fo-tp-position .fo-tp-num, td.fo-budget-col-amount,
  .fo-budget-txm-amount, .fo-budget-txm-value, .fo-budget-bd-amount,
  .summary-page .performance-card .performance-value,
  .summary-page .leverage-card .leverage-value,
  .summary-page .holding-row .holding-change, .fo-budget-review-amount,
  .fo-budget-txm-part-amount, .fo-budget-cal-total, .fo-budget-extra-stat-value,
  .fo-budget-tx-flow > strong) {
  direction: ltr;
  unicode-bidi: isolate;
}
/* A number on a line of its own keeps the page's start edge, which
   "direction: ltr" alone would move to the left. */
[dir="rtl"] :is(.value-box-value, .fo-budget-extra-stat-value, .fo-budget-cal-total) {
  text-align: right;
}
[dir="rtl"] :is(.fo-budget-split-amt input, .fo-budget-bd-amount-cell input,
  .fo-budget-bd-line-amount input, .fo-budget-st-money input,
  input.fo-budget-st-money, .fo-budget-st-days input, input.fo-budget-st-days,
  input.autonumeric-input) {
  direction: ltr;
}

/* Charts and sliders read like a number line: time and values run left to
   right. */
[dir="rtl"] :is(.js-plotly-plot, .plotly, .irs) {
  direction: ltr;
}

/* Inline styles of files the release train guards (dev/release/checks.R),
   which keep their physical margins; mirrored here instead. The sign-in
   pages' primary button (forgot_password_page.R, password_reset_page.R),
   the hourglass of the session timeout dialog (session_timeout_ui.R) and
   the list of sign-up errors in its alert (auth_server.R). */
[dir="rtl"] :is(#send_password_reminder, #submit_password_reset) {
  margin-right: 0 !important;
  margin-left: 10px !important;
}
[dir="rtl"] #fo_session_timeout_title > i.fa-hourglass-half {
  margin-right: 0 !important;
  margin-left: 8px !important;
}
[dir="rtl"] .sweet-alert ul[style*="margin-left"] {
  text-align: start !important;
  margin-left: 0 !important;
  margin-right: 20px !important;
}

/* Arabic letters: Noto Sans Arabic 2.013 (notofonts/arabic release
   NotoSansArabic-v2.013, unhinted variable-ttf, width pinned at 100, weights
   100-900 kept, cut to the Arabic blocks below as woff2; SIL Open Font
   License 1.1, OFL.txt beside it). sha256 of the woff2:
   6c78afe93034f2cefa3edc77e4d67a762267ec77e9f56fb23669961bfe6c1d26.
   Served by the app like Inter, never from a font CDN, and fetched only by a
   page that shows an Arabic letter. Declared here only, so landing.css keeps
   its two Inter faces. */
@font-face {
  font-family: 'Noto Sans Arabic';
  font-style: normal;
  font-display: swap;
  font-weight: 100 900;
  src: url('../fonts/noto-sans-arabic/noto-sans-arabic-arabic-wght-normal.woff2') format('woff2');
  unicode-range: U+0600-06FF, U+0750-077F, U+0870-08FF, U+FB50-FDFF, U+FE70-FEFF;
}

/* The family is appended to each stack, just before the generic family:
   Latin text and digits keep their fonts, and only a letter the fonts before
   it lack falls back to it. The app's stack is Bootstrap's (the body font
   is computed from it on the same element, so both are set); the landing
   page's is Inter's (landing.css, body and html). The guide sets no family
   of its own and inherits the page's. */
[dir="rtl"] {
  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
    "Noto Sans", "Liberation Sans", Arial, "Noto Sans Arabic", sans-serif,
    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --bs-body-font-family: var(--bs-font-sans-serif);
}
[dir="rtl"]:has(.landing-page),
[dir="rtl"] body:has(.landing-page) {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Noto Sans Arabic',
    sans-serif;
}
