/* The site's own icon font, for the community half of the same domain.
 *
 * anandbodh.com serves a website and a community. The website has drawn its
 * navigation with this font for a year; the community drew the same
 * destinations with its own set, and two icon systems in two bars on one
 * hostname read as two websites.
 *
 * The font is not copied anywhere new. It is the file this site already
 * serves, at this site's own origin, referenced by the community pages that
 * sit on this hostname - so nothing is redistributed and no other community
 * on the platform can reach it.
 *
 * Codepoints are read out of the theme's own stylesheet (assets/2b7560fc58.css)
 * rather than guessed, and every one of them was rasterised and looked at
 * before it was written down here.
 */

/* TWO WEIGHTS, WHICH IS HOW THIS FONT DRAWS OUTLINE AND SOLID.
 *
 * The theme's own rule is the whole of it:
 *   .bb-icon-l,.bb-icon-lined  {font-family:bb-icons;font-weight:400}
 *   .bb-icon-f,.bb-icon-filled {font-family:bb-icons;font-weight:300}
 * Same codepoints, same family, different weight - 400 is the outline the nav
 * rests in, 300 is the solid the active item switches to. So the active state
 * is not a colour swap or a second class list: it is the same glyph asking the
 * family for its other weight, which is what the site has always done.
 */
@font-face {
  font-family: 'bb-icons';
  font-style: normal;
  font-weight: 400;
  font-display: block;
  src: url('/assets/bb-icons.woff2') format('woff2');
}
@font-face {
  font-family: 'bb-icons';
  font-style: normal;
  font-weight: 300;
  font-display: block;
  src: url('/assets/bb-icons-filled.woff2') format('woff2');
}

.bbi {
  font-family: 'bb-icons' !important;
  font-style: normal;
  font-weight: 400;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  speak: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  display: inline-block;
}

/* THE ACTIVE ITEM IS THE SOLID ONE.
 *
 * Keyed on aria-current rather than a class name, because aria-current is what
 * the nav already sets on the page you are on, in both the bar and the rail,
 * and it cannot drift out of sync with the styling the way a second class can.
 * The class is kept alongside it for the same element in either shell.
 */
a[aria-current='page'] .bbi,
a.on .bbi {
  font-weight: 300;
}

/* The top bar - the seven destinations the site's own header carries. */
.bbi-home:before     { content: '\eeb3' }
.bbi-activity:before { content: '\e854' }
.bbi-course:before   { content: '\ee3f' }
.bbi-bullseye:before { content: '\ee04' }
.bbi-users:before    { content: '\e95d' }
.bbi-forum:before    { content: '\ee37' }
.bbi-article:before  { content: '\eda9' }

/* The rail - the community's modules, and the two controls that are about the
 * reader rather than the community. Destinations the site's own left panel
 * also carries use the panel's glyph for that destination; the rest are the
 * same font's own word for the thing, so the column is one alphabet.
 */
.bbi-members:before  { content: '\ef5a' }
.bbi-calendar:before { content: '\e803' }
.bbi-image:before    { content: '\eeb4' }
.bbi-poll:before     { content: '\eefb' }
.bbi-bulb:before     { content: '\ee05' }
.bbi-envelope:before { content: '\ee62' }
.bbi-card:before     { content: '\eed4' }
.bbi-tag:before      { content: '\ef3b' }
.bbi-clock:before    { content: '\e884' }
.bbi-flag:before     { content: '\ee9c' }
.bbi-bell:before     { content: '\e86d' }
.bbi-cog:before      { content: '\ee27' }
.bbi-sidebar:before  { content: '\e8a0' }

/* The site's own left panel, for the destinations it carries that the
 * community's module list does not name. */
.bbi-rocket:before    { content: '\ef0c' }
.bbi-alarm:before     { content: '\ed93' }
.bbi-clipboard:before { content: '\e882' }

/* SIZE, TAKEN FROM THE SITE RATHER THAN CHOSEN.
 *
 * The site's own rule is
 *   .menu-style-tab_bar .site-header .primary-menu>li>a>i._mi
 *     { font-size:24px; min-width:20px }
 * and the community bar was drawing the same glyphs at 19. Two bars on one
 * hostname at two sizes reads as two websites even when the shapes match, so
 * the number is copied out of that rule instead of eyeballed.
 */
.bbi.tabglyph {
  font-size: 24px;
  min-width: 20px;
  line-height: 1;
}

/* The rail draws at 24, which is what the rail's own rule already says:
 *   .srail > a:not(.srail-mark) svg { width:24px; height:24px }
 * The glyph replaces an SVG in a slot that is already 24 wide; it does not get
 * to change the slot, and a rail drawn at 20 under a bar drawn at 24 is the
 * two-icon-sets fault again in one column. */
.bbi.railglyph {
  font-size: 24px;
  min-width: 24px;
  line-height: 1;
}

/* The panel switch at the head of the rail, which the traced set drew at 24
 * because that is the size the live one is drawn at. A glyph that changes the
 * size of the control it sits in is a glyph that has been allowed to redesign
 * the rail. */
.bbi.togglyph {
  font-size: 24px;
  min-width: 20px;
  line-height: 1;
}
