.component-interactive-pagination {
  :global {
    .ant-pagination-next,
    .ant-pagination-prev {
      border: var(--component-pagination-prev-next-border);
      background-color: var(--component-pagination-prev-next-background-color);
      display: inline-flex;
      align-items: center;
      justify-content: center;

      width: calc(var(--component-pagination-text-size) + 18px);
      height: calc(var(--component-pagination-text-size) + 18px);
      line-height: calc(
        var(--component-pagination-text-size) + 18px -
          var(--component-pagination-border-width) * 2
      );
    }
    .ant-pagination-next,
    .ant-pagination-item,
    .ant-pagination-prev,
    .ant-select-selector,
    .ant-select:not(.ant-select-customize-input) .ant-select-selector,
    .ant-pagination-options-quick-jumper input {
      border-radius: var(--component-pagination-border-radius);
    }
    .ant-select:not(.ant-select-customize-input) .ant-select-selector,
    .ant-pagination-item,
    .ant-pagination-options-quick-jumper input {
      border: var(--component-pagination-border);
      background-color: var(--component-pagination-background-color);

      width: calc(var(--component-pagination-text-size) + 18px);
      height: calc(var(--component-pagination-text-size) + 18px);
      line-height: calc(
        var(--component-pagination-text-size) + 18px -
          var(--component-pagination-border-width) * 2
      );
    }
    .ant-select:not(.ant-select-customize-input) .ant-select-selector {
      width: 100%;
    }
    .ant-pagination-item {
      margin-right: var(--component-pagination-margin);
    }
    .ant-pagination-item.ant-pagination-item-active {
      border: var(--component-pagination-active-border);
      background-color: var(--component-pagination-active-background-color);
    }
    .ant-pagination-item a,
    .ant-select:not(.ant-select-customize-input) .ant-select-selector,
    .ant-pagination-options-quick-jumper,
    .ant-pagination-options-quick-jumper input,
    .ant-pagination-jump-prev,
    .ant-pagination-jump-next,
    .ant-pagination-jump-prev
      .ant-pagination-item-container
      .ant-pagination-item-link-icon,
    .ant-pagination-jump-next
      .ant-pagination-item-container
      .ant-pagination-item-link-icon {
      color: var(--component-pagination-text-color);
      font-size: var(--component-pagination-text-size);
      font-weight: var(--component-pagination-text-weight);
      font-family: var(--component-pagination-text-family);
    }
    .ant-pagination-item.ant-pagination-item-active a {
      color: var(--component-pagination-text-active-color);
      font-size: var(--component-pagination-text-active-size);
      font-weight: var(--component-pagination-text-active-weight);
      font-family: var(--component-pagination-text-active-family);
    }
    .ant-pagination-total-text {
      margin-right: var(--component-pagination-total-margin);
    }
    .ant-pagination-options {
      margin-left: calc(var(--component-pagination-margin) * 2);
    }
    .ant-pagination-options-quick-jumper {
      margin-left: var(--component-pagination-margin);
    }
    .ant-pagination-item,
    .ant-pagination-jump-prev,
    .ant-pagination-jump-next {
      width: calc(var(--component-pagination-text-size) + 18px);
      height: calc(var(--component-pagination-text-size) + 18px);
      line-height: calc(
        var(--component-pagination-text-size) + 18px -
          var(--component-pagination-border-width) * 2
      );
    }
    .ant-pagination-options-quick-jumper input {
      margin: 0 var(--component-pagination-margin);
      width: calc(var(--component-pagination-text-size) + 36px);
      height: calc(var(--component-pagination-text-size) + 18px);
    }
    .ant-select-selector .ant-select-selection-item {
      height: 100%;
      line-height: calc(var(--component-pagination-text-size) + 18px);
      padding-right: calc(var(--component-pagination-changer-size) + 6px);
    }
    .ant-pagination-options-size-changer.ant-select-show-arrow
      .ant-select-arrow {
      font-size: var(--component-pagination-changer-size);
      color: var(--component-pagination-changer-color);
    }
    .ant-select-focused:not(.ant-select-disabled).ant-select:not(
        .ant-select-customize-input
      )
      .ant-select-selector {
      box-shadow: none;
      border: var(--component-pagination-border);
    }
    .ant-select-single.ant-select-open .ant-select-selection-item {
      color: var(--component-pagination-text-color);
    }

    .ant-select-item-option-selected:not(.ant-select-item-option-disabled) {
      background-color: transparent;
      color: var(--component-pagination-text-active-color);
    }
    .ant-select-item-option-active:not(.ant-select-item-option-disabled) {
      background-color: transparent;
    }
    .ant-select-item {
      color: var(--component-pagination-text-color);
      font-size: var(--component-pagination-text-size);
      font-weight: var(--component-pagination-text-weight);
      font-family: var(--component-pagination-text-family);
      line-height: calc(var(--component-pagination-text-size) + 14px);
    }
  }
}
