.pagination-container {
    margin: 2rem 0;
}

.pagination {
    display: flex;
    padding-left: 0;
    list-style: none;
    margin: 0;
}

.pagination .page-item {
    margin: 0 0.5rem;
}

.pagination .page-link {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--edtt-color-text-default);
    text-decoration: none;
    background-color: var(--edtt-color-bg-default);
    border-radius: 0.5rem;
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out,
        border-color 0.15s ease-in-out;
    font-size: var(--edtt-font-size-body);
    font-weight: 400;
    height: 2rem;
    width: 2rem;
}

.pagination .page-item.active .page-link {
    z-index: 3;
    color: var(--edtt-color-white);
    background-color: var(--edtt-color-primary-base);
    border-color: var(--edtt-color-primary-base);
}

.pagination .page-link .icon {
    font-size: var(--edtt-font-size-lg);
    line-height: 1;
}

.pagination .page-link span {
    padding: 0 0.5rem;
}