@import '~scss/variables';

.logined {
  display: inline-block;
  line-height: 1.67;
  font-family: $font-family-id;
  z-index: 100;
  cursor: pointer;

  :global {
    .popper[x-placement^='top'] {
      margin-bottom: 0;
      transform: translate3d(-31px, 27px, 0px) !important;
    }
  }
}

.name {
  font-size: $body-size;
  color: $title-color;

  &.isAppsPage {
    color: white;
  }

  :global .icon {
    margin-top: -2px;

    &:first-of-type {
      margin-right: 12px;
    }

    &:last-of-type {
      margin-left: 12px;
    }
  }
}

.notLoggedIn {
  .name {
    color: $yellow-color03;
    font-size: $size-small;
    line-height: 20px;

    :global {
      svg {
        --primary-color: #{$yellow-color03};
        --second-color: #{$yellow-color05};
      }
    }
  }

  .loginLabel {
    color: $yellow-color03;
    cursor: pointer;
  }
}
