/* ===== Champions: box-обёртка ===== */
.champions-box{
    border:1px solid var(--fc-border);
    border-radius:12px;
    overflow:auto;
    background:var(--fc-surface);
    box-shadow:0 6px 18px var(--fc-shadow);
    -webkit-overflow-scrolling:touch;
}
.champions-box::before, .champions-box::after{ content:none!important; display:none!important; }

/* ===== Таблица (десктоп/планшет) ===== */
.champions-box table{ table-layout:fixed; width:100%; min-width:640px; margin:0; }
.champions-box thead.table-light th{
    background:#fafafa; color:#374151; font-weight:800; border-bottom:1px solid var(--fc-border);
    text-align:center;
}
[data-theme="dark"] .champions-box thead.table-light th{
    background:#141414; color:#e0e0e0; border-bottom:1px solid var(--fc-border);
}
.champions-box tbody td{
    vertical-align:middle; text-align:center;
    word-break:break-word; overflow-wrap:anywhere;
    padding-top:.6rem; padding-bottom:.6rem;
}
.champions-box tbody tr + tr td{ border-top:1px solid #f3f4f6; }
[data-theme="dark"] .champions-box tbody tr + tr td{ border-top:1px solid #1a1a1a; }

/* Первая колонка "Division" — больше места и sticky на ≥992px */
@media (min-width:992px){
    .champions-box thead th:first-child,
    .champions-box tbody td:first-child{ width:220px; }
    .champions-box tbody td:first-child{
        position:sticky; left:0; z-index:1;
        background:var(--bs-body-bg, var(--fc-surface));
        text-align:left; font-weight:800;
        white-space:normal; text-overflow:clip; line-height:1.25;
        border-right:1px solid rgba(0,0,0,.04);
        box-sizing:border-box; padding-right:.5rem;
    }
    [data-theme="dark"] .champions-box tbody td:first-child{ border-right-color:rgba(255,255,255,.08); }
}
@media (max-width:991.98px){
    .champions-box tbody td:first-child{
        text-align:left; font-weight:800; white-space:normal; line-height:1.25;
    }
}

/* Ссылки на чемпионов */
.champions-box a.text-decoration-none{
    color:var(--fc-text); text-decoration:none; border-bottom:1px dashed transparent;
}
.champions-box a.text-decoration-none:hover{
    color:var(--fc-red); border-bottom-color:var(--fc-red);
}
.champions-box .text-muted{ color:var(--fc-muted)!important; }

/* ===== Mobile card mode (<576px) ===== */
@media (max-width:575.98px){
    .champions-box thead{ display:none; }
    .champions-box table, .champions-box tbody, .champions-box tr, .champions-box td{
        display:block; width:100%;
    }
    .champions-box tr{
        background:var(--fc-surface);
        border-top:1px solid var(--fc-border);
        padding:.75rem .75rem;
    }
    .champions-box tr:first-child{ border-top:0; }
    .champions-box td{
        border:0!important; padding:.25rem 0!important;
        display:flex; align-items:flex-start; gap:.5rem;
        min-width:0; text-align:left;
    }
    .champions-box td:first-child::before{
        content:"Division"; flex:0 0 100px; color:var(--fc-muted); font-weight:700; font-size:.9rem;
    }
    .champions-box td:not(:first-child)::before{
        content:attr(data-label); flex:0 0 100px; color:var(--fc-muted); font-weight:700; font-size:.9rem;
    }
    .champions-box a.text-decoration-none, .champions-box .text-body{
        display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical;
        overflow:hidden; line-height:1.25; font-size:.95rem;
    }
}

/* === Адаптив без горизонтального скролла: если хотите — включайте этот блок вместо sticky/Fixed layout === */
/* (оставляю, если предпочтёте auto-ширину) */
/*
.champions-box{ overflow:visible; }
.champions-box table{ table-layout:auto; min-width:0; width:100%; }
.champions-box thead th, .champions-box tbody td{ white-space:normal; word-break:break-word; overflow-wrap:anywhere; }
.champions-box thead th:first-child, .champions-box tbody td:first-child{ width:auto !important; }
.champions-box tbody td:first-child{ position:static !important; left:auto; z-index:auto; border-right:0; }
*/

/* === Dark theme уточнения === */
[data-theme="dark"] .champions-box{ color:#fff; }
[data-theme="dark"] .champions-box tbody td,
[data-theme="dark"] .champions-box .text-body{ color:#fff !important; }
[data-theme="dark"] .champions-box a.text-decoration-none{ color:#fff !important; border-bottom-color:transparent; }
[data-theme="dark"] .champions-box a.text-decoration-none:hover{ color:var(--fc-red) !important; border-bottom-color:var(--fc-red); }
[data-theme="dark"] .champions-box .text-muted{ color:#d1d1d1 !important; }
@media (max-width:575.98px){
    [data-theme="dark"] .champions-box td::before{ color:#cfcfcf; }
}
