chromium/ash/webui/common/resources/cr_elements/cr_toolbar/cr_toolbar_selection_overlay.html

<style>
  :host {
    background-color: white;
    border-bottom: 1px solid var(--google-grey-300);
    bottom: 0;
    color: var(--cr-primary-text-color);
    display: flex;
    left: 0;
    opacity: 0;
    padding-inline-start: var(--cr-toolbar-field-margin, 0);
    pointer-events: none;
    position: absolute;
    right: 0;
    top: 0;
    transition: opacity var(--cr-toolbar-overlay-animation-duration),
                visibility var(--cr-toolbar-overlay-animation-duration);
    visibility: hidden;
  }

  @media (prefers-color-scheme: dark) {
    :host {
      background-color: var(--google-grey-900);
      background-image: linear-gradient(rgba(255, 255, 255, .04),
                                        rgba(255, 255, 255, .04));
      border-bottom-color: var(--cr-separator-color);
    }
  }

  :host([show]) {
    opacity: 1;
    pointer-events: initial;
    visibility: initial;
  }

  #overlay-content {
    align-items: center;
    display: flex;
    flex: 1;
    margin: 0 auto;
    max-width: var(--cr-toolbar-selection-overlay-max-width, initial);
    padding: 0 var(--cr-toolbar-selection-overlay-padding, 24px);
  }

  #number-selected {
    flex: 1;
  }

  cr-icon-button {
    height: 36px;
    margin-inline-end: 24px;
    margin-inline-start: 2px;
    width: 36px;
  }

  #slot {
    align-items: center;
    display: flex;
    gap: var(--cr-toolbar-selection-overlay-slot-gap, 16px);
    margin-inline-start: 8px;
  }
</style>
<template is="dom-if" if="[[hasShown_]]">
  <div id="overlay-content">
    <cr-icon-button part="clearIcon"
        title="[[cancelLabel]]" iron-icon="cr:clear"
        on-click="onClearSelectionClick_"></cr-icon-button>
    <div id="number-selected">[[selectionLabel_]]</div>
    <div id="slot"><slot></slot></div>
  </div>
</template>