/* ═════════════════════════════════════════════════════════
   SPORTS DETAIL — LIGHT BLUE / SILVER / GOLD
   Compact mobile-first sportsbook UI inspired by guru365.
   Extracted from resources/views/sports/detail.blade.php so all
   sport pages can share one cached stylesheet.
═════════════════════════════════════════════════════════ */
.dt-strip,#dtStrip,.topnav,nav.topnav{display:none!important;}
.layout{margin-top:0!important;}
@media(max-width:900px){.layout{margin-top:0!important;}}
.sidebar{top:0!important;}

html,body,.layout,.main,main{background:#060a14!important;}
#dt-page{
  --bg-page:  #060a14;
  --bg-card:  #0b1022;
  --bg-card2: #0f152c;
  --bg-strip: #080d1c;
  --border:   rgba(255,255,255,.06);
  --border-2: rgba(255,255,255,.10);
  --silver:   #3d4a6a;
  --silver-d: #7a8aad;
  --slate:    #b8c4df;
  --slate-d:  #dce3f2;
  --back:     #72b4ff;
  --back-bg:  rgba(114,180,255,.08);
  --back-bg2: rgba(114,180,255,.14);
  --back-bg3: rgba(114,180,255,.22);
  --lay:      #f7a0b8;
  --lay-bg:   rgba(247,160,184,.08);
  --lay-bg2:  rgba(247,160,184,.14);
  --lay-bg3:  rgba(247,160,184,.22);
  --blue:var(--back);--blue-2:var(--back);
  --blue-bg:var(--back-bg);--blue-bg2:var(--back-bg2);--blue-bg3:var(--back-bg3);
  --pink:var(--lay);
  --pink-bg:var(--lay-bg);--pink-bg2:var(--lay-bg2);--pink-bg3:var(--lay-bg3);
  --gold:     #e8b830;
  --gold-2:   #ffd56b;
  --gold-bg:  rgba(232,184,48,.08);
  --green:    #34d399;
  --green-bg: rgba(52,211,153,.08);
  --red:      #f87171;
  --red-bg:   rgba(248,113,113,.08);
  --shadow-sm: 0 1px 4px rgba(0,0,0,.25);
  --shadow-md: 0 2px 10px rgba(0,0,0,.3);
  --shadow-lg: 0 4px 20px rgba(0,0,0,.4);
  --font-d:'Oxanium',sans-serif;
  --font-n:'Rajdhani',sans-serif;
  --font-b:'Inter','Nunito',system-ui,sans-serif;

  background:var(--bg-page);
  color:var(--slate-d);
  font-family:var(--font-b);
  font-weight:400;
  min-height:100vh;
  padding-bottom:140px;
  -webkit-font-smoothing:antialiased;
}
.main{background:var(--bg-page)!important;}

/* ── TOP STRIP (compact) ────────────────────────────── */
.dt-top{
  display:flex;align-items:center;gap:8px;
  padding:6px 10px;height:34px;
  background:linear-gradient(180deg,var(--bg-strip),var(--bg-card));
  border-bottom:1px solid var(--border);
  position:sticky;top:0;z-index:600;
  box-shadow:0 1px 4px rgba(15,23,42,.06);
}
.dt-back{
  width:24px;height:24px;border-radius:5px;
  background:var(--bg-strip);border:1px solid var(--border);
  color:var(--slate);font-size:14px;font-weight:600;
  display:flex;align-items:center;justify-content:center;
  text-decoration:none;flex-shrink:0;
}
.dt-back:hover{background:var(--gold-bg);border-color:var(--gold);color:var(--gold);}
.dt-clock{font-family:var(--font-n);font-size:11px;font-weight:600;color:var(--slate);letter-spacing:.4px;}
.dt-marquee{flex:1;overflow:hidden;height:100%;display:flex;align-items:center;}
.dt-marquee-inner{
  display:flex;gap:18px;white-space:nowrap;
  animation:dtMarquee 34s linear infinite;
  font-family:var(--font-d);font-size:10px;font-weight:700;color:var(--silver-d);
  padding-left:18px;
}
.dt-marquee-inner b{color:var(--blue);}
@keyframes dtMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ── HEADER STRIP ── */
.dt-hd{
  background:linear-gradient(180deg,#1a1600,#141100);
  border-bottom:1px solid rgba(232,184,48,.15);
  padding:6px 12px;display:flex;align-items:center;gap:8px;
  color:var(--slate-d);
}
.dt-hd-teams{
  flex:1;min-width:0;
  font-family:var(--font-d);font-size:12px;font-weight:600;
  letter-spacing:.1px;line-height:1.2;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.dt-hd-teams .vs{font-weight:700;opacity:.6;padding:0 3px;}
.dt-hd-time{
  font-family:var(--font-n);font-size:11px;font-weight:600;
  text-align:right;flex-shrink:0;line-height:1.15;
}
.dt-hd-time small{display:block;font-size:9px;font-weight:700;opacity:.75;}
.dt-hd-live{
  display:inline-flex;align-items:center;gap:3px;
  background:rgba(248,113,113,.12);color:var(--red);padding:1px 6px;border-radius:3px;
  font-size:8px;font-weight:600;letter-spacing:.3px;margin-right:4px;
  border:1px solid rgba(248,113,113,.25);
}
.dt-hd-live::before{
  content:'';width:4px;height:4px;border-radius:50%;background:var(--red);
  box-shadow:0 0 4px #dc2626;animation:livePulse 1.6s infinite;
}
@keyframes livePulse{0%,100%{opacity:1}50%{opacity:.4}}

/* ── HEADER ACTIONS ──── */
.dt-acts{
  display:flex;align-items:center;gap:6px;
  padding:5px 10px;background:var(--bg-card);border-bottom:1px solid var(--border);
}
.dt-pill{
  padding:4px 10px;border-radius:12px;cursor:pointer;
  font-family:var(--font-d);font-size:9px;font-weight:700;letter-spacing:.4px;
  text-transform:uppercase;text-decoration:none;border:none;
  display:inline-flex;align-items:center;gap:4px;line-height:1;
}
.dt-pill.gold{background:var(--gold-bg);color:var(--gold);border:1px solid rgba(232,184,48,.3);}
.dt-pill.gold:hover{background:rgba(232,184,48,.15);}
.dt-pill.outline{background:transparent;border:1px solid rgba(232,184,48,.25);color:var(--gold);}
.dt-pill .pill-cnt{
  background:rgba(232,184,48,.18);border-radius:6px;padding:0 5px;
  min-width:14px;text-align:center;font-size:9px;color:var(--gold);
}
.dt-pill.outline .pill-cnt{background:rgba(232,184,48,.15);}
.dt-comp{
  margin-left:auto;font-size:9px;color:var(--silver-d);font-family:var(--font-d);
  font-weight:700;letter-spacing:.3px;text-transform:uppercase;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

/* ── MEDIA CARD ───────────────── */
.media-strip{padding:6px 8px 0;}
.media-card{
  background:var(--bg-card);border:1px solid var(--border);border-radius:10px;
  overflow:hidden;box-shadow:var(--shadow-sm);
}
.media-head{
  display:flex;align-items:center;justify-content:space-between;gap:6px;
  padding:5px 8px;background:var(--bg-card2);border-bottom:1px solid var(--border);
}
.media-tabs{display:flex;gap:3px;}
.media-tab{
  background:var(--bg-card);border:1px solid var(--border);color:var(--silver-d);
  font-family:var(--font-d);font-size:9px;font-weight:600;letter-spacing:.3px;
  padding:3px 8px;border-radius:4px;cursor:pointer;text-transform:uppercase;
  display:inline-flex;align-items:center;gap:3px;transition:all .15s;line-height:1;
}
.media-tab:hover{color:var(--gold);border-color:rgba(232,184,48,.3);}
.media-tab.active{background:var(--gold-bg);border-color:rgba(232,184,48,.3);color:var(--gold);}
.media-tab .ld{width:5px;height:5px;border-radius:50%;background:var(--green);box-shadow:0 0 4px var(--green);animation:livePulse 1.6s infinite;}
.media-pin-btn{
  background:var(--bg-card);border:1px solid var(--border);color:var(--silver-d);
  width:28px;height:28px;border-radius:6px;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;font-size:11px;
  flex-shrink:0;transition:all .2s ease;
}
.media-pin-btn:hover{color:var(--gold);border-color:var(--gold);background:var(--gold-bg);}
.media-pin-btn.active{background:var(--gold-bg);border-color:var(--gold);color:var(--gold);transform:rotate(-25deg);}
@media(max-width:480px){.media-pin-btn{width:32px;height:32px;font-size:13px;border-radius:8px;}}
.media-body{
  position:relative;width:100%;aspect-ratio:16/9;background:#0c1322;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
}
.media-body iframe,.media-body video{width:100%;height:100%;border:0;background:#000;}
.media-pane{display:none;width:100%;height:100%;position:relative;}
.media-pane.active{display:block;}
.media-pane.active>.media-empty{display:flex;align-items:center;justify-content:center;height:100%;}
.media-pane iframe,.media-pane video{position:absolute;inset:0;width:100%!important;height:100%!important;border:0;display:block;background:#000;}
.media-empty{
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  width:100%;height:100%;color:#9aa7c2;font-family:var(--font-d);
  background:linear-gradient(135deg,#0a0f1e,#0e1428);text-align:center;padding:14px;
}
.media-empty .icon{font-size:28px;color:var(--gold-2);}
.media-empty .title{font-size:11px;font-weight:600;color:#e8ecf8;letter-spacing:.4px;}
.media-empty .sub{font-size:9px;color:#6b7790;max-width:240px;line-height:1.35;}
@keyframes spin{from{transform:rotate(0)}to{transform:rotate(360deg)}}
.media-empty.starting .icon{animation:pulse-soft 2s ease-in-out infinite;}
@keyframes pulse-soft{0%,100%{transform:scale(1);opacity:1;}50%{transform:scale(1.08);opacity:.7;}}

/* ── 2-COL LAYOUT ──────────────────────────────────── */
.dt-content{display:grid;grid-template-columns:1fr;gap:0;align-items:flex-start;position:relative;}
.dt-main-col{min-width:0;}
.dt-media-aside{display:none;}
.dt-media-mobile{display:block;}
@media(min-width:992px){
  .dt-content{grid-template-columns:minmax(0,1fr) 340px;gap:8px;padding:0 8px;}
  .dt-media-aside{display:block;position:sticky;top:74px;align-self:flex-start;
    max-height:calc(100vh - 90px);overflow-y:auto;padding-top:6px;}
  .dt-media-mobile{display:none;}
  .dt-main-col .markets-wrap{padding-bottom:90px;}
}
@media(min-width:1280px){.dt-content{grid-template-columns:minmax(0,1fr) 380px;}}

/* ── PINNED PIP ────────────────────────────────────── */
body.media-pinned .dt-media-aside,
body.media-pinned .dt-media-mobile{
  display:block!important;position:fixed!important;
  top:auto!important;bottom:80px;right:8px;left:auto;
  width:300px;max-width:calc(100vw - 16px);max-height:none;
  z-index:950;box-shadow:0 8px 32px rgba(0,0,0,.6);border-radius:12px;overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
}
body.media-pinned .dt-media-aside .media-body,
body.media-pinned .dt-media-mobile .media-body{aspect-ratio:16/9;max-height:180px;}
body.media-pinned .dt-media-aside .media-head,
body.media-pinned .dt-media-mobile .media-head{padding:6px 10px;gap:4px;}
@media(min-width:992px){
  body.media-pinned .dt-media-mobile{display:none!important;}
}
@media(max-width:991px){
  body.media-pinned .dt-media-aside{display:none!important;}
  body.media-pinned .dt-media-mobile{
    bottom:70px;right:4px;left:4px;width:auto;max-width:none;
    border-radius:12px;
  }
  body.media-pinned .dt-media-mobile .media-body{max-height:160px;}
}
@media(max-width:480px){
  body.media-pinned .dt-media-mobile{bottom:64px;}
}

/* ── MARKET TABS (sticky) ──────────────────────────── */
.market-tabs{
  display:flex;background:var(--bg-card);border-bottom:1px solid var(--border);
  overflow-x:auto;scrollbar-width:none;
  position:sticky;top:34px;z-index:500;padding:0 4px;
  box-shadow:0 1px 3px rgba(15,23,42,.04);
}
.market-tabs::-webkit-scrollbar{display:none;}
.market-tab{
  flex-shrink:0;padding:8px 12px;font-size:10px;font-weight:600;
  color:var(--silver-d);cursor:pointer;
  border-bottom:2px solid transparent;
  font-family:var(--font-d);white-space:nowrap;letter-spacing:.2px;
  min-height:34px;display:flex;align-items:center;gap:5px;
  text-transform:uppercase;transition:color .15s;
}
.market-tab.active{color:var(--gold);border-bottom-color:var(--gold);background:var(--gold-bg);}
.market-tab:hover:not(.active){color:var(--slate);background:var(--bg-card2);}
.market-tab .badge{
  background:var(--silver);color:#fff;border-radius:8px;padding:0 5px;
  font-size:8px;font-weight:700;
}
.market-tab.active .badge{background:var(--gold);}

/* ── MARKETS WRAP ──────────────────────────────────── */
.markets-wrap{padding:8px 6px 200px;}

/* ── CAT SECTION ───────────────────────────────────── */
.cat-section{
  margin:0 0 10px;border-radius:10px;overflow:hidden;
  background:var(--bg-card);border:1px solid var(--border);
  box-shadow:var(--shadow-sm);
}
.cat-head{
  display:flex;align-items:center;gap:7px;
  padding:6px 10px;background:var(--bg-card2);
  border-bottom:1px solid var(--border);
}
.cat-icon{
  width:22px;height:22px;border-radius:5px;
  background:var(--back-bg3);color:var(--back);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font-d);font-size:11px;font-weight:600;
  flex-shrink:0;border:1px solid rgba(114,180,255,.25);
}
.cat-section.cat-bm .cat-icon{background:rgba(56,189,248,.14);color:#38bdf8;border-color:rgba(56,189,248,.25);}
.cat-section.cat-fancy .cat-icon{background:rgba(167,139,250,.14);color:#a78bfa;border-color:rgba(167,139,250,.25);}
.cat-section.cat-premium .cat-icon{background:rgba(249,115,22,.14);color:#fb923c;border-color:rgba(249,115,22,.25);}
.cat-section.cat-overodds .cat-icon{background:rgba(232,184,48,.18);color:var(--gold);border-color:rgba(232,184,48,.4);}
.cat-text{flex:1;min-width:0;}
.cat-title{
  font-family:var(--font-d);font-size:11px;font-weight:600;
  color:var(--slate-d);letter-spacing:.2px;text-transform:uppercase;line-height:1.1;
}
.cat-sub{font-size:9px;color:var(--silver);font-weight:400;margin-top:1px;}
.cat-pill{
  font-size:9px;font-weight:600;font-family:var(--font-d);
  background:var(--back-bg);color:var(--back);border:1px solid rgba(114,180,255,.25);
  border-radius:10px;padding:1.5px 7px;letter-spacing:.2px;
}

/* ── MARKET BLOCK ───────────────────────────────────── */
.market-block{
  background:var(--bg-card);border-top:1px solid var(--border);
  position:relative;overflow:hidden;
}
.market-block:first-child{border-top:none;}

/* ── MARKET STATUS OVERLAYS ──
   When a market goes SUSPENDED / BALL RUNNING / CLOSED we paint a real
   semi-transparent overlay across the runner area (not just a tiny chip)
   so the user can see at a glance that the market is locked. The
   `.mkt-status-banner` is the prominent centered label inside it. */
.mkt-status-overlay{
  position:absolute;left:0;right:0;top:30px;bottom:0;
  display:flex;align-items:center;justify-content:center;
  pointer-events:none;z-index:5;
  background:rgba(8,11,22,.55);
  backdrop-filter:blur(2px) saturate(.6);
  -webkit-backdrop-filter:blur(2px) saturate(.6);
  animation:mktOverlayIn .25s ease-out;
}
@keyframes mktOverlayIn{from{opacity:0;}to{opacity:1;}}
.mkt-status-banner{
  padding:8px 22px;border-radius:6px;
  font-family:var(--font-d);font-size:13px;font-weight:800;
  letter-spacing:2px;text-transform:uppercase;
  background:rgba(0,0,0,.5);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 6px 24px rgba(0,0,0,.45);
  display:inline-flex;align-items:center;gap:6px;
}
@media(max-width:600px){
  .mkt-status-banner{font-size:11px;padding:6px 16px;letter-spacing:1.5px;}
}
.mk-status-badge{
  font-size:8px;font-weight:700;padding:2px 7px;border-radius:3px;
  letter-spacing:.4px;font-family:var(--font-d);margin-right:6px;
}

/* ── BALL RUNNING — smooth diagonal stripes + red glow ── */
.market-block.mkt-ball-running{
  border:1px solid rgba(248,113,113,.35);
  box-shadow:0 0 12px rgba(248,113,113,.08);
  transition:border-color .3s, box-shadow .3s;
}
.market-block.mkt-ball-running .rtable tbody{
  position:relative;
  background:
    repeating-linear-gradient(45deg,
      rgba(248,113,113,.06) 0,
      rgba(248,113,113,.06) 10px,
      transparent 10px,
      transparent 20px);
  background-size:28px 28px;
  animation:mktStripe 2s linear infinite;
}
.market-block.mkt-ball-running .odds-btn{
  pointer-events:none;opacity:.45;filter:grayscale(.35);
  transition:opacity .3s, filter .3s;
}
.market-block.mkt-ball-running .mk-status-badge{
  background:rgba(248,113,113,.15);color:#fca5a5;
  border:1px solid rgba(248,113,113,.35);
  animation:mktBallPulse 1.6s ease-in-out infinite;
}
.market-block.mkt-ball-running .mkt-status-overlay{
  background:rgba(140,30,30,.35);
  backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(1px);
  transition:background .3s;
}
.market-block.mkt-ball-running .mkt-status-banner{
  background:rgba(248,113,113,.18);color:#fca5a5;
  border:1px solid rgba(248,113,113,.45);
  animation:mktBallPulse 1.6s ease-in-out infinite;
  font-size:11px;letter-spacing:.5px;
}
.market-block.mkt-ball-running .mkt-status-banner::before{
  content:'●';margin-right:6px;color:#f87171;animation:mktBallDot 1s ease-in-out infinite;
}
@keyframes mktStripe{from{background-position:0 0;}to{background-position:28px 0;}}
@keyframes mktBallPulse{0%,100%{box-shadow:0 0 0 0 rgba(248,113,113,.35);}50%{box-shadow:0 0 0 6px rgba(248,113,113,0);}}
@keyframes mktBallDot{0%,100%{opacity:1;transform:scale(1);}50%{opacity:.2;transform:scale(.6);}}

/* ── SUSPENDED — keep odds visible but show animated overlay ── */
.market-block.mkt-suspended{
  border:1px solid rgba(251,191,36,.25);
  position:relative;
}
.market-block.mkt-suspended .rtable{position:relative;}
.market-block.mkt-suspended .odds-btn{
  pointer-events:none;opacity:.35;filter:grayscale(.6);
}
.market-block.mkt-suspended .mk-status-badge{
  background:rgba(251,191,36,.18);color:#fbbf24;
  border:1px solid rgba(251,191,36,.45);
  animation:mktSuspFade 1.8s ease-in-out infinite;
}
/* Animated diagonal-stripe overlay covers the odds table */
.market-block.mkt-suspended .rtable::before{
  content:'';
  position:absolute;inset:0;
  pointer-events:none;z-index:2;
  background:
    repeating-linear-gradient(-45deg,
      rgba(251,191,36,.12) 0,
      rgba(251,191,36,.12) 10px,
      transparent 10px,
      transparent 22px),
    rgba(15,18,35,.4);
  background-size:32px 32px, auto;
  animation:mktStripeSusp 1.8s linear infinite;
}
.market-block.mkt-suspended .mkt-status-overlay{display:none;}
.market-block.mkt-suspended .mkt-status-banner{
  background:rgba(251,191,36,.22);color:#fbbf24;
  border:1px solid rgba(251,191,36,.55);
  font-size:11px;padding:5px 14px;letter-spacing:.8px;
  animation:mktSuspFade 1.8s ease-in-out infinite;
}
/* NO lock icon on banner — just text */
.market-block.mkt-suspended .mkt-status-banner::before{content:none;}
@keyframes mktStripeSusp{from{background-position:0 0, 0 0;}to{background-position:32px 0, 0 0;}}
@keyframes mktSuspFade{0%,100%{opacity:1;}50%{opacity:.65;}}

/* ── CLOSED ── */
.market-block.mkt-closed{
  border:1px solid rgba(122,138,173,.3);
}
.market-block.mkt-closed .rtable tbody{
  background:rgba(122,138,173,.04);
}
.market-block.mkt-closed .odds-btn{
  pointer-events:none;opacity:.28;filter:grayscale(1);
}
.market-block.mkt-closed .mk-status-badge{
  background:rgba(122,138,173,.15);color:var(--silver-d);
  border:1px solid rgba(122,138,173,.3);
}
.market-block.mkt-closed .mkt-status-overlay{
  background:rgba(15,20,30,.65);
}
.market-block.mkt-closed .mkt-status-banner{
  background:rgba(122,138,173,.22);color:var(--silver-d);
  border:1px solid rgba(122,138,173,.5);
}
.market-block.mkt-closed .mkt-status-banner::before{
  content:'✕';margin-right:8px;font-size:14px;
}
.mk-title-bar{
  display:flex;align-items:center;gap:6px;
  background:var(--bg-card2);
  color:var(--slate);padding:4px 10px;border-bottom:1px solid var(--border);
  font-family:var(--font-d);font-weight:600;
}
.mk-title-bar .mk-name{
  flex:1;font-size:10px;letter-spacing:.2px;text-transform:uppercase;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--gold);
}
.mk-title-bar .mk-limits{font-size:8px;font-weight:500;color:var(--silver-d);letter-spacing:.1px;white-space:nowrap;}
.mk-cashout-row{
  display:flex;align-items:center;gap:5px;
  background:var(--bg-card2);border-bottom:1px solid var(--border);
  padding:4px 8px;font-family:var(--font-d);font-size:9px;font-weight:600;
}
.mk-cashout-row .mk-co-cell{
  flex:1;text-align:center;padding:2.5px 6px;border-radius:4px;
  background:var(--red-bg);color:var(--red);
  border:1px solid rgba(248,113,113,.2);letter-spacing:.2px;
}
.mk-cashout-row .mk-co-cell.lc{
  background:var(--green-bg);color:var(--green);border-color:rgba(52,211,153,.2);
}

/* ── RUNNER TABLE ──────────────────────────────────── */
.rtable{width:100%;border-collapse:collapse;}
.rtable thead{display:none;}
.rtable tbody tr{border-top:1px solid var(--border);}
.rtable tbody tr:first-child{border-top:none;}
/* Per-runner suspension — when only ONE runner in an open market is
   suspended (the rest are still tradable). Dim the row, lock its odds,
   and stamp a small "SUSPENDED" pill on top of the odds cells. */
.rtable tbody tr.susp{position:relative;}
.rtable tbody tr.susp .odds-btn{opacity:.35;pointer-events:none;filter:grayscale(.5);}
.rtable tbody tr.susp .odds-row-cells{position:relative;}
.rtable tbody tr.susp .odds-row-cells::after{
  content:'\f023  SUSPENDED';
  font-family:'Font Awesome 6 Free','Font Awesome 5 Free','Oxanium',sans-serif;
  font-weight:900;font-size:9px;letter-spacing:1.2px;color:#fbbf24;
  position:absolute;inset:3px 6px 5px 6px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(40,28,8,.62);
  backdrop-filter:blur(2px);
  -webkit-backdrop-filter:blur(2px);
  border:1px solid rgba(251,191,36,.4);
  border-radius:4px;
  pointer-events:none;
}
.rtable tbody tr.susp .rname::after{
  content:'SUSP';font-size:8px;color:#fbbf24;font-weight:700;margin-left:6px;
  background:rgba(251,191,36,.15);padding:1px 5px;border-radius:3px;
  border:1px solid rgba(251,191,36,.4);
}
.rname{
  font-family:var(--font-d);font-size:11px;font-weight:600;color:var(--slate-d);
  padding:5px 10px;width:100%;
}
.rname-row{
  display:flex;align-items:center;justify-content:space-between;gap:6px;
}
.rname-text{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.rname-pl{
  font-size:9.5px;font-weight:700;font-family:var(--font-n);
  white-space:nowrap;flex-shrink:0;padding:1px 6px;border-radius:4px;
}
.rname-pl.pos{color:var(--green);background:var(--green-bg);}
.rname-pl.neg{color:var(--red);background:var(--red-bg);}

/* ── Horse/Greyhound race runner metadata strip ── */
.race-saddle{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:18px;height:18px;padding:0 5px;margin-right:6px;
  font-family:var(--font-d);font-weight:800;font-size:10px;
  background:linear-gradient(135deg,#d4a84b,#c49530);color:#1a1a1a;
  border-radius:3px;
}
.race-runner-row .rname-text{font-weight:700;}
.race-runner-meta{
  display:flex;flex-wrap:wrap;gap:10px;
  padding:3px 6px 4px 24px;
  font-family:var(--font-d);font-size:9px;color:var(--silver-d);
}
.race-runner-meta span{display:inline-flex;align-items:center;gap:3px;}
.race-runner-meta i{font-size:8px;opacity:.7;color:var(--gold);}
@media(max-width:600px){
  .race-runner-meta{gap:6px;font-size:8px;padding-left:20px;}
  .race-saddle{min-width:16px;height:16px;font-size:9px;}
}
.odds-cell{padding:3px 2px;text-align:center;}
.odds-row-cells{
  display:flex;gap:3px;justify-content:flex-end;padding:3px 6px 5px;flex-wrap:nowrap;
}
@media(max-width:600px){.odds-col-hide{display:none !important;}}
@media(min-width:601px){.odds-col-hide{display:flex;}}

.odds-btn{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-width:42px;min-height:34px;border-radius:4px;cursor:pointer;
  font-family:var(--font-n);
  transition:filter .12s ease,transform .08s ease;
  border:1px solid transparent;
  position:relative;overflow:hidden;
}
@media(min-width:601px){
  /* Desktop renders 6 back + 6 lay tiers per runner. Shrink the min-width
     slightly so all 12 cells fit without wrapping on mid-size screens. */
  .odds-btn{min-width:42px;min-height:32px;}
  .odds-row-cells{gap:2px;padding:3px 6px 5px;}
  .o-price{font-size:11px;}
  .o-size{font-size:7px;}
}
@media(min-width:1100px){
  /* Wide desktop: give the cells a bit more breathing room */
  .odds-btn{min-width:48px;min-height:34px;}
  .odds-row-cells{gap:3px;}
  .o-price{font-size:12px;}
}
.odds-btn:active{transform:scale(.94);}
.odds-btn.back-6,.odds-btn.back-5,.odds-btn.back-4{background:var(--back-bg);border-color:rgba(114,180,255,.12);}
.odds-btn.back-3{background:var(--back-bg);border-color:rgba(114,180,255,.18);}
.odds-btn.back-2{background:var(--back-bg2);border-color:rgba(114,180,255,.22);}
.odds-btn.back-1{background:var(--back-bg3);border-color:rgba(114,180,255,.30);}
.odds-btn.lay-1{background:var(--lay-bg3);border-color:rgba(247,160,184,.30);}
.odds-btn.lay-2{background:var(--lay-bg2);border-color:rgba(247,160,184,.22);}
.odds-btn.lay-3{background:var(--lay-bg);border-color:rgba(247,160,184,.18);}
.odds-btn.lay-4,.odds-btn.lay-5,.odds-btn.lay-6{background:var(--lay-bg);border-color:rgba(247,160,184,.12);}
.odds-btn.back-5,.odds-btn.back-6{opacity:.75;}
.odds-btn.lay-5,.odds-btn.lay-6{opacity:.75;}
.odds-btn.back{background:var(--back-bg2);border-color:rgba(114,180,255,.20);}
.odds-btn.lay{background:var(--lay-bg2);border-color:rgba(247,160,184,.20);}
.odds-btn:hover{filter:brightness(1.2);}
.odds-btn.selected{box-shadow:0 0 0 1.5px var(--gold) inset;}
.o-price{font-size:12px;font-weight:700;color:var(--back);line-height:1.05;position:relative;z-index:2;}
.odds-btn.lay-1 .o-price,.odds-btn.lay-2 .o-price,.odds-btn.lay-3 .o-price,
.odds-btn.lay-4 .o-price,.odds-btn.lay-5 .o-price,.odds-btn.lay-6 .o-price,
.odds-btn.lay .o-price{color:var(--lay);}
.o-size{font-size:7px;color:var(--silver);font-weight:500;margin-top:1px;line-height:1;position:relative;z-index:2;}

@keyframes flashUp   {0%{background:rgba(52,211,153,.35)!important}100%{}}
@keyframes flashDown {0%{background:rgba(248,113,113,.35)!important}100%{}}
.odds-btn.flash-up  {animation:flashUp .8s ease-out;}
.odds-btn.flash-down{animation:flashDown .8s ease-out;}

/* ── FANCY ─────────────────────────────────────────── */
.fancy-row{
  display:flex;align-items:center;gap:6px;padding:5px 10px;
  border-top:1px solid var(--border);
}
.fancy-row:first-child{border-top:none;}
.fancy-row:hover{background:var(--bg-card2);}
.fancy-name{
  flex:1;font-family:var(--font-d);font-size:11px;font-weight:600;color:var(--slate-d);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.fancy-name small{display:block;font-size:9px;color:var(--red);font-weight:700;}
.fancy-btns{display:flex;gap:3px;flex-shrink:0;}
.fancy-odds-btn{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  min-width:48px;min-height:34px;border-radius:4px;cursor:pointer;padding:3px 5px;
  border:1px solid transparent;
}
.fancy-odds-btn.back{background:var(--lay-bg2);border-color:rgba(247,160,184,.20);}
.fancy-odds-btn.lay{background:var(--back-bg2);border-color:rgba(114,180,255,.20);}
.fancy-odds-btn:hover{filter:brightness(1.2);}
.fancy-odds-btn:active{transform:scale(.96);}
.fancy-odds-btn .fo-run{font-size:7px;font-weight:600;color:var(--silver-d);font-family:var(--font-d);}
.fancy-odds-btn .fo-price{font-size:11px;font-weight:700;font-family:var(--font-n);line-height:1.05;}
.fancy-odds-btn.back .fo-price{color:var(--lay);}
.fancy-odds-btn.lay  .fo-price{color:var(--back);}
.fancy-odds-btn .fo-size{font-size:7px;color:var(--silver);font-weight:500;line-height:1;}
/* Suspended fancy row gets the same dark overlay treatment as a
   suspended exchange market — semi-transparent dim wash + a centered
   "SUSPENDED" pill so the user can't miss it. */
/* Suspended fancy rows — keep visible, overlay animated stripes */
.fancy-row.susp-fancy{
  position:relative;
  border-bottom:1px solid rgba(251,191,36,.2);
}
.fancy-row.susp-fancy .fancy-odds-btn{opacity:.35;pointer-events:none;filter:grayscale(.5);}
.fancy-row.susp-fancy::before{
  content:'';
  position:absolute;inset:0;pointer-events:none;z-index:1;
  background:
    repeating-linear-gradient(-45deg,
      rgba(251,191,36,.1) 0,
      rgba(251,191,36,.1) 8px,
      transparent 8px,
      transparent 18px);
  animation:mktStripeSusp 1.8s linear infinite;
}
.fancy-row.susp-fancy::after{
  content:'SUSPENDED';
  font-family:'Oxanium',sans-serif;
  font-weight:800;font-size:9px;letter-spacing:1px;
  color:#fbbf24;
  position:absolute;right:10px;top:50%;transform:translateY(-50%);
  pointer-events:none;z-index:2;
  background:rgba(15,18,35,.85);padding:3px 8px;border-radius:3px;
  animation:mktSuspFade 1.8s ease-in-out infinite;
}
/* Single-side empty (one of NO/YES missing while the other has data).
   Fade the dead side out and block its clicks so the bet slip can't
   open against null prices. If BOTH sides are empty the parent row
   gets .susp-fancy via PHP/JS and the rule above handles it. */
.fancy-odds-btn.is-empty{opacity:.4;pointer-events:none;filter:grayscale(.6);cursor:not-allowed;}
.fancy-odds-btn.is-empty .fo-price,
.fancy-odds-btn.is-empty .fo-size{color:var(--silver-d)!important;}

.fancy-chooser{display:flex;gap:4px;padding:6px 8px 0;}
.fancy-chooser-btn{
  flex:1;padding:6px 8px;border-radius:5px;cursor:pointer;
  background:var(--bg-card);border:1px solid var(--border);color:var(--silver-d);
  font-family:var(--font-d);font-size:10px;font-weight:600;letter-spacing:.3px;
  text-transform:uppercase;text-align:center;
}
.fancy-chooser-btn:hover{color:var(--gold);border-color:rgba(232,184,48,.25);}
.fancy-chooser-btn.active{
  background:var(--gold-bg);
  color:var(--gold);border-color:rgba(232,184,48,.35);
}
.fancy-chooser-btn .fc-count{
  display:inline-block;background:rgba(232,184,48,.15);
  padding:0 5px;border-radius:6px;margin-left:4px;font-size:9px;color:var(--gold);
}
.fancy-pane{display:none;padding:5px 0 0;}
.fancy-pane.active{display:block;}
.fancy-pane-empty{text-align:center;padding:24px 14px;color:var(--silver-d);font-family:var(--font-d);font-size:11px;}

.fancy-subtabs{
  display:flex;gap:5px;padding:8px 8px 6px;overflow-x:auto;scrollbar-width:none;
  border-bottom:1px solid var(--border);margin-bottom:6px;
}
.fancy-subtabs::-webkit-scrollbar{display:none;}
.fancy-subtab{
  flex-shrink:0;padding:6px 11px;border-radius:14px;
  background:var(--bg-card);border:1px solid var(--border);color:var(--silver-d);
  font-family:var(--font-d);font-size:9px;font-weight:600;letter-spacing:.3px;
  cursor:pointer;text-transform:uppercase;display:inline-flex;align-items:center;gap:5px;
  transition:all .15s;white-space:nowrap;
}
.fancy-subtab i{font-size:10px;}
.fancy-subtab:hover{color:var(--gold);border-color:rgba(232,184,48,.25);}
.fancy-subtab.active{background:var(--gold-bg);color:var(--gold);border-color:rgba(232,184,48,.4);}
.fancy-subtab .fs-cnt{
  background:rgba(255,255,255,.06);color:inherit;border-radius:7px;padding:0 6px;
  font-size:8px;font-weight:600;
}
.fancy-subtab.active .fs-cnt{background:rgba(232,184,48,.18);color:var(--gold);}
.fancy-group.fancy-hidden{display:none;}

/* ── MY BETS / OPEN BETS ───────────────────────────── */
.bet-card{
  background:var(--bg-card);border:1px solid var(--border);border-radius:8px;
  padding:8px 10px;margin-bottom:7px;box-shadow:var(--shadow-sm);
}
.bet-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px;}
.bet-card-name{font-family:var(--font-d);font-size:11px;font-weight:600;color:var(--slate-d);}
.bet-badge{font-size:8px;font-weight:700;padding:2px 7px;border-radius:4px;font-family:var(--font-d);}
.bet-badge.back-badge{background:var(--back-bg2);color:var(--back);border:1px solid rgba(114,180,255,.3);}
.bet-badge.lay-badge{background:var(--lay-bg2);color:var(--lay);border:1px solid rgba(247,160,184,.3);}
.bet-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;}
.bg-label{font-size:8px;color:var(--silver-d);font-family:var(--font-d);font-weight:700;text-align:center;text-transform:uppercase;}
.bg-val{font-family:var(--font-n);font-size:11px;font-weight:600;color:var(--slate-d);text-align:center;}
.cashout-btn{
  width:100%;margin-top:7px;padding:6px;
  border:1px solid rgba(52,211,153,.25);border-radius:5px;
  background:var(--green-bg);color:var(--green);
  font-size:10px;font-weight:600;cursor:pointer;font-family:var(--font-d);
  letter-spacing:.3px;transition:all .15s;
}
.cashout-btn:hover:not(:disabled){background:rgba(52,211,153,.15);border-color:rgba(52,211,153,.4);}
.cashout-btn:disabled{opacity:.35;cursor:not-allowed;}

/* ── Live cashout / loss-cut quote strip on open-bet cards ── */
.cashout-quote{margin-top:7px;border-top:1px dashed var(--border);padding-top:6px;}
.cashout-quote .cq-row{
  display:flex;align-items:center;justify-content:space-between;gap:6px;
  font-family:var(--font-d);font-size:9px;margin-bottom:5px;
}
.cashout-quote .cq-label{color:var(--silver-d);text-transform:uppercase;letter-spacing:.4px;font-weight:700;}
.cashout-quote .cq-val{font-family:var(--font-n);font-size:12px;font-weight:800;color:var(--slate-d);}
.cashout-quote .cq-pl{font-family:var(--font-n);font-size:10px;font-weight:700;padding:1px 6px;border-radius:3px;}
.cashout-quote .cq-pl.good{background:var(--green-bg);color:var(--green);}
.cashout-quote .cq-pl.bad{background:rgba(239,68,68,.15);color:#ef4444;}
.cashout-quote .cq-btns{display:grid;grid-template-columns:1fr 1fr;gap:5px;}
.cashout-quote .cq-btns .cashout-btn{margin-top:0;padding:7px 4px;}
.cashout-quote .loss-btn{
  border:1px solid rgba(239,68,68,.35);
  background:rgba(239,68,68,.12);
  color:#ef4444;
}
.cashout-quote .loss-btn:hover:not(:disabled){background:rgba(239,68,68,.22);border-color:rgba(239,68,68,.55);}

.empty-state{text-align:center;padding:30px 15px;color:var(--silver-d);font-family:var(--font-d);font-size:11px;}

/* ── BETSLIP DRAWER ──────────────── */
.betslip-outer{
  position:fixed;bottom:60px;left:0;right:0;z-index:999;
  max-width:520px;margin:0 auto;pointer-events:none;
}
@media(min-width:769px){.betslip-outer{bottom:0;}}
.betslip-outer>*{pointer-events:all;}
.bs-empty{
  margin:6px 8px;background:var(--bg-card);
  border:1px dashed var(--border-2);border-radius:8px;padding:8px 12px;
  display:flex;align-items:center;gap:8px;color:var(--silver-d);font-size:10px;font-family:var(--font-d);
  box-shadow:0 -2px 10px rgba(15,23,42,.06);
}
.bs-card{
  margin:6px 6px;background:var(--bg-card);
  border:1px solid rgba(232,184,48,.25);border-radius:8px;overflow:hidden;
  box-shadow:0 6px 24px rgba(0,0,0,.4);
  animation:bsSlideUp .22s ease-out;
}
.bs-card::before{
  content:'';display:block;height:1.5px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
}
@keyframes bsSlideUp{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
.bs-inner{padding:8px 10px;}
.bs-top-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:5px;gap:6px;}
.bs-type-pill{font-size:9px;font-weight:700;padding:3px 10px;border-radius:4px;font-family:var(--font-d);letter-spacing:.3px;text-transform:uppercase;}
.bs-type-pill.back{background:var(--back-bg2);color:var(--back);border:1px solid rgba(114,180,255,.3);}
.bs-type-pill.lay{background:var(--lay-bg2);color:var(--lay);border:1px solid rgba(247,160,184,.3);}
.bs-close{
  background:var(--bg-card);border:1px solid var(--border);width:24px;height:24px;
  border-radius:5px;cursor:pointer;color:var(--silver-d);font-size:14px;line-height:1;
}
.bs-selection{font-family:var(--font-d);font-size:12px;font-weight:600;color:var(--slate-d);margin-bottom:1px;}
.bs-market{font-size:9px;color:var(--silver);margin-bottom:6px;}
.bs-fancy-note{
  font-size:8px;color:#7e22ce;background:#f3e8ff;
  border:1px solid #d8b4fe;border-radius:4px;
  padding:3px 7px;text-align:center;margin-bottom:5px;display:none;
}
.bs-inputs{display:flex;gap:5px;margin-bottom:6px;}
.bs-inp-wrap{flex:1;}
.bs-inp-label{font-size:8px;color:var(--silver-d);font-weight:700;font-family:var(--font-d);margin-bottom:3px;text-transform:uppercase;}
.bs-inp{
  width:100%;background:var(--bg-card2);border:1px solid var(--border-2);
  border-radius:6px;color:var(--slate-d);font-size:14px;font-weight:700;
  font-family:var(--font-n);padding:6px 8px;text-align:center;outline:none;
  min-height:36px;-moz-appearance:textfield;
}
.bs-inp::-webkit-inner-spin-button,.bs-inp::-webkit-outer-spin-button{-webkit-appearance:none;}
.bs-inp:focus{border-color:var(--gold);background:var(--gold-bg);}
.stake-chips{display:flex;gap:4px;margin-bottom:6px;flex-wrap:wrap;}
.stake-chip{
  flex:1;min-width:34px;background:var(--bg-card2);border:1px solid var(--border);
  border-radius:5px;padding:5px 4px;text-align:center;font-size:10px;font-weight:600;
  color:var(--slate);cursor:pointer;font-family:var(--font-d);
}
.stake-chip:hover{background:var(--gold-bg);color:var(--gold);border-color:rgba(232,184,48,.3);}
.stake-chip.clr{color:var(--red);}
.stake-chip.clr:hover{background:var(--red-bg);border-color:rgba(248,113,113,.3);}
#bsLimits{font-size:9px;color:var(--silver-d);text-align:center;margin:-2px 0 6px;letter-spacing:.2px;}
.bs-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;margin-bottom:7px;}
.bs-sum-item{background:var(--bg-card2);border:1px solid var(--border);border-radius:5px;padding:5px 4px;text-align:center;}
.bs-sum-label{font-size:7.5px;color:var(--silver-d);font-family:var(--font-d);margin-bottom:2px;text-transform:uppercase;letter-spacing:.3px;}
.bs-sum-val{font-family:var(--font-n);font-size:12px;font-weight:700;color:var(--slate-d);}
.place-btn{
  width:100%;padding:10px;border:none;border-radius:6px;
  background:linear-gradient(180deg,#e8b830,#c49530);
  color:#0a0d1c;font-size:12px;font-weight:700;cursor:pointer;
  font-family:var(--font-d);letter-spacing:.4px;text-transform:uppercase;
  box-shadow:0 2px 10px rgba(232,184,48,.2);
  transition:all .15s;
}
.place-btn:hover:not(:disabled){filter:brightness(1.1);box-shadow:0 4px 16px rgba(232,184,48,.3);}
.place-btn:disabled{opacity:.4;cursor:not-allowed;}
.login-link{display:block;text-align:center;margin-top:5px;color:var(--gold);font-size:11px;text-decoration:none;font-family:var(--font-d);}

/* ── BOOK PANEL ───────────── */
.book-panel{
  background:var(--bg-card2);
  border:1px solid rgba(232,184,48,.2);border-radius:8px;
  padding:6px 10px;margin:6px 6px 0;
  box-shadow:var(--shadow-sm);
}
.book-panel-head{
  display:flex;align-items:center;gap:6px;font-family:var(--font-d);
  font-size:9px;font-weight:700;color:var(--gold);text-transform:uppercase;letter-spacing:.4px;
  margin-bottom:5px;
}
.book-panel-head .ico{
  width:14px;height:14px;border-radius:3px;background:var(--gold-bg);
  display:inline-flex;align-items:center;justify-content:center;font-size:9px;color:var(--gold);
}
.book-rows{display:flex;flex-direction:column;gap:3px;}
.book-row{
  display:flex;align-items:center;justify-content:space-between;gap:6px;
  padding:3px 6px;background:var(--bg-card);border:1px solid var(--border);border-radius:5px;
  font-family:var(--font-d);font-size:10px;
}
.book-row .br-name{flex:1;font-weight:600;color:var(--slate);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.book-row .br-cur{font-family:var(--font-n);font-size:11px;font-weight:700;color:var(--silver-d);}
.book-row .br-arrow{color:var(--silver);font-size:9px;}
.book-row .br-new{font-family:var(--font-n);font-size:11px;font-weight:700;}
.book-row .br-new.pos{color:var(--green);}
.book-row .br-new.neg{color:var(--red);}
.book-row .br-new.zero{color:var(--silver-d);}

/* ── TOAST ─────────────────────────────────────────── */
.toast-container{position:fixed;top:46px;left:50%;transform:translateX(-50%);z-index:9999;display:flex;flex-direction:column;gap:5px;align-items:center;pointer-events:none;}
.toast{padding:7px 14px;border-radius:6px;font-family:var(--font-d);font-weight:600;font-size:11px;animation:toastIn .3s ease;box-shadow:0 4px 16px rgba(15,23,42,.2);}
.toast.success{background:var(--green);color:#fff;}
.toast.error{background:var(--red);color:#fff;}
@keyframes toastIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}

/* ── RESPONSIVE ────────────────────── */
@media(max-width:600px){
  .markets-wrap{padding:6px 4px 200px;}
  .mk-title-bar{padding:3px 8px;}
  .mk-title-bar .mk-name{font-size:10px;}
  .mk-title-bar .mk-limits{font-size:8px;}
  .rname{font-size:10px;padding:4px 8px;}
  .odds-btn{min-width:38px;min-height:30px;border-radius:3px;}
  .o-price{font-size:11px;}
  .o-size{font-size:7px;}
  .market-tab{padding:6px 10px;font-size:9px;min-height:30px;}
  .fancy-row{padding:4px 8px;}
  .fancy-name{font-size:10px;}
  .fancy-odds-btn{min-width:42px;min-height:30px;}
  .fancy-odds-btn .fo-price{font-size:10px;}
  .bs-inp{font-size:13px;padding:5px 8px;min-height:32px;}
  .stake-chip{font-size:9px;padding:4px 3px;}
  .place-btn{font-size:11px;padding:7px;}
}
@media(max-width:380px){
  .markets-wrap{padding:5px 3px 200px;}
  .odds-btn{min-height:28px;min-width:34px;}
  .o-price{font-size:10px;}
  .o-size{display:none;}
  .market-tab{padding:5px 8px;font-size:8px;}
  .dt-hd-teams{font-size:11px;}
  .dt-pill{font-size:8px;padding:3px 8px;}
}

/* ── MOBILE TEXT SIZING ────────────────────────────── */
@media(max-width:600px){
  .dt-hd-teams{font-size:11px!important;}
  .dt-hd-time{font-size:9px!important;}
  .dt-hd-time small{font-size:8px!important;}
  .dt-hd-live{font-size:7px!important;padding:1px 4px!important;}
  .cat-title{font-size:10px!important;}
  .cat-sub{font-size:8px!important;}
  .cat-pill{font-size:8px!important;padding:1px 5px!important;}
  .dt-pill{font-size:8px!important;padding:3px 7px!important;}
  .dt-comp{font-size:8px!important;}
  .dt-clock{font-size:9px!important;}
  .dt-marquee-inner{font-size:9px!important;}
  .market-tab{font-size:9px!important;padding:6px 9px!important;}
  .market-tab .badge{font-size:7px!important;}
  .bs-selection{font-size:11px!important;}
  .bs-market{font-size:8px!important;}
  .bs-inp-label{font-size:7px!important;}
  .bs-sum-label{font-size:7px!important;}
  .bs-sum-val{font-size:11px!important;}
  .fancy-subtab{font-size:8px!important;padding:5px 8px!important;}
  .fancy-name{font-size:9px!important;}
}
@media(max-width:380px){
  .dt-hd-teams{font-size:10px!important;}
  .cat-title{font-size:9px!important;}
  .market-tab{font-size:8px!important;padding:5px 7px!important;}
  .fancy-subtab{font-size:7px!important;}
}

/* ── INLINE BETSLIP ── */
.betslip-outer{position:static !important;bottom:auto !important;max-width:none;}
.betslip-outer .bs-empty{display:none !important;}
#dt-page .bs-card{
  margin:8px 0 !important;
  border:1px solid rgba(232,184,48,.28) !important;
  border-radius:8px;
  box-shadow:0 4px 20px rgba(0,0,0,.45);
}
.bs-inline-row > td{padding:6px 4px 10px !important;background:transparent !important;border:0 !important;}

/* ── MOBILE MEDIA CARD ── */
.media-card .media-collapse-btn{
  background:var(--bg-card);border:1px solid var(--border);color:var(--silver-d);
  width:22px;height:22px;border-radius:4px;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;font-size:10px;
  flex-shrink:0;
}
.media-card.collapsed .media-body{display:none !important;}
.media-card.collapsed .media-collapse-btn i{transform:rotate(-90deg);}
@media(min-width:992px){
  .dt-media-aside .media-card.collapsed .media-body{display:flex !important;}
}

/* ═════════════════════════════════════════════════════════
   CRICKET — OVER ODDS SECTION (per-tile animations)
═════════════════════════════════════════════════════════ */
.over-odds-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));
  gap:8px;padding:8px;
}
@media(max-width:600px){
  .over-odds-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px;padding:6px;}
}
.over-card{
  background:var(--bg-card2);border:1px solid var(--border);
  border-radius:8px;overflow:hidden;position:relative;
  transition:border-color .2s,box-shadow .2s;
}
.over-card:hover{border-color:rgba(232,184,48,.25);}
.over-card-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:5px 8px;background:linear-gradient(180deg,#1a1600,#141100);
  border-bottom:1px solid rgba(232,184,48,.15);
}
.over-card-title{
  font-family:var(--font-d);font-size:10px;font-weight:700;color:var(--gold);
  letter-spacing:.5px;text-transform:uppercase;
}
.over-card-sub{
  font-family:var(--font-d);font-size:8px;color:var(--silver-d);font-weight:600;
}
.over-card-status{
  font-family:var(--font-d);font-size:7px;font-weight:700;letter-spacing:.4px;
  padding:2px 6px;border-radius:3px;text-transform:uppercase;
}
.over-card-status.s-open    {background:var(--green-bg);color:var(--green);border:1px solid rgba(52,211,153,.3);}
.over-card-status.s-suspended{background:rgba(251,191,36,.15);color:#fbbf24;border:1px solid rgba(251,191,36,.4);}
.over-card-status.s-ball-running{background:rgba(248,113,113,.18);color:#fca5a5;border:1px solid rgba(248,113,113,.4);animation:mktBallPulse 1.2s ease-in-out infinite;}
.over-card-status.s-closed  {background:rgba(122,138,173,.15);color:var(--silver-d);border:1px solid rgba(122,138,173,.3);}

.over-card-body{padding:6px;display:flex;flex-direction:column;gap:5px;}
.over-runner{
  display:grid;grid-template-columns:1fr auto auto;gap:5px;align-items:center;
  background:var(--bg-card);border:1px solid var(--border);border-radius:5px;
  padding:4px 6px;
}
.over-runner-name{
  font-family:var(--font-d);font-size:10px;font-weight:600;color:var(--slate);
  letter-spacing:.2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

/* ── PER-TILE STATUS ANIMATIONS (the headline feature) ── */
.odds-btn.tile-ball-running{
  pointer-events:none;
  border-color:rgba(248,113,113,.5)!important;
  background:rgba(248,113,113,.10)!important;
}
.odds-btn.tile-ball-running::before{
  content:'';position:absolute;inset:0;
  background:linear-gradient(110deg,transparent 30%,rgba(248,113,113,.32) 50%,transparent 70%);
  background-size:220% 100%;
  animation:tileSweep 1.2s linear infinite;
  z-index:1;
}
.odds-btn.tile-ball-running::after{
  content:'●';position:absolute;top:1px;right:2px;font-size:6px;color:#fca5a5;
  animation:mktBallDot .8s ease-in-out infinite;z-index:3;
}
.odds-btn.tile-ball-running .o-price,
.odds-btn.tile-ball-running .o-size{filter:blur(.6px) grayscale(.4);opacity:.8;}
@keyframes tileSweep{0%{background-position:200% 0;}100%{background-position:-100% 0;}}

.odds-btn.tile-suspended{
  pointer-events:none;
  border-color:rgba(251,191,36,.4)!important;
  background:repeating-linear-gradient(-45deg,rgba(251,191,36,.10) 0,rgba(251,191,36,.10) 4px,rgba(251,191,36,.02) 4px,rgba(251,191,36,.02) 8px)!important;
  animation:tileLockPulse 1.6s ease-in-out infinite;
}
.odds-btn.tile-suspended::after{
  content:'\f023';font-family:'Font Awesome 6 Free','Font Awesome 5 Free',sans-serif;font-weight:900;
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  font-size:11px;color:#fbbf24;background:rgba(15,23,42,.55);
  z-index:3;
}
.odds-btn.tile-suspended .o-price,
.odds-btn.tile-suspended .o-size{visibility:hidden;}
@keyframes tileLockPulse{0%,100%{box-shadow:inset 0 0 0 0 rgba(251,191,36,.4);}50%{box-shadow:inset 0 0 0 2px rgba(251,191,36,.4);}}

.odds-btn.tile-closed{
  pointer-events:none;
  background:rgba(122,138,173,.06)!important;
  filter:grayscale(1);opacity:.4;
}
.odds-btn.tile-closed::after{
  content:'\f00d';font-family:'Font Awesome 6 Free','Font Awesome 5 Free',sans-serif;font-weight:900;
  position:absolute;top:1px;right:3px;font-size:7px;color:var(--silver-d);z-index:3;
}

/* New-tile pop-in (used when over odds appear) */
@keyframes overCardIn{from{opacity:0;transform:translateY(6px);}to{opacity:1;transform:translateY(0);}}
.over-card{animation:overCardIn .25s ease-out;}

/* ── SIDEBAR BET DATA ── */
.sidebar-bets-panel{
  background:var(--bg-card);border:1px solid var(--border);border-radius:10px;
  overflow:hidden;margin-top:8px;
}
.sb-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:8px 12px;background:var(--bg-card2);border-bottom:1px solid var(--border);
}
.sb-title{font-family:var(--font-d);font-size:10px;font-weight:700;color:var(--gold);text-transform:uppercase;letter-spacing:.5px;}
.sb-title i{margin-right:5px;}
.sb-count{
  font-family:var(--font-d);font-size:9px;font-weight:700;
  background:var(--gold-bg);color:var(--gold);border:1px solid rgba(232,184,48,.3);
  border-radius:8px;padding:1px 7px;
}
.sb-body{padding:6px;max-height:300px;overflow-y:auto;}
.sb-body::-webkit-scrollbar{width:3px;}
.sb-body::-webkit-scrollbar-thumb{background:var(--silver);border-radius:2px;}
.sb-empty{text-align:center;padding:16px;color:var(--silver-d);font-size:10px;font-family:var(--font-d);}
.sb-bet{
  background:var(--bg-card2);border:1px solid var(--border);border-radius:6px;
  padding:6px 8px;margin-bottom:4px;
}
.sb-bet.back{border-left:3px solid var(--back);}
.sb-bet.lay{border-left:3px solid var(--lay);}
.sb-bet-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px;}
.sb-sel{font-family:var(--font-d);font-size:10px;font-weight:600;color:var(--slate-d);}
.sb-badge{font-size:7px;font-weight:700;padding:1px 5px;border-radius:3px;font-family:var(--font-d);text-transform:uppercase;}
.sb-badge.back{background:var(--back-bg2);color:var(--back);border:1px solid rgba(114,180,255,.3);}
.sb-badge.lay{background:var(--lay-bg2);color:var(--lay);border:1px solid rgba(247,160,184,.3);}
.sb-bet-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;}
.sb-label{display:block;font-size:7px;color:var(--silver);font-family:var(--font-d);text-transform:uppercase;}
.sb-val{display:block;font-size:10px;font-weight:700;font-family:var(--font-n);color:var(--slate-d);}
.sb-val.gold{color:var(--gold);}

/* ── MARKET ANALYTICS ── */
.sidebar-analytics{
  background:var(--bg-card);border:1px solid var(--border);border-radius:10px;
  overflow:hidden;margin-top:8px;
}
.sa-head{
  display:flex;align-items:center;padding:8px 12px;
  background:var(--bg-card2);border-bottom:1px solid var(--border);
}
.sa-title{font-family:var(--font-d);font-size:10px;font-weight:700;color:var(--gold);text-transform:uppercase;letter-spacing:.5px;}
.sa-title i{margin-right:5px;}
.sa-body{padding:8px;}
.sa-section{margin-bottom:8px;}
.sa-section:last-child{margin-bottom:0;}
.sa-section-title{font-family:var(--font-d);font-size:9px;font-weight:600;color:var(--silver-d);text-transform:uppercase;letter-spacing:.3px;margin-bottom:6px;}
.odds-tracker{min-height:60px;}
.odds-tracker .ot-row{
  display:flex;align-items:center;justify-content:space-between;gap:6px;
  padding:4px 6px;background:var(--bg-card2);border:1px solid var(--border);
  border-radius:5px;margin-bottom:3px;font-family:var(--font-d);font-size:10px;
}
.ot-name{flex:1;font-weight:600;color:var(--slate);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.ot-back{color:var(--back);font-weight:700;font-family:var(--font-n);font-size:11px;}
.ot-lay{color:var(--lay);font-weight:700;font-family:var(--font-n);font-size:11px;}
.ot-trend{font-size:9px;width:16px;text-align:center;}
.ot-trend.up{color:var(--green);}
.ot-trend.down{color:var(--red);}
.ot-trend.flat{color:var(--silver);}
.sa-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;}
.sa-stat{
  background:var(--bg-card2);border:1px solid var(--border);border-radius:5px;
  padding:6px;text-align:center;
}
.sa-stat-label{display:block;font-size:7px;color:var(--silver-d);font-family:var(--font-d);text-transform:uppercase;margin-bottom:2px;}
.sa-stat-val{display:block;font-size:11px;font-weight:700;font-family:var(--font-n);color:var(--slate-d);}

/* ── MOBILE BETS INDICATOR ── */
.dt-mobile-bets-indicator{
  display:none;padding:6px 12px;background:var(--bg-card2);border:1px solid var(--border);
  border-radius:8px;margin-top:6px;font-family:var(--font-d);font-size:10px;
  color:var(--gold);font-weight:600;
}
.dt-mobile-bets-indicator i{margin-right:5px;}
@media(max-width:991px){
  .dt-mobile-bets-indicator{display:flex;align-items:center;}
}

/* ──────────────────────────────────────────────────────────
   v2 CLEAN LOOK — Betfair-style pink/lay + blue/back tiles,
   20px radius, no lock overlays, no animated stripes.
   This block is loaded AFTER the legacy rules so it wins.
   ────────────────────────────────────────────────────────── */
:root{
  --bf-back:    #72bbef;   /* Betfair blue   */
  --bf-back-2:  #a6d8f4;   /* lighter tier   */
  --bf-back-3:  #d4ecfa;   /* lightest tier  */
  --bf-back-ink:#0a3a66;
  --bf-lay:     #faa9ba;   /* Betfair pink   */
  --bf-lay-2:   #fdc8d3;
  --bf-lay-3:   #fee5ea;
  --bf-lay-ink: #6b1a2e;
  --bf-radius:  20px;
}

/* Round + saturate the exchange tiles */
.odds-btn{
  border-radius:var(--bf-radius) !important;
  border:none !important;
  box-shadow:0 1px 0 rgba(0,0,0,.04), inset 0 -1px 0 rgba(0,0,0,.05);
  /* Smooth opacity + grayscale + filter changes when suspend / ball-running
     / closed flips on or off — avoids the harsh snap that the v1 CSS had. */
  transition:filter .25s ease, opacity .25s ease, transform .08s ease, background-color .25s ease;
}
.odds-btn .o-price{ color:var(--bf-back-ink) !important; font-weight:800; }
.odds-btn .o-size { color:rgba(10,58,102,.7) !important; }

.odds-btn.back, .odds-btn.back-1{ background:var(--bf-back)   !important; }
.odds-btn.back-2{ background:var(--bf-back-2) !important; }
.odds-btn.back-3{ background:var(--bf-back-3) !important; }
.odds-btn.back-4,
.odds-btn.back-5,
.odds-btn.back-6{ background:var(--bf-back-3) !important; opacity:.85; }

.odds-btn.lay,  .odds-btn.lay-1 { background:var(--bf-lay)    !important; }
.odds-btn.lay-2 { background:var(--bf-lay-2)  !important; }
.odds-btn.lay-3 { background:var(--bf-lay-3)  !important; }
.odds-btn.lay-4,
.odds-btn.lay-5,
.odds-btn.lay-6 { background:var(--bf-lay-3)  !important; opacity:.85; }

.odds-btn.lay-1 .o-price,
.odds-btn.lay-2 .o-price,
.odds-btn.lay-3 .o-price,
.odds-btn.lay   .o-price{ color:var(--bf-lay-ink) !important; }
.odds-btn.lay   .o-size,
.odds-btn.lay-1 .o-size,
.odds-btn.lay-2 .o-size,
.odds-btn.lay-3 .o-size{ color:rgba(107,26,46,.7) !important; }

.odds-btn:hover{ filter:brightness(1.05) saturate(1.05); transform:translateY(-1px); }
.odds-btn:active{ transform:scale(.96); }
.odds-btn.selected{
  outline:2px solid var(--gold);
  outline-offset:-2px;
  box-shadow:0 0 0 4px rgba(232,184,48,.18);
}

/* Match the same look on per-over cards and fancy buttons */
.over-card .odds-btn,
.over-card .odds-btn.back,
.over-card .odds-btn.lay{ border-radius:var(--bf-radius) !important; }
.fancy-odds-btn{
  border-radius:var(--bf-radius) !important;
  border:none !important;
}
.fancy-odds-btn.back{ background:var(--bf-lay)  !important; }
.fancy-odds-btn.lay { background:var(--bf-back) !important; }
.fancy-odds-btn.back .fo-price{ color:var(--bf-lay-ink)  !important; }
.fancy-odds-btn.lay  .fo-price{ color:var(--bf-back-ink) !important; }

/* ── Remove the lock-icon SVG overlay + animated stripes ── */
.mkt-status-overlay{ display:none !important; }
.market-block.mkt-suspended .rtable tbody,
.market-block.mkt-ball-running .rtable tbody{
  background:transparent !important;
  animation:none !important;
}
.market-block.mkt-suspended .mk-status-badge::before,
.market-block.mkt-suspended .mkt-status-banner::before,
.market-block.mkt-ball-running .mkt-status-banner::before,
.market-block.mkt-closed .mkt-status-banner::before{
  content:none !important;
}
.market-block.mkt-suspended .mk-status-badge,
.market-block.mkt-ball-running .mk-status-badge,
.market-block.mkt-closed .mk-status-badge{
  animation:none !important;
}
/* Subtle, single, non-animated cue: dim the tiles + show pill in title bar */
.market-block.mkt-suspended .odds-btn,
.market-block.mkt-ball-running .odds-btn,
.market-block.mkt-closed .odds-btn{
  pointer-events:none;
  opacity:.45;
  filter:grayscale(.45);
}
.market-block.mkt-suspended .mk-status-badge{
  background:rgba(251,191,36,.18);color:#b27d00;border:1px solid rgba(251,191,36,.4);
}
.market-block.mkt-ball-running .mk-status-badge{
  background:rgba(248,113,113,.18);color:#9c2626;border:1px solid rgba(248,113,113,.4);
}
.market-block.mkt-closed .mk-status-badge{
  background:rgba(122,138,173,.18);color:#5a6b8a;border:1px solid rgba(122,138,173,.35);
}
/* Kill the legacy stripe + pulse animations entirely */
.market-block.mkt-ball-running .mkt-status-banner,
.market-block.mkt-suspended    .mkt-status-banner,
.market-block.mkt-closed       .mkt-status-banner{
  animation:none !important;
  box-shadow:none !important;
}

/* ──────────────────────────────────────────────────────────
   ELCHAPO custom markets — gold accent so they stand out
   ────────────────────────────────────────────────────────── */
.market-block.is-custom,
.over-card.is-custom{
  position:relative;
  border:1px solid rgba(232,184,48,.45) !important;
  background:linear-gradient(180deg, rgba(232,184,48,.05), transparent 40%) !important;
  box-shadow:0 0 0 1px rgba(232,184,48,.18), 0 6px 22px rgba(0,0,0,.18);
  border-radius:14px;
  overflow:hidden;
}
.market-block.is-custom::before{
  content:'';
  position:absolute;left:0;top:0;bottom:0;width:3px;
  background:linear-gradient(180deg, var(--gold), #c98e1a);
}
.market-block.is-custom .mk-name::before{
  content:'★ ELCHAPO';
  display:inline-block;
  font-family:var(--font-d);font-size:9px;font-weight:800;
  letter-spacing:.6px;color:#1a1304;
  background:linear-gradient(135deg, var(--gold), #ffd86a);
  padding:2px 7px;border-radius:99px;margin-right:8px;
  vertical-align:middle;
}
.market-block.is-custom.elchapo-fancy .mk-name::before{ content:'★ ELCHAPO FANCY'; }
.market-block.is-custom.elchapo-bookmaker .mk-name::before{ content:'★ ELCHAPO BM'; }
.market-block.is-custom.elchapo-match_odds .mk-name::before{ content:'★ ELCHAPO ODDS'; }

.market-block.is-custom .odds-btn{
  border-radius:var(--bf-radius) !important;
}
.market-block.is-custom .odds-btn.back,
.market-block.is-custom .odds-btn.back-1{
  background:linear-gradient(180deg, #72bbef, #5aa9e5) !important;
}
.market-block.is-custom .odds-btn.lay,
.market-block.is-custom .odds-btn.lay-1{
  background:linear-gradient(180deg, #faa9ba, #f489a0) !important;
}

/* ── Fancy-row custom (dynamically injected Elchapo fancy markets) ── */
.fancy-row.is-custom{
  position:relative;
  border:1px solid rgba(232,184,48,.35);
  border-radius:10px;
  background:linear-gradient(90deg, rgba(232,184,48,.06), transparent 50%);
  margin-bottom:4px;
  padding-left:12px;
}
.fancy-row.is-custom::before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:3px;
  background:linear-gradient(180deg, var(--gold), #c98e1a);border-radius:3px 0 0 3px;
}
.fancy-row.is-custom .fancy-name::before{
  content:'★';display:inline-block;color:var(--gold);margin-right:4px;font-size:10px;
}

/* ── Bet delay countdown state ── */
.place-btn[data-mode="cancel"],
.rd-bs-place[data-mode="cancel"]{
  background:linear-gradient(135deg, #f87171, #dc2626) !important;
  animation:pulse-cancel .8s ease-in-out infinite alternate;
}
@keyframes pulse-cancel{
  from{ box-shadow:0 0 0 0 rgba(248,113,113,.5); }
  to  { box-shadow:0 0 0 8px rgba(248,113,113,0); }
}