.tkb-theme.scoreboard-dashboard .scoreboard-toolbar {
  display: flex;
  flex-wrap: wrap;
}

.tkb-theme.scoreboard-dashboard .scoreboard-toolbar .filter-row {
  flex: 1 0 auto;
  max-width: 100%;
}

.tkb-theme.scoreboard-dashboard .scoreboard-toolbar .status-filters {
  max-width: 100%;
}

.tkb-theme.scoreboard-dashboard .scoreboard-toolbar [data-status="live"] {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
}

.tkb-theme.scoreboard-dashboard .scoreboard-toolbar [data-status="live"] .live-dot {
  flex: 0 0 6px;
  background: currentColor;
  box-shadow: none;
}

.tkb-theme.scoreboard-dashboard .scoreboard-toolbar .filter-count {
  display: inline-grid;
  flex: none;
  place-items: center;
  min-width: 18px;
  padding: 2px 4px;
  border-radius: 5px;
  color: var(--live-red);
  background: var(--live-soft);
  font-variant-numeric: tabular-nums;
  line-height: 1;
}

.tkb-theme.scoreboard-dashboard .scoreboard-toolbar [data-status="live"].active .filter-count {
  color: #fff;
  background: #ffffff29;
}

.tkb-theme.scoreboard-dashboard .scoreboard-toolbar .scoreboard-sort {
  flex: 0 1 auto;
  max-width: 100%;
}

.tkb-theme.scoreboard-dashboard .scoreboard-sort::after {
  position: absolute;
  inset-inline-end: 10px;
  inset-block-start: 50%;
  width: 6px;
  height: 6px;
  border: solid var(--scoreboard-muted);
  border-width: 0 1.5px 1.5px 0;
  transform: translateY(-70%) rotate(45deg);
  pointer-events: none;
  content: "";
}

.tkb-theme.scoreboard-dashboard .scoreboard-toolbar .scoreboard-sort select {
  -webkit-appearance: none;
  appearance: none;
  padding-inline-end: 25px;
}

.tkb-theme.scoreboard-dashboard .scoreboard-toolbar .match-controls {
  flex: 0 1 auto;
  max-width: 100%;
  margin-inline-start: auto;
}

@media (max-width: 767px) {
  .tkb-theme.scoreboard-dashboard .scoreboard-toolbar .filter-row {
    flex-basis: 100%;
  }
}

html[data-theme="dark"] {
  color-scheme: dark;
  --canvas: #171316;
  --surface: #231b20;
  --tint: #2c2127;
  --line: #4b363f;
  --ink: #f4ecf0;
  --muted: #c8b4be;
  --accent: #ffaab8;
  --selected: #3e2530;
  --header: #28171f;
  --white: var(--surface);
  --brand-red: var(--accent);
  --brand-red-dark: #ffbac5;
  --brand-soft: var(--selected);
  --orange-ink: #ffbb93;
  --dark-solid: #882e42;
  --dark-solid-hover: #a73750;
  --dark-border-strong: #805962;
  --dark-hero: linear-gradient(112deg, #381c28 5%, #5a2636 65%, #712c3d 100%);
}

html[data-theme="dark"] body.tkb-theme {
  --scoreboard-canvas: var(--canvas);
  --scoreboard-surface: var(--surface);
  --scoreboard-tint: var(--tint);
  --scoreboard-border: var(--line);
  --scoreboard-ink: var(--ink);
  --scoreboard-muted: var(--muted);
  --scoreboard-accent: var(--accent);
  --scoreboard-accent-tint: var(--selected);
  --scoreboard-hero: var(--dark-hero);
  --live-soft: #412631;
  --live-red: #ffadbb;
  background: var(--canvas);
  color: var(--ink);
}

html[data-theme="dark"] :focus-visible { outline-color: var(--accent); }

html[data-theme="dark"] :is(.tkb-theme, .error-page) .site-header {
  background: var(--dark-hero);
  border-bottom-color: var(--line);
  box-shadow: 0 3px 12px #0004;
  color: var(--ink);
}

html[data-theme="dark"] :is(.tkb-theme, .error-page) .site-header::after {
  background: linear-gradient(90deg, #742a40, #cb586e 55%, #742a40);
}

html[data-theme="dark"] .tkb-theme .site-header .desktop-nav :is(button, a) { color: var(--muted); }
html[data-theme="dark"] .tkb-theme .site-header .desktop-nav :is(button, a):is(:hover, .active) {
  color: var(--ink);
}
html[data-theme="dark"] .tkb-theme .site-header .desktop-nav :is(button, a).active::after {
  background: var(--accent);
}

html[data-theme="dark"] .tkb-theme :is(.site-header :is(a, button), .site-footer a):focus-visible {
  outline-color: var(--accent);
}

html[data-theme="dark"] .tkb-theme :is(.site-header .search-trigger, .site-header .mobile-menu-trigger,
    .site-header .language-trigger, .search-trigger kbd, .mobile-menu-close) {
  color: var(--ink);
  background: var(--surface);
  border-color: var(--dark-border-strong);
}

html[data-theme="dark"] .tkb-theme :is(.site-header .search-trigger, .site-header .mobile-menu-trigger,
    .site-header .language-trigger, .mobile-menu-close):hover {
  color: var(--accent);
  background: var(--selected);
}

html[data-theme="dark"] .tkb-theme .site-header .language-trigger { box-shadow: none; }

html[data-theme="dark"] .tkb-theme :is(.sports-bar, .sidebar-section,
    .right-sidebar .side-card-heading, .side-promo, .favorite-help) {
  background: var(--tint);
  border-color: var(--line);
}

html[data-theme="dark"] .tkb-theme :is(.sidebar-heading, .sidebar-section .league-link, .sports-bar-status,
    .league-link .league-count, .date-picker-button svg, .site-footer :is(nav a, nav button, .footer-tagline),
    .side-card-heading > span svg, .side-promo p, .favorite-help p, .data-note, .standings-legend) {
  color: var(--muted);
}

html[data-theme="dark"] .tkb-theme :is(.sport-button, .sidebar-section .league-link):hover,
html[data-theme="dark"] .tkb-theme .sidebar-section .league-link.active {
  color: var(--accent);
  background: var(--selected);
}

html[data-theme="dark"] .tkb-theme .sport-button.active,
html[data-theme="dark"] .tkb-theme .button-green,
html[data-theme="dark"] .tkb-theme.scoreboard-dashboard .scoreboard-toolbar [data-status="live"].active,
html[data-theme="dark"] .tkb-theme.scoreboard-dashboard #match-list .match-scores > .is-winner,
html[data-theme="dark"] .tkb-theme #entity-view .entity-match-group .match-scores > .is-winner {
  color: #fff;
  background: var(--dark-solid);
}

html[data-theme="dark"] .tkb-theme .button-green:hover { background: var(--dark-solid-hover); }
html[data-theme="dark"] .tkb-theme .sport-button.active { border-color: var(--dark-border-strong); }

html[data-theme="dark"] .tkb-theme .sport-button:not(.active) .sport-count {
  color: var(--muted);
  background: var(--selected);
}

html[data-theme="dark"] .tkb-theme :is(#sidebar-league-list, .sidebar-section .scoreboard-league-tile,
    .right-sidebar .table-link, .scoreboard-upcoming-match, .scoreboard-sidebar-search:hover) {
  border-color: var(--line);
}

html[data-theme="dark"] .tkb-theme .scoreboard-league-tile:is(:hover, .active, [aria-current="page"]) {
  border-color: var(--dark-border-strong);
  background: var(--selected);
}

html[data-theme="dark"] .tkb-theme.scoreboard-dashboard .scoreboard-toolbar .status-filters {
  background: var(--tint);
}

html[data-theme="dark"] .tkb-theme.scoreboard-dashboard .scoreboard-toolbar .status-filters button {
  color: var(--muted);
}

html[data-theme="dark"] .tkb-theme.scoreboard-dashboard .scoreboard-toolbar .status-filters button.active:not([data-status="live"]) {
  background: var(--selected);
  color: var(--ink);
}

html[data-theme="dark"] .tkb-theme.scoreboard-dashboard .scoreboard-toolbar [data-status="live"]:not(.active) {
  color: var(--live-red);
}

html[data-theme="dark"] .tkb-theme.scoreboard-dashboard .scoreboard-toolbar :is(.date-picker-button,
    .today-button, .scoreboard-sort select):hover {
  border-color: var(--dark-border-strong);
  background: var(--selected);
}

html[data-theme="dark"] .tkb-theme :is(.league-group, .side-card, .empty-state,
    .league-week-button, .league-week-select) {
  color: var(--ink);
  background: var(--surface);
  border-color: var(--line);
}

html[data-theme="dark"] .tkb-theme.scoreboard-dashboard #match-list :is(.league-header, .match-scores > span) {
  background: var(--tint);
}

html[data-theme="dark"] .tkb-theme.scoreboard-dashboard #match-list .match-scores.upcoming-score > span {
  background: transparent;
}

html[data-theme="dark"] .tkb-theme.scoreboard-dashboard #match-list .live-match .match-scores > span {
  color: var(--live-red);
  background: var(--live-soft);
}

html[data-theme="dark"] .tkb-theme :is(.match-row, .timeline-item, .lineup-player, .standings-table td) {
  border-color: var(--line);
}

html[data-theme="dark"] .tkb-theme.scoreboard-dashboard #match-list .match-row {
  border-bottom-color: var(--line);
}

html[data-theme="dark"] .tkb-theme :is(.match-row, .match-main):hover { background: var(--tint); }

html[data-theme="dark"] .tkb-theme :is(.match-time, .match-time small, .match-scores.upcoming-score,
    .timeline-text small, .timeline-team, .lineup-player span, .match-dialog-top,
    .match-date-line, .stat-labels span:nth-child(2), .sets-card th) {
  color: var(--muted);
}

html[data-theme="dark"] .tkb-theme .match-time.is-live,
html[data-theme="dark"] .tkb-theme .red-cards,
html[data-theme="dark"] .tkb-theme .red-card-count { color: var(--live-red); }

html[data-theme="dark"] .tkb-theme :is(.match-scores, .side-promo-symbol) { color: var(--ink); }

html[data-theme="dark"] .tkb-theme .favorite-button,
html[data-theme="dark"] .tkb-theme.scoreboard-dashboard #match-list .favorite-button {
  color: var(--muted);
}

html[data-theme="dark"] .tkb-theme .favorite-button:hover { background: var(--selected); }
html[data-theme="dark"] .tkb-theme .favorite-button.active,
html[data-theme="dark"] .tkb-theme.scoreboard-dashboard #match-list .favorite-button.active {
  color: #ffc298;
}
html[data-theme="dark"] .tkb-theme .favorite-button.active svg { fill: #ee905a; stroke: #ffc298; }

html[data-theme="dark"] .tkb-theme .standings-table th {
  color: var(--muted);
  background: var(--tint);
  border-color: var(--line);
}

html[data-theme="dark"] .tkb-theme .standings-table .table-team {
  color: var(--ink);
  text-decoration-color: var(--dark-border-strong);
}

html[data-theme="dark"] .tkb-theme .standings-table :is(th, td):first-child { color: var(--muted); }
html[data-theme="dark"] .tkb-theme .form-chip { color: #ffbe93; background: #412c25; }
html[data-theme="dark"] .tkb-theme .form-chip.D { color: var(--muted); background: var(--tint); }
html[data-theme="dark"] .tkb-theme .form-chip.L { color: var(--accent); background: var(--selected); }

html[data-theme="dark"] .tkb-theme :is(dialog, .dialog-footer, .mobile-anchor:not([hidden])) {
  color: var(--ink);
  background: var(--surface);
  border-color: var(--line);
}

html[data-theme="dark"] .tkb-theme dialog::backdrop,
html[data-theme="dark"] .tkb-theme #mobile-menu-dialog::backdrop { background: #0b080bd9; }

html[data-theme="dark"] .tkb-theme #mobile-menu-dialog { border-inline-start-color: var(--line); }

html[data-theme="dark"] .tkb-theme :is(.language-search, .search-large, .date-input, .sets-card,
    .match-facts, .match-summary, .timeline-symbol, .detail-source-note, .mobile-anchor > .icon-button) {
  color: var(--muted);
  background: var(--tint);
  border-color: var(--line);
}

html[data-theme="dark"] .tkb-theme :is(.language-search input, .search-large input, .date-input) {
  color: var(--ink);
}

html[data-theme="dark"] .tkb-theme :is(.language-option, .regional-options label, .search-result) {
  border-color: var(--line);
}

html[data-theme="dark"] .tkb-theme :is(.language-option small, .regional-options label > span,
    .guide-intro, .guide-footnote, .info-body-text, .detail-tabs button) {
  color: var(--muted);
}

html[data-theme="dark"] .tkb-theme .detail-tabs button.active { color: var(--accent); }

html[data-theme="dark"] .tkb-theme :is(.language-option.selected, .mobile-menu-icon, .mobile-menu-badge,
    .mobile-menu-item:is(:hover, :active, .active, [aria-current="page"]),
    .mobile-menu-item[aria-pressed="true"] .mobile-menu-icon) {
  background: var(--selected);
  border-color: var(--line);
  color: var(--accent);
}

html[data-theme="dark"] .tkb-theme .match-dialog-score { background: var(--tint); }

html[data-theme="dark"] .tkb-theme :is(.detail-feed-note, .entity-notice, .match-page-notice) {
  color: #ffc298;
  background: #3a2822;
  border-color: #705044;
}

html[data-theme="dark"] .tkb-theme .fixture-player-photo {
  color: var(--muted);
  background: var(--tint);
  border-color: var(--line);
}

html[data-theme="dark"] .tkb-theme #match-page .match-page-status,
html[data-theme="dark"] .tkb-theme #match-page .match-page-status:has(.live-dot) {
  color: var(--accent);
  background: var(--selected);
}

html[data-theme="dark"] .tkb-theme #match-page .match-page-status:has(.live-dot) {
  color: var(--live-red);
  background: var(--live-soft);
}

html[data-theme="dark"] .tkb-theme :is(#entity-view, #match-page)
  :is(.squad-player:hover, .entity-competitions :is(a, button):hover,
      a.lineup-roster-player:hover, .fixture-stats-controls button[aria-pressed="true"]) {
  border-color: var(--dark-border-strong);
}

html[data-theme="dark"] .tkb-theme #match-page .match-page-score .favorite-button.active { color: #ffdd83; }

html[data-theme="dark"] :is(body.theme-standalone, body.error-page) {
  color: var(--ink);
  background: var(--canvas);
}

html[data-theme="dark"] .theme-standalone :is(.site-header, .news-header, .site-footer, .news-footer) {
  background: var(--dark-hero);
  border-color: var(--line);
}

html[data-theme="dark"] .theme-standalone :is(.hero, .news-hero) {
  background: linear-gradient(120deg, var(--surface), var(--tint));
}

html[data-theme="dark"] .theme-standalone .news-hero::after {
  background: repeating-linear-gradient(90deg, var(--line) 0 1px, transparent 1px 38px);
}

html[data-theme="dark"] .theme-standalone :is(.article p, .article li, .article-body) { color: var(--muted); }
html[data-theme="dark"] .theme-standalone .page-nav a:hover { color: var(--accent); background: var(--selected); }
html[data-theme="dark"] .theme-standalone :is(.news-toolbar input, .footer-bottom) { border-color: var(--line); }
html[data-theme="dark"] .theme-standalone .story-link:hover { border-color: var(--dark-border-strong); }

html[data-theme="dark"] .theme-standalone :is(.page-nav a[aria-current="page"], .return-link,
    .news-toolbar button, .news-empty a, .article-end a, .error-copy .button) {
  color: #fff;
  background: var(--dark-solid);
  border-color: var(--dark-border-strong);
}

html[data-theme="dark"] .theme-standalone :is(.return-link, .news-toolbar button, .news-empty a,
    .article-end a, .error-copy .button):hover {
  color: #fff;
  background: var(--dark-solid-hover);
}

html[data-theme="dark"] .error-page .error-card { border-color: var(--line); }
html[data-theme="dark"] .error-page .error-scoreboard { background: var(--dark-hero); border-color: var(--line); }

/* Theme controls are available in the desktop header and mobile settings. */
.theme-toggle[hidden] { display: none !important; }

.theme-toggle--icon {
  display: inline-grid;
  flex: 0 0 auto;
  place-items: center;
  width: 40px;
  height: 40px;
  margin: 0;
  padding: 0;
  border: 1px solid #8993a366;
  border-radius: 9px;
  background: transparent;
  color: inherit;
  cursor: pointer;
}

.theme-toggle--icon:hover {
  background: #8793a521;
}

.theme-toggle:focus-visible {
  outline: 2px solid currentColor;
  outline-offset: 2px;
}

.theme-toggle svg {
  display: block;
  width: 19px;
  height: 19px;
  fill: none;
  stroke: currentColor;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 1.8;
}

.theme-toggle .theme-icon-sun,
html[data-theme="dark"] .theme-toggle .theme-icon-moon {
  display: none;
}

html[data-theme="dark"] .theme-toggle .theme-icon-sun {
  display: block;
}

.theme-toggle-switch {
  position: relative;
  flex: 0 0 34px;
  width: 34px;
  height: 20px;
  margin-inline-start: auto;
  border: 1px solid #79717b;
  border-radius: 999px;
  color: #79717b;
}

.theme-toggle-switch::before {
  position: absolute;
  inset-block-start: 3px;
  inset-inline-start: 3px;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: currentColor;
  content: "";
}

.theme-toggle[aria-pressed="true"] .theme-toggle-switch {
  border-color: currentColor;
  color: inherit;
}

.theme-toggle[aria-pressed="true"] .theme-toggle-switch::before {
  inset-inline-start: auto;
  inset-inline-end: 3px;
}

.error-page .theme-toggle--icon {
  margin-inline-start: auto;
}

@media (max-width: 767px) {
  :is(.odin-theme, .tkb-theme) .header-actions .theme-toggle--icon {
    display: none;
  }

  .theme-standalone .theme-toggle--icon {
    width: 38px;
    height: 38px;
  }
}

@media (min-width: 768px) and (max-width: 900px) {
  :is(.odin-theme, .tkb-theme) .header-actions {
    gap: 7px;
  }

  :is(.odin-theme, .tkb-theme) .theme-toggle--icon {
    width: 36px;
    height: 38px;
  }
}

@media (max-width: 420px) {
  .theme-standalone .news-header-inner {
    gap: 7px;
  }
  .theme-standalone .news-header nav a {
    padding-inline: 6px;
  }

  .theme-standalone .header-inner .header-actions {
    gap: 6px;
  }
}


html[data-theme="dark"] .tkb-theme.scoreboard-dashboard .scoreboard-toolbar .date-controls .icon-button {
  border-color: var(--line);
  background: var(--tint);
  color: var(--ink);
}

html[data-theme="dark"] .tkb-theme.scoreboard-dashboard .scoreboard-toolbar .date-controls .icon-button:not(:disabled):hover {
  border-color: var(--dark-border-strong);
  background: var(--selected);
}

html[data-theme="dark"] .tkb-theme .favorite-help > span {
  background: var(--selected);
  color: var(--accent);
}

/* Give loaded league logos a light backing in the dark theme. */
html[data-theme="dark"] .league-badge.sports-asset.has-image {
  border-radius: 5px;
  background: #f3e8eb;
}

html[data-theme="dark"] .league-badge.sports-asset.has-image > .sports-asset-image {
  padding: 2px;
}
