.panel-user {
  border: 2px solid transparent;
  overflow: hidden;

  .panel-heading {
    cursor: pointer;

    .avatar {
      min-width: $avatar-md;
      flex: 1;
      flex-basis: $avatar-xl;
      flex-shrink: 0;

      @include avatar-xl(true);
    }

    & + .panel-body {
      border-top-width: 0;
    }
  }

  .panel-collapse {
    &.in {
      margin-top: $panel-padding-y;

      @include themes-border-top(color-new-border);
    }

    .panel-body {
      padding-top: 0;
    }
  }

  &-name {
    font-size: $font-size-h4;
    line-height: $grid-unit-y * 3;
    font-weight: $font-weight-medium;

    @include themes(color, color-new-heading);

    @include text-overflow();
  }

  &-subname {
    font-size: $font-size-base;
    line-height: $grid-unit-y * 3;

    @include themes(color, color-new-body-light);

    @include text-overflow();
  }

  &-icon {
    @include themes(color, color-text-dark);

    &:hover,
    &:focus {
      color: $brand-primary;
    }
  }

  &-description {
    font-size: $font-size-base;

    &-block {
      line-height: $grid-unit-y * 3;
      display: flex;
      align-items: center;

      &:not(:last-child) {
        margin-bottom: ceil($grid-unit-y * 2.5);
      }
    }

    &-title {
      min-width: 0;

      @include themes(color, color-new-heading);

      @include text-overflow();
    }

    &-capture {
      margin-left: auto;
      min-width: 0;

      @include themes(color, color-new-body-light);

      @include text-overflow();
    }
  }

  &-selectable {
    &:hover,
    &:focus {
      @each $theme, $map in $themes {
        .#{$theme} & {
          $box-shadow: map-get($map, box-shadow);

          background-color: map-get($map, panel-user-hover-bg);

          @include box-shadow($box-shadow);
        }
      }
    }

    &.active {
      border-color: $brand-primary;
      padding: ($panel-padding-y - 2) ($panel-padding-x - 2);

      @include themes-value(border-width, 2px);
    }
  }

  &.panel-open {
    overflow: auto;
  }

  &-in-modal {
    margin-bottom: 0;

    @include themes-value("border-width", 0);
  }
}
