.items-page {

    font-size: $fontSize14;
    line-height: $lineHeight22;
    color: var(--bodyColor);

}

.page-item {
    font-size: $fontSize16;
    line-height: $lineHeight24;

    &:first-child,
    &:last-child {
        .page-link {
            align-items: center;
        }
    }

    &.active {
        .page-link {
            background-color: var(--primaryColorMain);
            color: var(--gray00);
            border-radius: $borderRadius50;
        }
    }

    &.disabled {
        cursor: not-allowed;

        &:first-child,
        &:last-child {
            .page-link {
                color: var(--gray400);
            }
        }

        .page-link {
            span {
                color: var(--gray400);
            }

        }

    }

    .page-link {
        display: flex;
        width: $spacing40;
        height: $spacing40;
        padding: $spacing8;
        border: none;
        background: none;
        color: var(--bodyColor);
        gap: $spacing16;
        box-shadow: none;
        justify-content: center;
        font-family: $fontTitle;
        font-size: $fontSize16;
        font-weight: $fontWeightRegular;
        line-height: $lineHeight24;
    }
}