/* 分页容器 */
.pagination {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    gap: 5px;
}

/* 每个分页项 */
.page-item {
    background-color: #fafafa;
    cursor: pointer;
    font-size: 16px;
    line-height: 40px;
    height: 40px;
    color: #666666;
    white-space: nowrap;
    border: 1px solid #eee;
    padding: 0;                    /* 移除内边距，由内部元素控制 */
}

/* 内部链接/文本块 */
.page-item a,
.page-item span {
    display: block;
    padding: 0 17px;               /* 保持原来的左右内边距 */
    text-decoration: none;
    color: inherit;
    height: 100%;
    width: 100%;
    box-sizing: border-box;
}

/* 悬停状态 */
.page-item:hover {
    background-color: var(--primary-color);
    color: white;
}

/* 当前激活项 */
.page-item.active {
    background-color: var(--primary-color);
    color: white;
}

/* 禁用项 */
.page-item.disabled {
    opacity: 0.5;
    cursor: not-allowed;
    color: #666666 !important;
    background-color: #f9f9f9 !important;
}
.page-item.disabled a,
.page-item.disabled span {
    cursor: not-allowed;
}

/* 省略号项（不带边框和背景） */
.page-ellipsis {
    padding: 0 17px;
    border: none;
    cursor: default;
    color: #666;
    font-size: 16px;
    line-height: 40px;
    height: 40px;
    background-color: transparent;
    opacity: 0.5;
}
.page-ellipsis span {
    display: block;
    height: 100%;
    width: 100%;
}

/* 滚动容器（可选） */
#pagination_el {
    overflow-x: auto;
    margin-top: 60px;
}
#pagination_el::-webkit-scrollbar {
    width: 5px;
    height: 5px;
}
#pagination_el::-webkit-scrollbar-track {
    background: transparent;
}
#pagination_el::-webkit-scrollbar-thumb {
    background: rgba(225, 225, 225, 0.3);
    border-radius: 10px;
}
#pagination_el::-webkit-scrollbar-thumb:hover {
    background: rgba(225, 225, 225, 0.7);
}

.page-item.prev-page a,
.page-item.prev-page span,
.page-item.next-page a,
.page-item.next-page span {
    padding-left: 0;
    padding-right: 0;
    text-align: center;  /* 确保图标居中 */
    min-width: 40px;     /* 可设置一个最小宽度，避免太窄 */
}