/* Modernized Admin "Login Report" pages (index = current season's users, inactive_users = users without a team
   this season) -- both tabs of the same feature, sharing the exact same login_report_table_header/_body/_footer
   partials, so they're modernized together under one wrapper class and one stylesheet. Scoped under
   .modernLoginReportPage so it never affects other pages that reuse the same .admin/.adminTable/
   .goldRow/.grayRow/.whiteRow utility classes shared across dozens of other admin tables in the app. Table
   structure/IDs used by the sortable JS (sortable_us.js) are left untouched -- only colors/spacing/borders
   change, matching the treatment already applied to the similar Duplicate Lineup Records troubleshooting page. */

.modernLoginReportPage #pageTitle {
  margin-bottom: 16px;
}

.modernLoginReportPage .loginReportTableWrap {
  display: block;
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  border: 1px solid #e2e6f2;
  border-radius: 10px;
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box;
}

@media (min-width: 800px) {
  .modernLoginReportPage .loginReportTableWrap {
    width: 90%;
  }
}

.modernLoginReportPage #usersWithTeamTable,
.modernLoginReportPage #usersWithoutTeamTable {
  width: auto;
  margin: 0;
  border-collapse: collapse;
  white-space: nowrap;
}

.modernLoginReportPage #usersWithTeamTable thead tr#header,
.modernLoginReportPage #usersWithoutTeamTable thead tr#header {
  background-color: #0b1a67;
}

.modernLoginReportPage #usersWithTeamTable thead tr#header td,
.modernLoginReportPage #usersWithoutTeamTable thead tr#header td {
  color: #fff;
  font-weight: 700;
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: 0.4px;
  padding: 6px 10px;
  border: 1px solid #24358c;
}

/* User Agent is the last column in the column-header row (the second of the two stacked tr#header rows). */
.modernLoginReportPage #usersWithTeamTable thead tr#header:last-child td:last-child,
.modernLoginReportPage #usersWithoutTeamTable thead tr#header:last-child td:last-child {
  text-align: left;
}

/* Title row (e.g. "2026 Users" / "Users Without 2026 Team") is the first of the two stacked tr#header rows in
   <thead> -- lightened to grey so it reads as a distinct title strip above the actual navy column-header row
   instead of blending into it, matching the same treatment used on the Statistics / League Career pages. The
   selector repeats "tr#header" (rather than switching to tr:first-child) so it matches the base rule's
   specificity (two ID selectors) and actually wins the cascade.

   The background/text color must be set directly on the <td> (not just the <tr>) because the title cells also
   carry their own #usersWithTeamsHeader / #usersWithoutTeamHeader IDs (admin.css), which set a background-color
   directly on the td itself -- navy for the "with team" table, light grey for the "without team" table. A td's
   own background always paints over whatever its parent tr shows through, so without this the "with team" title
   was rendering navy text on a still-navy td background (invisible) despite the tr underneath being grey. */
.modernLoginReportPage #usersWithTeamTable thead tr#header:first-child,
.modernLoginReportPage #usersWithoutTeamTable thead tr#header:first-child {
  background-color: #dde3f2;
}

.modernLoginReportPage #usersWithTeamTable thead tr#header:first-child td,
.modernLoginReportPage #usersWithoutTeamTable thead tr#header:first-child td {
  background-color: #dde3f2;
  color: #0b1a67;
  border-color: #c7cfe6;
  text-align: center;
}

.modernLoginReportPage #usersWithTeamTable thead tr#header td a.sortheader,
.modernLoginReportPage #usersWithoutTeamTable thead tr#header td a.sortheader {
  color: #fff;
}

.modernLoginReportPage #usersWithTeamTable thead tr#header td a.sortheader:hover,
.modernLoginReportPage #usersWithoutTeamTable thead tr#header td a.sortheader:hover {
  color: #dde3f2;
}

.modernLoginReportPage #usersWithTeamTable tbody td,
.modernLoginReportPage #usersWithoutTeamTable tbody td {
  border: 1px solid #e2e6f2;
  padding: 4px 8px;
  font-size: 12px;
}

/* User Agent (last column) can hold long browser UA strings -- let it wrap and flow naturally like the
   Commissioner's Dashboard banner, rather than being capped to a fixed width or truncated. */
.modernLoginReportPage #usersWithTeamTable tbody td:last-child,
.modernLoginReportPage #usersWithoutTeamTable tbody td:last-child {
  white-space: normal;
  word-break: break-word;
}

.modernLoginReportPage #usersWithTeamTable tbody tr.goldRow td {
  background-color: #f4f6fb;
}

.modernLoginReportPage #usersWithoutTeamTable tbody tr.grayRow td {
  background-color: #f4f6fb;
}

.modernLoginReportPage tbody tr.whiteRow td {
  background-color: #fff;
}

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

.modernLoginReportPage tbody td.centerText {
  text-align: center;
}

.modernLoginReportPage tfoot tr#header td {
  background-color: #0b1a67;
  color: #fff;
  padding: 10px;
  font-size: 12px;
  line-height: 1.6;
  white-space: normal;
}

.modernLoginReportPage tfoot .note {
  display: block;
  margin-top: 4px;
  font-size: 11px;
  color: #c7cfe6;
}