list {

  #list {
    background: white;
    padding-left: 0;
    padding-right: 0;
    margin-left: -7px;
    margin-right: -7px;

    #list-header {
      position: static;
      height: 35px;
      user-select: none;
      cursor: default;
      margin-top: 2px;
      display: grid;
      grid-template-columns: 4fr 6fr 9fr 130px 6px;
      grid-gap: 1px;
      color: rgb(73, 80, 87);
      background: rgb(221, 221, 221);
      font-size: 16px;
      font-weight: 500;
      border: solid 1px rgb(221, 221, 221);
      border-bottom: none;

      div {
        padding: 5px 5px 5px 10px;
        background: white;
      }

      #header-placeholder {
        border-right: solid 1px rgb(221, 221, 221);
        margin-left: -1px;
        margin-right: -1px;
        padding: 3px;
      }
    }

    #list-body {
      height: calc(100vh - 175px);
      border: solid 1px rgb(221, 221, 221);

      .cdk-virtual-scroll-viewport {
        height: calc(100vh - 178px);
        overflow-y: scroll;
      }

      #document-limit-info {
          display: block;
          padding: 10px;
          background-color: #f8f9fa;
          font-style: italic;
          user-select: none;
          cursor: default;
      }
    }

    .no-search-result {
      opacity: 0.7;
    }
  }

  #list-background {
    height: 38px;

    #create-document-button .circular-button {
      left: calc(50% - 20px);
      margin: -20px auto auto auto;
      z-index: 100;
    }
  }

  loading-icon {
    position: relative;
    bottom: 14px;
  }
}