/* === TDC OVERRIDES: stable props header arrows + UI polish (2025-12-16) === */

/* Keep table header labels consistent */
body[data-view="props"] th{
  font-size: 14px !important;
  font-weight: 600 !important;
  white-space: nowrap;
}

/* Works for BOTH initial render + JS re-render variants */
body[data-view="props"] th .tdc-sort-arrows,
body[data-view="props"] th .sort-arrows,
body[data-view="props"] th .sort-icons,
body[data-view="props"] th .sort-ind{
  display: inline-flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  margin-left: 10px;
  vertical-align: middle;
  line-height: 1 !important;
}

/* Make arrows visible but not gigantic */
body[data-view="props"] th .tdc-sort-arrows span,
body[data-view="props"] th .sort-arrows span,
body[data-view="props"] th .sort-icons span,
body[data-view="props"] th .sort-ind span{
  font-size: 16px !important;
  line-height: 1 !important;
  opacity: .9;
}

/* Advanced toggle button stays consistent */
body[data-view="props"] #toggleAdvanced,
body[data-view="props"] #toggleAdvancedFilters,
body[data-view="props"] #showAdvanced,
body[data-view="props"] #showAdvancedFilters{
  font-size: 13px !important;
  line-height: 1 !important;
}

/* === TDC UI OVERRIDES: arrows 50% + 6px pills (2025-12-16) === */

/* 50% smaller sort arrows (props table) */
body[data-view="props"] .tdc-sort-arrows,
body[data-view="props"] th .tdc-sort-arrows,
body[data-view="props"] th .sort-arrows,
body[data-view="props"] th .sort-icons,
body[data-view="props"] th .sort-ind {
  font-size: 0.5em !important;
  line-height: 1 !important;
}
body[data-view="props"] .tdc-sort-arrows span,
body[data-view="props"] th .tdc-sort-arrows span {
  line-height: 1 !important;
}

/* Make all “pill” style buttons 6px corners (don’t touch table cells) */
:root{
  --tdc-radius-pill: 6px;
  --tdc-radius: 6px;
}
.nav-btn,
.ls-league-pill,
.league-pill,
.btn,
button.btn,
button.nav-btn,
button.ls-league-pill,
button.league-pill,
.pill,
.filter-pill,
.actions-bar .btn,
.topbar .btn {
  border-radius: 6px !important;
}

/* === /TDC UI OVERRIDES === */

/* === TDC FIX (2025-12-16): adv toggle + table centering + arrows + pills === */

/* 6px corners everywhere (kills pill shapes) */
button, .btn, .nav-btn, .ls-league-pill, .league-pill, .pill {
  border-radius: 6px !important;
}

/* Home + Props active use same blue theme */
.nav-btn.is-active, .nav-btn.active,
#navGames.is-active, #navGames.active,
#navProps.is-active, #navProps.active {
  background: rgba(0, 180, 255, 0.14) !important;
  border-color: rgba(0, 180, 255, 0.90) !important;
  color: #e5ffff !important;
  box-shadow: 0 0 1px rgba(0, 180, 255, 0.90), 0 0 18px rgba(0, 180, 255, 0.35) !important;
}

/* Show/Hide advanced button active styling */
#toggleAdvanced.btn.is-active {
  background: rgba(0, 180, 255, 0.14) !important;
  border-color: rgba(0, 180, 255, 0.90) !important;
  color: #e5ffff !important;
  box-shadow: 0 0 1px rgba(0, 180, 255, 0.90), 0 0 16px rgba(0, 180, 255, 0.35) !important;
}

/* Kill the "NBA · POINTS · L10 · ALL" line */
#propsMount .props-head {
  display: none !important;
}

/* Advanced bar: default hidden, but OPEN overrides even inline display:none */
#advancedBar { display: none; }
body[data-adv-open="1"] #advancedBar {
  display: flex !important;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 8px;
}

/* If actionsBar exists, keep it from being the thing that stays hidden */
#actionsBar { display: none !important; }

/* Center table header + body text */
table.tdc-table th, table.tdc-table td {
  text-align: center !important;
}

/* Shrink sort arrows ~50% */
body[data-view="props"] .tdc-sort-arrows,
body[data-view="props"] .tdc-sort-arrows span,
body[data-view="props"] .tdc-up,
body[data-view="props"] .tdc-dn {
  font-size: 8px !important;
  line-height: 1 !important;
  opacity: 0.9;
}

/* === TDC UI PATCH v5 START === */

/* Pills: 6px corners everywhere */
.nav-btn,
.ls-league-pill,
.btn,
#toggleAdvanced,
#viewTable,
#viewCards {
  border-radius: 6px !important;
}

/* Add breathing room between HOME/PROPS row and league row */
.topnav{
  row-gap: 10px !important;
  column-gap: 10px !important;
}
.nav-sep{
  flex-basis: 100% !important;
  height: 10px !important;
}

/* HOME active should match PROPS blue theme */
body[data-view="games"] #navGames.is-active,
body[data-view="games"] #navHome.is-active,
body[data-view="games"] #navProps.is-active {
  background: rgba(0,180,255,0.16) !important;
  border-color: rgba(0,180,255,0.90) !important;
  color: #e5f5ff !important;
  box-shadow: 0 0 1px rgba(0,180,255,0.9), 0 0 18px rgba(0,180,255,0.35) !important;
}

/* Hide the “NBA · POINTS · L10 · ALL” line */
body[data-view="props"] .props-head{
  display: none !important;
}

/* Advanced bar: allow JS/body class to control visibility (and beat old rules) */
#advancedBar{ display: none; }
body.adv-open #advancedBar,
body[data-adv-open="1"] #advancedBar,
#advancedBar.is-open{
  display: flex !important;
}
#toggleAdvanced.is-active{
  background: rgba(0,180,255,0.18) !important;
  border-color: rgba(0,180,255,0.95) !important;
  box-shadow: 0 0 1px rgba(0,180,255,0.9), 0 0 16px rgba(0,180,255,0.35) !important;
}

/* Sort arrows: shrink ~50% */
.tdc-sort-arrows span,
.tdc-sort-wrap .tdc-up,
.tdc-sort-wrap .tdc-dn{
  font-size: 8px !important;
  line-height: 0.9 !important;
}

/* Center header + body text in table (including header label+arrows) */
.tdc-table th,
.tdc-table td{
  text-align: center !important;
}
.tdc-table th .tdc-sort-wrap{
  justify-content: center !important;
}
.tdc-table th .tdc-sort-label{
  text-align: center !important;
}

/* === TDC UI PATCH v5 END === */

/* === TDC UI HOTFIX (v3) === */

/* Hide the center league label (this is the stray "NBA" you still see on Home) */
#scoreboardCenterText,
.scoreboard-center-text { display: none !important; }

/* Remove the "NBA · POINTS · L10 · ALL" line everywhere */
.props-head { display: none !important; }

/* Breathing room: banner → nav rows */
header.appbar { padding-bottom: 8px !important; }
.topbar { padding-top: 10px !important; }
.topnav{
  display:flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  column-gap: 10px !important;
  row-gap: 8px !important;     /* <-- vertical breathing room when it wraps */
  padding: 8px 0 10px !important;
}

/* Extra space between HOME/PROPS and the league row (wrap behavior) */
#navGames, #navProps { margin-right: 6px !important; }
.nav-sep { width: 100% !important; height: 0 !important; flex-basis: 100% !important; } /* forces next items to wrap cleanly */

/* Brand: logo left + bold text */
.brand{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
}
.brand-logo{ display:block !important; }
.brand-text{
  font-weight: 900 !important;
  letter-spacing: .5px !important;
}

/* 6px corners everywhere you care about */
:root { --tdc-radius: 6px; }
.nav-btn,
.ls-league-pill,
button#toggleAdvanced,
button.btn,
#btnTable, #btnCards,
.props-toggle button,
.tdc-toggle-pill,
.tdc-pill,
input, select {
  border-radius: 6px !important;
}

/* Unified blue active glow (Home + Props + leagues + advanced button) */
.nav-btn.is-active, .nav-btn.active,
.ls-league-pill.is-active, .ls-league-pill.active,
#toggleAdvanced.is-active, #toggleAdvanced.active,
.btn.is-active, .btn.active {
  background: rgba(0, 180, 255, 0.18) !important;
  border-color: rgba(0, 180, 255, 0.95) !important;
  color: #e9fbff !important;
  box-shadow: 0 0 1px rgba(0, 180, 255, 0.90), 0 0 18px rgba(0, 180, 255, 0.35) !important;
}

/* Make sure the advanced toggle button is never hidden */
#toggleAdvanced{
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 22px !important;
  padding: 4px 10px !important;
}

/* Advanced area show/hide (targets your real propsbar + the legacy containers) */
body[data-view="props"] .tdc-propsbar,
body[data-view="props"] #actionsBar,
body[data-view="props"] #advancedBar { display: none !important; }

body[data-view="props"][data-adv-open="1"] .tdc-propsbar,
body[data-view="props"][data-adv-open="1"] #actionsBar,
body[data-view="props"][data-adv-open="1"] #advancedBar,
body[data-view="props"] .tdc-propsbar.is-open,
body[data-view="props"] #actionsBar.is-open,
body[data-view="props"] #advancedBar.is-open {
  display: flex !important;
}

/* Table header/body centered (you said good-to-go, but lock it in) */
table.tdc-table th, table.tdc-table td { text-align: center !important; }

/* Sort arrows smaller (stop the flash + keep small) */
.tdc-sort-arrows,
.tdc-sort-arrows span,
.sort-arrows span,
.sort-icons span {
  font-size: 11px !important;
  line-height: 1 !important;
  opacity: .85 !important;
}
.tdc-sort-arrows .tdc-up,
.tdc-sort-arrows .tdc-dn {
  display: block !important;
  transform: scale(0.85) !important;
}

/* === END TDC UI HOTFIX === */
