.pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
    justify-content: center;
    margin-bottom: 0;
}

.pagination > li,
.pagination .page-item {
    list-style: none;
}

.pagination > li > a,
.pagination > li > span,
.pagination .page-link {
    align-items: center;
    background-color: #ffffff;
    border: 1px solid #d1d5db;
    border-radius: 0.375rem;
    color: #334155;
    display: inline-flex;
    justify-content: center;
    line-height: 1.25;
    min-width: 2.25rem;
    padding: 0.5rem 0.75rem;
    text-decoration: none;
    transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.pagination > li > a:hover,
.pagination > li > span:hover,
.pagination .page-link:hover,
.pagination > li > a:focus,
.pagination > li > span:focus,
.pagination .page-link:focus {
    background-color: #f8fafc;
    border-color: #0c83ff;
    color: #0c83ff;
    text-decoration: none;
}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus,
.pagination .page-item.active .page-link,
.pagination .page-item.active .page-link:hover,
.pagination .page-item.active .page-link:focus {
    background-color: #0c83ff;
    border-color: #0c83ff;
    color: #ffffff;
}

.pagination > .disabled > a,
.pagination > .disabled > span,
.pagination > .disabled > a:hover,
.pagination > .disabled > span:hover,
.pagination > .disabled > a:focus,
.pagination > .disabled > span:focus,
.pagination .page-item.disabled .page-link,
.pagination .page-item.disabled .page-link:hover,
.pagination .page-item.disabled .page-link:focus {
    background-color: #f3f4f6;
    border-color: #e5e7eb;
    color: #9ca3af;
    cursor: not-allowed;
}

.pagination.pagination-sm > li > a,
.pagination.pagination-sm > li > span,
.pagination.pagination-sm .page-link {
    min-width: 2rem;
    padding: 0.375rem 0.625rem;
}

.card .pagination,
.content .pagination {
    width: 100%;
}
