/* Scoped to the shared standings component; saved section colors/backgrounds remain authoritative. */
.hub-standings {
    min-width: 0;
    max-width: 100%;
    background: var(--hub-surface, var(--slms-surface));
    border: 1px solid var(--hub-border, var(--slms-secondary));
    border-radius: var(--hub-card-radius, 16px);
    overflow: hidden;
}
.hub-standings-tabs__toolbar { display: flex; flex-wrap: wrap; border-bottom: 1px solid var(--hub-border); }
.hub-standings-tabs__list { display: flex; min-width: 0; max-width: 100%; flex: 1 1 240px; overflow-x: auto; scrollbar-width: thin; }
.hub-standings-tabs__tab { display: flex; flex-direction: column; gap: .2rem; flex: 0 0 auto; max-width: 260px; border: 0; border-bottom: 3px solid transparent; background: transparent; color: var(--hub-text-muted); text-align: left; padding: .85rem 1rem; overflow-wrap: anywhere; }
.hub-standings-tabs__tab strong { font-size: .85rem; line-height: 1.35; color: inherit; }
.hub-standings-tabs__tab small { font-size: .72rem; line-height: 1.4; color: inherit; }
.hub-standings-tabs__tab.is-active { border-bottom-color: var(--hub-accent, var(--slms-accent)); color: var(--hub-text); background: var(--hub-surface-alt); }
.hub-standings__controls { display: flex; align-items: center; justify-content: flex-end; gap: .25rem; padding: .4rem; margin-left: auto; }
.hub-standings__arrow, .hub-standings-tabs__toggle { display: inline-flex; align-items: center; justify-content: center; gap: .3rem; min-width: 44px; min-height: 44px; border: 1px solid var(--hub-border); border-radius: var(--slms-button-radius, 8px); color: var(--hub-text); background: var(--hub-surface-alt); padding: .4rem .65rem; }
.hub-standings__arrow { font-size: 1.2rem; }
.hub-standings-tabs__toggle { font-size: .75rem; }
.hub-standings :is(button, a, [tabindex]):focus-visible { outline: 3px solid var(--hub-accent, var(--slms-accent)); outline-offset: -3px; }
.hub-standings button:hover { color: var(--hub-accent, var(--slms-accent)); }
.hub-standings-tabs__panel[hidden] { display: none !important; }
.hub-standings__context { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .65rem 1rem; padding: .85rem 1rem; color: var(--hub-text); }
.hub-standings__context > div { display: flex; flex-direction: column; gap: .15rem; min-width: 0; overflow-wrap: anywhere; }
.hub-standings__context strong { font-size: .85rem; }
.hub-standings__context span { font-size: .75rem; color: var(--hub-text-muted); }
.hub-standings__full-link { display: inline-flex; gap: .35rem; align-items: center; min-height: 44px; font-size: .8rem; font-weight: 650; color: var(--hub-text); text-decoration: underline; text-underline-offset: .2em; }
.hub-page-wrapper .hub-standings .hub-standings__scroll { max-width: 100%; overflow-x: auto; border: 0; border-radius: 0; scrollbar-width: thin; overscroll-behavior-x: contain; }
.hub-page-wrapper .hub-standings .hub-standings__table { width: 100%; margin: 0; border-collapse: collapse; }
.hub-page-wrapper .hub-standings .hub-standings__table :is(th, td) { padding: .75rem .6rem; font-variant-numeric: tabular-nums; white-space: nowrap; }
.hub-standings__table th { font-size: .7rem; }
.hub-standings__table td { font-size: .85rem; }
.hub-standings__table td:first-child::before { display: none !important; }
.hub-standings-tabs__position { font-weight: 700; color: var(--hub-text-muted); }
.hub-standings__identity { display: flex; align-items: center; gap: .5rem; min-width: 125px; max-width: 250px; }
.hub-page-wrapper .hub-standings .hub-standings-team-link, .hub-standings__identity > span:last-child { white-space: normal; overflow-wrap: anywhere; }
.hub-standings-tabs__logo, .hub-standings-tabs__logo-fallback { flex: 0 0 26px; width: 26px; height: 26px; border-radius: 4px; object-fit: contain; }
.hub-standings-tabs__logo-fallback { display: inline-flex; align-items: center; justify-content: center; font-size: .6rem; background: var(--hub-surface-alt); color: var(--hub-text-muted); }
.hub-standings__form { display: flex; justify-content: center; gap: .2rem; }
.hub-standings__result { display: inline-flex; align-items: center; justify-content: center; min-width: 1.3rem; height: 1.4rem; padding: 0 .15rem; border: 1px solid var(--hub-border); border-radius: 4px; font-size: .65rem; color: var(--hub-text); background: var(--hub-surface-alt); }
.hub-standings__result[data-result='W'] { font-weight: 800; border-color: var(--hub-accent, var(--slms-accent)); }
/* Legacy mobile tables use fixed fractional columns. A configurable table must
   instead retain readable cells and scroll inside its own region. */
html.hub-page.hub-design-refined .hub-page-wrapper .hub-standings .hub-standings__table { table-layout: auto; }
html.hub-page .hub-page-wrapper .hub-standings .hub-standings__table { table-layout: auto; }
html.hub-page .hub-page-wrapper .hub-standings .hub-standings__table thead th { width: auto !important; }
html.hub-page.hub-design-refined .hub-page-wrapper .hub-standings .hub-standings__table :is(th, td) { padding: .75rem .6rem !important; }
@media (max-width: 640px) {
    .hub-standings-tabs__list { flex-basis: 100%; }
    .hub-standings-tabs__tab { max-width: 220px; padding: .7rem .85rem; }
    .hub-standings__context { padding: .65rem .75rem; }
    .hub-page-wrapper .hub-standings .hub-standings__table :is(th, td) { padding: .65rem .45rem; }
}
/* Phones: the essentials (# · Team · GP · W · L · PTS) fit without sideways scrolling.
   Ties, goals, difference and form stay one tap away on Full standings. */
@media (max-width: 575.98px) {
    .hub-page-wrapper .hub-standings .hub-standings__table .hub-standings__col--secondary { display: none; }
    .hub-standings__identity { min-width: 0; }
    /* Team names wrap to two lines at most. The refined design forces overflow: visible
       !important on these names, so the second selector carries enough weight to clip. */
    html .hub-page-wrapper .hub-standings .hub-standings__table td:nth-child(2) .hub-standings__identity > .fw-semibold,
    html.hub-page .hub-page-wrapper .hub-standings .hub-standings__table td:nth-child(2) .hub-standings__identity > .fw-semibold {
        display: -webkit-box;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        overflow: hidden !important;
    }
    .hub-page-wrapper .hub-standings .hub-standings__table td { font-size: .9rem; }
}
