<div layoutDirection="row" layoutDirection-xs="column" class="fl-content fl-content-min-height">
  <div layoutDirection="column" appFlex="50" *ngIf="object">
    <p class="fl-detail" i18n>First name: {{ object.first_name }}</p>
    <p class="fl-detail" i18n>Last name: {{ object.last_name }}</p>
    <p class="fl-detail" i18n>Email: {{ object.email }}</p>
    <p class="fl-detail" i18n>External billing ID: {{ object.external_billing_id | nullValue }}</p>
    <p class="fl-detail" i18n>ID: {{ object.id }}</p>
    <p class="fl-detail" i18n>Last login: <app-date-displayer [date]="object.last_login" withTime></app-date-displayer></p>
    <p class="fl-detail" i18n>Date joined: <app-date-displayer [date]="object.date_joined" withTime></app-date-displayer></p>
    <p *ngIf="object.sfa_enabled && authSvc.feature('clients&users.second_factor_auth')" class="fl-detail" i18n>Second factor authentication enabled</p>
    <span class="fl-tag fit-content fl-margin-top-medium" *ngIf="object.is_staff">staff</span>
    <span class="fl-tag fit-content fl-margin-top-medium" *ngIf="object.is_superuser">superuser</span>
  </div>
</div>
