@import url('../../style/blink-indicator.scss');

mat-toolbar {
  height: 2.5em;
  min-height: 50px;

  &.mat-toolbar.mat-primary {
    background: #222222;
  }

  .navigation-items {
    list-style-type: none;
    padding: 0;
    margin: 0;
  }

  li {
    height: 50px;
    line-height: 46px;
    padding: 0 10px;
    cursor: pointer;

    mat-list-item {
      cursor: pointer;
    }

    a {
      font-size: 16px;
      text-decoration: none;
      color: #9d9d9d;
      padding: 16px 5px;
    }

    &:hover {
      a {
        color: white;
      }
    }

    &.active {
      @extend li:hover;

      background: #000000;
    }
  }

  .brand-logo {
    padding-top: 6px;
    margin-right: -10px;

    mat-icon {
      color: #dadada;
      width: 135px;
      height: 40px;
      stroke: #dadada;
    }

    .version-label {
      position: relative;
      left: -42px;
      font-size: 12px;
      color: #bebebe;
    }

    @media all and (max-width: 959px) {
      margin: auto;
    }
  }
}

button.active {
  background: #dadada;
}