/* ===== setinbet — Casino & Sportsbook theme (Bootstrap 5 skin) ===== */
:root{
  --bg:#06110b;
  --bg-grad:radial-gradient(120% 90% at 100% 0%, #0d2417 0%, #06110b 55%);
  --panel:#0f1d15;
  --panel-2:#0b1610;
  --sidebar:#08150e;
  --line:rgba(255,255,255,.06);
  --line-2:rgba(255,255,255,.1);
  --txt:#e8f0ea;
  --muted:#9bb0a3;
  --muted-2:#7e978a;
  --dim:#5f7368;
  --lime:#8cf03a;
  --lime-2:#9cf059;
  --green:#2fd06a;
  --grad:linear-gradient(135deg,#8cf03a,#2fd06a);
  --sb-w:236px;
  --top-h:62px;
  --r:14px;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg-grad);
  background-attachment:fixed;
  color:var(--txt);
  font-family:'Manrope',system-ui,sans-serif;
  min-height:100vh;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,.font-display{ font-family:'Sora',sans-serif; }
a{ text-decoration:none; color:inherit; }

::-webkit-scrollbar{width:10px;height:10px;}
::-webkit-scrollbar-track{background:#0a1812;}
::-webkit-scrollbar-thumb{background:#1c3326;border-radius:6px;}
::-webkit-scrollbar-thumb:hover{background:#2a4a36;}

@keyframes pulseDot{0%,100%{opacity:1;}50%{opacity:.3;}}
@keyframes floatY{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}

/* ---- helpers ---- */
.text-lime{ color:var(--lime-2)!important; }
.text-muted-2{ color:var(--muted-2)!important; }
.bg-panel{ background:var(--panel)!important; }
.bg-panel-2{ background:var(--panel-2)!important; }
.fw-800{ font-weight:800; }
.fw-700{ font-weight:700; }
.btn-grad{
  background:var(--grad); color:#06210f; border:none; font-family:'Sora',sans-serif; font-weight:800;
  box-shadow:0 4px 16px rgba(47,208,106,.35);
}
.btn-grad:hover{ color:#06210f; filter:brightness(1.05); }
.btn-ghost{
  background:rgba(255,255,255,.04); color:var(--txt); border:1px solid var(--line-2); font-family:'Sora',sans-serif; font-weight:700;
}
.btn-ghost:hover{ background:rgba(255,255,255,.08); color:var(--txt); }
.btn-lime-soft{
  background:rgba(140,240,58,.08); color:#bdf85f; border:1px solid rgba(140,240,58,.3); font-family:'Sora',sans-serif; font-weight:800;
}
.btn-lime-soft:hover{ color:#bdf85f; background:rgba(140,240,58,.14); }
.card-panel{ background:var(--panel); border:1px solid var(--line); border-radius:var(--r); }
.section-title{ font-size:18px; font-weight:800; margin:0; }
.eyebrow{ font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--muted-2); }
.icon{ width:18px; height:18px; flex:none; }

/* ---- layout shell ---- */
.app-main{
  margin-inline-start:var(--sb-w);
  padding:calc(var(--top-h) + 16px) 16px 90px;
  max-width:1340px;
}
@media (max-width:1079.98px){
  .app-main{ margin-inline-start:0; padding-bottom:86px; }
}

/* ---- sidebar ---- */
.sidebar{
  position:fixed; inset-block:0; inset-inline-start:0; width:var(--sb-w);
  background:var(--sidebar); border-inline-end:1px solid var(--line);
  z-index:1045; overflow-y:auto; padding:14px 12px 90px;
}
@media (max-width:1079.98px){
  .sidebar{ transform:translateX(-110%); transition:transform .25s ease; }
  .sidebar.open{ transform:translateX(0); }
}
.sb-backdrop{ position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:1040; backdrop-filter:blur(2px); display:none; }
.sb-backdrop.show{ display:block; }
.brand{ display:flex; align-items:center; gap:9px; padding:6px 6px 14px; cursor:pointer; }
.brand-mark{ width:34px;height:34px;border-radius:9px;background:var(--grad);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 14px rgba(47,208,106,.4); }
.brand-name{ font-family:'Sora',sans-serif; font-weight:800; font-size:19px; color:#fff; letter-spacing:-.02em; }
.sb-label{ font-size:10px; font-weight:700; letter-spacing:.14em; color:#566b5e; text-transform:uppercase; margin:18px 8px 8px; }
.sb-link{
  display:flex; align-items:center; gap:11px; padding:10px 12px; border-radius:10px;
  border:1px solid transparent; background:transparent; color:var(--muted); font-weight:600; font-size:14px;
  cursor:pointer; width:100%; text-align:start;
}
.sb-link:hover{ background:rgba(255,255,255,.04); color:var(--txt); }
.sb-link .icon{ color:#5f8a6f; }
.sb-link.active{
  background:linear-gradient(135deg, rgba(140,240,58,.16), rgba(47,208,106,.10));
  color:#bdf85f; border-color:rgba(140,240,58,.35);
}
.sb-link.active .icon{ color:#bdf85f; }

/* ---- topbar ---- */
.topbar{
  position:fixed; inset-block-start:0; inset-inline:0; height:var(--top-h);
  background:rgba(7,17,11,.82); backdrop-filter:blur(14px); border-bottom:1px solid var(--line);
  z-index:1030; display:flex; align-items:center; gap:14px;
  padding-inline:0 16px; padding-inline-start:var(--sb-w);
}
@media (max-width:1079.98px){ .topbar{ padding-inline-start:0; } }
.topbar .inner-left{ display:flex; align-items:center; gap:12px; flex:1; padding-inline-start:16px; }
.menu-btn{ display:none; width:38px;height:38px;border-radius:9px;border:1px solid var(--line-2);background:rgba(255,255,255,.03);color:#cfe0d5;align-items:center;justify-content:center;cursor:pointer; }
@media (max-width:1079.98px){ .menu-btn{ display:flex; } }
.search-box{ display:flex; align-items:center; gap:8px; flex:1; max-width:280px; background:rgba(255,255,255,.04); border:1px solid var(--line); border-radius:10px; padding:9px 12px; }
.search-box input{ flex:1; min-width:0; background:transparent; border:none; outline:none; color:var(--txt); font-size:13px; }
.pill-group{ display:flex; align-items:center; gap:6px; background:rgba(255,255,255,.04); border:1px solid var(--line); border-radius:11px; padding:4px; }
.pill{ display:flex; align-items:center; gap:6px; padding:8px 14px; border-radius:8px; border:none; background:transparent; color:#cfe0d5; font-family:'Sora',sans-serif; font-weight:700; font-size:13px; cursor:pointer; }
.pill:hover{ background:rgba(255,255,255,.06); }
.pill .icon{ color:var(--lime); width:16px;height:16px; }
@media (max-width:719.98px){ .search-box,.pill-group{ display:none; } }
.wallet-chip{ display:flex; align-items:center; gap:8px; background:rgba(255,255,255,.04); border:1px solid var(--line-2); border-radius:11px; padding:5px 5px; padding-inline-start:13px; }
.wallet-chip .bal{ text-align:end; line-height:1.1; }
.wallet-chip .bal .n{ font-family:'Sora',sans-serif; font-weight:800; font-size:14px; color:#fff; }
.wallet-chip .bal .c{ font-weight:600; font-size:9px; color:var(--muted-2); letter-spacing:.04em; }
@media (max-width:559.98px){ .wallet-chip .bal{ display:none; } }
.icon-btn{ width:38px;height:38px;border-radius:10px;border:1px solid var(--line-2);background:rgba(255,255,255,.03);color:#cfe0d5;display:flex;align-items:center;justify-content:center;cursor:pointer;position:relative; }
.avatar{ width:38px;height:38px;border-radius:10px;border:none;cursor:pointer;background:linear-gradient(135deg,#3aa46a,#2f7fb8);color:#fff;font-family:'Sora';font-weight:800;font-size:14px; }
.dot-badge{ position:absolute; top:8px; inset-inline-end:9px; width:7px;height:7px;border-radius:50%;background:#ff5252;box-shadow:0 0 0 2px #07110b; }
.dep-progress{ height:4px; border-radius:4px; overflow:hidden; background:var(--line); }
.dep-progress-bar{ height:100%; width:40%; border-radius:4px; background:var(--lime); animation:depbar 1s infinite linear; }
@keyframes depbar{ 0%{ margin-inline-start:-40% } 100%{ margin-inline-start:100% } }

/* ---- hero carousel ---- */
.hero-carousel .carousel-item{ height:clamp(200px,32vw,320px); border-radius:18px; overflow:hidden; }
.hero-slide{ height:100%; display:flex; align-items:center; padding:30px 34px; position:relative; }
.hero-slide .veil{ position:absolute; inset:0; background:radial-gradient(80% 120% at 12% 50%, rgba(0,0,0,.4), transparent 60%); }
.hero-slide .content{ position:relative; max-width:460px;padding:20px; }
.hero-carousel .carousel-indicators{ margin-bottom:8px; }
.hero-carousel .carousel-indicators [data-bs-target]{ width:9px;height:9px;border-radius:50%;border:none; }
.hero-coin{ position:absolute; inset-inline-start:38px; top:50%; transform:translateY(-50%); width:140px;height:140px;border-radius:50%;background:radial-gradient(circle at 35% 30%, #ffe8a3, #e8a33c 45%, #8a5a17);display:flex;align-items:center;justify-content:center;box-shadow:0 16px 40px rgba(0,0,0,.4), inset 0 0 0 8px rgba(255,255,255,.18);animation:floatY 5s ease-in-out infinite; }
.hero-coin span{ font-family:'Sora';font-weight:800;font-size:42px;color:#b3340f;text-shadow:0 2px 0 #fff3c4; }
@media (max-width:600px){ .hero-coin{ display:none; } }
.carousel-control-next, .carousel-control-prev{
  width:5%;
}
/* ---- section header + row carousels ---- */
.sec-head{ display:flex; align-items:center; gap:9px; margin:28px 0 13px; }
.sec-head .icon{ color:var(--lime); }
.car-nav{ display:flex; gap:7px; margin-inline-start:auto; }
.car-btn{ width:32px;height:32px;border-radius:9px;border:1px solid var(--line-2);background:var(--panel);color:#cfe0d5;display:flex;align-items:center;justify-content:center;cursor:pointer; }
.car-btn:hover{ color:var(--lime-2); border-color:rgba(140,240,58,.3); }
.row-scroll{ display:flex; gap:10px; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:6px; scrollbar-width:none; }
.row-scroll::-webkit-scrollbar{ height:0; width:0; display:none; }
.row-scroll > *{ scroll-snap-align:start; flex:0 0 var(--tile-w,160px); }

/* ---- game tile ---- */
.tile{ position:relative; aspect-ratio:3/4; border-radius:13px; overflow:hidden; cursor:pointer; box-shadow:0 6px 16px rgba(0,0,0,.4); transition:transform .18s ease, box-shadow .18s ease; }
.tile:hover{ transform:translateY(-5px); box-shadow:0 16px 32px rgba(0,0,0,.55); }
.tile .gloss{ position:absolute; inset:0; background:radial-gradient(120% 80% at 80% 0%, rgba(255,255,255,.18), transparent 55%); }
.tile .shade{ position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,.82) 0%, rgba(0,0,0,.12) 46%, transparent 72%); }
.tile .tag{ position:absolute; top:8px; inset-inline-start:8px; font-size:8px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.92); background:rgba(0,0,0,.32); padding:4px 6px; border-radius:5px; }
.tile .meta{ position:absolute; inset-inline:11px; bottom:11px; }
.tile .meta .nm{ font-family:'Sora';font-weight:800;font-size:13px;line-height:1.08;color:#fff;text-transform:uppercase;text-shadow:0 1px 3px rgba(0,0,0,.5); }
.tile .meta .pv{ font-weight:500;font-size:9px;color:rgba(255,255,255,.62);margin-top:5px; }

/* win tile (square) */
.win-tile{ position:relative; aspect-ratio:1/1.18; border-radius:12px; overflow:hidden; box-shadow:0 6px 16px rgba(0,0,0,.4); }
.win-tile .shade{ position:absolute; inset:0; background:linear-gradient(to top, rgba(0,0,0,.85), transparent 55%); }
.win-tile .meta{ position:absolute; inset-inline:9px; bottom:9px; }

/* crypto + provider cards */
.crypto-card{ flex:0 0 190px; }
.provider-card{ flex:0 0 150px; height:58px; display:flex; align-items:center; justify-content:center; font-family:'Sora'; font-weight:800; font-size:13px; color:#8da498; letter-spacing:.06em; }
.provider-card:hover{ color:var(--lime-2); border-color:rgba(140,240,58,.3); }

/* ---- match / odds ---- */
.team-badge{ width:22px;height:22px;border-radius:6px;color:#fff;font-family:'Sora';font-weight:800;font-size:9px;display:flex;align-items:center;justify-content:center;flex:none; }
.odd-btn{ flex:1; display:flex; flex-direction:column; align-items:center; gap:3px; padding:8px 4px; border-radius:9px; border:1px solid var(--line-2); background:#13241b; color:var(--txt); cursor:pointer; font-family:'Sora'; }
.odd-btn .lab{ font-size:9px; font-weight:600; opacity:.7; }
.odd-btn .val{ font-size:13px; font-weight:800; }
.odd-btn.active{ background:var(--grad); color:#06210f; border-color:transparent; }
.odd-btn:disabled{ background:#0c1812; color:#46584d; cursor:default; }

/* expandable markets */
.odd-expand{ display:flex; align-items:center; gap:6px; padding:8px 12px; border-radius:9px; border:1px solid var(--line-2); background:var(--panel-2); color:#cfe0d5; font-family:'Sora'; font-weight:700; font-size:12px; cursor:pointer; white-space:nowrap; }
.odd-expand:hover{ border-color:rgba(140,240,58,.3); color:var(--lime-2); }
.odd-expand .chev{ transition:transform .2s ease; }
.odd-expand.open{ border-color:rgba(140,240,58,.4); color:var(--lime-2); }
.odd-expand.open .chev{ transform:rotate(180deg); }
.match-markets{ margin-top:14px; padding-top:14px; border-top:1px solid var(--line); display:flex; flex-direction:column; gap:14px; }
.mk-group .mk-title{ font-size:11px; font-weight:700; letter-spacing:.04em; color:var(--muted-2); text-transform:uppercase; margin-bottom:7px; }
.mk-opts{ display:flex; flex-wrap:wrap; gap:8px; }
.mk-opts .odd-btn{ flex:1 1 80px; min-width:80px; }

/* ---- loading / spinner ---- */
@keyframes sbSpin{ to{ transform:rotate(360deg); } }
.sb-spinner{ display:inline-block; width:18px; height:18px; border:2px solid var(--line-2); border-top-color:var(--lime); border-radius:50%; animation:sbSpin .7s linear infinite; }
.sb-spinner.lg{ width:30px; height:30px; border-width:3px; }
.sb-loadbox{ display:flex; align-items:center; justify-content:center; gap:10px; padding:26px; color:var(--muted-2); font-size:13px; }
.mk-loading{ display:flex; align-items:center; justify-content:center; padding:20px; }
/* live-refresh pulse on the match list */
#sportMatches.is-refreshing{ position:relative; }
#sportMatches.is-refreshing::after{ content:""; position:absolute; inset:0; border-radius:14px; background:rgba(0,0,0,.04); pointer-events:none; }
.sb-refresh-dot{ position:fixed; z-index:40; bottom:18px; inset-inline-end:18px; display:none; align-items:center; gap:8px; padding:8px 13px; border-radius:999px; background:var(--panel); border:1px solid var(--line-2); color:var(--muted-2); font-size:12px; font-family:'Sora'; box-shadow:0 6px 20px rgba(0,0,0,.25); }
.sb-refresh-dot.show{ display:flex; }
/* search toggle + bar */
.sb-search-toggle{ flex:0 0 auto; width:40px; height:40px; padding:0; display:flex; align-items:center; justify-content:center; }
.sb-search-toggle.active{ border-color:rgba(140,240,58,.4); color:var(--lime-2); background:var(--grad); }
.sb-search-toggle.active svg{ color:#06210f; }

/* ---- categories chips ---- */
.chip{ display:flex; align-items:center; gap:8px; padding:10px 16px; border-radius:11px; border:1px solid var(--line-2); background:var(--panel); color:#cfe0d5; font-weight:600; font-size:13px; cursor:pointer; }
.chip:hover{ border-color:rgba(140,240,58,.35); color:var(--lime-2); }
.chip .icon{ color:#5f8a6f; width:16px;height:16px; }
.tab-pill{ padding:10px 18px; border-radius:11px; border:1px solid var(--line-2); background:var(--panel); color:#cfe0d5; font-family:'Sora'; font-weight:700; font-size:13px; cursor:pointer; }
.tab-pill.active{ background:var(--grad); color:#06210f; border-color:transparent; }

/* ---- bet slip ---- */
.betslip{ position:sticky; top:calc(var(--top-h) + 16px); }
@media (max-width:1079.98px){ .betslip{ position:static; } }

/* ---- modals (skin bootstrap) ---- */
.modal-content{ background:#0c1a12; border:1px solid var(--line-2); border-radius:18px; color:var(--txt); box-shadow:0 30px 80px rgba(0,0,0,.6); }
.modal-content .form-control{ background:var(--panel-2); border:1px solid var(--line-2); color:var(--txt); border-radius:10px; padding:12px 14px; }
.modal-content .form-control:focus{ background:var(--panel-2); border-color:rgba(140,240,58,.5); box-shadow:none; color:var(--txt); }
.modal-content .form-label{ font-size:12px; font-weight:600; color:var(--muted); }
.seg{ display:flex; gap:4px; background:var(--panel-2); border:1px solid var(--line); border-radius:11px; padding:4px; }
.seg button{ flex:1; padding:11px; border-radius:8px; border:none; cursor:pointer; font-family:'Sora'; font-weight:700; font-size:13px; background:transparent; color:var(--txt); display:flex; align-items:center; justify-content:center; gap:7px; }
.seg button.active{ background:var(--grad); color:#06210f; }
.coin-btn{ display:flex; align-items:center; gap:7px; padding:9px 13px; border-radius:10px; border:1px solid var(--line-2); background:var(--panel-2); color:var(--muted); cursor:pointer; font-family:'Sora'; font-weight:700; font-size:12px; }
.coin-btn .dot{ width:16px;height:16px;border-radius:50%;flex:none; }
.coin-btn.active{ border-color:rgba(140,240,58,.5); background:rgba(140,240,58,.1); color:var(--txt); }
.amount-box{ display:flex; align-items:center; gap:8px; background:var(--panel-2); border:1px solid var(--line-2); border-radius:11px; padding:14px; }
.amount-box input{ flex:1; min-width:0; background:transparent; border:none; outline:none; color:#fff; font-family:'Sora'; font-weight:800; font-size:20px; }
.quick{ flex:1; text-align:center; padding:9px; border-radius:9px; background:var(--panel-2); border:1px solid var(--line); font-family:'Sora'; font-weight:700; font-size:12px; color:#cfe0d5; cursor:pointer; }
.quick:hover{ border-color:rgba(140,240,58,.3); color:var(--lime-2); }

/* ---- footer ---- */
.footer{ margin-top:50px; padding-top:30px; border-top:1px solid var(--line); }
.footer .col-title{ font-family:'Sora'; font-weight:700; font-size:13px; color:var(--txt); margin-bottom:11px; }
.footer a{ color:var(--muted-2); font-size:12px; display:block; margin-bottom:8px; }
.footer a:hover{ color:var(--lime-2); }

/* ---- mobile bottom nav ---- */
.mobile-nav{ position:fixed; inset-block-end:0; inset-inline:0; height:62px; background:rgba(7,17,11,.95); backdrop-filter:blur(14px); border-top:1px solid var(--line); z-index:1035; display:none; align-items:center; justify-content:space-between; padding:0 6px; }
@media (max-width:1079.98px){ .mobile-nav{ display:flex; } }
.mn-btn{ flex:1 1 0; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; background:none; border:none; color:var(--muted); cursor:pointer; font-size:9px; font-weight:600; padding:0; }
.mn-btn svg{ width:21px; height:21px; }
.mn-fab{ width:40px;height:40px;border-radius:13px;background:var(--grad);color:#06210f;display:flex;align-items:center;justify-content:center;box-shadow:0 6px 16px rgba(47,208,106,.45);margin-top:-16px; }
.mn-fab svg{ width:22px; height:22px; }

/* badges / pills */
.live-badge{ display:inline-flex; align-items:center; gap:7px; padding:5px 10px; border-radius:8px; background:rgba(255,82,82,.14); color:#ff6b6b; font-family:'Sora'; font-weight:800; font-size:11px; letter-spacing:.04em; }
.live-dot{ width:7px;height:7px;border-radius:50%;background:#ff5252;animation:pulseDot 1.2s infinite; }
.status-pill{ padding:5px 10px; border-radius:7px; font-family:'Sora'; font-weight:700; font-size:11px; }

/* seo block */
.seo-more{ background:none; border:none; color:var(--lime-2); font-family:'Sora'; font-weight:700; font-size:13px; cursor:pointer; padding:0; margin-top:6px; }
.seo-extra{ display:none; }
.seo-extra.show{ display:block; }

@media (max-width:600px){ .row-scroll{ --tile-w:132px; } }
@media (max-width:600px){ .crypto-card{ flex:0 0 160px; } }