/**
 * Inline SVG icon styling.
 *
 * Replaces css/fa.css. The markup is produced by csr_icon() in
 * inc/svg-icons.php and keeps the original <i> wrapper so that existing
 * rules in css/theme.css which target `i` (colour, margins, the circular
 * border on .btn-follow) keep applying untouched.
 *
 * The declarations below mirror what the Font Awesome webfont did:
 * inline-block, upright, line-height 1, and a baseline that sits 0.125em
 * (the font's 64/512 descent) below the surrounding text.
 */

.csr-icon {
  display: inline-block;
  font-style: normal;
  line-height: 1;
  vertical-align: -0.125em;
}

/*
 * display:block removes the inline strut inside the wrapper, so the <i> box
 * is exactly the icon box -- the same footprint the glyph had. Size and
 * colour come from the svg's own width/height/fill attributes, which are set
 * in em and to currentColor, so font-size and color still drive both.
 */
.csr-icon > svg {
  display: block;
}