@import "../Tokens/tokens.scss";

.top-bar {
  display: flex;
  margin-left: auto;
  margin-top: ($baseUnit * 2);
  margin-bottom: ($baseUnit * 9);
  flex-direction: row;
  align-items: center;

  @media(max-width: 1000px) {
    display: none;
  }

  .top-bar-left {
    flex: 2;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: flex-start;
  }

  .top-bar-user {
    flex: 1;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    margin: 0 ($baseUnit * 2) 0 auto;
    justify-content: flex-end;

    .user-name {
      margin-right: $baseUnit * 1.5;
    }

    .user-image {
      margin-right: $baseUnit * 2;
    }

    .user-menu {
      
    }
  }
}