/* Icon boxes. There is no icon font: every icon is an inline svg, drawn by
   {% toy_glyph %} / {% toy_icon %} / {% line_glyph %} (core/templatetags/toy_icons.py)
   or by window.TelorivaIcons (core/js/icons.js, generated from the same tables).
   Coloured Toy Box icons (.tbi) on most designs; one-colour line icons (.tli,
   stroke in currentColor) on Minimal and the calm administration look.

   The svg keeps the class the old glyph span had (`material-symbols-outlined`,
   or `material-symbols-rounded` on the classroom projector) and draws at 1em, so
   every rule that sized, spaced or hid a glyph with font-size still applies. */
.material-symbols-outlined,.material-symbols-rounded{font-size:24px;line-height:1;display:inline-block;flex-shrink:0}
/* Sit the svg where the glyph's ink sat; :where keeps utilities able to override. */
:where(svg).material-symbols-outlined,:where(svg).material-symbols-rounded{vertical-align:-.2em;overflow:visible}
:where(svg.tli){overflow:visible}
/* Directional line icons follow the reading direction, as the Toy Box arrows do (site_toybox.css). */
[dir="rtl"] :is(.tli-arrow-right,.tli-arrow-left,.tli-chevron-right,.tli-chevron-left,.tli-chevrons-right,
  .tli-chevrons-left,.tli-arrow-right-to-line,.tli-arrow-left-to-line,.tli-arrow-up-right,.tli-move-right,
  .tli-move-left,.tli-corner-down-right,.tli-log-out,.tli-log-in,.tli-reply,.tli-forward,.tli-undo-2,.tli-redo-2,
  .tli-panel-left-open,.tli-panel-left-close,.tli-panel-right-open,.tli-panel-right-close,.tli-skip-forward,
  .tli-skip-back){transform:scaleX(-1)}