@import "../../../../../../_share/media/sass/_mixins"
@import "fonts"
@import 'variables'

@include set-header-sizes($default-header-sizes)
@include set-header-colors($default-header-colors)

/* Base Styles */
body
  background-color: $background-color
  color: $text-color
  line-height: 1.6

  @include font-family('firamono')

/* Link Styles */
a
  color: $anchor-color
  text-decoration: none

a:hover
  text-decoration: underline
  color: $anchor-hover-color

/* List Styles */
ul, ol
  margin-bottom: 1em

li
  margin-bottom: 0.5em

/* Code Block Styles */
pre, code
  background-color: $code-background-color
  color: $secondary-color
  padding: 0.5em
  border-radius: 4px
  overflow-x: auto

  @include font-family('firamono')

/* Table of Contents Link */
.toc
  font-weight: bold
  color: $primary-color

/* Section Styles */
section
  margin-bottom: 2em

/* Highlight Specific Notes */
.note
  background-color: $note-background-color
  padding: 0.5em
  border-left: 3px solid $note-border-color
  margin-bottom: 1em
  color: $text-color

/* Header Styles */
h1, h2, h3, h4, h5, h6
  margin-top: 1em
  margin-bottom: 0.5em

h1.title
  text-align: left

h2 a
  color: map-get($default-header-colors, h2)
  &:hover
    text-decoration: none
    color: #ca9ca0

h4
  text-transform: uppercase
  margin-left: .5em

  a
    color: lighten($anchor-color, 10%)
    margin-left: 1em

  a:hover
    color: lighten($anchor-hover-color, 10%)
    text-decoration: underline

h3
  text-transform: uppercase
    

div#table-of-contents h2
  color: $primary-color
  text-transform: uppercase

div#postamble
  border-color: $note-border-color