$markdown-line-height: 1.5em;
$markdown-spacer-1: 4px;
$markdown-spacer-2: 8px;
$markdown-spacer-3: 16px;
$markdown-spacer-4: 24px;
$markdown-font-size-small: 12px;
$markdown-font-weight-bold: 600;

$gray-000: #fafbfc;
$gray-100: #f6f8fa;
$gray-200: #e1e4e8;
$gray-300: #d1d5da;
$gray-400: #959da5;
$gray-500: #6a737d;
$gray-700: #444d56;

.markdown-body {
  font-size: 16px;
  line-height: $markdown-line-height;
  word-wrap: break-word;
  color: #24292e;
  &::after {
    display: block;
    clear: both;
    content: "";
  }
  > *:first-child {
    margin-top: 0 !important;
  }
  > *:last-child {
    margin-bottom: 0 !important;
  }
  // Blocks
  p,
  blockquote,
  ul,
  ol,
  dl,
  table,
  pre,
  .highlight {
    margin-top: 0;
    margin-bottom: $markdown-spacer-3;
  }
  hr {
    height: 0.25em;
    padding: 0;
    margin: $markdown-spacer-4 0;
    background-color: $gray-200;
    border: 0;
  }
  blockquote {
    margin-left: 0;
    margin-right: 0;
    padding: 0 1em;
    color: $gray-500;
    border-left: 0.25em solid lighten($gray-300, 5%);
    > :first-child {
      margin-top: 0;
    }
    > :last-child {
      margin-bottom: 0;
    }
  }
  kbd {
    display: inline-block;
    padding: 3px 5px;
    font-size: 11px;
    line-height: 10px;
    color: $gray-700;
    vertical-align: middle;
    background-color: $gray-000;
    border: solid 1px darken($gray-300, 4%);
    border-bottom-color: $gray-400;
    border-radius: 3px;
    box-shadow: inset 0 -1px 0 $gray-400;
  }
  // Anchors like <a name="examples">. These sometimes end up wrapped around
  // text when users mistakenly forget to close the tag or use self-closing tag
  // syntax. We don't want them to appear like links.
  a {
    color: #0366d6;
    text-decoration: none;
    &:hover,
    &:focus {
      text-decoration: underline;
    }
  }
  a:not([href]) {
    color: inherit;
    text-decoration: none;
  }
  // Links
  .absent {
    color: #cb2431;
  }
  .anchor,
  .anchorjs-link  {
    float: left;
    line-height: 1em;
    font-size: 1.1em !important;
    padding-right: 10px !important;
    margin-left: calc(-1em - 10px) !important;
    &:hover,
    &:focus {
      outline: none;
      text-decoration: none;
    }
  }
}

@import "./headings.scss";
@import "./lists.scss";
@import "./tables.scss";
@import "./images.scss";
@import "./code.scss";
@import "./blob-csv.scss";