* {
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;

    &:focus,
    &:active {
        outline: none;
    }
}

html {
    font-size: $root-font-size;
}

body {
    all: unset;
    font-family: $font-family-base;
    font-size: 1rem;
    line-height: $body-line-height;
    color: $body-color;
    background-color: $body-bg;
    font-weight: $font-weight-normal;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

a {
    color: $link-color;
    text-decoration: none;

    &:hover {
        color: $link-hover-color;
        text-decoration: none;
    }

    & > img.anchor {
       box-shadow: none;
       height: 1rem; 
    }

    &.reference {
       text-decoration: none;
       border-bottom: none;
    }
}

h1, h2, h3, h4, h5, h6 {
    color: $docs-item-main-color;
    position: relative;
    
    & > .toc-backref {
        color: $docs-item-main-color;
    }

    & > .headerlink {
        position: absolute;
        left: -1.5rem;
        top: 0;
        opacity: 0.5;

        &:hover {
            background-color: transparent;
            opacity: 1;
        }
    }
}

dl {
   & > dt {
      font-weight: bold;
   }
}

// Hack because sphinx renders nested ul elements as dl/dt/dd for some reason

li {
   & dl.simple {
      font-weight: normal;

      & dt {
         font-weight: normal;
      }

      & dd {
         margin-left: 0px;
      }
   }
}

div.admonition {
    margin-top: 0;
    padding: 10px 20px;

    background: rgba($black, .01);
    border: none;
    border-left: 4px solid grey;

    & > p.admonition-title {
        font-weight: bold;
        font-family: $font-family-base;
        font-size: 1rem;
    }

    &.warning {
        background-color: $docs-item-admonition-warning-body;
        border: none;
        border-left: 4px solid $docs-item-admonition-warning-border;
    }

    &.important {
        background-color: $docs-item-admonition-important-body;
        border: none;
        border-left: 4px solid $docs-item-admonition-important-border;
    }

    &.note {
        background-color: $docs-item-admonition-note-body;
        border: none;
        border-left: 4px solid $docs-item-admonition-note-border;
    }
}

dl {
    margin: 10px 0 10px 0;
}

dl.minio {
    margin: 10px 0 10px 0;
}

div.footer {
    width: auto;
    margin: 0px;
}

.align-default {
    text-align: left;
}

table.docutils {
    border: none;
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    font-size: .9rem;

    & > tbody tr th.stub {
        border: none;
        border-bottom: 1px solid $docs-item-table-border;
        color: $theme-red;
    }

    & > thead tr th {
        border: none;
        border-bottom: 1px solid $docs-item-table-border;
        color: $theme-red;
    }

    & > tbody tr td {
        border: none;
        border-bottom: 1px solid $docs-item-table-border;
    }

}

.sphinx-tabs-tab {
   color: rgba($black, .5);

   background: none;
   border: none;
   padding: 0px 20px 10px 20px;
   
   &[aria-selected=true] {
      color: $theme-red;
      font-weight: bold;
      border-bottom: .15em solid $theme-red;
      pointer-events: none;
   }
}

button.toggle-button {
   width: 1.25em;
   height: 1.25em;

   &.toggle-button-hidden:before {
      left: -7em;
   }

   & > .bar {
      width: 14px;
      left: 13%;
   }
}

.xref {
    color: $theme-red;
}

.content__main {
    a img {
        box-shadow: 0px 0px 5px lightgray;
    }

    a.noshadow img {
        box-shadow: none;
    }
}

ul.simple li {
   margin: 0px 0px 10px 0px;
}

video {
    display: block;
    margin-left: auto;
    margin-right: auto;
}