/* ============================
   BASE TABLE / STATS RECAP
   ============================ */

/* Container with scroll + freeze */
.table-freeze {
  position: relative;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 4px 16px rgba(0,0,0,.06);
  margin: 16px 0;
}

/* Main table */
.stats-table {
  border-collapse: separate;
  border-spacing: 0;
  width: max-content;      /* expand to content */
  min-width: 900px;        /* tune as needed */
  font-family: 'Arial', sans-serif;
  font-size: 14px;
  border-radius: 12px;
}

/* Base cells */
.stats-table th,
.stats-table td {
  padding: 12px;
  border-bottom: 1px solid #e0e0e0;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
}

/* Sticky first column */
.stats-table th:first-child,
.stats-table td:first-child {
  position: sticky;
  left: 0;
  z-index: 2;
  background: inherit;
  box-shadow: 1px 0 0 rgba(0,0,0,.08);
}
.stats-table thead th:first-child { z-index: 5; }

/* Sticky header rows (Rankings + Averages) */
.stats-table thead tr.rankings-row th {
  position: sticky;
  top: 0;
  z-index: 4;
  background: #f5f5f5;
  color: #333;
  font-weight: bold;
}
.stats-table thead tr.averages-row th {
  position: sticky;
  top: 42px;   /* adjust if your first row is taller/shorter */
  z-index: 3;
  background: #fafafa;
  color: #333;
  font-weight: bold;
}

/* Labels row */
.stats-table tbody tr.labels th,
.stats-table tbody tr.labels td {
  background: #001f3f;
  color: #fff;
  font-weight: bold;
}

/* Body rows */
.stats-table tbody tr { background: #fff; color: #333; }
.stats-table tbody tr:nth-child(odd) { background: #fcfcfc; }
.stats-table tbody tr:hover { background: #f6f7f8; }

/* Team totals row */
.stats-table tbody tr.team-totals th,
.stats-table tbody tr.team-totals td {
  background: #222;
  color: #fff;
  font-weight: bold;
}

/* Ranking heatmap colors */
.ranking-cell[data-rank="1"],
.ranking-cell[data-rank="2"],
.ranking-cell[data-rank="3"],
.ranking-cell[data-rank="4"],
.ranking-cell[data-rank="5"],
.ranking-cell[data-rank="6"],
.ranking-cell[data-rank="7"],
.ranking-cell[data-rank="8"] {
  background-color: #28a745;
  color: white;
}
.ranking-cell[data-rank="9"],
.ranking-cell[data-rank="10"],
.ranking-cell[data-rank="11"],
.ranking-cell[data-rank="12"],
.ranking-cell[data-rank="13"],
.ranking-cell[data-rank="14"],
.ranking-cell[data-rank="15"],
.ranking-cell[data-rank="16"] {
  background-color: #6c757d;
  color: white;
}
.ranking-cell[data-rank="17"],
.ranking-cell[data-rank="18"],
.ranking-cell[data-rank="19"],
.ranking-cell[data-rank="20"],
.ranking-cell[data-rank="21"],
.ranking-cell[data-rank="22"],
.ranking-cell[data-rank="23"],
.ranking-cell[data-rank="24"] {
  background-color: #ffc107;
  color: black;
}
.ranking-cell[data-rank="25"],
.ranking-cell[data-rank="26"],
.ranking-cell[data-rank="27"],
.ranking-cell[data-rank="28"],
.ranking-cell[data-rank="29"],
.ranking-cell[data-rank="30"],
.ranking-cell[data-rank="31"],
.ranking-cell[data-rank="32"] {
  background-color: #dc3545;
  color: white;
}

/* Header row styling (general fallback) */
.stats-table th {
  text-transform: uppercase;
  font-size: 12px;
  font-weight: bold;
}

/* Mobile density */
@media (max-width: 640px) {
  .stats-table { min-width: 1000px; }
  .stats-table th, .stats-table td {
    padding: 8px 6px;
    font-size: 12px;
  }
}

/* ============================
   ODDS MOVEMENT CARDS
   ============================ */

.odds-move { margin: 24px 0; }
.odm-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(280px,1fr)); }

.odm-card {
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  box-shadow: 0 2px 10px rgba(0,0,0,.06);
  padding: 12px;
}

.odm-head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 6px; }
.odm-head h3 { margin: 0; font-size: 16px; font-weight: 700; }

.odm-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.odm-table th { text-align: left; white-space: nowrap; font-weight: 700; padding: 6px 4px; border-bottom: 1px solid #f1f5f9; width: 110px; }
.odm-table td { padding: 6px 4px; vertical-align: top; border-bottom: 1px solid #f1f5f9; }
.odm-table tr:last-child td { border-bottom: 0; }

.delta[data-delta] { font-weight: 700; margin-left: 4px; }
.delta[data-delta^="-"] { color: #c40000; }
.delta[data-delta]:not([data-delta^="-"]):not([data-delta="0"]):not([data-delta="0.0"]) { color: #0b7a07; }
.delta[data-delta="0"], .delta[data-delta="0.0"] { color: #6b7280; }

.odds-line { margin-left: .5rem; color: #6b7280; font-size: 12px; }

/* DraftKings skin */
.brand-dk {
  background: #0d0d0d;
  color: #f3f4f6;
  border-color: #151515;
  box-shadow: inset 0 3px 0 #9ac434, 0 2px 10px rgba(0,0,0,.06);
}
.brand-dk .odm-head h3 { color: #9ac434; }
.brand-dk .odm-table th {
  background: #111;
  color: #9ac434;
  border-right: 1px solid #1b1b1b;
  border-bottom: 2px solid #2f2f2f;
  text-transform: uppercase;
  letter-spacing: .3px;
}
.brand-dk .odm-table td {
  color: #e5e7eb;
  background: #0f0f0f;
  border-bottom: 2px solid #2f2f2f;
}
.brand-dk .odm-table tr:nth-child(odd) td { background: #141414; }
.brand-dk .odds-line { color: #c9d1d9; }
.brand-dk .delta[data-delta^="-"] { color: #ff5a5a; }
.brand-dk .delta:not([data-delta^="-"]):not([data-delta="0"]):not([data-delta="0.0"]) { color: #9ac434; }

/* FanDuel skin */
.brand-fd {
  background: #ffffff;
  color: #0b3a6a;
  border-color: #e6f0ff;
  box-shadow: inset 0 3px 0 #1493ff, 0 2px 10px rgba(0,0,0,.06);
}
.brand-fd .odm-head h3 { color: #1493ff; }
.brand-fd .odm-table th {
  background: #0a68ff;
  color: #ffffff;
  border-right: 2px solid #e6f0ff;
  border-bottom: 1px solid #dbeafe;
  text-transform: uppercase;
  letter-spacing: .3px;
}
.brand-fd .odm-table td {
  color: #111827;
  background: #ffffff;
  border-bottom: 1px solid #e6f0ff;
}
.brand-fd .odm-table tr:nth-child(odd) td { background: #f8fbff; }
.brand-fd .odds-line { color: #475569; }
.brand-fd .delta[data-delta^="-"] { color: #b91c1c; }
.brand-fd .delta:not([data-delta^="-"]):not([data-delta="0"]):not([data-delta="0.0"]) { color: #0b7a07; }
.brand-fd .delta[data-delta="0"], .brand-fd .delta[data-delta="0.0"] { color: #64748b; }

/* Mobile tweaks for odds movement */
@media (max-width:640px){
  .odm-head { flex-direction: column; gap: 2px; }
  .odm-table { font-size: 13px; }
}


.recap-banner,
.preview-banner {
  width: 100%;
  height: auto;
  max-width: 1400px;   /* desktop cap */
  display: block;
  margin: 0 auto;
}

@media (max-width: 768px) {
  .recap-banner,
  .preview-banner {
    max-width: 100%;   /* no oversized scaling */
    height: auto;
    object-fit: contain;
  }
}

/* Base sticky layers */
.stats-table th:first-child,
.stats-table td:first-child {
  position: sticky;
  left: 0;
  z-index: 1;                 /* left column baseline */
  background: inherit;
  box-shadow: 1px 0 0 rgba(0,0,0,.08);
}

.stats-table thead tr.rankings-row th {
  position: sticky;
  top: 0;
  z-index: 2;                 /* first header row baseline */
}

.stats-table thead tr.averages-row th {
  position: sticky;
  top: 42px;                  /* match your actual row-1 height */
  z-index: 2;                 /* second header row baseline */
}

/* Corner cells need to sit above everything around them */
.stats-table thead tr.rankings-row th:first-child { z-index: 4; }
.stats-table thead tr.averages-row th:first-child { z-index: 3; }


/* ===== Game Points w/ side logos ===== */

.table-container--points { max-width: 1100px; margin: 0 auto 16px; }

.table--points {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  min-width: 0; /* no forced horizontal scroll here */
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  font-size: 14px;
}

.table--points td {
  padding: 10px 12px;
  border-bottom: 1px solid #e6e9ee;
  text-align: center;
  vertical-align: middle;
  white-space: nowrap;
  background: #fff;
  color: #111;
}

/* Labels row (dark, contrasting) */
.table--points .labels td {
  background: #0b2948;
  color: #fff;
  font-weight: 800;
  letter-spacing: .02em;
  border-bottom: 1px solid #05203a;
}

/* "Team" column a bit wider + left aligned */
.table--points .col-team {
  text-align: left;
  min-width: 160px;
  font-weight: 700;
}

/* Total column a touch bolder to pop */
.table--points .total-cell {
  font-weight: 800;
}

/* Zebra body rows (only the two team rows) */
.table--points .team-row:nth-child(odd) td { background: #fbfdff; }

/* Side logos (desktop only) */
.table--points .logo-col {
  width: 140px;
  min-width: 140px;
  background: #fff;            /* keep table background through */
  border-bottom: 1px solid #e6e9ee;
}
.table--points .logo-col img {
  display: block;
  width: 110px;
  height: 110px;
  object-fit: contain;
  margin: 0 auto;
  filter: drop-shadow(0 2px 6px rgba(0,0,0,.08));
}

/* Tighten spacing on the quarters to pull stats closer to team name */
.table--points td:not(.col-team):not(.logo-col) { padding-left: 10px; padding-right: 10px; }

/* Mobile: hide logos + compact the table */
@media (max-width: 768px) {
  .table-container--points { max-width: 100%; }

  .table--points td { padding: 8px 6px; font-size: 13px; }

  .table--points .logo-col { display: none; }

  .table--points .col-team { min-width: 120px; }

  /* Slightly reduce letter spacing and weight in header on mobile */
  .table--points .labels td { letter-spacing: .01em; font-weight: 700; }
}
