/* * This is a manifest file that'll be compiled into application.css. * * With Propshaft, assets are served efficiently without preprocessing steps. You can still include * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard * cascading order, meaning styles declared later in the document or manifest will override earlier ones, * depending on specificity. * * Consider organizing styles into separate files for maintainability. */ /* ────────────────────────────────────────────────────────────────────────────── * XCUT-RTL — right-to-left shim for the learner surface. * * Layout mirroring is handled by Tailwind v4 logical utilities (ms-/me-/ps-/pe-/ * text-start/text-end/start-/end-) in the views; this file only covers the few * things logical utilities can't express. It is gated on [dir="rtl"] (emitted on * by the Localization concern), so en/es (LTR) are never affected. * ────────────────────────────────────────────────────────────────────────────── */ /* Directional icons (heroicons rendered as inline ) point "forward". In RTL, * forward is leftward, so horizontally mirror arrows/chevrons that denote direction. * The heroicon helper passes through arbitrary attributes, so a directional icon opts in * with: heroicon("arrow-right", "data-flip-rtl": "") — non-directional icons (bell, star, * academic-cap …) carry no marker and are left untouched. */ [dir="rtl"] svg[data-flip-rtl], [dir="rtl"] [data-flip-rtl] svg { transform: scaleX(-1); } /* Off-canvas / drawer transforms authored for LTR slide-in should mirror in RTL. */ [dir="rtl"] .rtl-mirror { transform: scaleX(-1); } /* Progress bars fill from the inline-start edge; keep the visual fill anchored to the * start (right, in RTL) so percentage growth reads naturally for RTL learners. */ [dir="rtl"] [role="progressbar"] > * { margin-inline-start: 0; margin-inline-end: auto; }