@import 'base'
@import 'book_content'

body, div, html, p
  margin 0
  padding 0



body
  font-family system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-weight normal
  font-size 20px

p
  margin 0
  text-indent 0

a
  text-decoration inherit
  text-decoration-color inherit
  color inherit

  &:hover
    text-decoration underline


normal_color = rgba(255, 255, 255, 0.82)
selected_color = #6D3102
left_align = 40px
header_underline_height = 6px

header_height = 60px

#header
  height header_height
  width 100%
  position fixed
  top 0px
  z-index 10000

  background-color #C5946C
  box-shadow 1px 1px 10px rgba(0, 0, 0, 0.4)

#header_content
  height 100%
  max-width 1200px
  margin 0 auto
  position relative

  ul
    padding 0
    margin 0 0 0 left_align
    position absolute
    bottom header_underline_height

    li
      display inline
      list-style none
      padding 0
      margin 0 10px
      font-size (header_height / 1.8px)
      color normal_color
      border-bottom solid header_underline_height transparent

      a
        text-decoration inherit
        color inherit

      &:first-child
        margin-left 0

      &:hover
        text-decoration underline
        color selected_color
        border-bottom-color selected_color

      &.selected
        color selected_color
        border-bottom-color selected_color


#main
  display -webkit-flex // Safari
  display flex
  flex-flow row wrap

  max-width 1200px

  margin 0 auto
  margin-top header_height + 20px

#content
  flex 5

.toc_content
  margin-left 40px


div.cover_image
  flex 1
  margin-right 40px
  margin-left left_align

  max-width 250px

  div
    box-shadow 1px 1px 10px rgba(0, 0, 0, 0.4)

    img
      width 100%

h1.meta_section
  font-weight normal
  font-size 36px
  color text_color
  margin-bottom 0

  &:first-child
    margin-top 0

td.book_meta_key
  text-align right
  font-size 14px
  color text_color
  vertical-align baseline
  padding-right 8px

td.book_meta_value
  font-size 20px
  vertical-align baseline



p.target_selected
  font-weight bold



ul.spine
  padding-left 0
  margin-top 0

  & &
    padding-left 30px

  li
    list-style none
    line-height 1.4em

    span.title
      color text_color
      text-decoration-color text_color

    span.option
      opacity .5
      padding .1em .3em
      font-size 12px
      background-color #D8D8D8
      border solid 1px #979797
      border-radius 5px

    a.toc_href
      color rgba(0, 0, 0, 0.5)



#footer
  margin-top 50px
  border-top solid 1px text_color
  padding 10px 0
  width 100%

  p
    text-align center
    color gray
    font-size 10px


p.file
  font-size 16px

  span.arrow
    font-family monospace
    color text_color