/* ==========================================================================
   Live sports bets — /live/sports/ (template-live-sports.php, livesports.js)
   Loads after livebets.css and only adds what the sports board needs: the
   casino/sports switch, sport chips, sport glyph tiles, slip tags, odds bands.
   Odds chip bands:  < 1.5 muted · 1.5–3 cyan · 3–10 violet · 10+ gold.
   ========================================================================== */

/* casino / sports switch (.lvb-kind) lives in livebets.css — both boards use it */
.lvs .lvb-kind-item.is-on{background:linear-gradient(115deg,#2ED47F,#12A66B 60%,#0E7A6E);box-shadow:0 6px 16px -10px rgba(46,212,127,.8)}

/* page mark: layered emerald tile with a glossy top light and a soft breathing halo */
.lvs .lvb-mark{position:relative;overflow:visible;isolation:isolate;
	background:
		radial-gradient(120% 90% at 20% 0%,rgba(255,255,255,.28),transparent 55%),
		radial-gradient(90% 90% at 85% 100%,rgba(79,199,234,.45),transparent 60%),
		linear-gradient(145deg,#34E08A 0%,#16B27A 45%,#0E7F8B 100%);
	border-color:rgba(255,255,255,.22);
	box-shadow:0 14px 30px -14px rgba(46,212,127,.9),inset 0 1px 0 rgba(255,255,255,.35),inset 0 -8px 16px -10px rgba(0,0,0,.45)}
.lvs .lvb-mark svg{position:relative;z-index:1;filter:drop-shadow(0 2px 4px rgba(0,0,0,.35))}
.lvs-mark-ring{position:absolute;inset:-5px;border-radius:21px;border:1.5px solid rgba(46,212,127,.55);opacity:.7;animation:lvsHalo 2.6s ease-in-out infinite;pointer-events:none}
@keyframes lvsHalo{0%,100%{transform:scale(1);opacity:.55}50%{transform:scale(1.07);opacity:.15}}
@media (prefers-reduced-motion:reduce){.lvs-mark-ring{animation:none}}

/* ---------- sport tiles (icon buttons in a scrolling strip) ---------- */
.lvs-strip{position:relative;padding:12px 18px 0}
.lvs-sports{display:flex;gap:10px;overflow-x:auto;scroll-behavior:smooth;scrollbar-width:none;padding:6px 2px 4px;scroll-snap-type:x proximity}
.lvs-sports::-webkit-scrollbar{display:none}
.lvs-sport{--accent:var(--hi,#A78BFA);flex:0 0 auto;width:72px;display:flex;flex-direction:column;align-items:center;gap:6px;padding:0;background:none;border:0;scroll-snap-align:start;color:var(--ink-3);cursor:pointer}
.lvs-sport .lvs-sport-ico{position:relative;width:56px;height:56px;border-radius:14px;display:grid;place-items:center;background:var(--card-2);border:1px solid var(--hair);color:var(--ink-2);transition:background .16s,border-color .16s,transform .16s,box-shadow .16s}
.lvs-sport .lvs-sport-ico svg{width:26px;height:26px}
.lvs-sport .lvs-sport-lbl{font-size:12px;font-weight:600;line-height:1.2;max-width:72px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;transition:color .16s}
.lvs-sport em{position:absolute;top:-6px;right:-6px;font-style:normal;font-size:10px;font-weight:800;line-height:1;padding:3px 5px;border-radius:999px;background:var(--card-3);border:1px solid var(--hair-2);color:var(--ink-3)}
.lvs-sport:hover .lvs-sport-ico{border-color:var(--hair-2);color:#fff;transform:translateY(-1px)}
.lvs-sport:hover .lvs-sport-lbl{color:#fff}
.lvs-sport.is-on .lvs-sport-ico{background:color-mix(in srgb,var(--accent) 16%,var(--card-2));border-color:color-mix(in srgb,var(--accent) 70%,transparent);color:#fff;box-shadow:0 0 0 3px color-mix(in srgb,var(--accent) 18%,transparent)}
.lvs-sport.is-on .lvs-sport-lbl{color:color-mix(in srgb,var(--accent) 80%,#fff)}
.lvs-sport.is-on em{background:var(--accent);border-color:transparent;color:#0B0B13}
/* scroll arrows — .lvb button reset outranks a single class, hence the .lvs prefix */
.lvs .lvs-strip-btn{position:absolute;top:18px;right:10px;width:44px;height:56px;border-radius:12px;display:grid;place-items:center;padding:0;background:linear-gradient(90deg,rgba(27,32,48,0),var(--card) 45%);color:#fff;z-index:3;opacity:0;pointer-events:none;transition:opacity .16s}
.lvs .lvs-strip-btn svg{width:20px;height:20px;filter:drop-shadow(0 1px 2px rgba(0,0,0,.6))}
.lvs .lvs-strip-btn.is-show{opacity:1;pointer-events:auto}
.lvs .lvs-strip-btn.is-left{right:auto;left:10px;background:linear-gradient(270deg,rgba(27,32,48,0),var(--card) 45%)}

/* ---------- glyph tile (sport icon or team logo) ---------- */
.lvs-glyph{width:36px;height:36px;border-radius:9px;display:grid;place-items:center;background:var(--card-2);border:1px solid var(--hair);color:var(--ink-2);flex:0 0 auto}
.lvs-glyph svg{width:20px;height:20px}
.lvs-glyph.is-logo{padding:4px;background:#fff}
.lvs-glyph.is-logo img{width:100%;height:100%;object-fit:contain;display:block}
.lvs-glyph.is-multi{color:var(--hi)}

/* ---------- row text ---------- */
.lvs .lvb-user{display:inline-block;vertical-align:middle;max-width:22ch}
.lvs .lvb-user.is-hidden{display:inline-block}
.lvs .lvb-game{max-width:44ch}
.lvs-event{display:block;font-weight:700;color:#fff;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:44ch}
.lvs-pick{display:block;font-size:12.5px;color:var(--ink-3);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:48ch}
.lvs-pick i{font-style:normal;color:var(--ink-4)}
.lvs-tags{display:inline-flex;gap:4px;margin-left:6px;vertical-align:middle}
.lvs-tag{display:inline-block;font-size:10px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:1px 6px;border-radius:5px;background:var(--card-3);color:var(--ink-2)}
.lvs-tag.t-live{background:rgba(255,92,122,.16);color:#FFB3C0}
.lvs-tag.t-multi{background:rgba(167,139,250,.16);color:#DCD1FF}
.lvs-tag.t-boost{background:rgba(245,196,81,.16);color:#FFE7A8}
.lvs-tag.t-live i{display:inline-block;width:5px;height:5px;border-radius:50%;background:currentColor;margin-right:4px;vertical-align:1px;animation:lvbPulse 1.6s infinite}

/* odds chip reuses .lvb-chip; bands are set by JS classes */
.lvs .lvb-chip.o-lo{--c:var(--ink-3);color:var(--ink-2)}
.lvs .lvb-chip.o-mid{--c:var(--mid);color:#D6F3FB}
.lvs .lvb-chip.o-hi{--c:var(--hi);color:#E9E0FF}
.lvs .lvb-chip.o-max{--c:var(--max);color:#0B0B13;background:linear-gradient(135deg,var(--max),#FF9F43);border-color:transparent;box-shadow:0 8px 20px -10px rgba(245,196,81,.8)}
.lvs .c-payout{color:var(--up,#2ED47F)}
.lvs .c-payout .lvs-pot-mult{display:block;font-size:11.5px;color:var(--ink-4);font-weight:500}

/* tiles accents */
.lvs .lvb-tile[data-tile="bigmult"] b{color:var(--max)}
.lvs .lvb-tile[data-tile="paid"] b{color:var(--ink)}

/* rail lists: sport rows reuse .lvb-games with a glyph instead of a game icon */
.lvs .lvb-games li{grid-template-columns:20px 34px minmax(0,1fr) auto}
.lvs .lvb-games .lvs-glyph{width:34px;height:34px}
.lvs .lvb-games-name span b{font-weight:600;color:var(--ink-3)}

/* ---------- responsive ---------- */
@media (max-width:820px){
	.lvs-strip{padding:10px 10px 0}
}
@media (max-width:640px){
	.lvs-sport{width:62px}
	.lvs-sport .lvs-sport-ico{width:50px;height:50px;border-radius:12px}
	.lvs-sport .lvs-sport-ico svg{width:23px;height:23px}
	.lvs-sport .lvs-sport-lbl{max-width:62px;font-size:11.5px}
	.lvs-strip-btn{display:none}
	.lvs-glyph{width:32px;height:32px;border-radius:8px}
	.lvs-event,.lvs-pick{max-width:none}
	.lvs .lvb-table td.c-mult{grid-row:2;grid-column:-3}
	.lvs .lvb-table td.c-payout{grid-row:2;grid-column:-2}
	.lvs .lvb-table td.c-wager{grid-row:1;grid-column:-3/-1}
	.lvs .c-payout .lvs-pot-mult{display:none}
	.lvs-tags{margin-left:4px}
}