// shared styles for user and group cards
.user-card,
.group-card {
  position: absolute;
  z-index: z("usercard");
  &.fixed {
    position: fixed;
    z-index: z("header") + 1;
  }
  &.docked-card {
    z-index: z("header") + 1;
  }
  // avatar - names - controls
  .first-row {
    .names {
      flex: 1 1 auto;
    }
    .usercard-controls {
      max-width: 225px;
      button {
        min-width: 150px;
      }
    }
  }
  h1 {
    .d-icon {
      font-size: $font-down-1;
    }
  }
  h2 {
    font-size: $font-up-1;
  }
  h3 {
    font-size: $font-0;
  }
}

// styles for user cards only
.user-card {
  // badges
  .badge-section {
    .user-badge {
      display: block;
      max-width: 185px;
    }
    .more-user-badges {
      max-width: 125px;
    }
  }
}