/* ==== NBA game details (Full preview), redesigned 2026-10-23 ====
   Answer-first layout: verdict + situation, tale of the tape, then collapsible
   detail sections. Desktop: content column + right rail (odds). Uses the tei
   tokens from mainnav.css and the hero/table styles from tei-gamedetail.css.
*/

.pv-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:20px;align-items:start;margin-top:20px}
.pv-main{display:flex;flex-direction:column;gap:20px;min-width:0}
.pv-rail{display:flex;flex-direction:column;gap:20px;position:sticky;top:84px}

.pv-card{padding:20px 22px;border-radius:var(--tei-radius);background:var(--tei-panel);border:1px solid var(--tei-line)}
.pv-card__head{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:8px 16px;margin-bottom:14px}
.pv-h2{margin:0;font-family:var(--tei-font-display);font-weight:400;font-size:28px;letter-spacing:1px;text-transform:uppercase;line-height:1;color:var(--tei-fg)}
.pv-h3{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-family:var(--tei-font-label);font-weight:700;font-size:16px;letter-spacing:.5px;text-transform:uppercase;color:var(--tei-fg)}
.pv-mt{margin-top:18px}
.pv-sub{font-size:14px;color:var(--tei-fg-dim)}
.pv-sub strong{color:var(--tei-fg)}
.pv-muted{color:var(--tei-fg-dim)}
.pv-note{margin:12px 0 0;font-size:13px;color:var(--tei-fg-dim)}
.pv-note--top{margin:0 0 8px}
.pv-note a{color:var(--tei-accent)!important}
.pv-warn{margin:0 0 14px;padding:10px 12px;border-radius:10px;background:rgba(245,165,36,.12);color:var(--tei-amber);font-size:14px}
.pv-empty{margin:0;color:var(--tei-fg-dim);font-size:15px}
.pv-logo{width:auto;object-fit:contain;flex:none}

/* ---------- The read ---------- */
.pv-read{background:linear-gradient(160deg,#10203a,var(--tei-panel) 60%);border-color:#22345a}
.pv-picks{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.pv-pick{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border-radius:12px;background:rgba(7,12,22,.45);border:1px solid var(--tei-line);border-left:4px solid var(--tei-line)}
.pv-pick--strong{border-left-color:var(--tei-accent)}
.pv-pick--lean{border-left-color:var(--tei-blue)}
.pv-pick--thin{border-left-color:var(--tei-fg-dim)}
.pv-pick__label{font-family:var(--tei-font-label);font-weight:600;font-size:12px;letter-spacing:1px;text-transform:uppercase;color:var(--tei-fg-dim)}
.pv-pick__value{font-family:var(--tei-font-label);font-weight:700;font-size:24px;line-height:1.1;color:var(--tei-fg)}
.pv-pick__meta{font-size:13px;color:var(--tei-fg-dim)}
.pv-pick__edge{align-self:flex-start;margin-top:4px;padding:2px 8px;border-radius:999px;font-family:var(--tei-font-label);font-weight:700;font-size:12px;letter-spacing:.5px;text-transform:uppercase;background:var(--tei-panel-2);color:var(--tei-fg)}
.pv-pick--strong .pv-pick__edge{background:rgba(63,214,138,.16);color:var(--tei-accent)}
.pv-pick--lean .pv-pick__edge{background:rgba(46,167,255,.14);color:var(--tei-blue)}
.pv-foot{margin:14px 0 0;font-size:14px;color:var(--tei-fg-dim)}
.pv-foot strong{color:var(--tei-fg)}
.pv-foot .pv-note{display:block;margin-top:6px}

/* ---------- Situation ---------- */
.pv-why{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.pv-why__name{display:flex;align-items:center;gap:8px;margin-bottom:8px;font-family:var(--tei-font-label);font-weight:700;font-size:18px;text-transform:uppercase}
.pv-why__l5{margin-left:auto;font-weight:600;font-size:13px;color:var(--tei-fg-dim)}
.pv-chips{display:flex;flex-wrap:wrap;gap:6px}
.pv-chip{padding:5px 10px;border-radius:999px;border:1px solid var(--tei-line);font-family:var(--tei-font-label);font-weight:600;font-size:14px;color:var(--tei-fg)}
.pv-chip--warn{border-color:transparent;background:rgba(245,165,36,.14);color:var(--tei-amber)}
.pv-chip--good{border-color:transparent;background:rgba(63,214,138,.14);color:var(--tei-accent)}

/* ---------- Tale of the tape ---------- */
.pv-toggle{display:inline-flex;padding:3px;border-radius:999px;border:1px solid var(--tei-line);background:var(--tei-ink)}
.pv-toggle button{padding:6px 12px;border:0;border-radius:999px;background:transparent;font-family:var(--tei-font-label);font-weight:600;font-size:13px;letter-spacing:.5px;text-transform:uppercase;color:var(--tei-fg-dim);cursor:pointer}
.pv-toggle button[aria-selected="true"]{background:var(--tei-panel-2);color:var(--tei-fg)}
.pv-tape__teams{display:flex;justify-content:space-between;margin-bottom:6px;font-family:var(--tei-font-label);font-weight:700;font-size:15px;text-transform:uppercase}
.pv-tape__teams span{display:flex;align-items:center;gap:6px}
.pv-tape{display:flex;flex-direction:column}
.pv-tape[hidden]{display:none}
.pv-tape__row{display:grid;grid-template-columns:64px minmax(0,1fr) 64px;align-items:center;gap:12px;padding:7px 0;border-bottom:1px solid var(--tei-line)}
.pv-tape__row:last-child{border-bottom:0}
.pv-tape__val{font-family:var(--tei-font-label);font-weight:700;font-size:18px;font-variant-numeric:tabular-nums;color:var(--tei-fg-dim)}
.pv-tape__val--home{text-align:right}
.pv-tape__val.is-lead{color:var(--tei-fg)}
.pv-tape__bars{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:10px}
.pv-tape__label{font-size:13px;color:var(--tei-fg-dim);text-align:center;white-space:nowrap}
.pv-bar{display:flex;height:8px;border-radius:999px;background:var(--tei-ink);overflow:hidden}
.pv-bar--away{justify-content:flex-end}
.pv-bar i{display:block;height:100%;border-radius:999px;background:#2a3a5c}
.pv-bar.is-lead i{background:var(--tei-accent)}
.pv-recent{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:14px;padding-top:12px;border-top:1px solid var(--tei-line);font-size:14px;color:var(--tei-fg-dim)}
.pv-recent__title{font-family:var(--tei-font-label);font-weight:600;letter-spacing:.5px;text-transform:uppercase}
.pv-recent strong{color:var(--tei-fg)}

/* ---------- Collapsible sections ---------- */
.pv-fold>summary{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px;list-style:none;cursor:pointer}
.pv-fold>summary::-webkit-details-marker{display:none}
.pv-fold>summary::after{content:"+";margin-left:auto;font-family:var(--tei-font-label);font-size:24px;line-height:1;color:var(--tei-fg-dim)}
.pv-fold[open]>summary::after{content:"\2212"}
.pv-fold[open]>summary{margin-bottom:14px}
.pv-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}

/* tables inside cards */
.tei-dark .pv-table th,.tei-dark .pv-table td{padding:7px 8px!important}
.pv-table--center td,.pv-table--center thead th{text-align:center!important}
.tei-dark .pv-table td.is-lead{color:var(--tei-accent);font-weight:700}
.pv-flag{margin-left:4px;padding:1px 6px;border-radius:6px;background:rgba(245,165,36,.16);color:var(--tei-amber);font-family:var(--tei-font-label);font-weight:700;font-size:11px;text-transform:uppercase}

/* recent games */
.pv-games{list-style:none;margin:0;padding:0}
.pv-games li{display:grid;grid-template-columns:34px 48px minmax(0,1fr);align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--tei-line);font-size:14px}
.pv-games li:last-child{border-bottom:0}

/* injuries */
.pv-inj{list-style:none;margin:0;padding:0}
.pv-inj__item{padding:8px 0;border-bottom:1px solid var(--tei-line)}
.pv-inj__item:last-child{border-bottom:0}
.pv-inj__item.is-stale{opacity:.6}
.pv-inj__top{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:15px}
.pv-inj__top .pv-muted{margin-left:auto;font-size:13px}
.pv-inj__item p{margin:4px 0 0;font-size:13px;line-height:1.4;color:var(--tei-fg-dim)}
.pv-status{padding:1px 7px;border-radius:6px;font-family:var(--tei-font-label);font-weight:700;font-size:12px;text-transform:uppercase;background:var(--tei-panel-2);color:var(--tei-fg-dim)}
.pv-status--out{background:rgba(255,99,99,.15);color:#ff8a8a}
.pv-status--dtd{background:rgba(245,165,36,.16);color:var(--tei-amber)}

/* odds rail */
.tei-dark .pv-odds tbody th{font-size:14px!important;white-space:nowrap}
.tei-dark .pv-odds td{white-space:nowrap}
.tei-dark .pv-odds td.is-best{color:var(--tei-accent);font-weight:700}
.pv-odds thead img{display:block;border-radius:3px}
.pv-move{margin-left:4px;font-size:12px;color:var(--tei-amber)}

/* ---------- Responsive ---------- */
@media (max-width:1060px){
  .pv-grid{grid-template-columns:1fr}
  .pv-rail{position:static}                  /* one column: odds and track record follow the main sections */
}
@media (max-width:720px){
  .pv-card{padding:16px}
  .pv-why,.pv-two{grid-template-columns:1fr}
  .pv-picks{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pv-pick__value{font-size:20px}
  .pv-tape__row{grid-template-columns:52px minmax(0,1fr) 52px;gap:8px}
  .pv-tape__val{font-size:16px}
  .pv-tape__bars{grid-template-columns:1fr 1fr;row-gap:4px}
  .pv-tape__label{grid-column:1/-1;grid-row:1}
  .pv-h2{font-size:24px}
}
