/* stylelint-disable-next-line selector-type-no-unknown */
paginate {
  display: block;

  /* stylelint-disable-next-line selector-type-no-unknown */
  paginate-controls {
    display: flex;
    align-items: center;
    padding: $euiSizeXS $euiSizeXS $euiSizeS;
    text-align: center;

    .pagination-other-pages {
      flex: 1 0 auto;
      display: flex;
      justify-content: center;
    }

    .pagination-other-pages-list {
      flex: 0 0 auto;
      display: flex;
      justify-content: center;
      padding: 0;
      margin: 0;
      list-style: none;

      > li {
        flex: 0 0 auto;
        user-select: none;

        a {
          text-decoration: none;
          background-color: $euiColorLightestShade;
          margin-left: $euiSizeXS / 2;
          padding: $euiSizeS $euiSizeM;
        }

        a:hover {
          text-decoration: underline;
        }

        &.active a {
          text-decoration: none !important;
          font-weight: $euiFontWeightBold;
          color: $euiColorDarkShade;
          cursor: default;
        }
      }
    }

    .pagination-size {
      flex: 0 0 auto;

      input[type="number"] {
        width: 3em;
      }
    }
  }
}