@use '../../../common/scss/global.scss';
@use '~@kyndryl-design-system/shidoka-foundation/scss/mixins/typography.scss';

:host {
  @include typography.type-ui-05;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  height: 48px;
  color: var(--kd-color-text-primary);
  padding: var(--kd-spacing-0);
  border: 0;
  margin: var(--kd-spacing-15) var(--kd-spacing-0);
}

kyn-pagination-items-range,
kyn-pagination-page-size-dropdown,
kyn-pagination-navigation-buttons {
  height: 100%;
  align-items: center;
  display: flex;
}

kyn-pagination-page-size-dropdown {
  margin: var(--kd-spacing-0) var(--kd-spacing-24);
}

@media (max-width: 767px) {
  kyn-pagination-navigation-buttons {
    margin-left: 20px;
  }
}