html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem var(--fst-surface), 0 0 0 0.25rem var(--fst-primary);
}

/* Sticky footer via flexbox. The <footer> carries `mt-auto`, so a column-flex body
   pushes it to the bottom on short pages and lets it flow naturally below the content
   on long ones — it never overlaps the last rows / action buttons. Replaces the old
   half-migrated `html{position:relative}` + `body{margin-bottom:60px}` reserve, which
   assumed an absolutely-positioned footer that no longer exists. */
html {
    min-height: 100%;
}

body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

/* ── Mobile: horizontally scrollable tables with sticky player-name column ── */
@media (max-width: 767px) {
    .table-responsive-mobile {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        border: 1px solid var(--fst-border);
        border-radius: var(--fst-radius-sm);
    }
    .table-responsive-mobile table {
        min-width: 580px;
    }
    .table-responsive-mobile td:first-child,
    .table-responsive-mobile th:first-child {
        position: sticky;
        left: 0;
        background: var(--fst-surface);
        z-index: 2;
        min-width: 130px;
        border-right: 2px solid var(--fst-border);
    }
    /* Collapse button groups to wrap nicely */
    .btn-group-wrap-mobile {
        flex-wrap: wrap;
        gap: .25rem;
    }
}

/* ── User preference: hide the per-player Note column ──
   When the user sets Preferences → Player Notes = No, _Layout.cshtml adds
   the `hide-note-col` class to <body>. Every <th> and <td> in the Note
   column carries the `note-col` marker class so this single rule collapses
   the entire column (header + data cells + totals placeholder) at once. */
body.hide-note-col .note-col {
    display: none !important;
}

/* ── User preference: per-column visibility for roster tables ──
   Driven by Users.HiddenColumnsJson + HiddenColumnsHelper. Each togglable
   column has a `col-{path}` marker class on its <th> and every <td>; when
   the user hides it, _Layout.cshtml adds the matching `col-hide-{path}`
   class to <body>. To add a new togglable column: add an entry to
   HiddenColumnsHelper.TogglableColumns, add the marker class on the cells,
   and add one rule below. */
body.col-hide-baseball-hitter-pa   .col-baseball-hitter-pa,
body.col-hide-baseball-hitter-r    .col-baseball-hitter-r,
body.col-hide-baseball-hitter-h    .col-baseball-hitter-h,
body.col-hide-baseball-hitter-2b   .col-baseball-hitter-2b,
body.col-hide-baseball-hitter-3b   .col-baseball-hitter-3b,
body.col-hide-baseball-hitter-bb   .col-baseball-hitter-bb,
body.col-hide-baseball-hitter-so   .col-baseball-hitter-so,
body.col-hide-baseball-hitter-sb   .col-baseball-hitter-sb,
body.col-hide-baseball-hitter-cs   .col-baseball-hitter-cs,
body.col-hide-baseball-hitter-hbp  .col-baseball-hitter-hbp,
body.col-hide-baseball-hitter-avg  .col-baseball-hitter-avg,
body.col-hide-baseball-hitter-obp  .col-baseball-hitter-obp,
body.col-hide-baseball-hitter-slg  .col-baseball-hitter-slg,
body.col-hide-baseball-hitter-ops  .col-baseball-hitter-ops,
body.col-hide-baseball-hitter-opsplus  .col-baseball-hitter-opsplus,
body.col-hide-baseball-hitter-rbatplus .col-baseball-hitter-rbatplus,
body.col-hide-baseball-hitter-tb   .col-baseball-hitter-tb,
body.col-hide-baseball-hitter-war  .col-baseball-hitter-war,
body.col-hide-baseball-pitcher-whip .col-baseball-pitcher-whip,
body.col-hide-baseball-pitcher-war  .col-baseball-pitcher-war {
    display: none !important;
}

/* ── Print styles ── */
@media print {
    header, footer, nav, .navbar, .footer,
    .btn, .btn-group, .breadcrumb,
    .alert, .no-print, form:not(.print-include),
    #chartPanel { display: none !important; }

    body { margin: 0; font-size: 12px; background: #fff !important; color: #000 !important; }
    .container { max-width: 100% !important; width: 100% !important; }
    table { font-size: 11px; border-collapse: collapse; }
    table th, table td { border: 1px solid #999 !important; padding: 3px 6px !important; color: #000 !important; background: #fff !important; }
    h2 { font-size: 16px; margin-bottom: 6px; }
    a { color: inherit !important; text-decoration: none !important; }
}

/* Context-Aware Stat Colouring (#10) — heat-shades a roster stat cell vs the
   season's league average. Low-alpha rgba so it reads on both light and dark
   themes without overriding text colour. */
.stat-good { background-color: rgba(40, 167, 69, 0.20); }
.stat-bad  { background-color: rgba(220, 53, 69, 0.20); }

/* Daily Stat Movers (#1) — yesterday's game line under a roster player name. */
.daily-mover { font-size: 0.72rem; line-height: 1.2; }

/* Game-Log Sparklines (#7) — inline SVG trend next to a roster player name. */
.roster-sparkline-wrap { display: inline-block; vertical-align: middle; }
.roster-sparkline { vertical-align: middle; }
