/** All of the custom styles for arXiv-NG - related to specific graphical style rather than overrides of Bulma - are placed here. **/

header
  h1
    font-size: 2em
    font-weight: bold
    padding: .25em 0 .5em
  .columns
    .column
      padding-bottom: 0

footer
  background-color: $grey
  color: #fff
  padding: 1em 2em
  h2
    margin-bottom: .5em
    text-transform: uppercase
  a
    color: #fff
    border-bottom: 1px solid transparent
    &:hover,
    &:active
      border-bottom: 1px dotted #fff
      background-color: $grey-light

/**** Primary content default styling ****/
main
  padding: 3rem 1.5rem
  a
    border-bottom: 1px solid transparent
    &:hover
      border-bottom: 1px dotted $blue
  p,
  dl,
  ol,
  ul,
  blockquote,
  pre,
  table
    &:not(:last-child)
      margin-bottom: 1em
  h1,
  h2,
  h3,
  h4,
  h5,
  h6
    font-weight: 600
    margin-bottom: .8em
    &:not(:first-child)
      margin-top: 1em
  h1
    font-size: 1.75em
  h2
    font-size: 1.5em
    margin-bottom: .5em
  h3
    font-size: 1.35em
  h4
    font-size: 1.25em
  h5
    font-size: 1.15em
  ul
    list-style: disc outside
    margin-left: 2em
    ul
      list-style-type: circle
      margin-top: .5em
  ol
    list-style-position: outside
    margin-left: 2em
    margin-top: 1em
  li
    margin-bottom: .5em

.breadcrumb ul
  margin-left: 0

/**** End primary content default styling ****/

.nav-spaced
  line-height: 2

.attribution
  align-items: center
  background-color: $cul-gray
  color: #fff
  line-height: 1
  .level-left
    padding: .25em

.identity
  background-color: $cul-red
  color: #fff
  padding: 0 .75em
  a
    color: #fff
    border-bottom: 1px solid transparent
    &:visited
      color: #fff
    &:hover
      border-bottom: 1px dotted #fff
      color: #fff
  .arxiv
    margin: .5em 0
  .search-block
    margin-top: .5em
    margin-bottom: .25em

.logo
  height: 45px
  margin: .2em
  vertical-align: middle

.button.is-cul-darker
  background-color: $cul-red-darker
  color: $white
  border-color: transparent
  &:hover,
  &:active
    background-color: darken($cul-red-darker, 10%)

.sponsors
  font-size: .9em
  font-weight: 600
  line-height: 1.3
  margin: 4px
  padding-right: .75em
  text-align: right
  a
    color: #fff
    &:visited
      color: #fff
    &:hover
      background-color: $grey-light
      color: #fff

.status-code
  background-color: $black
  color: #00FF00
  font-size: 16em
  font-family: 'Courier', monospace
  font-weight: bold
  width: max-content
  line-height: 1em
  padding: .1em .25em
  margin-left: auto !important
  margin-right: auto !important

.beta
  &::after
    content: '\03b2'
    color: $grey-lighter
    font-size: 25em
    position: absolute
    top: 0
    left: 0
    line-height: .75em
    font-family: serif
    z-index: -10

.is-monospace
  font-family: monospace

/* specific styles for search lists with classic dl/dt/dd structure and classes */
.list-identifier
  font-weight: 600

.list-title
  font-size: 1.25em
  font-weight: 600

dt
  margin-top: 1em

/* utility styles for forms */
.fieldset
  border: 1px solid $grey-lighter
  border-radius: $radius-small
  padding: .5em 1em 1em 1em
  margin: 1em 0

.fieldset.is-warning
  border: 1px solid #d47500

.fieldset.is-danger
  border: 1px solid #cd0200

.legend
  font-weight: $weight-semibold
  background-color: inherit
  padding: 0 .5em
  margin-left: -.5em

.is-baseline
  align-items: baseline

.is-centered-vertically
  margin-top: auto !important
  margin-bottom: auto !important

.is-datefield
  max-width: 8rem

.is-short-field
  max-width: 25rem

/* table and file tree styles */

.is-subdirectory
  margin-left: 2em

li.is-danger
  background-color: #fff5f5
  color: #970503
  border: 1px solid #cd0200
  padding: 2px
  p
    padding-left: 2em
    &:before
      content: '\f071'
      font-family: 'FontAwesome'
      color: #cd0200
      position: relative
      left: -.5em

li.is-warning
  background-color: #fffaf5
  color: #5d3605
  border: 1px solid #d47500
  padding: 2px
  p
    padding-left: 2em
    &:before
      content: '\f071'
      font-family: 'FontAwesome'
      color: #d47500
      position: relative
      left: -.5em

li.is-success
  background-color: #f8fdf6
  color: #1F6B0E
  border: 1px solid #3CB521
  padding: 2px
  p
    padding-left: 2em
    &:before
      content: '\f058'
      font-family: 'FontAwesome'
      color: #1F6B0E
      position: relative
      left: -.5em

/* whitespace styles */
.breathe-vertical
  margin-top: 4rem
  margin-bottom: 4rem

.breathe-horizontal
  @media screen and (min-width: 769px)
    margin-left: 4rem !important
    margin-right: 4rem !important
  @media screen and (min-width: 980px)
    margin-left: 6rem !important
    margin-right: 6rem !important

/* pagination styles */
.pagination
  margin-top: 3rem
  margin-bottom: 2rem

.pagination-list
  margin: 0 !important

.pagination-list li
  list-style: none

.pagination-list li + li // fixes override from content li + li
  margin: 0
