body
  background-color: #1b1f23
  width: 100%
  font-family: 'Fira Code', 'Source Code Pro', monospace

#page .container
  display: flex
  padding: 0
  justify-content: center
  align-items: flex-start
  margin-top: 20px

article
  width: 900px
  flex-shrink: 0

#leftnav
  width: 320px
  flex-shrink: 0
  margin: 0
  margin-right: 50px

article, #leftnav
  border: 1px solid #3b444c
  background-color: #14171a
  color: #fff
  padding: 20px

ul#leftnav
  list-style: none
  padding: 0

#leftnav li
  border-bottom: 1px solid #3b444c

  &:last-child
    border-bottom: none

#leftnav a
  display: block
  padding: 10px 15px
  text-decoration: none
  color: #fff

  &:hover
    background: #333

code
  font-family: 'Fira Code', monospace
  font-size: 13px
  background-color: #0d1117
  color: #c9d1d9
  padding: 0.2em 0.4em
  border-radius: 6px
  border: 1px solid #30363d

.small
  font-size: 10px

h2
  margin-top: 40px

div.error, div#debug
  border: 1px solid red
  padding: 30px
  background-color: pink
  color: darkred
  margin: 0 auto
  width: 900px

div.notice
  border: 1px solid rgb(31, 119, 13)
  padding: 30px
  background-color: rgb(169, 218, 163)
  color: rgb(20, 56, 13)
  margin: 0 auto
  width: 900px

div#debug
  margin-top: 100px
  margin-bottom: 100px

.pages-table
  width: 100%
  border-collapse: collapse
  border: 1px solid #333

  th, td
    padding: 10px
    border: 1px solid #ddd
    text-align: left

  th
    font-weight: bold

/* ============================================================
   DARK MODE STYLES — edit-page-form-novaconium
   ============================================================ */
@media (prefers-color-scheme: dark)
  #edit-page-form-novaconium
    input[type="text"],
    input[type="number"],
    textarea,
    select
      background: #2a2a2a
      border: 1px solid #444
      color: #eee

    input:focus,
    textarea:focus,
    select:focus
      border-color: #3399ff
      box-shadow: 0 0 0 3px rgba(51, 153, 255, 0.25)

    input[type="checkbox"]
      accent-color: #3399ff

    button[type="submit"]
      background: #3399ff
      color: #fff

      &:hover
        background: #1d7fd4

    p
      color: #aaa

    a
      color: #66b3ff

      &:hover
        color: #99ccff

    .form-group
      margin-bottom: 1.2rem

      &.fullwidth textarea
        width: 100%
        resize: vertical

    .checkbox-group
      margin-top: 1.5rem