@mixin component-header {
  @include e(header) {
    position: relative;
    display: flex;
    align-items: center;
    padding: 12px 20px;
    border-bottom: 1px solid var(--#{$rd-prefix}color-divider);
  }

  @include e(header-title) {
    @include utils-ellipsis;

    flex: 1 0 0;
    font-size: 1.1em;
    font-weight: $rd-font-weight-bold;
  }

  @include e(header-actions) {
    @include polyfill-column-gap(8px);

    display: inline-flex;
    flex-shrink: 0;
    align-items: center;
  }
}