lego-appbar {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: $navbar-index;

  .appbar-container {
    overflow: hidden;
    display: flex;
    height: $navbar-height;
    align-items: center;
    background-color: $navbar-bg;
    border-bottom: solid 1px $border-gray;

    .appbar-left {
      display: flex;
      align-items: center;

      .logo {
        display: flex;
        margin: 0.5rem 1rem;
        align-items: center;
        user-select: none;

        img {
          max-width: 15rem;
        }
      }

      .links {
        lego-menu {
          display: flex;
          align-items: center;
          text-transform: uppercase;
          font-size: 0.825rem;
          letter-spacing: $caps-letter-spacing;
          color: $secondary;

          lego-menu-left-item {
            padding: 0 0.75rem;

            a {
              color: $mid-gray;
              border-bottom: none;
            }
          }
        }
      }
    }

    .appbar-center {
      margin-left: 1rem;
      flex-grow: 1;

      lego-textbox {
        margin-right: 1rem;
        padding: 5px;
        border-radius: 3px;
        border: solid 1px #ccc;
        width: 400px;
        display: block;
        background-color: $white;

        .input-wrapper {
          padding: 0;

          .input {
            input {
              border: none;
            }
          }
        }
      }
    }

    .appbar-right {
      lego-menu {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        margin-right: 1rem;

        lego-menu-right-item {
          margin-left: 0.5rem;

          lego-appbar-profile {
            .profile {
              img {
                width: 2.5rem;
                border-radius: 50%;
              }
            }
          }
        }
      }
    }
  }
}