/* Modernized Prizes "By Year" page (prizes_view#index). Scoped under .modernPrizesIndexPage so it never
   affects the Commish Prizes admin pages, which reuse some of the same generic class names.

   This page is a stack of ~10 different prize-category sections (Season, Segment, Majors, FedEx, Commissioner's
   Cup, Best Ball, several ITM contests, Skins Pool, Weekly Tournament), each rendered by its own partial but
   sharing the exact same .prizesXxx/.prizesHeader/.prizesNote/prizeRow1/prizeRow2 markup -- only the color
   varies per category (already deliberately color-coded in the legacy CSS, e.g. Season=navy, Best Ball=red,
   Segment=baby blue). That color-coding is preserved here, just moved from the table's own <thead> onto the
   .prizesHeader title bar above it (mirroring the two-tier "colored group label + light column-header row"
   treatment already used on the Statistics page) and given the same rounded-card/shadow treatment as the rest
   of the modernized site. The JS-driven .highlightRow (current user, via highlightCurrentUserRows()) is
   explicitly restored since it would otherwise lose to the prizeRow1/prizeRow2 rules, the same fix applied
   elsewhere (Administer Seasons/Users, Prize Winnings pages). */

.modernPrizesIndexPage > table:first-of-type {
  border-collapse: collapse;
  margin-bottom: 16px;
}

.modernPrizesIndexPage > table:first-of-type td {
  border: none;
  padding: 0;
  vertical-align: middle;
}

.modernPrizesIndexPage .dropDownLabel {
  font-weight: 600;
  font-size: 15px;
  color: #333;
  padding-right: 8px !important;
}

.modernPrizesIndexPage > table:first-of-type select {
  border: 1px solid #cfd4e0;
  border-radius: 6px;
  padding: 3px 6px;
  font-size: 12px;
}

.modernPrizesIndexPage #prizesTotalPrizeMoney {
  display: inline-flex;
  align-items: center;
  margin: 0 0 0 16px;
  padding: 5px 14px;
  background: #eef1fa;
  border: 1px solid #cfd8ee;
  border-radius: 20px;
  color: #0b1a67;
  font-size: 13px;
  font-weight: 700;
}

.modernPrizesIndexPage .prizes {
  width: auto;
  max-width: 800px;
  margin-bottom: 0;
}

.modernPrizesIndexPage .prizes table {
  width: 100%;
  border-collapse: collapse;
}

.modernPrizesIndexPage .prizesSectionBottomSpacer {
  display: block;
  width: fit-content;
  min-width: 675px;
  max-width: 100%;
  margin-bottom: 20px;
  border: 1px solid #e2e6f2;
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 2px 10px rgba(11, 26, 103, 0.06);
  background: #fff;
}

.modernPrizesIndexPage .prizesSectionBottomSpacer:last-child {
  margin-bottom: 0;
}

.modernPrizesIndexPage .prizesHeader {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: wrap;
  gap: 8px;
  margin: 0;
  padding: 10px 16px;
  font-size: 13px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}

.modernPrizesIndexPage .pickWinnerBadge {
  display: inline-block;
  padding: 2px 10px;
  background: #fff3cd;
  border: 1px solid #f0d896;
  color: #7a5c00;
  border-radius: 10px;
  font-size: 10px;
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0;
}

.modernPrizesIndexPage .inProgressText {
  display: inline-block;
  padding: 2px 10px;
  background: #fff;
  color: #c30900;
  border-radius: 10px;
  font-size: 10px;
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0;
  vertical-align: middle;
}

.modernPrizesIndexPage .statusPill {
  display: inline-block;
  padding: 2px 10px;
  background: #fff;
  border-radius: 10px;
  font-size: 10px;
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0;
  text-decoration: none;
}

.modernPrizesIndexPage .statusPillInProgress {
  border: 1px solid #f5c2c0;
  color: #c30900;
}

.modernPrizesIndexPage .statusPillInProgress:hover {
  background: #fdecea;
  color: #c30900;
  text-decoration: none;
}

.modernPrizesIndexPage .statusPillComplete {
  border: 1px solid #b8dfc0;
  color: #0b6726;
}

.modernPrizesIndexPage .statusPillComplete:hover {
  background: #e8f5ea;
  color: #0b6726;
  text-decoration: none;
}

/* Per-category header colors -- preserved from the legacy .prizesXxx thead td rules, just relocated onto
   .prizesHeader. */
.modernPrizesIndexPage .prizesSeason .prizesHeader {
  color: #fff;
  background: #0b1a67;
}

.modernPrizesIndexPage .prizesSegment .prizesHeader {
  color: #0b1a67;
  background: #bbd9ee;
}

.modernPrizesIndexPage .prizesSkins .prizesHeader {
  color: #fff;
  background: #1a1a1a;
}

.modernPrizesIndexPage .prizesBestBall .prizesHeader {
  color: #fff;
  background: #c30900;
}

.modernPrizesIndexPage .prizesInTheMoney .prizesHeader {
  color: #fff;
  background: #5b2c6f;
}

.modernPrizesIndexPage .prizesMajorsOnly .prizesHeader {
  color: #fff;
  background: #fd6b00;
}

.modernPrizesIndexPage .prizesPgaPlayoffs .prizesHeader {
  color: #4a3a06;
  background: #daa520;
}

.modernPrizesIndexPage .prizesCommissionersCup .prizesHeader {
  color: #5c4a10;
  background: #eee7bd;
}

.modernPrizesIndexPage .prizesInTheMoneySingle .prizesHeader {
  color: #fff;
  background: #610050;
}

.modernPrizesIndexPage .prizesInTheMoneyMulti .prizesHeader {
  color: #fff;
  background: #3366ff;
}

.modernPrizesIndexPage .prizesTournament .prizesHeader {
  color: #fff;
  background: #0b6726;
}

#prizesWeeklyTournamentHeader {
  color: #0b1a67;
  background-color: #bbd9ee;
}

/* Column-label row (the table's own <thead>) -- kept neutral/light now that the bold color lives on
   .prizesHeader above it. */
.modernPrizesIndexPage .prizes thead td {
  background: #f4f6fb;
  color: #333;
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  padding: 4px 6px;
  border-bottom: 1px solid #e2e6f2;
  white-space: nowrap;
}

.modernPrizesIndexPage .prizes tr {
  border: none;
}

.modernPrizesIndexPage .prizes td {
  padding: 2px 6px;
  font-size: 12px;
  border-bottom: 1px solid #eef0f6;
  white-space: nowrap;
}

.modernPrizesIndexPage .prizes td.text-md-right,
.modernPrizesIndexPage .prizes td.alignRight {
  text-align: right;
}

.modernPrizesIndexPage tbody tr.prizeRow1 td {
  background-color: #f4f6fb;
}

.modernPrizesIndexPage tbody tr.prizeRow2 td {
  background-color: #fff;
}

.modernPrizesIndexPage tbody tr:hover td {
  background-color: #eef1fa;
}

.modernPrizesIndexPage tbody tr.highlightRow td {
  background-color: #d0a9f5;
}

.modernPrizesIndexPage .prizeDescription {
  font-weight: 600;
  color: #333;
}

.modernPrizesIndexPage .prizesNote {
  padding: 8px 16px;
  font-size: 11px;
  color: #6b7280;
  background: #f8f9fc;
}

.modernPrizesIndexPage .prizesNote a {
  color: #0b1a67;
  font-weight: 600;
  text-decoration: none;
}

.modernPrizesIndexPage .prizesNote a:hover {
  text-decoration: underline;
}

.modernPrizesIndexPage .prizesSkins tbody td:first-child a {
  font-weight: 700;
  color: #0b1a67;
}