/* Site themes (Pat 2026-09-29: "offering options on the color scheme to users"). Loaded LAST.
   html[data-theme] is set before first paint by the inline script in base.html and saved in localStorage sffl_theme.
   [data-preview-theme] applies the same tokens to the swatch cards on /appearance.
   Only accent-family tokens change; the navy surfaces stay. "light" inverts the page (see bottom). */
html[data-theme="gold"],html[data-theme="gold"] .fp,html[data-theme="gold"] #main-content [id^="view-"],[data-preview-theme="gold"]{--accent:#d1a637;--accent-bright:#ecc766;--accent-on:#1a1300;--accent-soft:rgba(217,180,95,.16);--accent-glow:rgba(217,180,95,.35);--fp-accent:#e2bd65;--fp-accent-bg:#2b2410;--fp-link:#eccf8a;--fp-mine:#2b2410}
html[data-theme="classic"],html[data-theme="classic"] .fp,html[data-theme="classic"] #main-content [id^="view-"],[data-preview-theme="classic"]{--accent:#3b82f6;--accent-bright:#60a5fa;--accent-on:#ffffff;--accent-soft:rgba(59,130,246,.14);--accent-glow:rgba(59,130,246,.4);--fp-accent:#6ee0bd;--fp-accent-bg:#10302f;--fp-link:#8fd0ee;--fp-mine:#10302f}
html[data-theme="blue"],html[data-theme="blue"] .fp,html[data-theme="blue"] #main-content [id^="view-"],[data-preview-theme="blue"]{--accent:#3b82f6;--accent-bright:#60a5fa;--accent-on:#ffffff;--accent-soft:rgba(59,130,246,.16);--accent-glow:rgba(59,130,246,.4);--fp-accent:#7cb8ff;--fp-accent-bg:#10233d;--fp-link:#a5d0ff;--fp-mine:#10233d}
html[data-theme="pitch"],html[data-theme="pitch"] .fp,html[data-theme="pitch"] #main-content [id^="view-"],[data-preview-theme="pitch"]{--accent:#22c55e;--accent-bright:#4ade80;--accent-on:#04140a;--accent-soft:rgba(34,197,94,.15);--accent-glow:rgba(34,197,94,.35);--fp-accent:#5ee08e;--fp-accent-bg:#0f2f1c;--fp-link:#9beab7;--fp-mine:#0f2f1c}
html[data-theme="crimson"],html[data-theme="crimson"] .fp,html[data-theme="crimson"] #main-content [id^="view-"],[data-preview-theme="crimson"]{--accent:#e5484d;--accent-bright:#ff7a7d;--accent-on:#ffffff;--accent-soft:rgba(229,72,77,.16);--accent-glow:rgba(229,72,77,.4);--fp-accent:#ff8a8d;--fp-accent-bg:#3a1417;--fp-link:#ffb3b5;--fp-mine:#3a1417}
html[data-theme="violet"],html[data-theme="violet"] .fp,html[data-theme="violet"] #main-content [id^="view-"],[data-preview-theme="violet"]{--accent:#8b5cf6;--accent-bright:#b18cff;--accent-on:#ffffff;--accent-soft:rgba(139,92,246,.16);--accent-glow:rgba(139,92,246,.4);--fp-accent:#b79bff;--fp-accent-bg:#221743;--fp-link:#d0bcff;--fp-mine:#221743}

/* Light: invert the dark page and turn images back (a real light palette would mean re-authoring ~40 stylesheets). */
html[data-theme="light"]{filter:invert(1) hue-rotate(180deg);background:#fff}
html[data-theme="light"] img,html[data-theme="light"] video,html[data-theme="light"] canvas,html[data-theme="light"] iframe,
html[data-theme="light"] .site-logo,html[data-theme="light"] .rc-photo img,html[data-theme="light"] [style*="background-image"],
html[data-theme="light"] .wr-card,html[data-theme="light"] .ng-player-details img{filter:invert(1) hue-rotate(180deg)}
html[data-theme="light"],html[data-theme="light"] .fp,html[data-theme="light"] #main-content [id^="view-"]{--accent:#d1a637;--accent-bright:#ecc766;--accent-on:#1a1300;--accent-soft:rgba(217,180,95,.16);--accent-glow:rgba(217,180,95,.35);--fp-accent:#e2bd65;--fp-accent-bg:#2b2410;--fp-link:#eccf8a;--fp-mine:#2b2410}

/* Header logo: transparent mark, no box (2026-09-29) */
.site-logo{height:2.3rem!important;width:auto!important;border-radius:0!important;box-shadow:none!important;filter:drop-shadow(0 2px 6px rgba(0,0,0,.55))}
@media (max-width:640px){.site-logo{height:1.9rem!important}}

/* Header search button */
.site-search{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;flex:none;border:1px solid var(--border);border-radius:999px;background:var(--bg-elevated);color:var(--text-dim)}
.site-search:hover{color:var(--accent-bright);border-color:var(--accent)}

/* Home: this week in SFFL history */
.fp-past{margin-top:14px}
.fp-past-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px;padding:12px 14px 14px}
.fp-past-grid>*{display:grid!important;gap:2px;padding:10px 12px;border-radius:12px;background:var(--fp-panel-2);border:1px solid var(--fp-line);color:var(--fp-text);text-decoration:none!important}
.fp-past-grid a:hover{border-color:var(--fp-accent)}
.fp-past-grid small{font-size:10px;font-weight:800;letter-spacing:.1em;text-transform:uppercase;color:var(--fp-dim)}
.fp-past-grid b{font-size:24px;font-weight:900;font-variant-numeric:tabular-nums}
.fp-past-grid span{font-size:12px;color:var(--fp-faint);line-height:1.35}

.fp-nextup{display:flex!important;flex-wrap:wrap;align-items:center;gap:6px 16px;padding:10px 16px;margin:0 0 12px;text-decoration:none!important;color:var(--fp-text)}
.fp-nextup-label{font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--fp-accent)}
.fp-nextup b{font-size:15px}
.fp-nextup-when{font-size:13px;font-variant-numeric:tabular-nums;color:var(--fp-dim)}
.fp-nextup em{margin-left:auto;font-style:normal;font-size:12px;font-weight:700;color:var(--fp-accent)}

/* Live: record watch strip */
.record-watch{margin:0 0 10px;padding:10px 14px;border-radius:12px;background:var(--fp-accent-bg,#10302f);border:1px solid var(--fp-accent);font-size:13px}
.record-watch .rw-title{font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--fp-accent)}
.record-watch ul{list-style:none;margin:4px 0;padding:0;display:grid;gap:2px}
.record-watch small{color:var(--fp-dim);font-size:11px}
.record-watch .is-record{font-size:15px}

/* Sortable tables (static/table-tools.js) */
.tt-th{cursor:pointer;user-select:none;white-space:nowrap}
.tt-th:hover{color:var(--fp-text,#fff)}
.tt-th:focus-visible{outline:2px solid var(--fp-accent);outline-offset:-2px}
.tt-th::after{content:"";display:inline-block;width:0;height:0;margin-left:5px;vertical-align:middle;opacity:0;border-left:4px solid transparent;border-right:4px solid transparent;border-top:5px solid currentColor}
.tt-th:hover::after{opacity:.35}
.tt-th[aria-sort="descending"]::after{opacity:1;color:var(--fp-accent)}
.tt-th[aria-sort="ascending"]::after{opacity:1;color:var(--fp-accent);transform:rotate(180deg)}
