/* Icon system: Lucide for UI glyphs, Simple Icons for brand/social glyphs.
   Replaces Font Awesome. See js/icons.js for rendering. */

/* Lucide UI icons (rendered as <svg class="lucide ...">) */
svg.lucide {
  width: 1em;
  height: 1em;
  display: inline-block;
  vertical-align: -0.125em;
}

/* Center icons sitting alone inside the circular .icon-wrapper.
   (As fonts these were centered by text-align; block SVGs need margin auto.) */
.icons .icon-wrapper svg.lucide {
  display: block;
  margin: 0 auto;
}

/* Simple Icons brand glyphs (<i class="si" data-brand="...">) */
.si {
  display: inline-block;
  line-height: 1;
}
.si svg {
  width: 1em;
  height: 1em;
  fill: currentColor;
  display: inline-block;
  vertical-align: -0.125em;
}

/* Font Awesome size-class equivalents */
.icon-2x { font-size: 2em; }
.icon-4x { font-size: 4em; }
