/* ==========================================================================
   JB theme — header, side nav, home page, footer, bottom bar.
   Tokens and sizes follow the reference design (dark neutral + green).
   Loaded after style.css and the admin color overrides.
   ========================================================================== */

html:root{
  --jb-p200:#ffc48a; --jb-p300:#ffae5b; --jb-p400:#ff9a33; --jb-p500:#ff8a14; --jb-p600:#ff7714;
  --jb-accent:#ffdf1a;
  --jb-n100:#ffffff; --jb-n200:#e2e6e9; --jb-n300:#8d9aa5; --jb-n400:#657381; --jb-n500:#576775;
  --jb-n600:#454745; --jb-n700:#303232; --jb-n800:#222424; --jb-n900:#141515; --jb-n1000:#000000;
  --jb-line:rgba(255,255,255,.1);
  --jb-line-2:rgba(255,255,255,.15);
  --jb-gap:8px;
  --jb-radius:3px;
  --jb-fs-small:10px; --jb-fs-normal:12px; --jb-fs-larger:14px; --jb-fs-h5:16px;
  --jb-rail:64px;
  --jb-rail-open:300px;
  --jb-content-max:1200px;
  --jb-bottombar-h:52px;
  --header-h:64px !important;
  --page-wrapper-bg:var(--jb-n900) !important;
  --page-content-bg:var(--jb-n900) !important;
  --footer-bg:var(--jb-n1000) !important;
}

html{background:var(--jb-n900)}
body{
  background:var(--jb-n900);
  font-family:Poppins,'Hind Siliguri','Helvetica Neue',Helvetica,Tahoma,Arial,sans-serif;
}
.page-wrapper{padding-top:var(--header-h) !important;background:var(--jb-n900)}
.page-content{background:var(--jb-n900)}
@media(max-width:780px){
  body.has-mobile-download-bar .page-wrapper{padding-top:calc(var(--header-h) + var(--mobile-download-bar-h)) !important;}
}

/* ── Header ──────────────────────────────────────────────────────────── */
.jb-header.header{
  display:flex;align-items:center;height:var(--header-h);padding:0 0 0 var(--jb-gap);
  background:var(--jb-n900);border-bottom:1px solid var(--jb-line);box-shadow:none;
}
.jb-header__head,.jb-header__body{display:flex;align-items:center;flex:none;height:100%}
.jb-header__body{margin-inline-start:auto}
.jb-hd-menu{
  display:flex;align-items:center;justify-content:center;flex:none;
  width:44px;height:44px;margin-inline-end:24px;padding:0;border:0;
  background:var(--jb-n700);border-radius:var(--jb-radius);cursor:pointer;transition:opacity .3s ease-in;
}
.jb-hd-menu:hover{opacity:.7}
.jb-hd-menu img{width:20px;height:20px;display:block}
.jb-hd-logo{display:flex;align-items:center;height:100%}
.jb-hd-logo img{height:48px;width:auto;display:block;transition:opacity .3s}
.jb-hd-logo:hover img{opacity:.7}
.jb-hd-links{display:flex;height:100%;margin-inline-start:32px}
.jb-hd-link{
  position:relative;display:flex;align-items:center;height:100%;padding:0 12px;
  color:var(--jb-n300);font-size:var(--jb-fs-normal);transition:opacity .5s;
}
.jb-hd-link:hover{opacity:.8}
.jb-hd-link img{width:20px;height:20px;display:block}
.jb-hd-link span{margin-inline-start:var(--jb-gap)}
.jb-hd-link:after{content:"";position:absolute;left:0;bottom:0;width:100%;height:3px;background:transparent;transition:background .5s}
.jb-hd-link--active:after{background:var(--jb-p500)}
.jb-hd-link--active{color:var(--jb-n200)}

.jb-hd-actions{display:flex;align-items:center;gap:4px}
.jb-btn{
  display:inline-flex;align-items:center;justify-content:center;position:relative;
  height:34px;padding:0 10px;min-width:90px;border-radius:var(--jb-radius);
  font-family:inherit;font-size:var(--jb-fs-larger);font-weight:500;line-height:1;text-align:center;
  border:1px solid transparent;cursor:pointer;transition:opacity .3s,background .3s;white-space:nowrap;
}
.jb-btn:hover{opacity:.7}
.jb-btn--primary{background:var(--jb-p500);color:var(--jb-n100)}
.jb-btn--tertiary{background:#454647;color:var(--jb-n200);border-color:#454647}
.jb-btn--secondary{background:var(--jb-n700);color:var(--jb-n200)}
.jb-btn--yellow{background:linear-gradient(180deg,#ffee58 0%,#e38a00 100%);color:var(--jb-n900);font-weight:600}

.jb-hd-lang{display:flex;align-items:center;justify-content:center;width:64px;height:64px;cursor:pointer;transition:opacity .5s}
.jb-hd-lang:hover{opacity:.8}
.jb-hd-lang .lang-toggle__btn{display:flex;align-items:center;justify-content:center;padding:0;border:0;background:none;width:100%;height:100%}
.jb-hd-lang .lang-toggle__flag{width:24px;height:24px;border-radius:50%;object-fit:cover;display:block}
.jb-hd-lang .lang-toggle__chev{display:none}

/* Logged-in bar */
.jb-header .hdr-user-bar{align-items:center;gap:6px;margin:0}
.jb-header .hdr-user-id{
  display:flex;align-items:center;height:34px;padding:0 10px;border-radius:var(--jb-radius);
  background:var(--jb-n800);color:var(--jb-n200);font-size:var(--jb-fs-normal);border:0;
}
.jb-header .hdr-balance{
  display:flex;align-items:center;gap:6px;height:34px;padding:0 6px 0 10px;border-radius:var(--jb-radius);
  background:var(--jb-n800);color:var(--jb-accent);font-size:var(--jb-fs-larger);font-weight:600;border:0;
}
.jb-header .hdr-balance-refresh{background:none;border:0;color:var(--jb-n300);padding:4px;font-size:12px}
.jb-header .hdr-notif-btn,
.jb-header .hdr-avatar-btn{
  width:34px !important;height:34px !important;border-radius:var(--jb-radius) !important;
  background:var(--jb-n800) !important;border:0 !important;
}
.jb-header .hdr-avatar-btn{display:flex;align-items:center;justify-content:center;padding:0}
.jb-header .hdr-avatar-dep-label{display:none}
.jb-header .hdr-notif-btn img,.jb-header .hdr-avatar-btn img{filter:brightness(0) invert(.75)}
.jb-header .btn-deposit.hdr-deposit-desktop{
  height:34px;padding:0 16px;border-radius:var(--jb-radius);border:0;
  background:var(--jb-p500);color:var(--jb-n100);font-size:var(--jb-fs-larger);font-weight:500;
}
.jb-header .hdr-history-mobile{display:none}
.jb-header .hdr-logout-btn{width:34px;height:34px;margin-inline-start:4px;border-radius:var(--jb-radius);background:var(--jb-n800);border:0;align-items:center;justify-content:center}
.jb-header .hdr-logout-btn img{width:16px;height:16px;filter:brightness(0) invert(.75)}
.jb-header .hdr-profile-menu{top:calc(var(--header-h) - 4px)}

@media(max-width:1023px){
  .jb-hd-links{display:none}
  .jb-hd-menu{width:36px;height:36px;margin-inline-end:10px}
  .jb-hd-logo img{height:40px}
}
@media(max-width:780px){
  .jb-header.header{padding-left:6px}
  .jb-hd-actions .jb-btn{min-width:0;width:93px;height:35px;font-size:14.5px}
  .jb-hd-lang{width:48px}
  .jb-header .hdr-user-id,
  .jb-header .btn-deposit.hdr-deposit-desktop,
  .jb-header .hdr-logout-btn,
  .jb-header .hdr-avatar-btn--desktop{display:none !important}
  .jb-header .hdr-balance{height:30px;font-size:var(--jb-fs-normal)}
  .jb-header .hdr-notif-btn{width:30px !important;height:30px !important}
}

/* ── Side nav (desktop rail / mobile drawer) ─────────────────────────── */
.jb-sidenav-overlay{
  display:none;position:fixed;left:0;right:0;bottom:0;top:var(--header-h);z-index:998;
  background:rgba(20,21,21,.75);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
}
.jb-sidenav-overlay.open{display:block}
.jb-sidenav{
  position:fixed;left:0;top:var(--header-h);bottom:0;z-index:999;
  width:var(--jb-rail-open);max-width:85vw;
  display:flex;flex-direction:column;
  background:var(--jb-n900);border-right:1px solid var(--jb-line);
  transform:translateX(-100%);transition:transform .3s ease,width .3s ease;
  -webkit-user-select:none;user-select:none;
}
.jb-sidenav.open{transform:translateX(0)}
.jb-sidenav__head{flex:none;padding:calc(var(--jb-gap) * 2)}
.jb-sidenav__scroll{flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch}
.jb-sidenav__scroll::-webkit-scrollbar{width:0;height:0}
.jb-sidenav__section{padding-bottom:16px}
.jb-sidenav__section + .jb-sidenav__section{padding-top:16px;border-top:1px solid var(--jb-line-2)}

.jb-sm-chat{
  display:flex;align-items:center;gap:8px;width:max-content;max-width:100%;padding:8px 12px;border:0;
  background:var(--jb-n800);color:var(--jb-n100);border-radius:var(--jb-radius);
  font-family:inherit;font-size:var(--jb-fs-normal);cursor:pointer;white-space:nowrap;overflow:hidden;
}
.jb-sm-chat:hover{opacity:.7}
.jb-sm-chat img{width:20px;height:20px;flex:none}

.jb-sm-item{
  display:flex;align-items:center;height:52px;padding:0 16px;gap:15px;
  color:var(--jb-n300);font-size:var(--jb-fs-larger);cursor:pointer;white-space:nowrap;overflow:hidden;
  background:transparent;border:0;width:100%;font-family:inherit;text-align:left;transition:background .3s,color .3s;
}
.jb-sm-item:hover{background:var(--jb-n800);color:var(--jb-n200)}
.jb-sm-item--active{color:var(--jb-n200)}
.jb-sm-item__icon{flex:none;width:20px;height:20px;display:flex;align-items:center;justify-content:center;font-size:17px;color:var(--jb-n300)}
.jb-sm-item__icon img{width:20px;height:20px;display:block;object-fit:contain}
.jb-sm-item__icon img.jb-flag{border-radius:50%;object-fit:cover}
.jb-sm-item__title{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;transition:opacity .25s}
.jb-sm-item__ext{flex:none;font-size:11px;color:var(--jb-n300);transition:opacity .25s}

/* Logged-in profile / balance blocks (drawer only) */
.jb-sidenav .side-menu__profile{
  display:flex;align-items:center;gap:10px;margin:0 16px 12px;padding:10px 12px;
  background:var(--jb-n800);border-radius:var(--jb-radius);color:var(--jb-n200);
}
.jb-sidenav .side-menu__avatar{
  width:36px;height:36px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;
  background:var(--jb-p500);color:#fff;font-weight:700;font-size:13px;
}
.jb-sidenav .side-menu__profile-info{flex:1;min-width:0;font-size:var(--jb-fs-normal);line-height:1.4}
.jb-sidenav .side-menu__profile-label{color:var(--jb-n300);font-size:var(--jb-fs-small)}
.jb-sidenav .side-menu__profile-name{color:var(--jb-n100);font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jb-sidenav .side-menu__profile-id{color:var(--jb-n300);font-size:var(--jb-fs-small)}
.jb-sidenav .side-menu__balance-card{margin:0 16px 12px;padding:10px 12px;background:var(--jb-n800);border-radius:var(--jb-radius)}
.jb-sidenav .side-menu__balance-body{width:100%}
.jb-sidenav .side-menu__balance-row{display:flex;justify-content:space-between;font-size:var(--jb-fs-normal);line-height:1.8}
.jb-sidenav .side-menu__balance-label{color:var(--jb-n300)}
.jb-sidenav .side-menu__balance-val{color:var(--jb-accent);font-weight:600}
.jb-sidenav .side-menu__wager-val{color:var(--jb-n200)}

@media(min-width:1024px){
  body{padding-left:var(--jb-rail)}
  .jb-sidenav{transform:none;width:var(--jb-rail);max-width:none;box-shadow:4px 1px 5.3px #00000007,13.4px 3.4px 17.9px #0000000b,60px 15px 80px #00000012}
  .jb-sidenav:hover,.jb-sidenav.open{width:var(--jb-rail-open)}
  .jb-sidenav:not(:hover):not(.open) .jb-sm-item__title,
  .jb-sidenav:not(:hover):not(.open) .jb-sm-item__ext{opacity:0}
  .jb-sidenav:not(:hover):not(.open) .jb-sm-item{padding-left:22px}
  .jb-sidenav:not(:hover):not(.open) .jb-sm-chat{padding:8px 10px;width:40px}
  .jb-sidenav:not(:hover):not(.open) .jb-sm-chat span{opacity:0}
  .jb-sidenav:not(:hover):not(.open) .side-menu__profile,
  .jb-sidenav:not(:hover):not(.open) .side-menu__balance-card{display:none !important}
  .jb-sidenav-overlay{left:var(--jb-rail)}
  .bottom-nav{display:none !important}
}

/* ── Home page ───────────────────────────────────────────────────────── */
.jb-home{padding-bottom:calc(var(--jb-gap) * 2)}
.jb-home__body{max-width:calc(var(--jb-content-max) + var(--jb-gap) * 4);margin:0 auto;padding:0 calc(var(--jb-gap) * 2)}

/* Banner carousel */
.jb-banner{position:relative;overflow:hidden;-webkit-user-select:none;user-select:none}
.jb-banner__track{display:flex;transition:transform .6s cubic-bezier(.4,0,.2,1);will-change:transform}
.jb-banner__slide{flex:none;width:100%;display:block;cursor:pointer}
.jb-banner__slide img{display:block;width:100%;height:auto}
.jb-banner__nav{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:95%;max-width:1150px;height:30px;
  display:flex;justify-content:space-between;pointer-events:none;
}
.jb-banner__btn{
  pointer-events:auto;width:34px;height:30px;border:0;padding:0;border-radius:var(--jb-radius);
  background:var(--jb-n700);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:opacity .3s;
}
.jb-banner__btn:hover{opacity:.7}
.jb-banner__btn img{width:16px;height:16px}
.jb-banner__dots{display:flex;justify-content:center;align-items:center;gap:8px;position:absolute;left:0;right:0;bottom:10px}
.jb-banner__dot{width:12px;height:6px;border-radius:99px;background:var(--jb-n700);cursor:pointer;transition:width .5s,background-color .5s;border:0;padding:0}
.jb-banner__dot--active{width:24px;background:var(--jb-p500)}
@media(min-width:781px){
  /* Desktop: slides sit side by side at a fixed height with faded edges */
  .jb-banner__slide{width:auto;height:210px;margin-inline-end:var(--jb-gap)}
  .jb-banner__slide img{height:210px;width:auto;max-width:none}
  .jb-banner__viewport{
    -webkit-mask:linear-gradient(90deg,transparent 0%,#000 10%,#000 90%,transparent 100%);
            mask:linear-gradient(90deg,transparent 0%,#000 10%,#000 90%,transparent 100%);
  }
  .jb-banner__dots{display:none}
}
@media(max-width:780px){
  .jb-banner{padding:var(--jb-gap) calc(var(--jb-gap) * 2) 0}
  .jb-banner__viewport{overflow:hidden;border-radius:var(--jb-radius)}
  .jb-banner__nav{display:none}
  /* Dots over the bottom of the banner image, sized to the screen width */
  .jb-banner__dots{position:absolute;left:0;right:0;bottom:2.7vw;gap:2.1vw;margin:0;pointer-events:none}
  .jb-banner__dot{width:3.2vw;height:1.6vw;pointer-events:auto}
  .jb-banner__dot--active{width:6.4vw}
}

/* Marquee */
.jb-marquee{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:var(--jb-gap);padding:calc(var(--jb-gap) * 4) 0 calc(var(--jb-gap) * 2)}
.jb-marquee__icon{width:20px;height:20px;color:var(--jb-p500);display:flex;align-items:center;justify-content:center;font-size:15px}
.jb-marquee__content{overflow:hidden}
.jb-marquee__track{display:flex;width:max-content;animation:jbMarquee var(--jb-marquee-duration,40s) linear infinite}
.jb-marquee__content:hover .jb-marquee__track{animation-play-state:paused}
.jb-marquee__item{flex:none;padding-left:300px;white-space:nowrap;font-size:var(--jb-fs-larger);line-height:1.5;color:var(--jb-n200)}
.jb-marquee__item b{font-weight:700}
@keyframes jbMarquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(max-width:780px){.jb-marquee{padding:var(--jb-gap) 0}}

/* Mobile wallet strip (logged in) */
.jb-home #mobileBalanceBar .mob-home-wallet-row{gap:var(--jb-gap)}

/* Category nav */
.jb-mainnav{-webkit-user-select:none;user-select:none}
.jb-mainnav__cats{display:flex;align-items:flex-end;overflow-x:auto;overflow-y:hidden;scrollbar-width:none;touch-action:pan-x}
.jb-mainnav__cats::-webkit-scrollbar{display:none}
.jb-mainnav__cats-inner{display:inline-flex;gap:var(--jb-gap)}
.jb-mainnav__btn{
  position:relative;flex:none;display:flex;flex-direction:column;align-items:center;min-width:80px;
  padding:var(--jb-gap) 0;border:0;background:none;cursor:pointer;font-family:inherit;
  opacity:0;animation:jbFadeIn .75s forwards;
}
.jb-mainnav__btn:before{
  content:"";position:absolute;left:0;bottom:0;width:100%;min-width:80px;height:50px;z-index:0;
  border-radius:var(--jb-radius);background:var(--jb-n800);transition:background .4s,height .4s;
}
.jb-mainnav__btn--active:before{background:var(--jb-p500);height:56px}
.jb-mainnav__img{position:relative;z-index:2;top:-4px;width:50px;height:50px;display:flex;align-items:center;justify-content:center;transition:transform .4s}
.jb-mainnav__img img{width:40px;height:40px;display:block;object-fit:contain}
.jb-mainnav__btn--active .jb-mainnav__img{transform:translateY(-3px) scale(1.06)}
.jb-mainnav__text{position:relative;z-index:2;font-size:var(--jb-fs-larger);font-weight:600;color:var(--jb-n300);text-align:center;padding:0 8px;white-space:nowrap}
.jb-mainnav__btn--active .jb-mainnav__text{color:var(--jb-n100)}
@keyframes jbFadeIn{to{opacity:1}}

.jb-mainnav__panel{display:none;padding:var(--jb-gap) 0}
.jb-mainnav__panel--active{display:block;animation:jbFadeIn .4s both}
.jb-mainnav__panel--active{opacity:0}

.jb-games-banner{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:var(--jb-gap)}
.jb-games-banner__cell{position:relative;display:block;border-radius:var(--jb-radius);background:var(--jb-n800);overflow:hidden;cursor:pointer;transition:opacity .3s}
.jb-games-banner__cell:hover{opacity:.8}
.jb-games-banner__cell[hidden]{display:none}
.jb-games-banner__cell img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover}
.jb-games-banner__name{
  display:block;padding:6px 8px;font-size:var(--jb-fs-normal);color:var(--jb-n200);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:center;
}

.jb-games-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:var(--jb-gap)}
.jb-games-grid__cell{
  display:flex;align-items:center;height:50px;padding:0 15px;gap:15px;overflow:hidden;cursor:pointer;
  border-radius:var(--jb-radius);background:var(--jb-n800);transition:background .3s;
}
.jb-games-grid__cell:hover{background:var(--jb-n700)}
.jb-games-grid__icon{flex:none;width:30px;height:30px;border-radius:var(--jb-radius);overflow:hidden}
.jb-games-grid__icon img{display:block;width:100%;height:100%;object-fit:cover}
.jb-games-grid__cell--all .jb-games-grid__icon img{object-fit:contain}
.jb-games-grid__text{min-width:0;font-size:var(--jb-fs-larger);line-height:1.3;color:var(--jb-n300);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.jb-more{display:flex;justify-content:center;margin-top:20px}
.jb-more[hidden]{display:none}
.jb-more .jb-btn{height:48px;width:150px;font-weight:600}

@media(max-width:780px){
  .jb-mainnav__cats-inner{margin:0}
  .jb-games-banner{grid-template-columns:repeat(3,minmax(0,1fr))}
  /* phones: 6 games until "More" opens the Favourite list (pages/home.php adds .jb-games-banner--open) */
  .jb-games-banner:not(.jb-games-banner--open) .jb-games-banner__cell:nth-child(n+7){display:none}
  .jb-games-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .jb-mainnav__btn,.jb-mainnav__btn:before{min-width:72px}
}
@media(min-width:781px) and (max-width:1100px){
  .jb-games-banner{grid-template-columns:repeat(6,minmax(0,1fr))}
  .jb-games-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}

/* Labeled carousels (Providers / Events / Exclusive Games) */
.jb-lc{margin-top:calc(var(--jb-gap) * 2)}
.jb-lc__head{display:flex;align-items:center;padding-bottom:10px}
.jb-lc__head:before{content:"";display:block;width:4px;height:20px;border-radius:70px;background:var(--jb-p500);margin-inline-end:10px}
.jb-lc__title{margin:0;color:var(--jb-n100);font-size:var(--jb-fs-h5);font-weight:600}
.jb-lc__nav{display:flex;gap:var(--jb-gap);margin-inline-start:auto}
.jb-lc__btn{
  width:34px;height:34px;padding:0;border:0;border-radius:var(--jb-radius);background:var(--jb-n800);
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:opacity .3s;
}
.jb-lc__btn:hover{opacity:.7}
.jb-lc__btn img{width:15px;height:15px}
.jb-lc__btn:disabled{cursor:default;opacity:.4}
.jb-lc__track{
  display:flex;gap:var(--jb-gap);overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;
}
.jb-lc__track::-webkit-scrollbar{display:none}
.jb-lc__track > *{flex:none;scroll-snap-align:start}

.jb-provider{
  --jb-per:7; --jb-main:.8733;
  width:calc((100% * var(--jb-main) - var(--jb-gap) * (var(--jb-per) - 1)) / var(--jb-per));
  display:flex;align-items:center;padding:7.1%;padding:12px;gap:8px;
  background:var(--jb-n800);border-radius:var(--jb-radius);cursor:pointer;transition:background .3s;
}
.jb-provider:hover{background:var(--jb-n700)}
.jb-provider__img{width:39.3%;aspect-ratio:1/1;object-fit:cover;border-radius:var(--jb-radius);flex:none}
.jb-provider__text{margin-inline-start:auto;font-size:var(--jb-fs-larger);font-weight:600;line-height:1.3;color:var(--jb-n300);text-align:right;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}

.jb-event{
  --jb-per:3; --jb-main:.9508;
  width:calc((100% * var(--jb-main) - var(--jb-gap) * (var(--jb-per) - 1)) / var(--jb-per));
  display:block;border-radius:var(--jb-radius);overflow:hidden;background:var(--jb-n800);cursor:pointer;
}
.jb-event img{display:block;width:100%;aspect-ratio:2.0859/1;object-fit:cover;transition:opacity .3s}
.jb-event:hover img{opacity:.8}

.jb-fav{
  --jb-per:6; --jb-main:.915;
  width:calc((100% * var(--jb-main) - var(--jb-gap) * (var(--jb-per) - 1)) / var(--jb-per));
  display:block;border-radius:var(--jb-radius);overflow:hidden;background:var(--jb-n800);cursor:pointer;transition:opacity .3s;
}
.jb-fav:hover{opacity:.7}
.jb-fav__img{display:block;width:100%;aspect-ratio:1/1;object-fit:cover}
.jb-fav__info{padding:8px 10px 10px;min-height:calc(33% - 4px)}
.jb-fav__name{font-size:var(--jb-fs-larger);font-weight:600;color:var(--jb-n100);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jb-fav__prov{font-size:var(--jb-fs-normal);color:var(--jb-n300);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

@media(max-width:1100px){
  .jb-provider{--jb-per:5}
  .jb-fav{--jb-per:4}
}
@media(max-width:780px){
  .jb-provider{--jb-per:2.4;--jb-main:1}
  .jb-event{--jb-per:1.15;--jb-main:1}
  .jb-fav{--jb-per:2.6;--jb-main:1}
  .jb-lc__nav{display:none}
}

/* Floating social buttons sit above the bottom bar */
@media(max-width:1023px){
  .mob-social-fab-stack{bottom:calc(var(--jb-bottombar-h) + 16px) !important}
}

/* ── Footer ──────────────────────────────────────────────────────────── */
.jb-footer.footer{background:var(--jb-n1000);padding:0;margin:0;border:0;color:var(--jb-n400)}
.jb-footer__inner{max-width:calc(var(--jb-content-max) + var(--jb-gap) * 4);margin:0 auto;padding:0 calc(var(--jb-gap) * 2)}
.jb-footer a{color:inherit}

.jb-flinks{padding:10px 0;border-bottom:1px solid var(--jb-line-2)}
.jb-flinks__ul{display:flex;align-items:flex-start;margin:0;padding:0;list-style:none}
.jb-flinks__li{width:25%}
.jb-flinks__head{
  display:flex;align-items:center;justify-content:space-between;width:100%;padding:19px 0;border:0;background:none;
  font-family:inherit;font-size:var(--jb-fs-larger);color:var(--jb-n200);text-align:left;cursor:default;
}
.jb-flinks__arrow{display:none;width:12px;height:12px;transition:transform .3s;color:var(--jb-n400)}
.jb-flinks__item{
  display:flex;align-items:center;gap:6px;padding:10px 0;font-size:var(--jb-fs-larger);
  color:var(--jb-n400);cursor:pointer;transition:color .3s;background:none;border:0;font-family:inherit;text-align:left;
}
.jb-flinks__item:hover{color:var(--jb-n200)}
.jb-flinks__item i{font-size:10px;color:var(--jb-n400)}

.jb-flist{display:flex;flex-direction:column;width:100%;padding:20px 0 var(--jb-gap);border-bottom:1px solid var(--jb-line-2)}
.jb-flist__title{width:100%;margin-bottom:15px;font-size:var(--jb-fs-larger);font-weight:600;color:var(--jb-p300)}
.jb-flist__wrap{display:flex;flex-wrap:wrap;align-items:center;width:100%}
.jb-sponsor{display:flex;align-items:center;gap:var(--jb-gap);margin:0 calc(var(--jb-gap) * 2) var(--jb-gap) 0}
.jb-sponsor img{width:30px;height:30px;border-radius:50%;object-fit:cover;display:block;flex:none}
.jb-sponsor__name{font-size:var(--jb-fs-normal);color:var(--jb-n200);line-height:1.4}
.jb-sponsor__sub{font-size:var(--jb-fs-small);color:var(--jb-n400)}
.jb-ambassadors img{display:block;max-width:420px;width:100%;border-radius:var(--jb-radius)}

.jb-frow{display:flex;align-items:stretch;width:100%}
.jb-frow > .jb-flist{width:auto;flex:none}
.jb-frow > .jb-flist + .jb-flist{flex:1;padding-left:calc(var(--jb-gap) * 8)}
.jb-icons__item{display:inline-flex;align-items:center;margin:0 20px 5px 0}
.jb-icons__item img{height:30px;width:auto;max-width:110px;object-fit:contain;display:block}

.jb-social{display:flex;justify-content:center;flex-wrap:wrap;gap:calc(var(--jb-gap) * 3);width:100%;padding:20px 0;border-bottom:1px solid var(--jb-line-2)}
.jb-social a{
  width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  background:var(--jb-n700);color:var(--jb-n200);font-size:15px;transition:background .3s,color .3s;
}
.jb-social a:hover{background:var(--jb-p500);color:#fff}

.jb-showmore{position:relative;margin:var(--jb-gap) 0 25px}
.jb-showmore__inner{overflow:hidden;max-height:150px;transition:max-height .4s ease}
.jb-showmore--open .jb-showmore__inner{max-height:4000px}
.jb-showmore__ctrl{display:flex;justify-content:center;align-items:flex-end;padding-top:30px;position:absolute;left:0;right:0;bottom:0}
.jb-showmore__mask{position:absolute;inset:0;background:linear-gradient(to top,var(--jb-n1000) 20%,transparent 100%);pointer-events:none}
.jb-showmore--open .jb-showmore__ctrl{position:static}
.jb-showmore--open .jb-showmore__mask{display:none}
.jb-showmore__btn{position:relative;z-index:1;height:40px;padding:0 15px;border:0;border-radius:var(--jb-radius);background:var(--jb-n700);color:var(--jb-n200);font-family:inherit;font-size:var(--jb-fs-larger);cursor:pointer}
.jb-desc h3,.jb-desc .jb-desc__title{padding:var(--jb-gap) 0;margin:0;line-height:1.5;font-weight:600;font-size:var(--jb-fs-larger);color:var(--jb-n400)}
.jb-desc p{padding:var(--jb-gap) 0;margin:0;line-height:1.5;font-weight:300;font-size:var(--jb-fs-larger);color:var(--jb-n400);overflow-wrap:anywhere}

.jb-fbrand{display:flex;align-items:center;gap:calc(var(--jb-gap) * 2);padding:20px 0;border-top:1px solid var(--jb-line-2)}
.jb-fbrand__logo{width:78px;height:56px;flex:none;background:center/contain no-repeat}
.jb-fbrand__content{font-size:var(--jb-fs-normal);line-height:1.8em}
.jb-fbrand__subtitle{color:var(--jb-p500);font-weight:600}
.jb-fbrand__txt{margin:0;color:var(--jb-n400)}

@media(max-width:780px){
  .jb-footer__inner{padding:0 calc(var(--jb-gap) * 2) 12px}
  .jb-flinks{padding:0}
  .jb-flinks__ul{flex-direction:column}
  .jb-flinks__li{width:100%;border-bottom:1px solid var(--jb-line-2)}
  .jb-flinks__li:last-child{border-bottom:0}
  /* Footer link groups on phones: spacing scales with the screen, bigger chevron, dim on tap */
  .jb-flinks{padding:2.7vw 0}
  .jb-flinks__head{cursor:pointer;padding:5vw 0;font-size:var(--jb-fs-larger);line-height:1.3;color:var(--jb-n400);transition:color .3s,opacity .2s}
  .jb-flinks__head:active{opacity:.7}
  .jb-flinks__arrow{display:block;flex:none;width:5.3vw;height:5.3vw;min-width:18px;min-height:18px;color:var(--jb-n400);transition:transform .3s,color .3s}
  .jb-flinks__body{display:none;padding:0 2.7vw 2.7vw}
  .jb-flinks__item{padding:2.7vw 0;font-size:var(--jb-fs-larger);line-height:1.4}
  .jb-flinks__li--open .jb-flinks__head{color:var(--jb-n200)}
  .jb-flinks__li--open .jb-flinks__arrow{transform:rotate(180deg);color:var(--jb-n200)}
  .jb-flinks__li--open .jb-flinks__body{display:block}
  .jb-sponsor{width:calc(50% - 8px);margin-right:8px}
  .jb-frow{flex-direction:column}
  .jb-frow > .jb-flist,.jb-frow > .jb-flist + .jb-flist{width:100%;padding-left:0}
}

/* ── Live matches panel (reference match-odds widget) ────────────────── */
.jb-odds{display:flex;margin-top:calc(var(--jb-gap) * 3);border-radius:var(--jb-radius);overflow:hidden;background:linear-gradient(#333 0 143px,#1e1e1e 143px);color:#fff}
.jb-odds[hidden]{display:none}
.jb-odds a,.jb-odds a:hover{text-decoration:none}
.jb-odds__sports{flex:none;display:flex;flex-direction:column;gap:12px;width:110px;padding:64px 0 0 18px;background:#1e1e1e;border-radius:0 34px 0 0}
.jb-odds__sport{display:flex;align-items:center;gap:8px;height:28px;font-size:12px;text-transform:uppercase;color:#8f8f8f;transition:color .2s}
.jb-odds__sport i{width:20px;font-size:19px;text-align:center}
.jb-odds__sport svg{flex:none;width:20px;height:20px}
.jb-odds__tools{display:none}
.jb-odds__sport:hover,.jb-odds__sport--active{color:#fff}
.jb-odds__main{flex:1;min-width:0;padding:8px 10px 0 13px}
.jb-odds__bar{display:flex;align-items:center;justify-content:space-between;height:34px;margin-bottom:8px}
.jb-odds__all{display:flex;align-items:center;height:30px;padding:0 17px;border-radius:15px;background:#f2f2f2;color:#1e1e1e;font-size:13px}
.jb-odds__date{display:flex;align-items:center;gap:12px;height:30px;padding:0 10px 0 12px;border:1px solid #6b6b6b;border-radius:15px;color:#e6e6e6;font-size:13px}
.jb-odds__date i{font-size:13px;color:#bdbdbd}
.jb-odds__track{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.jb-odds__track::-webkit-scrollbar{display:none}
.jb-odds__item{flex:none;width:262px;display:flex;flex-direction:column;scroll-snap-align:start;color:#fff}
.jb-odds__card{display:flex;flex-direction:column;height:93px;border-radius:10px 10px 0 0;background:#1e1e1e;overflow:hidden}
.jb-odds__head{display:flex;flex:none;height:17px;font-size:9.5px;line-height:17px}
.jb-odds__comp{flex:1;min-width:0;display:flex;align-items:center;gap:6px;padding:0 9px;border-radius:10px 0 14px 0;background:#1d2ab8;font-weight:500;white-space:nowrap;overflow:hidden}
.jb-odds__comp i{flex:none;width:1px;height:10px;background:rgba(255,255,255,.55)}
.jb-odds__series{flex:none;max-width:55%;overflow:hidden;text-overflow:ellipsis}
.jb-odds__match{min-width:0;overflow:hidden;text-overflow:ellipsis}
.jb-odds__live{flex:none;display:flex;align-items:center;gap:4px;padding:0 8px 0 7px;color:#22c58b;font-weight:500}
.jb-odds__live:before{content:"";width:5px;height:5px;border-radius:50%;background:#22c58b}
.jb-odds__team{display:flex;align-items:center;gap:8px;height:23px;padding:0 8px}
.jb-odds__logo,.jb-odds__flag{flex:none;width:14px;height:14px;border-radius:50%;object-fit:contain}
.jb-odds__flag{display:flex;align-items:center;justify-content:center;background:#3a3a3a;color:#e6e6e6;font-size:8px;font-weight:700}
.jb-odds__name{flex:1;min-width:0;font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jb-odds__score{flex:none;font-size:13px;font-weight:700}
.jb-odds__foot{display:flex;align-items:flex-end;flex:1;min-height:0;box-shadow:inset 0 -1px 0 #3a3a3a}
.jb-odds__time{flex:1;min-width:0;padding:0 0 5px 8px;font-size:12px;color:#b5bbff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jb-odds__mk{flex:none;display:flex;align-items:center;gap:6px;height:24px;padding:0 9px 0 20px;border:1px solid #3a3a3a;border-width:1px 0 0 1px;border-radius:18px 0 0 0;background:#1e1e1e}
.jb-odds__mb{display:flex;align-items:center;justify-content:center;width:15px;height:15px;border-radius:3px;background:#a8890b;font-size:10px;font-weight:700;color:#fff}
.jb-odds__mk i{margin-left:4px;font-size:12px;color:#e6e6e6}
.jb-odds__market{display:flex;gap:5px;height:67px;padding-top:8px}
.jb-odds__tag{flex:none;display:flex;align-items:center;justify-content:center;width:14px;height:46px;border-radius:2px;background:#9a7d00;font-size:10px;font-weight:700;color:#fff}
.jb-odds__mbody{min-width:0}
.jb-odds__mname{margin:0 0 4px 1px;font-size:10px;line-height:12px;color:#e6e6e6}
.jb-odds__prices{display:flex;gap:6px}
.jb-odds__runner{display:flex;border:1px solid #5a5a5a;border-radius:3px;overflow:hidden}
.jb-odds__back,.jb-odds__lay{display:flex;align-items:center;justify-content:center;width:48px;height:28px;font-size:11px;font-weight:700;color:#1e1e1e}
.jb-odds__back{background:#69b4ea}
.jb-odds__lay{background:#f9a2b4;border-left:1px solid #5a5a5a}
.jb-odds__item:hover .jb-odds__card{background:#232323}
@media(max-width:780px){
  .jb-odds{flex-direction:column;background:#1e1e1e}
  /* Top band: light #333 strip with a dark S-curved corner on the left (reference mobile widget) */
  .jb-odds__sports{position:relative;flex-direction:row;align-items:center;gap:18px;width:auto;height:38px;padding:0 10px 0 91px;background:#333;border-radius:0}
  .jb-odds__sports:before{content:"";position:absolute;left:0;top:0;bottom:0;width:98px;background:#1e1e1e}
  .jb-odds__sports:after{content:"";position:absolute;left:66px;top:0;bottom:0;width:40px;background:#333;border-radius:0 0 0 30px / 0 0 0 38px}
  .jb-odds__sport{position:relative;z-index:1;gap:6px;height:auto;font-size:15px;color:#a7a3a3}
  .jb-odds__sport--active{color:#f2f2f2}
  .jb-odds__sport:not(.jb-odds__sport--active) span{display:none}
  .jb-odds__sport i{width:20px;font-size:20px}
  .jb-odds__tools{position:relative;z-index:1;display:flex;gap:10px;margin-left:auto}
  .jb-odds__tools a{display:flex;align-items:center;justify-content:center;width:20px;height:20px;border-radius:50%;background:#a29e9e;color:#121212;font-size:10px}
  .jb-odds__bar{display:none}
  .jb-odds__main{padding:4px 0 0 10px;background:#1e1e1e}
  .jb-odds__track{gap:10px;padding-right:10px}
  .jb-odds__card{height:96px}
  .jb-odds__head{height:18px;font-size:10px;line-height:18px}
  .jb-odds__team{height:24px}
  .jb-odds__name{font-size:14px}
  .jb-odds__score{font-size:16px}
  .jb-odds__time{font-size:13px}
  .jb-odds__mb{width:16px;height:16px;font-size:11px}
  .jb-odds__market{height:70px}
  .jb-odds__mname{font-size:12px;line-height:14px}
  .jb-odds__back,.jb-odds__lay{font-size:13px}
  .jb-odds__item:hover .jb-odds__card{background:#1e1e1e}
}

/* ── Game tiles: tall, image-only (as on the reference) ──────────────── */
.jb-games-banner__cell img{aspect-ratio:143/190;object-fit:cover}
.jb-games-banner__name,
.jb-fav__info{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.jb-fav{position:relative}
.jb-fav__img{aspect-ratio:146/194;object-fit:cover}


/* ── Bottom bar (mobile) — reference: 4 buttons logged out, 5 logged in ─ */
.jb-bottombar.bottom-nav{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:1001;
  height:auto;min-height:0;padding:0 0 env(safe-area-inset-bottom,0px);
  background:var(--jb-n800);border-top:1px solid var(--jb-line-2);box-shadow:none;border-radius:0;
}
.jb-bb-row{width:100%;height:var(--jb-bottombar-h)}
.jb-bb-btn{
  position:relative;flex:1 1 0;min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;
  color:var(--jb-n300);border-top:2px solid transparent;text-decoration:none;-webkit-tap-highlight-color:transparent;
}
.jb-bb-btn:before{
  content:"";position:absolute;inset:0;z-index:1;opacity:0;transition:opacity .6s;
  background:linear-gradient(to top,#24313c,rgba(255,138,20,.4) 100%);
}
.jb-bb-btn--active{color:var(--jb-n200);border-top-color:var(--jb-p500)}
.jb-bb-btn--active:before{opacity:1;transition:none}
.jb-bb-btn__visual{position:relative;z-index:2;display:block}
.jb-bb-btn__img{display:block;width:21px;height:21px}
.jb-bb-btn__img--on{display:none}
.jb-bb-btn--active .jb-bb-btn__img--off{display:none}
.jb-bb-btn--active .jb-bb-btn__img--on{display:block}
.jb-bb-btn__text{position:relative;z-index:2;display:block;margin-top:3px;font-size:12.5px;line-height:1.2;text-align:center;white-space:nowrap}
.jb-bb-btn__badge{
  position:absolute;top:6px;right:calc(50% - 10px);z-index:4;transform:translate(80%,-25%);
  min-width:21px;height:21px;line-height:22px;padding:0;border-radius:70px;
  background:#e20000;color:var(--jb-n200);font-size:12px;font-weight:600;text-align:center;
}
.jb-bb-btn__badge--more{padding:0 5px;width:auto}
.jb-bb-btn__badge[hidden]{display:none}

@media(max-width:1023px){
  .jb-bottombar.bottom-nav{display:block}
  /* Menu lives in the bottom bar on phones/tablets, as on the reference */
  .jb-hd-menu{display:none}
  .jb-header.header{padding-left:16px}
  /* Side menu stops above the bottom bar so it stays usable */
  .jb-sidenav{bottom:calc(var(--jb-bottombar-h) + env(safe-area-inset-bottom,0px))}
  .jb-sidenav-overlay{bottom:calc(var(--jb-bottombar-h) + env(safe-area-inset-bottom,0px))}
  body{padding-bottom:calc(var(--jb-bottombar-h) + env(safe-area-inset-bottom,0px))}
}

/* ── Footer social: brand-coloured round icons, left aligned ─────────── */
.jb-social{justify-content:flex-start;gap:24px}
.jb-social a{width:30px;height:30px;font-size:15px;color:#fff;background:#3a3c3d}
.jb-social a:hover{filter:brightness(1.12);background:inherit}
.jb-social a.jb-social__facebook{background:#1877f2}
.jb-social a.jb-social__instagram{background:radial-gradient(circle at 30% 107%,#fdf497 0%,#fd5949 45%,#d6249f 60%,#285aeb 90%)}
.jb-social a.jb-social__twitter{background:transparent;font-size:19px}
.jb-social a.jb-social__youtube{background:#ff0000}
.jb-social a.jb-social__telegram{background:#2aabee}
.jb-social a.jb-social__whatsapp{background:#25d366;font-size:17px}
.jb-flist__title{color:var(--jb-p500)}

/* ── Sponsor badge rotating beside the logo (slides left every 3s) ───── */
.jb-hd-sponsor{position:relative;flex:none;width:30px;height:30px;margin:0 16px 0 32px;overflow:hidden;-webkit-user-select:none;user-select:none}
.jb-hd-sponsor__img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;border-radius:50%;transform:translateX(100%);opacity:0;transition:transform .6s ease,opacity .6s ease}
.jb-hd-sponsor__img--on{transform:none;opacity:1}
.jb-hd-sponsor__img--out{transform:translateX(-100%);opacity:0}
@media(max-width:1023px){.jb-hd-sponsor{width:31px;height:31px;margin:0 8px 0 10px}}
@media(max-width:420px){
  .jb-hd-sponsor{width:28px;height:28px;margin:0 6px 0 6px}
  .jb-hd-logo img{height:34px}
  .jb-hd-actions .jb-btn{width:80px;font-size:13.5px}
  .jb-hd-lang{width:40px}
}

/* ── Side menu: reference mobile menu layout ─────────────────────────── */
.jb-sidenav__head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.jb-sm-close{display:none;width:44px;height:37px;border:0;border-radius:var(--jb-radius);background:var(--jb-n800);cursor:pointer;align-items:center;justify-content:center}
.jb-sm-close .jb-sm-mask{display:block;width:22px;height:22px;background:var(--jb-n200)}
.jb-sm-mask{
  display:inline-block;background:var(--jb-n300);
  -webkit-mask:var(--m) center/contain no-repeat;mask:var(--m) center/contain no-repeat;
}
.jb-sm-item__icon.jb-sm-mask{width:20px;height:20px}
.jb-sm-item--active .jb-sm-mask{background:var(--jb-n200)}
.jb-sm-item__ext.jb-sm-mask{width:18px;height:18px;margin-left:auto}
.jb-sm-item{height:54px;padding:0 16.6px;font-size:14.5px}
.jb-sm-item__icon img{object-fit:contain}
.jb-sm-banner{display:block;margin:0 16px 16px;border-radius:var(--jb-radius);overflow:hidden}
.jb-sm-banner img{display:block;width:100%;aspect-ratio:3.8111;object-fit:cover}

.jb-sm-collapse__head{cursor:pointer}
.jb-sm-collapse__head .jb-sm-item__title{flex:1}
.jb-sm-viewall{margin-left:auto;margin-right:12px;font-size:13px;color:var(--jb-p500);text-decoration:underline}
.jb-sm-arrow{flex:none;width:20px;height:20px;background:var(--jb-n300);transition:transform .3s;
  -webkit-mask:url(/assets/jb/menu/arrow-down.svg) center/contain no-repeat;mask:url(/assets/jb/menu/arrow-down.svg) center/contain no-repeat}
.jb-sm-collapse__body{display:none}
.jb-sm-collapse--open > .jb-sm-collapse__body{display:block;animation:jbFadeIn .3s both}
.jb-sm-collapse--open > .jb-sm-collapse__head .jb-sm-arrow{transform:rotate(180deg);background:var(--jb-n200)}
.jb-sm-collapse--open > .jb-sm-collapse__head .jb-sm-item__title{color:var(--jb-n200)}

.jb-sm-promos{display:flex;gap:8px;overflow-x:auto;padding:16px;background:#222424;scroll-snap-type:x mandatory}
.jb-sm-promos a{flex:none;width:216px;border-radius:var(--jb-radius);overflow:hidden;scroll-snap-align:start}
.jb-sm-promos img{display:block;width:100%;aspect-ratio:216/103;object-fit:cover}

.jb-sm-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:4px 16.6px 16px}
.jb-sm-grid__cell{display:flex;align-items:center;gap:12px;height:52px;padding:0 15.6px;border-radius:var(--jb-radius);background:var(--jb-n800);color:var(--jb-n200);font-size:14px;overflow:hidden;transition:background .2s}
.jb-sm-grid__cell:hover{background:var(--jb-n700)}
.jb-sm-grid__icon{flex:none;width:28px;height:28px;border-radius:var(--jb-radius);overflow:hidden;display:flex;align-items:center;justify-content:center}
.jb-sm-grid__icon img{width:100%;height:100%;object-fit:cover}
.jb-sm-grid__cell--all .jb-sm-grid__icon img{object-fit:contain}
.jb-sm-grid__icon--fa{font-size:20px;color:var(--jb-p500)}
.jb-sm-grid__text{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Collapsed desktop rail: hide extras, keep icons only */
@media(min-width:1024px){
  .jb-sidenav:not(:hover):not(.open) .jb-sm-banner,
  .jb-sidenav:not(:hover):not(.open) .jb-sm-collapse__body,
  .jb-sidenav:not(:hover):not(.open) .jb-sm-viewall,
  .jb-sidenav:not(:hover):not(.open) .jb-sm-arrow{display:none}
}
/* Phones/tablets: full-width menu between header and bottom bar, with close button */
@media(max-width:1023px){
  .jb-sidenav{width:100%;max-width:none;border-right:0}
  .jb-sm-close{display:flex}
  .jb-sidenav__head{padding:12px 16px}
}

/* ── Games page (reference: toolbar · search · tall tiles · Load more) ─ */
.jbg{max-width:calc(var(--jb-content-max) + var(--jb-gap) * 4);margin:0 auto;padding:40px calc(var(--jb-gap) * 2) 30px}
.jbg-toolbar{display:flex;align-items:center;justify-content:space-between;height:62px}
.jbg-toolbar__head{display:flex;align-items:center;gap:8px;cursor:pointer;-webkit-user-select:none;user-select:none}
.jbg-toolbar__icon{width:21px;height:21px}
.jbg-toolbar__title{font-size:20px;font-weight:600;color:var(--jb-n200)}
.jbg-toolbar__arrow{display:inline-block;width:21px;height:21px;background:var(--jb-n200);
  -webkit-mask:url(/assets/jb/menu/arrow-down.svg) center/contain no-repeat;mask:url(/assets/jb/menu/arrow-down.svg) center/contain no-repeat}
.jbg-toolbar__tools{display:flex}
.jbg-tool{position:relative;width:52px;height:62px;border:0;background:none;color:var(--jb-n300);font-size:19px;cursor:pointer}
.jbg-tool:hover{color:var(--jb-n200)}
.jbg-tool__dot{position:absolute;top:18px;right:12px;width:7px;height:7px;border-radius:50%;background:var(--jb-p500)}
.jbg-tool__dot[hidden]{display:none}
.jbg-tool--search{display:none}
.jbg-search{display:flex;align-items:center;gap:12px;height:50px;padding:0 16px;margin-bottom:16px;border-radius:var(--jb-radius);background:var(--jb-n800);color:var(--jb-n200)}
.jbg-search i{font-size:17px}
.jbg-search input{flex:1;min-width:0;height:100%;border:0;outline:0;background:none;color:var(--jb-n200);font-family:inherit;font-size:14px}
.jbg-search input::placeholder{color:var(--jb-n400)}
.jbg-search__clear{border:0;background:none;color:var(--jb-n300);font-size:22px;cursor:pointer}
.jbg-search__clear[hidden]{display:none}
.jbg-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px}
.jbg-tile{position:relative;display:block;border-radius:var(--jb-radius);overflow:hidden;background:var(--jb-n800);aspect-ratio:139/185;transition:transform .2s}
.jbg-tile:hover{transform:translateY(-3px)}
.jbg-tile img{display:block;width:100%;height:100%;object-fit:cover}
.jbg-tile__name{position:absolute;left:0;right:0;bottom:0;padding:18px 6px 6px;font-size:11px;font-weight:600;color:#fff;text-align:center;
  background:linear-gradient(transparent,rgba(0,0,0,.75));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.jbg-empty{padding:60px 0;text-align:center;color:var(--jb-n300)}
.jbg-empty i{font-size:40px;margin-bottom:10px}
.jbg-empty[hidden],.jbg-more[hidden],.jbg-more__btn[hidden]{display:none}
.jbg-more{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:40px}
.jbg-more__btn{height:40px;padding:0 24px;border:0;border-radius:var(--jb-radius);background:var(--jb-n700);color:var(--jb-n200);font-family:inherit;font-size:14px;cursor:pointer}
.jbg-more__btn:hover{background:#3a3c3c}
.jbg-more__bar{width:203px;height:4px;border-radius:4px;background:var(--jb-n700);overflow:hidden}
.jbg-more__bar span{display:block;height:100%;background:var(--jb-n300);transition:width .3s}
.jbg-more__txt{font-size:14px;color:var(--jb-n300)}
.jbg-more__txt b{font-weight:400}
.jbg-provgrid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.jbg-prov{display:flex;align-items:center;gap:12px;height:60px;padding:0 14px;border-radius:var(--jb-radius);background:var(--jb-n800);color:var(--jb-n300);font-size:14px;font-weight:600;overflow:hidden}
.jbg-prov img{width:34px;height:34px;border-radius:var(--jb-radius);object-fit:cover;flex:none}
.jbg-prov span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* Sheets (category picker, filter, sort) */
.jbg-sheet{position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(0,0,0,.6)}
.jbg-sheet[hidden]{display:none}
.jbg-sheet__box{display:flex;flex-direction:column;width:min(480px,100%);max-height:85vh;border-radius:6px;background:var(--jb-n900);overflow:hidden;animation:jbFadeIn .25s both}
.jbg-sheet__head{display:flex;align-items:center;justify-content:space-between;padding:16px;border-bottom:1px solid var(--jb-line-2)}
.jbg-sheet__head b{font-size:18px;color:var(--jb-n100)}
.jbg-sheet__head button{border:0;background:none;color:var(--jb-n200);font-size:30px;line-height:1;cursor:pointer}
.jbg-sheet__body{flex:1;overflow-y:auto}
.jbg-sheet__foot{display:flex;gap:16px;padding:16px;border-top:1px solid var(--jb-line-2)}
.jbg-btn{height:50px;border:0;border-radius:var(--jb-radius);font-family:inherit;font-size:15px;cursor:pointer}
.jbg-btn--grey{flex:0 0 40%;background:#454647;color:var(--jb-n200)}
.jbg-btn--primary{flex:1;background:var(--jb-p500);color:#fff}
.jbg-cats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:16px}
.jbg-cat{display:flex;align-items:center;gap:10px;height:50px;padding:0 14px;border-radius:var(--jb-radius);background:var(--jb-n800);color:var(--jb-n300);font-size:14px}
.jbg-cat img{width:24px;height:24px}
.jbg-cat--active{background:var(--jb-p500);color:#fff}
.jbg-acc__head{display:flex;align-items:center;justify-content:space-between;width:100%;height:88px;padding:0 32px;border:0;border-bottom:1px solid var(--jb-line-2);background:none;color:var(--jb-n200);font-family:inherit;font-size:15px;cursor:pointer}
.jbg-acc__head .jbg-toolbar__arrow{transition:transform .3s}
.jbg-acc--open .jbg-acc__head .jbg-toolbar__arrow{transform:rotate(180deg)}
.jbg-acc__body{display:none}
.jbg-acc--open .jbg-acc__body{display:grid}
.jbg-provlist{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:16px}
.jbg-check{display:flex;align-items:center;gap:10px;height:46px;padding:0 12px;border-radius:var(--jb-radius);background:var(--jb-n800);color:var(--jb-n300);font-size:13px;cursor:pointer;overflow:hidden}
.jbg-check input{position:absolute;opacity:0;width:0;height:0}
.jbg-check__box{flex:none;width:18px;height:18px;border-radius:var(--jb-radius);background:var(--jb-n600);display:flex;align-items:center;justify-content:center}
.jbg-check__box:after{content:"\f00c";font-family:"Font Awesome 6 Free";font-weight:900;font-size:11px;color:#fff;opacity:0}
.jbg-check input:checked + .jbg-check__box{background:var(--jb-p500)}
.jbg-check input:checked + .jbg-check__box:after{opacity:1}
.jbg-check input:checked ~ .jbg-check__txt{color:var(--jb-n200)}
.jbg-check img{width:24px;height:24px;border-radius:var(--jb-radius);object-fit:cover;flex:none}
.jbg-check__txt{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.jbg-sorts{display:flex;flex-direction:column;padding:8px 0}
.jbg-sortopt{height:52px;padding:0 20px;border:0;background:none;color:var(--jb-n300);font-family:inherit;font-size:15px;text-align:left;cursor:pointer}
.jbg-sortopt--active{color:var(--jb-p500);font-weight:600}

@media(max-width:1100px){.jbg-grid{grid-template-columns:repeat(6,minmax(0,1fr))}.jbg-provgrid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:780px){
  .jbg{padding:0 16px 20px}
  .jbg-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .jbg-provgrid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .jbg-tool--search{display:block}
  .jbg-search{display:none}
  .jbg-search--open{display:flex}
  .jbg-sheet--full{padding:0}
  .jbg-sheet--full .jbg-sheet__box{width:100%;max-height:none;height:100%;border-radius:0}
  .jbg-sheet:not(.jbg-sheet--full){align-items:flex-end;padding:0}
  .jbg-sheet:not(.jbg-sheet--full) .jbg-sheet__box{width:100%;border-radius:12px 12px 0 0}
}
/* Old style.css #gameSearch rules (teal text, boxed input) do not apply here */
.jbg-search #gameSearch{background:none !important;border:0 !important;box-shadow:none !important;padding:0 !important;height:100% !important;
  color:var(--jb-n200) !important;-webkit-text-fill-color:var(--jb-n200) !important;border-radius:0 !important}
.jbg-search #gameSearch::placeholder{color:var(--jb-n400) !important;-webkit-text-fill-color:var(--jb-n400) !important}
/* Broken game images: no alt text, just the dark tile with the name */
.jbg-tile img{color:transparent;font-size:0}

/* ── Live chat button: reference style (black 50px circle with brand badge) ── */
#lc-launcher{
  width:50px !important;height:50px !important;right:16px !important;
  background:#000 url('/livechat_mb.png') center/70% no-repeat !important;
  border:0 !important;border-radius:50% !important;box-shadow:0 4px 14px rgba(0,0,0,.5) !important;
}
#lc-launcher > *{display:none !important}
@media(max-width:1023px){ #lc-launcher{bottom:calc(var(--jb-bottombar-h) + 52px) !important} }
/* pop_up badges are square crests: show whole, no circle crop */
.jb-hd-sponsor__img{border-radius:0}

/* ── Promotions page (reference: title · category chips · 3-col cards) ─ */
html[data-page="bonuses"] body .promo-page-header,
html[data-page="bonuses"] body .category-select-wrap{display:none !important}
html[data-page="bonuses"] body .main-content{max-width:calc(var(--jb-content-max) + var(--jb-gap) * 4) !important;margin:0 auto !important;padding:40px calc(var(--jb-gap) * 2) 40px !important;background:none !important}
html[data-page="bonuses"] body .page-title{display:block !important;margin:0 0 30px !important;font-size:20px !important;font-weight:600 !important;color:var(--jb-n200) !important;text-align:left !important}
html[data-page="bonuses"] body .category-filter{border-radius:0 !important;display:flex !important;flex-wrap:nowrap !important;gap:8px !important;overflow-x:auto !important;margin:0 0 18px !important;padding:0 !important;background:none !important;border:0 !important;scrollbar-width:none !important}
html[data-page="bonuses"] body .category-filter::-webkit-scrollbar{display:none !important}
html[data-page="bonuses"] body .category-btn{flex:none !important;height:40px !important;padding:0 16px !important;border:0 !important;border-radius:var(--jb-radius) !important;background:var(--jb-n800) !important;color:var(--jb-n300) !important;font-family:inherit !important;font-size:14px !important;font-weight:400 !important;box-shadow:none !important;white-space:nowrap !important;cursor:pointer !important}
html[data-page="bonuses"] body .category-btn.active{background:var(--jb-p500) !important;color:#fff !important}
html[data-page="bonuses"] body .bonus-grid{background:none !important;border:0 !important;border-radius:0 !important;padding:0 !important;display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:16px !important;padding:0 !important;background:none !important}
html[data-page="bonuses"] body .bonus-card.horizontal{display:flex !important;flex-direction:column !important;width:auto !important;margin:0 !important;padding:0 !important;border:0 !important;border-radius:var(--jb-radius) !important;background:var(--jb-n800) !important;box-shadow:none !important;overflow:hidden !important;transform:none !important}
html[data-page="bonuses"] body .bonus-card.horizontal .bonus-banner{width:100% !important;height:auto !important;min-height:0 !important;aspect-ratio:378/165 !important;margin:0 !important;border-radius:0 !important;background:var(--jb-n700) !important}
html[data-page="bonuses"] body .bonus-card.horizontal .bonus-banner img{width:100% !important;height:100% !important;object-fit:cover !important;border-radius:0 !important}
html[data-page="bonuses"] body .bonus-card.horizontal .bonus-details{display:flex !important;flex-direction:column !important;flex:1 !important;width:auto !important;padding:16px !important;background:none !important}
html[data-page="bonuses"] body .jbpr-tags{display:flex !important;flex-wrap:wrap !important;gap:6px !important;margin-bottom:10px !important}
html[data-page="bonuses"] body .jbpr-tags span{padding:1px 6px !important;border:1px solid var(--jb-n600) !important;border-radius:2px !important;font-size:12px !important;line-height:18px !important;color:var(--jb-n300) !important}
html[data-page="bonuses"] body .jbpr-date{margin-bottom:6px !important;font-size:12px !important;color:var(--jb-n400) !important}
html[data-page="bonuses"] body .jbpr-date i{margin-right:4px !important}
html[data-page="bonuses"] body .bonus-card.horizontal .bonus-title{margin:0 0 12px !important;font-size:18px !important;font-weight:600 !important;line-height:1.3 !important;color:var(--jb-n100) !important}
html[data-page="bonuses"] body .bonus-card.horizontal .bonus-description,
html[data-page="bonuses"] body .bonus-card.horizontal .bonus-terms{display:none !important}
html[data-page="bonuses"] body .btn-row{display:flex !important;gap:8px !important;margin-top:auto !important}
html[data-page="bonuses"] body .claim-button{flex:1 !important;height:42px !important;margin:0 !important;border-radius:var(--jb-radius) !important;font-family:inherit !important;font-size:14px !important;font-weight:600 !important;box-shadow:none !important;background:var(--jb-p500) !important;color:#fff !important;border:1px solid var(--jb-p500) !important}
html[data-page="bonuses"] body .bonus-card.horizontal .claim-button.read-more-button, html[data-page="bonuses"] body .claim-button.read-more-button{background:transparent !important;color:var(--jb-n300) !important;border:1px solid var(--jb-n600) !important}
html[data-page="bonuses"] body .claim-button:hover{filter:brightness(1.15) !important}
@media(max-width:1100px){html[data-page="bonuses"] body .bonus-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}}
@media(max-width:780px){
  html[data-page="bonuses"] body .main-content{padding:16px 16px 24px !important}
  html[data-page="bonuses"] body .page-title{margin-bottom:24px !important}
  html[data-page="bonuses"] body .bonus-grid{grid-template-columns:1fr !important}
  html[data-page="bonuses"] body .category-btn{height:42px !important;font-size:15px !important}
}

/* ── Currency and Language pop-up (reference language menu) ──────────── */
.jb-lp-overlay{position:fixed;left:0;right:0;bottom:0;top:var(--header-h);z-index:1500;background:rgba(20,21,21,.6);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.jb-lp-overlay[hidden]{display:none}
.jb-lp{position:absolute;top:0;right:0;width:420px;max-width:100%;max-height:calc(100% - 20px);overflow-y:auto;padding:0 16px 20px;background:var(--jb-n900);box-shadow:0 10px 30px rgba(0,0,0,.6);animation:jbLpIn .25s ease both}
@keyframes jbLpIn{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
.jb-lp__head{display:flex;align-items:center;justify-content:space-between;height:54px}
.jb-lp__title{font-size:14.5px;color:var(--jb-n200)}
.jb-lp__close{width:30px;height:30px;padding:0;border:0;background:none;cursor:pointer;display:flex;align-items:center;justify-content:center}
.jb-lp__close .jb-sm-mask{width:22px;height:22px;background:var(--jb-n200)}
.jb-lp__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.jb-lp__cur{display:flex;flex-direction:column;align-items:center;gap:8px;padding:10px 8px 12px;border-radius:var(--jb-radius);background:var(--jb-n800)}
.jb-lp__flag{width:31px;height:31px;border-radius:50%;object-fit:cover}
.jb-lp__name{margin-bottom:2px;font-size:14.5px;color:var(--jb-n200)}
.jb-lp__opt{width:100%;height:37px;border:0;border-radius:var(--jb-radius);background:var(--jb-n700);color:var(--jb-n300);font-family:inherit;font-size:14.5px;cursor:pointer;transition:background .2s,color .2s}
.jb-lp__opt:hover{color:var(--jb-n200)}
.jb-lp__opt--on{background:var(--jb-p500);color:var(--jb-n200)}
@media(max-width:780px){
  body.has-mobile-download-bar .jb-lp-overlay{top:calc(var(--header-h) + var(--mobile-download-bar-h))}
  .jb-lp{width:100%}
}
html[data-page="bonuses"] body .category-filter{box-shadow:none !important}
html[data-page="bonuses"] body .bonus-card.horizontal .claim-button:not(.read-more-button){background:var(--jb-p500) !important;color:#fff !important}

/* ── Promotion detail (reference promotion-detail page) ──────────────── */
.jbpd{max-width:650px;margin:0 auto;padding:60px 16px 120px;color:var(--jb-n200)}
.jbpd__title{display:flex;align-items:center;gap:20px;margin-bottom:28px}
.jbpd__back{display:flex;align-items:center;justify-content:center;width:20px;color:var(--jb-n200);font-size:18px}
.jbpd__title h1{margin:0;font-size:20px;font-weight:600;color:var(--jb-n200);line-height:1.3}
.jbpd__banner{display:block;width:100%;aspect-ratio:618/313;object-fit:cover;border-radius:var(--jb-radius)}
.jbpd__tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.jbpd__tags span{padding:1px 8px;border:1px solid var(--jb-n600);border-radius:2px;font-size:12px;line-height:18px;color:var(--jb-n300)}
.jbpd__date{margin-top:14px;font-size:12px;color:var(--jb-n400)}
.jbpd__date i{margin-right:4px}
.jbpd__body{margin-top:16px;font-size:14.5px;line-height:1.55;color:var(--jb-n200);overflow-wrap:anywhere}
.jbpd__body[hidden]{display:none}
.jbpd__body p{margin:0 0 10px}
.jbpd__body img{max-width:100%;height:auto}
.jbpd__body table{width:100%;max-width:520px;border-collapse:collapse;margin:8px 0 16px;text-align:center}
.jbpd__body th,.jbpd__body td{border:1px solid var(--jb-n200) !important;padding:6px 8px;color:var(--jb-n200);background:transparent !important}
.jbpd__body a{color:var(--jb-p500)}
.jbpd__terms{margin-top:14px;font-size:13px;line-height:1.8;color:var(--jb-n300)}
.jbpd__terms:empty{display:none}
.jbpd__foot{position:fixed;left:0;right:0;bottom:0;z-index:900;padding:16px;background:var(--jb-n900);border-top:1px solid var(--jb-line)}
.jbpd__cta{display:flex;align-items:center;justify-content:center;width:100%;max-width:618px;height:52px;margin:0 auto;border:0;border-radius:var(--jb-radius);
  background:var(--jb-p500);color:#fff !important;font-family:inherit;font-size:16px;font-weight:600;cursor:pointer;text-decoration:none}
.jbpd__cta[hidden]{display:none}
.jbpd__cta:hover{filter:brightness(1.1)}
@media(min-width:1024px){.jbpd__foot{left:var(--jb-rail)}}
@media(max-width:1023px){
  .jbpd{padding:16px 16px 110px}
  .jbpd__title{margin-bottom:22px}
  .jbpd__foot{bottom:calc(var(--jb-bottombar-h) + env(safe-area-inset-bottom,0px))}
}
html[data-page="bonuses"] body .bonus-card.horizontal a.claim-button.read-more-button{display:flex !important;align-items:center !important;justify-content:center !important;text-decoration:none !important}
/* Before login: only a full-width "Read more" on each card (reference site) */
html.jbpr-guest[data-page="bonuses"] body .btn-row .claim-button:not(.read-more-button){display:none !important}
html[data-page="bonuses"] body .bonus-card.horizontal .claim-button{box-sizing:border-box !important;flex:1 1 0 !important;min-width:0 !important;height:45px !important;padding:0 8px !important;font-size:14.5px !important}

/* ── Help Center / About pages (reference help-centre layout) ────────── */
.jbhc{background:#f4f4f4;color:#333;font-family:Manrope,'Hind Siliguri',Poppins,sans-serif}
.jbhc-hero{position:relative;padding:70px 20px 64px;text-align:center;
  background:linear-gradient(rgba(10,12,14,.72),rgba(10,12,14,.72)),var(--hc-bg,linear-gradient(135deg,#1d2228,#3a3f45)) center/cover no-repeat}
.jbhc-hero__inner{max-width:1170px;margin:0 auto}
.jbhc-hero__title{margin:0;font-size:46px;font-weight:800;color:#e9e9e9;letter-spacing:-.5px}
.jbhc-hero__sub{margin:22px 0 32px;font-size:30px;color:#fff}
.jbhc-hero__sub em{font-style:normal;color:#f5a00f}
.jbhc-search{position:relative;display:block;max-width:1170px;margin:0 auto}
.jbhc-search input{width:100%;height:72px;padding:0 70px 0 30px;border:0;border-radius:8px;background:#fff;color:#333;font-family:inherit;font-size:19px;outline:none}
.jbhc-search input::placeholder{color:#777}
.jbhc-search i{position:absolute;right:30px;top:50%;transform:translateY(-50%);font-size:20px;color:#1f6f5c}
.jbhc-crumbs{display:flex;gap:14px;max-width:1170px;margin:20px auto 0;font-size:16px;color:#e8e8e8;text-align:left}
.jbhc-crumbs a{color:#e8e8e8}
.jbhc-crumbs a:hover{color:#f5a00f}
.jbhc-crumbs b{font-weight:400}
.jbhc-body{max-width:1146px;margin:0 auto;padding:76px 16px 60px}
.jbhc-topics__label{margin-bottom:22px;font-size:15px;color:#555}
.jbhc-topics{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:15px 16px;margin-bottom:50px}
.jbhc-topic{display:flex;align-items:center;justify-content:center;min-height:46px;padding:6px 10px;border:1px solid #e5e5e5;border-radius:3px;background:#fff;
  font-size:15px;font-weight:500;text-transform:uppercase;text-align:center;color:#222;transition:background .2s,color .2s}
.jbhc-topic:hover{border-color:#f5a00f;color:#f5a00f}
.jbhc-topic--on,.jbhc-topic--on:hover{background:#f5a00f;border-color:#f5a00f;color:#fff}
.jbhc-intro{margin-bottom:24px;font-size:15px;line-height:1.7;color:#444}
.jbhc-intro p{margin:0 0 8px}
.jbhc-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 30px;align-items:start}
.jbhc-item{border:1px solid #e3e3e3;border-radius:3px;background:#f9f9f6}
.jbhc-item[hidden]{display:none}
.jbhc-item__q{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:56px;padding:12px 15px 12px 16px;border:0;background:none;
  font-family:inherit;font-size:15px;line-height:1.6;color:#222;text-align:left;cursor:pointer}
.jbhc-item__ic{flex:none;position:relative;width:24px;height:24px;border:1.5px solid #222;border-radius:50%}
.jbhc-item__ic:before,.jbhc-item__ic:after{content:"";position:absolute;left:50%;top:50%;width:10px;height:1.5px;background:#222;transform:translate(-50%,-50%);transition:transform .25s}
.jbhc-item__ic:after{transform:translate(-50%,-50%) rotate(90deg)}
.jbhc-item--open .jbhc-item__ic:after{transform:translate(-50%,-50%) rotate(0)}
.jbhc-item__a{display:none;padding:0 16px 16px;font-size:14.5px;line-height:1.7;color:#444}
.jbhc-item--open .jbhc-item__a{display:block}
.jbhc-item__a p{margin:0 0 8px}
.jbhc-item__a ol,.jbhc-item__a ul{margin:0 0 8px;padding-left:20px}
.jbhc-empty{padding:30px 0;text-align:center;color:#777}
.jbhc-source{display:none}
@media(max-width:780px){
  .jbhc-hero{padding:70px 16px 64px}
  .jbhc-hero__title{font-size:26px}
  .jbhc-hero__sub{margin:20px 0 22px;font-size:19px}
  .jbhc-search input{height:52px;padding:0 50px 0 24px;font-size:16px;border-radius:10px}
  .jbhc-search i{right:20px;font-size:17px}
  .jbhc-crumbs{font-size:13px;margin-top:16px}
  .jbhc-body{padding:56px 14px 40px}
  .jbhc-topics{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px 18px}
  .jbhc-topic{font-size:12px;min-height:42px}
  .jbhc-grid{grid-template-columns:1fr;gap:14px}
}
.jbhc .jbhc-hero__title{color:#e9e9e9 !important;opacity:1 !important;-webkit-text-fill-color:#e9e9e9 !important;background:none !important}
.jbhc .jbhc-hero__sub,.jbhc .jbhc-hero__sub span{color:#fff !important;-webkit-text-fill-color:#fff !important;opacity:1 !important}
.jbhc .jbhc-hero__sub em{color:#f5a00f !important;-webkit-text-fill-color:#f5a00f !important}
.jbhc .jbhc-search input{background:#fff !important;color:#333 !important;-webkit-text-fill-color:#333 !important;border:0 !important;box-shadow:none !important}
.jbhc .jbhc-search input::placeholder{color:#777 !important;-webkit-text-fill-color:#777 !important}
.jbhc .jbhc-item__q,.jbhc .jbhc-item__t{color:#222 !important;-webkit-text-fill-color:#222 !important;opacity:1 !important}
.jbhc .jbhc-item__a,.jbhc .jbhc-item__a *{color:#444 !important;-webkit-text-fill-color:#444 !important}
.jbhc .jbhc-intro,.jbhc .jbhc-intro *{color:#444 !important;-webkit-text-fill-color:#444 !important}
.jbhc .jbhc-topic{color:#222 !important}
.jbhc .jbhc-topic--on{color:#fff !important}
html[data-page] body .jbhc .jbhc-search input{background:#fff !important;color:#333 !important;-webkit-text-fill-color:#333 !important;border:0 !important}

/* ── VIP page (reference VIP Details) ────────────────────────────────── */
.jbvip{max-width:calc(var(--jb-content-max) + var(--jb-gap) * 4);margin:0 auto;padding:40px 16px 0}
.jbvip__title{display:flex;align-items:center;gap:20px;margin-bottom:22px}
.jbvip__back{color:var(--jb-n200) !important;font-size:18px}
.jbvip__title h1{margin:0;font-size:20px;font-weight:600;color:var(--jb-n200)}
.jbvip__panel{background:#000;padding:40px 12px 30px}
.jbvip-hero{position:relative;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:380px;padding:30px 60px 0 100px;border-radius:12px;overflow:hidden;
  background:radial-gradient(60% 90% at 75% 40%,rgba(201,123,22,.55) 0%,transparent 70%),linear-gradient(180deg,#3a2508 0%,#160d03 55%,#000 100%)}
.jbvip-hero__brand{display:flex;align-items:flex-end;gap:12px}
.jbvip-hero__brand img{height:56px;width:auto}
.jbvip-hero__brand span{font-size:28px;font-weight:700;color:#f0901f !important;letter-spacing:.5px;line-height:1.2}
.jbvip-hero__sub{margin:14px 0 26px;font-size:15px;color:#fff}
.jbvip-hero__btn{display:inline-flex;align-items:center;justify-content:center;min-width:180px;height:38px;padding:0 24px;border-radius:8px;
  background:linear-gradient(90deg,#f1a53e,#f8cf5d);color:#1b1100 !important;font-size:14px;font-weight:700;letter-spacing:.3px;text-decoration:none !important}
.jbvip-hero__btn:hover{filter:brightness(1.08)}
.jbvip-hero__art{align-self:flex-end;border:0 !important;box-shadow:none !important;border-radius:0 !important;height:360px;width:auto;max-width:48%;object-fit:contain}
.jbvip__h2{margin:40px 0 14px;text-align:center;font-size:24px;font-weight:700;color:#fff;letter-spacing:.3px}
.jbvip-privs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px}
.jbvip-priv{position:relative;display:flex;align-items:center;min-height:230px;padding:28px 18px 28px 0;border-radius:6px;overflow:hidden;
  background:linear-gradient(160deg,#f6ae2d 0%,#e9861a 55%,#b85a0d 100%)}
.jbvip-priv:last-child:nth-child(odd){grid-column:1/-1;width:calc(50% - 15px);justify-self:center}
.jbvip-priv__art{flex:none;width:42%;text-align:center;font-size:110px;color:rgba(255,255,255,.3)}
.jbvip-priv__body h3{margin:0 0 8px;font-size:19px;font-weight:700;color:#fff}
.jbvip-priv__body p{margin:0;font-size:14px;line-height:1.35;color:#fff}
@media(max-width:780px){
  .jbvip{padding:16px 16px 0}
  .jbvip__title{margin-bottom:14px}
  .jbvip__panel{padding:20px 0;margin:0 -16px}
  .jbvip-hero{flex-direction:column-reverse;min-height:0;padding:0 16px 24px;text-align:center;border-radius:0;
    background:radial-gradient(70% 60% at 50% 30%,rgba(201,123,22,.5) 0%,transparent 70%),#000}
  .jbvip-hero__art{align-self:center;height:300px;max-width:100%;width:auto}
  .jbvip-hero__brand{justify-content:center}
  .jbvip-hero__brand img{height:36px}
  .jbvip-hero__brand span{font-size:20px}
  .jbvip-hero__sub{margin:10px 0 16px;font-size:13px}
  .jbvip__h2{font-size:20px;margin:24px 0 12px}
  .jbvip-privs{grid-template-columns:1fr;gap:14px;padding:0 12px}
  .jbvip-priv,.jbvip-priv:last-child:nth-child(odd){width:auto;min-height:170px}
  .jbvip-priv__art{width:38%;font-size:76px}
  .jbvip-priv__body h3{font-size:17px}
  .jbvip-priv__body p{font-size:13px}
}

/* ── Referral page (reference referral-program/info) ─────────────────── */
.jbrf-title{display:flex;align-items:center;gap:20px;padding:20px 0}
.jbrf-title__back{color:var(--jb-n200) !important;font-size:18px}
.jbrf-title h1{margin:0;font-size:20px;font-weight:600;color:var(--jb-n200)}
.jbrf-banner img{display:block;width:100%;max-height:260px;object-fit:cover;border-radius:var(--jb-radius)}
html[data-page="referral"] body .jbrf-tabs{display:flex !important;gap:8px;margin:16px 0 !important;padding:0 !important;background:none !important;border:0 !important;overflow-x:auto;position:static !important;box-shadow:none !important}
html[data-page="referral"] body .jbrf-tabs .rf-tab{flex:none;height:40px;padding:0 16px !important;display:flex !important;align-items:center;border:0 !important;border-radius:var(--jb-radius) !important;
  background:var(--jb-n800) !important;color:var(--jb-n300) !important;font-size:14px !important;white-space:nowrap}
html[data-page="referral"] body .jbrf-tabs .rf-tab.active{background:var(--jb-p500) !important;color:#fff !important}
html[data-page="referral"] body .jbrf-tabs .rf-tab::after{display:none !important}
.jbrf-card{margin-bottom:12px;padding:22px 16px;border-radius:var(--jb-radius);background:#222424}
.jbrf-how{display:flex;align-items:flex-start;justify-content:space-between;gap:30px}
.jbrf-how h2{margin:0 0 8px;font-size:20px;font-weight:700;color:#fff}
.jbrf-how p{margin:0;font-size:14px;line-height:1.5;color:var(--jb-n300)}
.jbrf-rules-btn{flex:none;width:347px;max-width:40%;height:50px;border:0;border-radius:var(--jb-radius);background:#454647;color:var(--jb-n200);font-family:inherit;font-size:16px;cursor:pointer}
.jbrf-rules-btn:hover{filter:brightness(1.15)}
.jbrf-card__h3{margin:30px 0 12px;font-size:16px;font-weight:700;color:#fff}
.jbrf-card__h2{margin:0 0 18px;font-size:20px;font-weight:700;color:#fff}
.jbrf-ratio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.jbrf-ratio__cell{display:flex;align-items:center;justify-content:space-between;height:40px;padding:0 16px;border-radius:var(--jb-radius);background:#454647;font-size:14px;color:var(--jb-n200)}
.jbrf-ratio__cell b{font-weight:500;color:var(--jb-accent)}
.jbrf-code{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:20px}
.jbrf-code__label{font-size:14px;color:var(--jb-n300)}
html[data-page="referral"] body .jbrf-code__box{min-width:140px;height:40px;margin:0;padding:0 16px !important;display:flex !important;align-items:center;border-radius:var(--jb-radius) !important;background:var(--jb-n700) !important;color:var(--jb-accent) !important;font-weight:600;border:0 !important}
html[data-page="referral"] body .jbrf-code__share{width:auto;height:40px;margin:0;padding:0 16px !important;border:0 !important;border-radius:var(--jb-radius) !important;background:var(--jb-p500) !important;color:#fff !important;font-family:inherit;font-weight:600;cursor:pointer}
.jbrf-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.jbrf-step{position:relative;min-height:150px;padding:66px 16px 16px;border-radius:var(--jb-radius);background:linear-gradient(180deg,transparent 0 38px,#2d2f2f 38px)}
.jbrf-step__n{position:absolute;left:30px;top:-6px;font-size:76px;line-height:1;font-weight:900;font-style:italic;color:#ffd21a}
.jbrf-step__ic{position:absolute;right:20px;top:4px;width:84px;height:84px;display:flex;align-items:center;justify-content:center;border-radius:22px;transform:rotate(-12deg);
  background:linear-gradient(135deg,#ffa53a,#e05a00);color:#fff;font-size:32px;box-shadow:0 8px 20px rgba(255,120,20,.35)}
.jbrf-step__t{position:relative;font-size:16px;font-weight:700;color:#ffd21a}
.jbrf-step__d{position:relative;margin-top:6px;font-size:12px;color:#fff}
.jbrf-net-hd{margin-top:20px}
.jbrf-cta{position:sticky;bottom:0;z-index:50;display:flex;justify-content:flex-end;padding:16px max(16px,calc((100% - 1200px) / 2));background:#222424;margin-top:20px}
.jbrf-cta__btn{width:386px;height:50px;border:0;border-radius:var(--jb-radius);background:var(--jb-p500);color:#fff;font-family:inherit;font-size:16px;cursor:pointer}
.jbrf-cta__btn:hover{filter:brightness(1.08)}
.jbrf-modal{position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(0,0,0,.6)}
.jbrf-modal[hidden]{display:none}
.jbrf-modal__box{width:min(520px,100%);max-height:85vh;overflow:auto;border-radius:6px;background:var(--jb-n900)}
.jbrf-modal__head{display:flex;justify-content:space-between;align-items:center;padding:16px;border-bottom:1px solid var(--jb-line-2);color:#fff;font-size:17px}
.jbrf-modal__head button{border:0;background:none;color:var(--jb-n200);font-size:28px;line-height:1;cursor:pointer}
.jbrf-modal__body{padding:16px;font-size:14px;line-height:1.6;color:var(--jb-n200)}
.jbrf-modal__body p{margin:0}
.jbrf-modal__body ul{padding-left:18px;margin:10px 0 0}
@media(max-width:780px){
  .jbrf-title{padding:12px 0}
  .jbrf-how{flex-direction:column;gap:20px}
  .jbrf-rules-btn{width:100%;max-width:none}
  .jbrf-ratio{grid-template-columns:1fr;gap:10px}
  .jbrf-steps{grid-template-columns:1fr}
  .jbrf-cta{position:fixed;left:0;right:0;bottom:calc(var(--jb-bottombar-h) + env(safe-area-inset-bottom,0px));margin:0;padding:12px 16px}
  .jbrf-cta__btn{width:100%}
  html[data-page="referral"] body .rf-page{padding-bottom:80px}
}
/* Referral: full-width page like the reference; icons keep their own font */
html[data-page="referral"] body .rf-page{box-sizing:border-box;width:100%;max-width:calc(var(--jb-content-max) + var(--jb-gap) * 4);margin:0 auto;padding-left:16px;padding-right:16px;background:none}
html[data-page="referral"] body .rf-page i.fa-solid,html[data-page="referral"] body .rf-page i.fa-solid::before{font-family:"Font Awesome 6 Free" !important;font-weight:900 !important}

/* ── Voucher + Reward pages: same layout as the referral page ────────── */
.jbpg{box-sizing:border-box;width:100%;max-width:calc(var(--jb-content-max) + var(--jb-gap) * 4);margin:0 auto;padding:0 16px 40px;font-family:inherit}
.jbpg i.fa-solid,.jbpg i.fa-solid::before{font-family:"Font Awesome 6 Free" !important;font-weight:900 !important}
.jbpg .jbrf-tabs{display:flex;gap:8px;margin:16px 0;overflow-x:auto}
.jbpg-tab{flex:none;height:40px;padding:0 16px;display:flex;align-items:center;gap:8px;border-radius:var(--jb-radius);background:var(--jb-n800);color:var(--jb-n300) !important;font-size:14px;white-space:nowrap;text-decoration:none}
.jbpg-tab img{width:18px;height:18px;object-fit:contain}
.jbpg-tab:hover{color:var(--jb-n200) !important}
.jbpg-tab.active{background:var(--jb-p500);color:#fff !important}
.jbpg-tab.active img{filter:brightness(0) invert(1)}

/* Voucher */
.jbvc-form{display:flex;gap:10px}
.jbvc-input{flex:1;min-width:0;height:40px;padding:0 16px;border:1px solid transparent;border-radius:var(--jb-radius);background:var(--jb-n700);color:var(--jb-n200);font-family:inherit;font-size:14px;outline:none;text-transform:uppercase}
.jbvc-input::placeholder{color:var(--jb-n400);text-transform:none}
.jbvc-input:focus{border-color:var(--jb-p500)}
.jbvc-btn{flex:none;height:40px;padding:0 24px;border:0;border-radius:var(--jb-radius);background:var(--jb-p500);color:#fff;font-family:inherit;font-size:14px;font-weight:600;cursor:pointer}
.jbvc-btn:hover{filter:brightness(1.08)}
.jbvc-btn:disabled{background:var(--jb-n600);color:var(--jb-n300);cursor:not-allowed;filter:none}
.jbvc-msg{display:none;margin-top:12px;padding:10px 14px;border-radius:var(--jb-radius);font-size:14px}
.jbvc-msg--ok{background:rgba(255,138,20,.12);border:1px solid rgba(255,138,20,.45);color:var(--jb-p300)}
.jbvc-msg--err{background:rgba(226,0,0,.12);border:1px solid rgba(226,0,0,.45);color:#ff6b6b}
.jbvc-list{display:flex;flex-direction:column;gap:8px}
.jbvc-item{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;border-radius:var(--jb-radius);background:#454647}
.jbvc-item__code{font-size:14px;font-weight:600;color:var(--jb-n200);letter-spacing:.5px}
.jbvc-item__sub{margin-top:2px;font-size:12px;color:var(--jb-n300)}
.jbvc-item__amt{flex:none;font-size:15px;font-weight:700;color:var(--jb-accent)}
.jbvc-empty{padding:30px 0;text-align:center;font-size:14px;color:var(--jb-n300)}

/* Reward */
.jbrw-coins{display:inline-flex;align-items:center;gap:10px;min-width:180px;height:40px;padding:0 16px;border-radius:var(--jb-radius);background:var(--jb-n700)}
.jbrw-coins img{width:24px;height:24px}
.jbrw-coins b{font-size:16px;font-weight:700;color:var(--jb-accent)}
.jbrw-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.jbrw-item{display:flex;flex-direction:column;border-radius:var(--jb-radius);background:#2d2f2f;overflow:hidden}
.jbrw-item__img{height:150px;padding:10px;background:#454647}
.jbrw-item__img img{display:block;width:100%;height:100%;object-fit:contain}
.jbrw-item__body{flex:1;padding:10px 12px 0}
.jbrw-item__pts{display:flex;align-items:center;gap:6px;font-size:15px;font-weight:700;color:var(--jb-accent)}
.jbrw-item__pts img{width:16px;height:16px}
.jbrw-item__name{margin-top:4px;min-height:32px;font-size:12px;line-height:1.35;color:var(--jb-n300)}
.jbrw-item__btn{margin:10px 12px 12px;height:36px;border:0;border-radius:var(--jb-radius);background:var(--jb-p500);color:#fff;font-family:inherit;font-size:14px;font-weight:600;cursor:pointer}
.jbrw-item__btn:hover{filter:brightness(1.08)}
.jbrw-item__btn:disabled{background:var(--jb-n600);color:var(--jb-n300);cursor:not-allowed;filter:none}
.jbrw-pager{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px;margin-top:20px}
.jbrw-pager__btn{min-width:36px;height:36px;padding:0 8px;display:flex;align-items:center;justify-content:center;border:0;border-radius:var(--jb-radius);background:#454647;color:var(--jb-n200) !important;font-family:inherit;font-size:14px;text-decoration:none;cursor:pointer}
.jbrw-pager__btn svg{width:18px;height:18px}
.jbrw-pager__btn.active{background:var(--jb-p500);color:#fff !important}
.jbrw-pager__btn:disabled{opacity:.4;cursor:default}
.jbrw-pager__more{color:var(--jb-n300)}
.jbrw-mb8{margin-bottom:8px}
.jbrw-sub{margin:0 0 20px;font-size:14px;line-height:1.5;color:var(--jb-n300)}
.jbrw-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px;margin-bottom:24px}
.jbrw-day{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 4px;border-radius:var(--jb-radius);background:#2d2f2f}
.jbrw-day__c{width:44px;height:44px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:16px}
.jbrw-day__c--locked{background:#454647;color:var(--jb-n300)}
.jbrw-day__c--done{background:var(--jb-p500);color:#fff}
.jbrw-day__c--today{background:linear-gradient(135deg,#ffa53a,#e05a00);color:#fff;box-shadow:0 6px 16px rgba(255,120,20,.35)}
.jbrw-day__c b{font-size:15px;font-weight:800}
.jbrw-day__lbl{font-size:12px;color:var(--jb-n200)}
.jbrw-cta-btn{display:block;width:386px;max-width:100%;height:50px;margin:0 auto;border:0;border-radius:var(--jb-radius);background:var(--jb-p500);color:#fff;font-family:inherit;font-size:16px;cursor:pointer}
.jbrw-cta-btn:hover{filter:brightness(1.08)}
.jbrw-cta-btn:disabled{background:var(--jb-n600);color:var(--jb-n300);cursor:not-allowed;filter:none}
.jbrf-modal__box.jbrw-modal{width:min(1100px,100%)}
.jbrw-search{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-bottom:16px}
.jbrw-search__lbl{font-size:14px;color:var(--jb-n300)}
.jbrw-date{display:inline-flex;align-items:center;height:40px;border-radius:var(--jb-radius);background:var(--jb-n700);overflow:hidden}
.jbrw-date input{height:100%;min-width:150px;padding:0 12px;border:0;background:transparent;color:var(--jb-n200);font-family:inherit;color-scheme:dark;outline:none}
.jbrw-date button{height:100%;padding:0 12px;border:0;background:none;color:var(--jb-n300);cursor:pointer}
.jbrw-search__btn{height:40px;padding:0 20px;border:0;border-radius:var(--jb-radius);background:var(--jb-p500);color:#fff;font-family:inherit;font-weight:600;cursor:pointer}
.jbrw-table-wrap{overflow-x:auto}
.jbrw-table{width:100%;min-width:900px;border-collapse:collapse}
.jbrw-table th{padding:10px 12px;background:#454647;color:var(--jb-n200);font-size:12px;font-weight:600;text-align:left;white-space:nowrap}
.jbrw-table td{padding:10px 12px;border-bottom:1px solid var(--jb-line);color:var(--jb-n300);font-size:12px;white-space:nowrap}
.jbrw-nodata{padding:32px !important;text-align:center !important}
.jbrw-status{display:inline-block;padding:2px 10px;border-radius:var(--jb-radius);background:rgba(255,138,20,.15);color:var(--jb-p300);font-size:12px}
/* Betting pass */
.jbbp-banner{position:relative;display:block}
.jbbp-banner__text{position:absolute;left:0;top:0;bottom:0;width:48%;display:flex;flex-direction:column;justify-content:center;gap:8px;padding:0 4%}
.jbbp-banner__text b{font-size:26px;font-weight:800;font-style:italic;line-height:1.15;color:#ffd21a;text-transform:uppercase}
.jbbp-banner__text span{font-size:15px;line-height:1.4;color:#fff}
.jbbp-intro .jbrf-how p{white-space:normal}
.jbbp-intro__art{flex:none;width:150px;max-width:30%;height:auto;align-self:center}
.jbbp-progress{margin-top:24px;padding-top:20px;border-top:1px solid var(--jb-line)}
.jbbp-guest{display:flex;align-items:center;justify-content:space-between;gap:20px}
.jbbp-guest__text{margin:0;font-size:14px;line-height:1.5;color:var(--jb-n200)}
.jbbp-guest__btns{flex:none;display:flex;gap:10px}
.jbbp-btn{height:40px;padding:0 24px;border:0;border-radius:var(--jb-radius);background:var(--jb-p500);color:#fff;font-family:inherit;font-size:14px;font-weight:600;white-space:nowrap;cursor:pointer}
.jbbp-btn:hover{filter:brightness(1.08)}
.jbbp-btn--grey{background:#454647;color:var(--jb-n200)}
.jbbp-logged{flex-direction:column;gap:16px}
.jbbp-mt0{margin-top:0}
.jbbp-bar-row{display:flex;align-items:center;gap:16px}
.jbbp-hex{flex:none;width:56px;height:62px;display:flex;align-items:center;justify-content:center;clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%);background:linear-gradient(135deg,#ffa53a,#e05a00);color:#fff;font-size:22px;font-weight:900;font-style:italic}
.jbbp-bar-col{flex:1;min-width:0}
.jbbp-bar-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px;font-size:12px;color:var(--jb-n300)}
.jbbp-bar-amt{font-size:14px;font-weight:600;color:var(--jb-accent)}
.jbbp-bar{height:10px;border-radius:var(--jb-radius);background:#454647;overflow:hidden}
.jbbp-bar__fill{height:100%;background:linear-gradient(90deg,#ffa53a,var(--jb-p500));transition:width .4s}
.jbbp-deposit{display:flex;align-items:center;justify-content:space-between;gap:20px}
.jbbp-deposit p{margin:0;font-size:14px;color:var(--jb-n300)}
.jbbp-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
.jbbp-prize{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 10px 12px;border:1px solid transparent;border-radius:var(--jb-radius);background:#2d2f2f;text-align:center}
.jbbp-prize--eligible{border-color:var(--jb-p500);box-shadow:0 0 14px rgba(255,138,20,.25)}
.jbbp-prize--claimed{opacity:.6}
.jbbp-prize__lvl{align-self:stretch;padding:4px 0;border-radius:var(--jb-radius);background:#454647;font-size:12px;font-weight:600;color:var(--jb-n200)}
.jbbp-prize__img{width:72px;height:72px;margin:6px 0}
.jbbp-prize__img img{width:100%;height:100%;object-fit:contain}
.jbbp-prize__name{min-height:34px;font-size:12px;line-height:1.4;color:var(--jb-n200)}
.jbbp-prize__req{font-size:14px;font-weight:700;color:var(--jb-accent)}
.jbbp-prize__btn{align-self:stretch;height:34px;margin-top:4px;border:0;border-radius:var(--jb-radius);background:var(--jb-p500);color:#fff;font-family:inherit;font-size:13px;font-weight:600;cursor:pointer}
.jbbp-prize__btn:hover{filter:brightness(1.08)}
.jbbp-prize__btn:disabled{background:var(--jb-n600);color:var(--jb-n300);cursor:not-allowed;filter:none}
.jbbp-prize--claimed .jbbp-prize__btn{background:#454647;color:var(--jb-p300)}
@keyframes bpToastIn{from{opacity:0;transform:translateY(14px) scale(.95)}to{opacity:1;transform:none}}

@media(max-width:1023px){
  .jbrw-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .jbbp-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media(max-width:780px){
  .jbbp-banner img{min-height:130px}
  .jbbp-banner__text{width:58%}
  .jbbp-banner__text b{font-size:16px}
  .jbbp-banner__text span{font-size:11px}
  .jbbp-intro__art{display:none}
  .jbbp-guest,.jbbp-deposit{flex-direction:column;align-items:stretch}
  .jbbp-guest__btns .jbbp-btn{flex:1}
  .jbbp-deposit .jbbp-btn{width:100%}
  .jbbp-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
}
@media(max-width:780px){
  .jbrw-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .jbrw-item__img{height:120px}
  .jbrw-days{grid-template-columns:repeat(4,minmax(0,1fr))}
  .jbvc-form{flex-direction:column}
  .jbvc-input{flex:none}
  .jbvc-btn{width:100%}
  .jbpg{padding-bottom:80px}
}

/* ── Side menu: promotions strip + desktop push (reference layout) ───── */
/* Opened collapse bodies are display:block; the promo strip must stay a single horizontal row */
.jb-sm-collapse--open > .jb-sm-collapse__body.jb-sm-promos{display:flex}
.jb-sm-promos{gap:8px;padding:16px 16px 10px;background:#222424;overflow-x:auto;overflow-y:hidden;flex-wrap:nowrap;scroll-snap-type:none;cursor:grab}
@supports not selector(::-webkit-scrollbar){.jb-sm-promos{scrollbar-width:thin;scrollbar-color:rgba(141,154,165,.5) transparent}}
/* Thin scrollbar under the promotion banners (reference: 4px, half-transparent grey thumb, no track) */
.jb-sm-promos::-webkit-scrollbar{display:block;height:4px}
.jb-sm-promos::-webkit-scrollbar-track{background:transparent}
.jb-sm-promos::-webkit-scrollbar-thumb{background:rgba(141,154,165,.5);border-radius:4px}
.jb-sm-promos::-webkit-scrollbar-button{display:none;width:0;height:0}
.jb-sm-promos a{margin-bottom:6px}
.jb-sm-promos a{flex:0 0 208px;width:208px;height:100px;border-radius:3px;overflow:hidden}
.jb-sm-promos img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;pointer-events:none}
.jb-sm-promos.is-dragging{cursor:grabbing}
.jb-sm-promos.is-dragging a{pointer-events:none}
@media(max-width:1023px){
  .jb-sm-promos a{flex-basis:216px;width:216px;height:103px}
}
@media(min-width:1024px){
  html:root{--jb-rail-open:350px}
  body{transition:padding-left .3s ease}
  /* Clicking the menu button pushes the page right instead of covering it */
  body.jb-menu-open{padding-left:var(--jb-rail-open)}
  body.jb-menu-open .jb-sidenav-overlay{display:none !important}
  .jb-sidenav.open{box-shadow:none}
}

/* ── Floating buttons (reference: live chat bottom-right; WhatsApp + Telegram stacked above it) ── */
#lc-launcher{position:fixed !important;right:20px !important;bottom:24px !important;z-index:9999 !important}
.mob-social-fab-stack{right:20px !important;bottom:86px !important;width:50px;align-items:center;gap:10px !important;z-index:9998 !important}
.mob-social-fab-stack .mob-social-fab,.mob-social-fab-stack .mob-social-fab img{width:44px !important;height:44px !important}
.mob-social-fab-stack .mob-social-fab{border-radius:50% !important;overflow:hidden;box-shadow:0 4px 14px rgba(0,0,0,.45)}
@media(max-width:1023px){
  #lc-launcher{right:16px !important;bottom:calc(var(--jb-bottombar-h) + 16px + env(safe-area-inset-bottom,0px)) !important}
  .mob-social-fab-stack{right:16px !important;bottom:calc(var(--jb-bottombar-h) + 78px + env(safe-area-inset-bottom,0px)) !important}
}

/* ── Games: category dropdown under the title (reference) ── */
.jbg-toolbar__head .jbg-toolbar__arrow{transition:transform .25s}
.jbg-toolbar__head--open .jbg-toolbar__arrow{transform:rotate(180deg)}
.jbg-sheet.jbg-sheet--drop{display:block;padding:0;background:transparent;z-index:1500}
.jbg-sheet.jbg-sheet--drop[hidden]{display:none}
.jbg-sheet.jbg-sheet--drop .jbg-sheet__box{position:fixed;width:178px;max-height:calc(100vh - 140px);border-radius:0 0 var(--jb-radius) var(--jb-radius);background:#191a1a;box-shadow:0 10px 30px rgba(0,0,0,.55);animation:jbFadeIn .2s both}
.jbg-sheet--drop .jbg-sheet__head{display:none}
.jbg-sheet--drop .jbg-cats{display:block;padding:0}
.jbg-sheet--drop .jbg-cat{display:flex;align-items:center;gap:16px;height:52px;padding:0 16px;border-radius:0;background:none;color:var(--jb-n100);font-size:14px;line-height:1.1;transition:background .2s}
.jbg-sheet--drop .jbg-cat:hover{background:var(--jb-n800)}
.jbg-sheet--drop .jbg-cat--active{background:var(--jb-n700);color:var(--jb-n100)}
.jbg-sheet--drop .jbg-cat img{flex:none;width:20px;height:20px;object-fit:contain}
@media(max-width:1023px){
  .jbg-sheet.jbg-sheet--drop .jbg-sheet__box{width:178px;border-radius:0 0 var(--jb-radius) var(--jb-radius)}
}

/* Gaming License badges (footer, managed in exchs_admin/payment-images.php) */
.jb-licenses .jb-icons__item img{height:40px;max-width:140px}
.jb-licenses a.jb-icons__item:hover img{opacity:.85}

/* License statement under the Gaming License badges */
.jb-license-text p{margin:0;color:#999;font-size:12px;line-height:1.6}
.jb-license-text a{color:#ffdf1a}

/* Login gate popup (includes/footer.php): shown when a logged-out visitor clicks a game */
.jb-gate{position:fixed;inset:0;z-index:13000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:24px;padding:16px 30px;background:rgba(0,0,0,.55);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.jb-gate[hidden]{display:none}
.jb-gate__box{width:100%;max-width:400px;padding:40px 12px 22px;border-radius:4px;background:#232525;box-shadow:0 10px 40px rgba(0,0,0,.45);text-align:center;animation:jbGateIn .25s ease-out}
/* Live chat logo in 3D (livechat_mb_3d.png, made from livechat_mb.png), animated: a slow 3D turn from side to side with a glass shine passing over it */
.jb-gate__visual{position:relative;display:block;width:170px;height:170px;margin:-34px auto 4px;perspective:420px}
.jb-gate__logo{display:block;width:100%;height:100%;object-fit:contain;transform-style:preserve-3d;filter:drop-shadow(0 6px 10px rgba(0,0,0,.45));animation:jbGateLogo 3.2s ease-in-out infinite}
.jb-gate__visual::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(115deg,transparent 35%,rgba(255,255,255,.55) 50%,transparent 65%) -150% 0/250% 100% no-repeat;-webkit-mask:url(/livechat_mb_3d.png) center/contain no-repeat;mask:url(/livechat_mb_3d.png) center/contain no-repeat;animation:jbGateShine 3.2s ease-in-out infinite}
@keyframes jbGateLogo{0%,100%{transform:rotateY(-22deg) rotateX(4deg)}50%{transform:rotateY(22deg) rotateX(-4deg)}}
@keyframes jbGateShine{0%,35%{background-position:-150% 0}65%,100%{background-position:150% 0}}
@media(prefers-reduced-motion:reduce){.jb-gate__logo,.jb-gate__visual::after{animation:none}}
.jb-gate__title{margin:0 0 24px;color:#e8e8e8;font-size:20px;font-weight:500;line-height:1.3;letter-spacing:.1px}
.jb-gate__text{margin:0 0 28px;padding:0 6px;color:#8d9192;font-size:14px;line-height:1.6}
.jb-gate__btn{display:flex;align-items:center;justify-content:center;width:100%;height:45px;margin-top:12px;border-radius:3px;font-size:15px;font-weight:500;text-decoration:none}
.jb-gate__btn:first-of-type{margin-top:0}
.jb-gate__btn:hover{opacity:.85;text-decoration:none}
.jb-gate__btn--signup{background:#ff8a14;color:#fff}
.jb-gate__btn--signup:hover{color:#fff}
.jb-gate__btn--login{background:#454747;color:#e8e8e8}
.jb-gate__btn--login:hover{color:#e8e8e8}
.jb-gate__close{display:flex;align-items:center;justify-content:center;width:36px;height:36px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.3);color:#fff;font-size:18px;cursor:pointer}
.jb-gate__close:hover{background:rgba(255,255,255,.4)}
html.jb-gate-open,html.jb-gate-open body{overflow:hidden}
@keyframes jbGateIn{from{opacity:0;transform:translateY(12px) scale(.97)}to{opacity:1;transform:none}}
/* Live chat button: stays on top of the popup, and keeps drawing attention (pulse ring + a small bounce) */
html.jb-gate-open #lc-launcher{z-index:13001 !important}
#lc-launcher{overflow:visible !important;animation:jbChatBounce 4s ease-in-out infinite}
#lc-launcher::after{content:'';position:absolute;inset:0;border-radius:50%;box-shadow:0 0 0 0 rgba(255,138,20,.6);animation:jbChatPulse 2s ease-out infinite;pointer-events:none}
@keyframes jbChatPulse{0%{box-shadow:0 0 0 0 rgba(255,138,20,.6)}70%{box-shadow:0 0 0 14px rgba(255,138,20,0)}100%{box-shadow:0 0 0 0 rgba(255,138,20,0)}}
@keyframes jbChatBounce{0%,80%,100%{transform:translateY(0)}85%{transform:translateY(-8px)}90%{transform:translateY(0)}95%{transform:translateY(-4px)}}
@media(prefers-reduced-motion:reduce){#lc-launcher,#lc-launcher::after{animation:none}}
