/* ===========================================================================
   全站统一分页
   ---------------------------------------------------------------------------
   页码规则在 app\widgets\OjLinkPager 里：首页 4 个 + 省略号 + 末页 4 个，
   当前页落在中间时省略号两侧各补一位。这里只管外观：居中、细线、当前页实心。

   为什么选择器要带 body + ul + .oj-pager：
   各模块 css（problem / contest / news / group / record / rating / discuss /
   admin …）历史上各写过一套 .pagination，而它们都在 theme.css 之后加载，
   只写 .pagination 会被盖回左对齐。多一层 body + ul + 类名，
   特异性提到 (0,2,2) 以上，才能稳定压住那些祖先类写法。
   =========================================================================== */

/* 兜底：没有 .oj-pager 的手写分页也居中 */
body .pagination {
    display: flex;
    float: none;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 5px;
    margin: 18px 0 0;
    padding: 0;
    list-style: none;
}

body ul.pagination.oj-pager {
    display: flex;
    /* 有些老模块把 .pagination 设成 float:left + inline-block，
       ul 收缩到内容宽后 justify-content 就没有余量可分，看着还是靠左 */
    float: none;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 5px;
    margin: 18px 0 0;
    padding: 0;
    border-radius: 0;
    list-style: none;
}

body ul.pagination.oj-pager > li {
    display: block;
    float: none;
    margin: 0;
    list-style: none;
}

body ul.pagination.oj-pager > li > a,
body ul.pagination.oj-pager > li > span {
    display: block;
    float: none;
    min-width: 30px;
    height: 30px;
    margin: 0;
    padding: 0 9px;
    border: 1px solid var(--line, #E4E7E4);
    border-radius: 3px;
    background: var(--paper, #fff);
    color: var(--ink-2, #3D4A52);
    font-size: 13px;
    line-height: 28px;
    text-align: center;
    text-decoration: none;
    font-variant-numeric: tabular-nums;
    transition: border-color .12s, color .12s, background-color .12s;
}

body ul.pagination.oj-pager > li > a:hover,
body ul.pagination.oj-pager > li > a:focus {
    border-color: var(--brand, #0F5C6B);
    background: var(--paper, #fff);
    color: var(--brand, #0F5C6B);
    text-decoration: none;
}

body ul.pagination.oj-pager > .active > a,
body ul.pagination.oj-pager > .active > span,
body ul.pagination.oj-pager > .active > a:hover,
body ul.pagination.oj-pager > .active > a:focus {
    border-color: var(--brand, #0F5C6B);
    background: var(--brand, #0F5C6B);
    color: #fff;
    cursor: default;
}

body ul.pagination.oj-pager > .disabled > a,
body ul.pagination.oj-pager > .disabled > span,
body ul.pagination.oj-pager > .disabled > a:hover {
    border-color: var(--line-soft, #F0F2F0);
    background: var(--page, #F6F7F5);
    color: var(--muted, #8A9490);
    cursor: default;
}

/* 省略号：不占按钮框，只留一个可呼吸的空档 */
body ul.pagination.oj-pager > .oj-pager-gap > span {
    min-width: 14px;
    padding: 0 2px;
    border-color: transparent;
    background: transparent;
    color: var(--muted, #8A9490);
    letter-spacing: 1px;
}

/* ---------------------------------------------------------------- 窄屏 */
@media (max-width: 767px) {
    body ul.pagination.oj-pager,
    body .pagination {
        gap: 4px;
        row-gap: 6px;
        margin: 14px 0 0;
    }

    body ul.pagination.oj-pager > li > a,
    body ul.pagination.oj-pager > li > span {
        min-width: 26px;
        height: 26px;
        padding: 0 6px;
        font-size: 12px;
        line-height: 24px;
    }
}