:host {
  --r-pagination--display: flex;
  --r-pagination--list-style: none;
  --r-pagination--align-items: center;
  --r-pagination--justify-content: center;
  --r-pagination--font-family: var(--r-font-family-text);
  --r-pagination--margin: 0 auto;
  --r-pagination--flex-direction: column;
  --r-pagination--width: 100%;
  --r-pagination--max-width: 664px;
  --r-pagination--margin: 0 auto;
  --r-pagination--items-list--display: flex;
  --r-paginaition--items-list--justify-content: center;
  --r-paginaition--items-list--align-items: center;
  --r-paginaition--items-list--list-style-type: none;
  --r-paginaition--items-list--padding: 0;
  --r-paginaition--items-list--margin: 0;
  --r-pagination--item--width: var(--r-spacing-300, 3rem);
  --r-pagination--item--height: var(--r-spacing-300, 3rem);
  --r-pagination--item--border-radius: 0;
  --r-pagination--button--border-width: 0;
  --r-pagination--button--padding: 0;
  --r-pagination--header--display: flex;
  --r-pagination--header--align-items: center;
  --r-pagination--header--justify-content: space-between;
  --r-pagination--header--min-width: 287px;
  --r-pagination--footer--display: flex;
  --r-pagination--footer--justify-content: center;
  --r-pagination--footer--width: 100%;
  --r-pagination--item--disabled-text: none;
  --r-pagination--font-size: var(--r-font-size-200);
  display: block;
}

:host([variant=minimized]) {
  --r-pagination--max-width: 440px;
}

:host([variant=standard]) {
  --r-pagination--max-width: 560px;
}

:host([variant=maximized]) {
  --r-pagination--max-width: 664px;
}

.r-pagination r-select {
  --r-select--font-size: var(--r-pagination--font-size, 12px);
  --r-select-option--font-size: var(--r-pagination--font-size, 12px);
}

.r-pagination {
  align-items: var(--r-pagination--align-items);
  display: var(--r-pagination--display);
  flex-direction: var(--r-pagination--flex-direction);
  font-family: var(--r-pagination--font-family);
  font-size: var(--r-pagination--font-size);
  justify-content: var(--r-pagination--justify-content);
  list-style: var(--r-pagination--list-style);
  margin: var(--r-pagination--margin);
  max-width: var(--r-pagination--max-width);
  user-select: var(--r-pagination--item--disabled-text);
  width: var(--r-pagination--width);
}
.r-pagination--footer {
  align-items: var(--r-pagination--header--align-items);
  display: var(--r-pagination--footer--display);
  justify-content: var(--r-pagination--footer--justify-content);
}
.r-pagination--header {
  align-items: var(--r-pagination--header--align-items);
  display: var(--r-pagination--header--display);
  justify-content: var(--r-pagination--header--justify-content);
  font-family: var(--r-pagination--font-family);
  min-width: var(--r-pagination--header--min-width);
}
.r-pagination--header--select {
  min-width: auto;
  --width: unset !important;
}
.r-pagination--header label {
  font-size: var(--r-pagination--font-size);
}
.r-pagination--items-list {
  display: var(--r-pagination--items-list--display);
  justify-content: var(--r-paginaition--items-list--justify-content);
  align-items: var(--r-paginaition--items-list--align-items);
  list-style-type: var(--r-paginaition--items-list--list-style-type);
  padding: var(--r-paginaition--items-list--padding);
  margin: var(--r-paginaition--items-list--margin);
}
.r-pagination--item.active {
  --r-button--color: var(--r-text-regular);
  --r-button--background-color: var(--r-background-interactive-activated);
  font-weight: var(--r-font-weight-semibold);
}
.r-pagination--item.number {
  --r-button--font-size: 0.813rem;
}
.r-pagination--item {
  --r-icon-button--height: var(--r-pagination--item--height);
  --r-icon-button--width: var(--r-pagination--item--width);
  --r-icon-button--border-radius: var(--r-pagination--item--border-radius);
  --r-button--width: var(--r-pagination--item--width);
  --r-button--height: var(--r-pagination--item--height);
  --r-button--border-width: var(--r-pagination--button--border-width);
  --r-button--padding: var(--r-pagination--button--padding);
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  overflow: hidden;
  white-space: nowrap;
}
