/*
 * Smart Parlays Galaxy - Results page and Research lists page (members demo).
 * Everything is prefixed .ex- . Reuses the site variables and the .btn / .chip / .badge / .kpi /
 * .select / .pager / .empty classes from styles.css.
 */

.ex-wrap { min-width: 0; max-width: 100%; }
.ex-wrap *, .ex-wrap *::before, .ex-wrap *::after { box-sizing: border-box; }
.ex-wrap [hidden] { display: none !important; }

.ex-head { margin-bottom: 18px; }
.ex-wrap .ex-title { font-size: 30px; margin: 0 0 4px; }
.ex-sub { margin: 0 0 4px; color: var(--muted); max-width: 70ch; }
.ex-date { margin: 0; color: var(--faint); font-size: 13px; }
.ex-print-only { display: none; }

/* ---------- Results ---------- */
.ex-days { margin-bottom: 18px; }
.ex-wrap .ex-day { padding: 8px 16px; font-size: 13.5px; font-weight: 600; }

.ex-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(132px, 1fr)); gap: 12px; margin-bottom: 20px; }
.ex-tiles:empty { display: none; }
.ex-tile b { font-variant-numeric: tabular-nums; }
.ex-t-won b { color: var(--green); }
.ex-t-lost b { color: var(--red); }
.ex-t-m1 b { color: var(--gold); }
.ex-t-m2 b { color: var(--cyan); }
.ex-t-pend b { color: var(--muted); }

.ex-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 18px; margin-bottom: 14px; }
.ex-controls:empty { display: none; }
.ex-wrap .ex-filters .chip { padding: 6px 12px; font-size: 13px; min-height: 32px; }
.ex-sort { display: inline-flex; align-items: center; gap: 8px; color: var(--muted); font-size: 13px; }
/* Results | Sellers switch */
.ex-pagetabs { display: inline-flex; margin: 0 0 16px; }
.ex-pagetabs a { padding: 7px 18px; color: var(--muted); font-weight: 600; font-size: 13.5px; text-decoration: none; }
.ex-pagetabs a:hover { color: var(--text); text-decoration: none; }
.ex-pagetabs a.on { background: var(--panel-3); color: var(--text); }

/* day chips + "Other day…" calendar */
.ex-dayrow { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 14px; }
.ex-dayrow .ex-days { margin-bottom: 0; }
.ex-cal { margin: -4px 0 18px; }
.late-cal { margin: 0 0 16px; }
.cal { display: inline-block; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.cal-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.cal-head b { font-family: var(--display); font-size: 15px; }
.cal-nav { width: 30px; height: 30px; border-radius: 8px; border: 1px solid var(--line-strong); background: transparent; color: var(--text); cursor: pointer; font-size: 17px; line-height: 1; }
.cal-nav[disabled] { opacity: .3; cursor: default; }
.cal-grid { display: grid; grid-template-columns: repeat(7, 36px); gap: 4px; }
.cal-dow { text-align: center; font-size: 11px; font-weight: 700; color: var(--faint); padding-bottom: 2px; }
.cal-day { display: grid; place-items: center; height: 34px; border-radius: 8px; font-size: 13px; color: var(--faint); opacity: .55; }
button.cal-day { border: 1px solid var(--line-strong); background: var(--panel-2); color: var(--text); opacity: 1; cursor: pointer; font-weight: 600; }
button.cal-day:hover { border-color: var(--cyan); }
button.cal-day[aria-pressed="true"] { background: var(--brand) border-box; border-color: transparent; color: #fff; }
.cal-empty { color: var(--muted); }

/* 1 Day Late / Archive */
.late-note { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-bottom: 16px; padding: 14px 18px; }
.late-note span { color: var(--muted); }
.late-controls { margin-top: 4px; }
.regen-out:not(:empty) { margin-top: 8px; display: grid; gap: 4px; }
.regen-out .fine { color: var(--muted); font-size: 12px; }

/* Result / Props / Legs filter rows */
.ex-frows { display: grid; gap: 8px; flex: 1 1 520px; min-width: 0; }
.ex-frow { display: flex; align-items: flex-start; gap: 10px; min-width: 0; }
.ex-flabel { flex: none; width: 54px; padding-top: 8px; color: var(--faint); font-size: 11.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.ex-side { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; align-self: flex-start; }
@media (max-width: 640px) {
  .ex-frow { flex-direction: column; gap: 4px; }
  .ex-flabel { padding-top: 0; }
  .ex-side { align-items: flex-start; }
}
.ex-count { margin: 0 0 12px; color: var(--muted); font-size: 13.5px; }
.ex-count:focus { outline: none; }

.ex-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 340px), 1fr)); gap: 14px; align-items: start; }
.ex-card {
  min-width: 0; padding: 14px 14px 10px; border-radius: var(--radius);
  background: linear-gradient(180deg, var(--panel), var(--bg-2)); border: 1px solid var(--line);
}
.ex-card.ex-st-won { border-color: rgba(52, 211, 153, .55); box-shadow: 0 0 0 1px rgba(52, 211, 153, .18), 0 10px 30px rgba(52, 211, 153, .08); }
.ex-card.ex-st-lost { border-color: rgba(248, 113, 113, .3); }
.ex-card.ex-st-pending { border-color: rgba(251, 191, 36, .35); }

.ex-ch { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 8px; }
.ex-ch-l { min-width: 0; }
.ex-no { display: inline-block; font-size: 11.5px; font-weight: 700; color: var(--faint); letter-spacing: .04em; margin-bottom: 2px; }
.ex-wrap .ex-ct { margin: 0; font: 600 15px/1.3 var(--font); overflow-wrap: anywhere; }
.ex-strat { margin-top: 2px; font-size: 11.5px; letter-spacing: .05em; text-transform: uppercase; color: var(--cyan); font-weight: 600; }

.ex-badge {
  flex: none; align-self: flex-start; padding: 7px 12px; border-radius: 999px; border: 1px solid transparent;
  font: 800 12px/1.1 var(--font); letter-spacing: .06em; white-space: nowrap;
}
.ex-b-won { background: rgba(52, 211, 153, .18); color: #6ee7b7; border-color: rgba(52, 211, 153, .6); }
.ex-b-lost { background: rgba(248, 113, 113, .14); color: #fecaca; border-color: rgba(248, 113, 113, .5); }
.ex-b-pending { background: rgba(251, 191, 36, .14); color: #fde68a; border-color: rgba(251, 191, 36, .5); }
.ex-b-void { background: rgba(150, 165, 255, .12); color: var(--muted); border-color: var(--line-strong); }

.ex-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 10px; }
.ex-odds {
  display: inline-flex; align-items: center; margin: -4px 0 10px; padding: 4px 11px; border-radius: 999px;
  font: 600 12px/1.2 var(--font); letter-spacing: .02em;
  background: rgba(52, 211, 153, .10); color: #6ee7b7; border: 1px solid rgba(52, 211, 153, .4);
}
.ex-odds.ex-odds-lost { background: rgba(150, 165, 255, .08); color: var(--muted); border-color: var(--line-strong); }
.ex-lnote { grid-column: 2 / -1; margin-top: 2px; font-size: 11.5px; line-height: 1.35; color: var(--faint); white-space: normal; }
.ex-tally { margin-left: auto; font-size: 12px; color: var(--muted); }
.ex-tally .ex-g { color: var(--green); }
.ex-tally .ex-r { color: var(--red); }

.ex-game { margin-bottom: 8px; }
.ex-game-h {
  display: flex; justify-content: space-between; align-items: baseline; gap: 8px;
  margin: 0 0 2px; padding: 5px 8px; border-radius: 7px;
  background: rgba(34, 211, 238, .07); color: #a5f3fc; font: 600 12.5px var(--font);
}
.ex-game-t { color: var(--muted); font-weight: 500; font-size: 12px; white-space: nowrap; }
.ex-legs { list-style: none; margin: 0; padding: 0; }
.ex-leg {
  display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; column-gap: 8px; align-items: start;
  padding: 6px 2px; border-bottom: 1px solid var(--line); font-size: 13.5px;
}
.ex-leg:last-child { border-bottom: 0; }
.ex-mark { grid-row: 1 / span 2; display: grid; place-items: center; width: 20px; height: 20px; margin-top: 1px; border-radius: 50%; font-size: 12px; font-weight: 800; background: rgba(150, 165, 255, .12); color: var(--faint); }
.ex-who { grid-column: 2; min-width: 0; overflow-wrap: anywhere; }
.ex-tm { color: var(--muted); }
.ex-prop { grid-column: 2; color: var(--muted); font-size: 12px; }
.ex-act { grid-column: 3; grid-row: 1 / span 2; align-self: center; text-align: right; font-size: 12.5px; font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--muted); }
.ex-hit .ex-mark { background: rgba(52, 211, 153, .2); color: var(--green); }
.ex-hit .ex-act { color: #6ee7b7; font-weight: 600; }
.ex-miss .ex-mark { background: rgba(248, 113, 113, .2); color: var(--red); }
.ex-miss .ex-act { color: #fca5a5; font-weight: 600; }

/* ---------- Research lists ---------- */
.ex-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.ex-tabs { display: inline-flex; gap: 4px; padding: 4px; max-width: 100%; overflow-x: auto; scrollbar-width: none; background: var(--panel); border: 1px solid var(--line); border-radius: 999px; }
.ex-tab { border: 0; background: transparent; color: var(--muted); cursor: pointer; border-radius: 999px; padding: 8px 18px; font-weight: 600; font-size: 14px; white-space: nowrap; }
.ex-tab:hover { color: var(--text); }
.ex-tab[aria-selected="true"] { background: var(--brand); color: #fff; }

.ex-wrap .ex-market-h { font-size: 22px; margin: 0 0 2px; }
.ex-note { margin: 0 0 14px; color: var(--faint); font-size: 13px; }
.ex-tier { margin-bottom: 22px; }
.ex-tier-h { display: flex; align-items: baseline; gap: 10px; margin: 0 0 8px; font-size: 17px; }
.ex-tier-h span { font: 500 12.5px var(--font); color: var(--muted); }
.ex-none { margin: 0; color: var(--faint); font-size: 13.5px; }

.ex-tablewrap { overflow-x: auto; max-width: 100%; border: 1px solid var(--line); border-radius: 12px; background: var(--panel); scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
.ex-table { width: 100%; min-width: 720px; border-collapse: collapse; font-size: 13.5px; }
.ex-table th, .ex-table td { padding: 9px 12px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: middle; }
.ex-table tbody tr:last-child > * { border-bottom: 0; }
.ex-table thead th { background: var(--panel-2); color: var(--muted); font-size: 11.5px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; white-space: nowrap; }
.ex-table tbody th { font-weight: 600; }
.ex-table tbody tr:hover > * { background: rgba(124, 92, 255, .06); }
.ex-c-n { width: 44px; color: var(--faint); font-variant-numeric: tabular-nums; }
.ex-c-pp { width: 110px; }
.ex-rec { display: block; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ex-bar { display: block; width: 110px; max-width: 100%; height: 5px; margin-top: 5px; border-radius: 999px; background: rgba(150, 165, 255, .16); overflow: hidden; }
.ex-bar i { display: block; height: 100%; border-radius: 999px; background: var(--brand); }
.ex-pp { display: inline-block; font-size: 11px; font-weight: 800; letter-spacing: .04em; padding: 2px 8px; border-radius: 999px; background: rgba(52, 211, 153, .14); color: #6ee7b7; border: 1px solid rgba(52, 211, 153, .4); }

@media (max-width: 640px) {
  .ex-wrap .ex-title { font-size: 25px; }
  .ex-grid { grid-template-columns: minmax(0, 1fr); }
  .ex-tab { padding: 8px 14px; }
  .ex-toolbar { align-items: stretch; }
}

/* ---------- Print: only the research lists, on white ---------- */
@media print {
  .ex-noprint { display: none !important; }
  html, body { background: #fff !important; color: #000 !important; }
  .ex-research { color: #000; }
  .ex-research .ex-screen-only { display: none !important; }
  .ex-research .ex-print-only { display: block !important; }
  .ex-research .ex-print-head { margin: 0 0 10px; padding-bottom: 8px; border-bottom: 1px solid #000; font-size: 12px; line-height: 1.5; color: #000; }
  .ex-research .ex-head { margin-bottom: 8px; }
  .ex-research .ex-title, .ex-research .ex-market-h, .ex-research .ex-tier-h { color: #000; }
  .ex-research .ex-sub, .ex-research .ex-date, .ex-research .ex-note, .ex-research .ex-tier-h span, .ex-research .ex-none { color: #333; }
  .ex-wrap .ex-market[hidden] { display: block !important; }
  .ex-research .ex-market { break-before: page; page-break-before: always; }
  .ex-research .ex-market:first-of-type { break-before: auto; page-break-before: auto; }
  .ex-research .ex-tier { break-inside: auto; margin-bottom: 14px; }
  .ex-research .ex-tier-h { break-after: avoid; page-break-after: avoid; }
  .ex-research .ex-tablewrap { overflow: visible !important; border: 0; background: #fff; border-radius: 0; }
  .ex-research .ex-table { min-width: 0; width: 100%; font-size: 10.5pt; color: #000; }
  .ex-research .ex-table th, .ex-research .ex-table td { padding: 4px 6px; border-bottom: 1px solid #999; color: #000; background: #fff !important; }
  .ex-research .ex-table thead { display: table-header-group; }
  .ex-research .ex-table thead th { background: #eee !important; color: #000; border-bottom: 1.5px solid #000; }
  .ex-research .ex-table tr { break-inside: avoid; page-break-inside: avoid; }
  .ex-research .ex-bar { background: #ddd; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .ex-research .ex-bar i { background: #333; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .ex-research .ex-pp { background: #fff; color: #000; border: 1px solid #000; }
  @page { margin: 14mm; }
}