/*
 * note, important, and important admonition styles
 */
$note-color: #1488C6;
$important-color: #aa6708;
$warning-color: #ce4844;


/* Blockquotes with no Liquid tag get $note-color sidebar */
blockquote {
  border-left-color: $note-color;
}

/* First paragraph of a multi-paragraph blockquote is bold and defaults to $note-color if not tagged differently */
blockquote > p:first-child {
  margin-top: 0;
  font-weight: 700;
  color: $note-color;
}

/* This used to prepend "Note" to title of any multi-paragraph blockquote, now it adds the note icon instead */
blockquote > p:first-child::before {
  content: '\f058 \00a0';
  font-family: FontAwesome;
}

/* Blockquotes with important tag get $important-color sidebar */
blockquote.important {
  border-left-color: $important-color;
}

/* First paragraph of a multi-paragraph .important blockquote inherits bold, and is $important-color */
blockquote.important > p:first-child {
  color: $important-color;
}

/* Add "important" icon to important admonitions */
blockquote.important > p:first-child::before {
  content: '\f06a  \00a0';
  font-family: FontAwesome;
}

/* Blockquotes with warning tag get $warning-color sidebar */
blockquote.warning {
  border-left-color: $warning-color;
}


/* First paragraph of a multi-paragraph .warning blockquote inherits bold, and is $warning-color */
blockquote.warning > p:first-child {
  color: $warning-color;
}

/* Add "warning" icon to warning admonitions */
blockquote.warning > p:first-child::before {
  content: '\f057  \00a0';
  font-family: FontAwesome;
}

/* Maintain backwards compatibility with old note style */
blockquote > p:only-child {
  font-weight: inherit;
  color: inherit;
}
blockquote > p:only-child::before {
  content: none;
}

/* For Bootstrap badges */

span.badge {
  display: inline-block;
  padding: .25em .4em;
  font-size: 75%;
  font-weight: bold;
  line-height: 1;
  color: #fff;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: .25rem;
}

span.badge.badge-info {
  background-color: $note-color;
}

span.badge.badge-danger {
  background-color: $warning-color;
}

span.badge.badge-warning {
  background-color: $important-color;
}