/**
 * @license
 * Copyright Endlessjs. All Rights Reserved.
 * Licensed under the MIT License. See License.txt in the project root for license information.
 */

@import '../../styles/core/mixins';

:host {
  display: flex;

  .user-container {
    position: relative;
    display: flex;
    align-items: center;
  }

  .user-picture {
    position: relative;
    flex-shrink: 0;

    &.image {
      background-size: cover;
      background-repeat: no-repeat;
    }

    &.initials {
      display: flex;
      align-items: center;
      justify-content: center;
    }
  }

  .user-name,
  .user-title {
    @include el-rtl(text-align, right);
  }

  .info-container {
    @include el-ltr(margin-left, 0.5rem);
    @include el-rtl(margin-right, 0.5rem);
  }
}