.ev-document-list {
  width: 100%;
}

.ev-document-list-grid {
  @extend .mdc-layout-grid;
  @extend .mdc-layout-grid--fixed-column-width;

  @media(max-width: mdc-layout-grid-breakpoint-max('phone')) {
    $phone-max-width: $document-card-max-width + $document-list-gutter*2;
    @include mdc-layout-grid('phone', auto, $phone-max-width);
  }

  @media(min-width: mdc-layout-grid-breakpoint-min('tablet')) {
    $tablet-max-width: $document-card-max-width*2 +$document-list-gutter*3;
    @include mdc-layout-grid('tablet', auto, $tablet-max-width);
  }

  @media(min-width: mdc-layout-grid-breakpoint-min('desktop')) {
    $desktop-max-width: $document-card-max-width*4 +$document-list-gutter*4;
    @include mdc-layout-grid('desktop', auto, $desktop-max-width);
  }
}

.ev-document-list-grid__inner {
  @extend .mdc-layout-grid__inner;
}

.ev-document-list-grid__cell {
  @extend .mdc-layout-grid__cell;

  @media(min-width: mdc-layout-grid-breakpoint-min('phone')) {
    @include mdc-layout-grid-cell('phone', 4, 10px);
  }

  @media(min-width: mdc-layout-grid-breakpoint-min('tablet')) {
    @include mdc-layout-grid-cell('tablet', 4, 10px);
  }

  @media(min-width: mdc-layout-grid-breakpoint-min('desktop')) {
    @include mdc-layout-grid-cell('desktop', 3, 10px);
  }
}
