.extra-files {
  display: grid;
  gap: var(--grid-gap);
  grid-template-columns: repeat(2, 1fr);
  margin: var(--grid-gap) 0;
}

.extra-files__title {
  grid-column: 1 / -1;
}

.extra-files__item {
  display: grid;
  gap: 20px;
  grid-template-columns: 0fr 1fr;
}

.extra-files__info {
  display: grid;
  gap: 4px;
  font-size: calc(16rem/var(--initial-font-multiplier));
}

.extra-files__date,
.extra-files__size {
  color: var(--hint-color);
}

:root.root--special .extra-files__item > svg {
  filter: grayscale(1);
}

:root.root--special .extra-files__date,
:root.root--special .extra-files__size {
  color: var(--special-test-color);
}

@media screen and (max-width: 735px) {
  .extra-files {
    grid-template-columns: 1fr;
  }
}

@media print {
  .extra-files {
    display: block;
  }

  .extra-files__item {
    margin: 10px 0;
    display: inline-block;
    width: 100%;
    page-break-inside: avoid;
    page-break-before: auto;
    position: relative;
  }

  .extra-files__item > svg {
    display: none;
  }

  .extra-files__info {
    display: block;
  }
}