/* SC-specific Leaderboard tweaks.
   Light-touch overrides applied on top of the existing Dashboard block —
   no JS / React rebuild required. Pilot-only on SC; roll out elsewhere
   when confirmed.

   1) Hide the Overview and On Target tab buttons (desktop + mobile select).
      Underlying React state still defaults to "overview" so that content
      remains the initial view; only the BUTTONS are hidden. Changing the
      default landing tab requires a Dashboard rebuild (flagged separately).

   2) Hide the "%" target badge ( <span class="percent"> rendered by the
      AgentWeighting component ) on top-3 agent cards. Scoped to .team-gci
      so other .percent uses elsewhere are untouched.

   3) Hide the "Overall Target" column on Overview, On Target, New Listings,
      and Sold tabs. Scoped to those tab panes because the .team-name class
      is also (re)used by the Super Saturday "Team" column — we don't want
      to nuke that.
*/

/* (1) Tab buttons — desktop */
#nav-overview-tab,
#nav-onTarget-tab {
  display: none !important;
}

/* (1) Tab options — mobile <select> fallback */
.tabs-mobile option[value="nav-overview-tab"],
.tabs-mobile option[value="nav-onTarget-tab"] {
  display: none !important;
}

/* (2) % target badge — top-3 cards (AgentWeighting renders into .team-gci) */
.team-gci .percent {
  display: none !important;
}

/* (3) "Overall Target" column — agent ranking table on the 4 non-special
      tab panes. Hides both <th class="team-name"> and <td class="team-name">. */
#nav-overview   .agent-listing-table .team-name,
#nav-onTarget   .agent-listing-table .team-name,
#nav-listings   .agent-listing-table .team-name,
#nav-sold       .agent-listing-table .team-name {
  display: none !important;
}

/* (4) Calls & Connects tab — visual polish.
      Numbers in the top-3 stat blocks should read prominently (they ARE
      the leaderboard's content), and the rest-table number columns should
      be centred for easier left-to-right scanning. Both scoped to
      #nav-callsconnects so other tabs are untouched. */
#nav-callsconnects .top-agent-box .prograss-bar span,
#nav-callsconnects .top-agent-box.small .prograss-bar span {
  font-size: 20px;
  font-weight: 600;
  color: #231F20;
  letter-spacing: 0;
}
#nav-callsconnects .top-agent-box.small .prograss-bar span {
  font-size: 16px;
}

/* Centre the three numeric columns (Calls / Connects / Ratio) in both
   header and body cells. Columns are: # / Agent / Office / Calls / Connects / Ratio
   so :nth-child(4|5|6) is the trio of numbers. */
#nav-callsconnects .agent-listing-table .responsive-table thead th:nth-child(4),
#nav-callsconnects .agent-listing-table .responsive-table thead th:nth-child(5),
#nav-callsconnects .agent-listing-table .responsive-table thead th:nth-child(6),
#nav-callsconnects .agent-listing-table .responsive-table tbody td:nth-child(4),
#nav-callsconnects .agent-listing-table .responsive-table tbody td:nth-child(5),
#nav-callsconnects .agent-listing-table .responsive-table tbody td:nth-child(6) {
  text-align: center;
}

/* (5) Leaderboard subtitle — shows which leaderboard is currently active
      under the main "Company Sales Leaderboard" title.
      Only visible in Broadcast mode (when tabs cycle every 60s and a screen
      viewer needs to know what they're looking at). Centred, black, large
      so it reads from across the room. */
.leaderboard-label-row {
  display: none;            /* hidden by default — broadcast-only feature */
  text-align: left;         /* sits under the main title, same x-position */
  margin-top: -9px;         /* tight against the title divider */
  margin-bottom: 24px;      /* generous breathing room before the leaderboard */
  padding-top: 0;
  padding-bottom: 0;
}
.leaderboard-label {
  font-size: 28px;
  font-weight: 400;         /* regular — not bold */
  color: #231F20;           /* brand dark text */
  margin: 0;
  padding: 0;
  line-height: 1.1;         /* override the default 1.4-ish line-height that adds top space */
  letter-spacing: -0.72px;  /* match h1.main-title so left edges visually align */
  text-indent: 0;
}

/* Broadcast mode toggles `body.broadcast-active` (set in DashboardPage.js).
   That's our cue to reveal the label. */
body.broadcast-active .leaderboard-label-row {
  display: block;
}
