@tailwind base;
@tailwind components;
@tailwind utilities;

@font-face {
  /* Set in tailwindconfig */
  font-family: "jetbrains-mono";
  src:
    local("jetbrains-mono"),
    url("/fonts/JetBrainsMono-Medium.woff2") format("woff2");
}

article {
  margin-bottom: 2rem;
}

article > section > :is(pre, p, h1, h2, h3, h4, h5, h6) {
  margin-top: 2rem;
}

article > section {
  font-family:
    "Lucida" Grande,
    sans-serif;
}

article > section > :is(h1, h2, h3, h4, h5, h6, code) {
  font-family: "jetbrains-mono";
}

article > section > blockquote {
  padding: 1rem;
  border-left-width: 4px;
  border-color: rgb(239 68 68);
  font-style: italic;
}

article > section > h1 {
  margin-top: 2rem;
  font-size: 3rem;
}

article > section > h1::before {
  content: "# ";
}

article > section > h2 {
  font-size: 2rem;
}

article > section > h2::before {
  content: "## ";
}

article > section > h3 {
  font-size: 1.5rem;
}

article > section > h3::before {
  content: "### ";
}

article > section > h4 {
  font-size: 1.3rem;
}

article > section > h4::before {
  content: "#### ";
}

article > section {
  margin-top: 4rem;
}

article a {
  text-decoration-color: rgb(239 68 68);
  text-decoration-thickness: 4px;
  text-decoration-line: underline;
  transition-duration: 70ms;
}

article a:hover {
  text-decoration-thickness: 8px;
  text-decoration-color: rgb(185 28 28);
  text-decoration-line: underline;
}

article ul {
  margin-left: 1rem;
  list-style-type: "- ";
}

article ol {
  margin-left: 1rem;
  list-style: decimal inside;
}

#footnotes {
  padding-top: 1rem;
}

#footnotes > ol > li {
  margin-top: 1rem;
}

#footnotes > ol > li > p {
  display: inline;
}
