.codehilite,
.highlight,
code,
pre {
  font-family: 'Source Code Pro', Monaco, Menlo, Consolas, 'Courier New', monospace;
}

.codehilite .filename,
.highlight .filename {
  display: block;
  padding: 0.5rem 0.5rem 0 0.5rem;

  /* Same as Bootstrap's <pre> default value */
  font-size: 87.5%;
}

.codehilite pre,
.highlight pre {
  padding: 0.5rem;
  color: inherit;
}

.codehilite pre {
  overflow: inherit;
  table-layout: fixed;
  width: 100%;
  white-space: pre-wrap;
}

.codehilite code,
.highlight code {
  word-wrap: normal;
}

.codehilite pre code,
.highlight pre code {
  word-break: normal;
}

.codehilite pre span[id^="coderow-"] {
  display: table-row;
}

pre code span.hll {
  display: block;
}

/* Prevents line numbers to be selected */
span.linenos {
  /* Same as Bootstrap's .user-select-none class */
  -webkit-user-select: none !important;
  -moz-user-select: none !important;
  -ms-user-select: none !important;
  user-select: none !important;

  /* Gutter's border separating numbers from code */
  box-shadow: -0.05rem 0 #6c757d inset;

  /* Same color as Monokai background generated by Pygments */
  background-color: #272822;

  /* Same color as Bootstrap's text-secondary */
  color: #6c757d;
}

.codehilite span.linenos {
  /* Prevents the long lines to wrap below the line number gitter on the left */
  display: table-cell;

  /* Simulates right margin, which has no effect on table cells */
  border-right: 0.5rem solid transparent;
}

/* Makes the left-side line number gutter sticky */
.highlight span.linenos {
  position: sticky;
  float: left;
  left: -0.5rem;
  padding: 0 0 0 1rem;
  margin-left: -0.5rem;
  margin-right: 0.5rem;
}

/* Display line numbers with PyMdown Extensions' syntax:
 * https://facelessuser.github.io/pymdown-extensions/extensions/highlight/#line-number-styles
 * */
.highlight [data-linenos]::before {
  content: attr(data-linenos);
}

/* Highlight every every Nth line number in the gutter */
span.linenos.special {
  background-clip: padding-box;
  background-color: #6c757d;
}

/* Highlight whole lines */
.codehilite pre code span.hll,
.highlight pre code span.hll {
  display: block;
}
