@import '../../../scss/styles.scss';

.versions {
  width: 100%;
  margin-bottom: base(2);

  &__wrap {
    padding-top: base(1);
  }

  &__header {
    margin-bottom: $baseline;
  }

  &__intro {
    margin-bottom: base(.5);
  }

  &__parent-doc {
    .banner__content {
      display: flex;
    }
  }

  &__parent-doc-pills {
    margin-left: auto;
  }

  .table {
    table {
      width: 100%;
      overflow: auto;
    }
  }

  &__page-controls {
    width: 100%;
    display: flex;
    align-items: center;
  }

  .paginator {
    margin-bottom: 0;
  }

  &__page-info {
    margin-right: base(1);
    margin-left: auto;
  }

  @include mid-break {
    &__wrap {
      padding-top: 0;
    }

    &__page-controls {
      flex-wrap: wrap;
    }

    &__page-info {
      margin-left: 0;
    }

    .paginator {
      width: 100%;
      margin-bottom: $baseline;
    }
  }
}
