//
// settings
//

$ngtb_height: 32px; // ngtb == nom_globaltopbar

//
// nom_globaltopbar
//

@media screen {
  .nom_globaltopbar {
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    border-bottom: 3px $nom-blue solid;
    box-sizing: border-box;
    display: flex;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    left: 0;
    letter-spacing: 0; // WordPress twentytwenty theme sets letter-spacing to -0.27px and DokuWiki does not.
    line-height: 1.5;
    margin: 0;
    overflow-x: auto;
    overflow-y: hidden;
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
    width: 100%;
    z-index: 9999;
    @if $type == blog {
      background: var(--global--color-background);
    } @else {
      background: var(--background);
    }
    @if $type == wiki {
      position: absolute;
      top: 0;
    } @else {
      order: -1;
      position: relative;
    }
    ul {
      display: flex;
      flex: 1;
      margin: 0;
      padding: 0;
      @if $type == blog {
        font-family: inherit;
      }
      li {
        display: flex;
        margin: 0;
        a {
          font-size: 14px;
          font-weight: normal;
          padding: 4px 6px;
          text-decoration: none;
          transition: background .2s,color .2s;
          @if $type == blog {
            color: var(--global--color-primary);
          } @else {
            color: var(--text);
          }
          &:hover,
          &:active,
          &:focus {
            @if $type == blog {
              background: $nom-blue !important;
            } @else {
              background: $nom-blue;
            }
            color: $white;
            text-decoration: none;
          }
        }
        span.separator {
          color: $grey;
          padding: 4px 6px;
          &::before {
            content: '·';
          }
        }
      }
      &.nom_globaltopbar-inner.right {
        justify-content: flex-end;
        margin-left: 20px;
      }
    }
  }
}

@media print {
  body {
    #dokuwiki__site {
      .site {
        .nom_globaltopbar {
          display: none;
        }
      }
    }
  }
}

//
// globaltopbar blog
//

@if $type == blog {

  body {
    display: flex;
    flex-direction: column;
    top: 32px;
    header {
      .search-modal {
        top: $ngtb_height; // Suchleiste nach unten versetzen, damit sie unter der Topbar angezeigt werden
      }
    }
    .menu-modal {
      top: $ngtb_height; // Menu oben nach unten versetzen, damit sie unter der Topbar angezeigt werden
    }
  }

}

//
// globaltopbar wiki
//

@if $type == wiki {

  body {
    margin-top: $ngtb_height;  // DokuWiki nach unten verschieben, damit globaltopbar sichtbar wird
    overflow-x: hidden;
    #dokuwiki__site {
      .site {
        #dokuwiki__header {
          .group {
            .tools {
              #dokuwiki__usertools {
                top: 15px + $ngtb_height; // 'em' and 'px' are incompatible units
              }
            }
          }
        }
        .nom_globaltopbar {
          top: 0;
          ul {
            padding: 0;
          }
        }
      }
    }
  }

  @media only screen and (min-width: 601px) {
    body {
      #dokuwiki__site {
        .site {
          #dokuwiki__header {
            padding-top: 3em;
            .group {
              .tools {
                #dokuwiki__usertools {
                  top: 12px + $ngtb_height; // 'em' and 'px' are incompatible units
                }
              }
            }
          }
        }
      }
    }
  }

  @media only screen and (max-width: 600px) {
    body {
      padding-top: 0;
    }
  }

}