.container {
  display: flex;
  align-items: center;
  gap: 10px;
  .perPageContainer {
    height: 40px;
  }
  .list {
    display: flex;
    height: 40px;
    align-items: center;
    gap: 1px;
    border: 1px solid rgba(102, 192, 255, 1);
    border-radius: 10px;
    padding: 2px;

    .item {
      display: flex;
      align-items: center;
      justify-content: center;
      height: 100%;
      padding: 0 14px;
      border-radius: 8px;
      transition: ease-in-out 200ms;
      color: var(--black);
      font-weight: 400;
      font-size: 12px;
      line-height: 12.19px;
      letter-spacing: 0;

      &.active {
        background-color: rgba(102, 192, 255, 1);
        color: var(--white);
      }

      &:disabled {
        cursor: not-allowed;
        opacity: 0.5;
      }
    }
  }
}
