// https://www.gatsbyjs.org/packages/gatsby-remark-prismjs/?=gatsby-remark-prismjs#optional-add-line-numbering

/* .gatsby-highlight pre[class*='language-'] .gatsby-highlight-code-line { */
.gatsby-highlight-code-line {
  background-color: #feb;
  display: block;
  border: 1px solid red;
  margin-right: -1em;
  margin-left: -1em;
  padding-right: 1em;
  padding-left: 0.75em;
  border-left: 0.25em solid #f99;
}

/* Adjust the position of the line numbers */
.gatsby-highlight pre[class*='language-'].line-numbers {
  padding-left: 2.8em;
}

/**
 * If you only want to use line numbering
 */

.gatsby-highlight {
  background-color: #fdf6e3;
  border-radius: 0.3em;
  margin: 0.5em 0;
  padding: 1em;
  overflow: auto;
}

.gatsby-highlight pre[class*='language-'].line-numbers {
  padding: 0;
  padding-left: 2.8em;
  overflow: initial;
}