/* Hillside promo page (gift → #/promo): same 1X2BET card layout, green/black skin */
html.hs-tpl .promo-grid.wl-promos{gap:20px}
html.hs-tpl .promo-grid.wl-promos article.promo.panel{
  background:#12281e;border:1px solid rgba(40,255,187,.22);color:#e8fff6;
  box-shadow:0 8px 24px rgba(0,0,0,.28);overflow:hidden
}
html.hs-tpl .promo-grid.wl-promos .promo-art{background:#0b1a14}
html.hs-tpl .promo-grid.wl-promos .promo-b h2{color:#e8fff6}
html.hs-tpl .promo-grid.wl-promos .promo-b .muted,
html.hs-tpl .promo-grid.wl-promos .wl-promo-body{color:#b7d9cc}
html.hs-tpl .promo-grid.wl-promos .btn-cta{
  background:#28ffbb;color:#042018;border-color:#28ffbb;font-weight:800
}
html.hs-tpl .promo-grid.wl-promos .hhcd{
  background:rgba(4,32,24,.88);color:#e8fff6;box-shadow:0 2px 10px rgba(0,0,0,.35),inset 0 0 0 1px rgba(40,255,187,.35)
}
html.hs-tpl .promo-grid.wl-promos .hhcd b{color:#28ffbb}
html.hs-tpl .promo-grid.wl-promos .hhcd.live{background:linear-gradient(90deg,#0a7a4a,#28ffbb);color:#042018}
html.hs-tpl .promo-grid.wl-promos .hhcd.live b{color:#042018}
@media (min-width:1024px){
  html.hs-tpl #hx-gift,html.hs-tpl .hx.desk-only:has(#hx-gift){display:inline-flex!important}
}
html.hs-tpl .bnx-jp{grid-template-columns:repeat(3,1fr)!important}
html.hs-tpl .bnx-jp > div{text-align:center}
html.hs-tpl .bnx-jp > div:last-child{grid-column:auto!important}
html.hs-tpl #wl-lb-box-pa .ltable td:first-child,html.hs-tpl #wl-lb-box-pa .ltable th:first-child{width:36px;text-align:center}
html.hs-tpl #wl-lb-box-pa .ltable th,html.hs-tpl #wl-lb-box-pa .ltable td{padding:6px 10px;text-align:start}
html.hs-tpl #wl-lb-box-pa .ltable .num{text-align:end}
@media (max-width:720px){html.hs-tpl .bnx-jp{gap:8px}html.hs-tpl .bnx-jp > div{min-width:0}}

/* Promo route: only title + cards (same collapse approach as hs-sbk). Header/footer/bnav stay. */
html.hs-tpl.hs-promopg #hs-msub,
html.hs-tpl.hs-promopg #hs-mbnr,
html.hs-tpl.hs-promopg #hs-mtop,
html.hs-tpl.hs-promopg #hs-msub .hsm-srch,
html.hs-tpl.hs-promopg #hs-msub .hsm-cats,
html.hs-tpl.hs-promopg .hsm-cats,
html.hs-tpl.hs-promopg #hs-band,
html.hs-tpl.hs-promopg #hs-subs,
html.hs-tpl.hs-promopg #hs-jp,
html.hs-tpl.hs-promopg #jp-strip,
html.hs-tpl.hs-promopg #gx-hub,
html.hs-tpl.hs-promopg .gx-bar,
html.hs-tpl.hs-promopg #main section.hero,
html.hs-tpl.hs-promopg #main .wl-car,
html.hs-tpl.hs-promopg #lobby .cats,
html.hs-tpl.hs-promopg #lobby .srch,
html.hs-tpl.hs-promopg #lobby .sbox,
html.hs-tpl.hs-promopg #main .hero,
html.hs-tpl.hs-promopg #hs-root .srch-wrap,
html.hs-tpl.hs-promopg #hs-root .cats,
html.hs-tpl.hs-promopg #hs-root .bnr-wrap{
  display:none!important;visibility:hidden!important;pointer-events:none!important;
  height:0!important;max-height:0!important;overflow:hidden!important;margin:0!important;padding:0!important;border:0!important;
}
html.hs-tpl.hs-promopg{--hs-promopg:1}

/* Mobile header: 1X2BET layout, Hillside palette, no clock/lang/gift/theme. One line, no wrap. */
@media (max-width:1023px){
  html.hs-tpl header.hdr,
  html.hs-tpl header.hdr .hdr-row{
    display:flex!important;flex-wrap:nowrap!important;align-items:center!important;
    gap:6px;overflow:hidden;
  }
  html.hs-tpl header.hdr .hdr-row{width:100%;padding-inline:8px;min-height:48px;box-sizing:border-box}
  html.hs-tpl header.hdr .hdr-r{
    display:flex!important;flex-wrap:nowrap!important;align-items:center;justify-content:flex-end;
    gap:6px;margin:0;min-width:0;flex:1 1 auto;overflow:hidden
  }
  html.hs-tpl header.hdr #hx-lang,
  html.hs-tpl header.hdr #hx-lang.dd,
  html.hs-tpl header.hdr .dd:has(#hx-lang),
  html.hs-tpl header.hdr .hb-lang,
  html.hs-tpl header.hdr .hdr-clock,
  html.hs-tpl header.hdr .hb-time,
  html.hs-tpl header.hdr #hx-clock,
  html.hs-tpl header.hdr #hx-support,
  html.hs-tpl header.hdr #hx-gift,
  html.hs-tpl header.hdr [data-hs-gift="1"],
  html.hs-tpl header.hdr .hx.desk-only:has(#hx-gift),
  html.hs-tpl header.hdr .hdr-th,
  html.hs-tpl header.hdr #hx-dollar{
    display:none!important
  }
  html.hs-tpl header.hdr .hdr-brand,
  html.hs-tpl header.hdr .hdr-brand a,
  html.hs-tpl header.hdr .wl-logo{
    flex:0 0 auto!important;min-width:auto!important;max-width:none!important;
    overflow:visible;display:flex;align-items:center
  }
  html.hs-tpl header.hdr .hdr-brand{margin-right:0;flex:0 0 auto!important}
  html.hs-tpl header.hdr .hdr-r{flex:1 1 auto;min-width:0;justify-content:flex-end}
  html.hs-tpl header.hdr .hdr-brand img,
  html.hs-tpl header.hdr .wl-logo img,
  html.hs-tpl header.hdr .logo img{
    height:38px!important;width:auto!important;min-height:36px!important;max-height:40px!important;
    max-width:128px!important;object-fit:contain!important;flex-shrink:0
  }
  html.hs-tpl header.hdr #hx-wheel,
  html.hs-tpl header.hdr #hx-wheel.hx-wf-hid{
    display:inline-flex!important;flex:none!important;width:34px!important;height:34px!important;min-width:34px!important;
    padding:0!important;margin:0!important
  }
  html.hs-tpl header.hdr .hdr-reg,
  html.hs-tpl header.hdr #login-btn,
  html.hs-tpl header.hdr .hdr-login,
  html.hs-tpl header.hdr .hb-green,
  html.hs-tpl header.hdr .hb-blue{
    flex:0 1 auto;min-width:0;max-width:38%;height:36px;padding:0 10px;box-sizing:border-box;
    white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
    font-size:clamp(9px,2.5vw,12px);font-weight:800;line-height:36px;border-radius:8px
  }
  html.hs-tpl header.hdr .hb-bal{
    flex:0 1 auto;min-width:0;max-width:none;width:auto;height:38px;padding:2px 8px;
    box-sizing:border-box;display:inline-flex;flex-direction:column;
    justify-content:center;align-items:flex-end;gap:0;
    line-height:1.1!important;white-space:normal;overflow:hidden;
    font-weight:800;border-radius:8px
  }
  html.hs-tpl header.hdr .hb-bal .lbl{
    display:block;font-size:9px;line-height:1.15!important;font-weight:700;
    white-space:nowrap;overflow:hidden;text-overflow:clip;max-width:100%
  }
  html.hs-tpl header.hdr .hb-bal b,
  html.hs-tpl header.hdr .hb-bal .num{
    display:block;font-size:11px;line-height:1.15!important;font-weight:800;
    white-space:nowrap;overflow:hidden;text-overflow:clip;max-width:100%
  }
  html.hs-tpl header.hdr #hx-wheel,
  html.hs-tpl header.hdr #hx-wheel.hx-wf-hid,
  html.hs-tpl header.hdr .acct-dd,
  html.hs-tpl header.hdr .hdr-avatar,
  html.hs-tpl header.hdr .hdr-ava,
  html.hs-tpl header.hdr [data-testid="hdr-avatar"]{flex:0 0 auto}
  html.hs-tpl header.hdr .acct-dd,
  html.hs-tpl header.hdr .hdr-ava,
  html.hs-tpl header.hdr [data-testid="hdr-avatar"]{flex:none}
  html.hs-tpl header.hdr button.menu,
  html.hs-tpl header.hdr .hdr-menu,
  html.hs-tpl header.hdr [data-act="menu"],
  html.hs-tpl header.hdr .hb-menu{flex:none}
}
@media (max-width:400px) and (min-width:361px){
  html.hs-tpl header.hdr,
  html.hs-tpl header.hdr .hdr-row,
  html.hs-tpl header.hdr .hdr-r{gap:4px}
  html.hs-tpl header.hdr .hdr-row{padding-inline:6px}
  html.hs-tpl header.hdr .hdr-reg,
  html.hs-tpl header.hdr #login-btn,
  html.hs-tpl header.hdr .hdr-login,
  html.hs-tpl header.hdr .hb-green,
  html.hs-tpl header.hdr .hb-blue{
    flex:0 0 auto;max-width:none;padding:0 10px!important;font-size:9px!important;letter-spacing:-0.02em;box-sizing:border-box
  }
  html.hs-tpl header.hdr .hb-bal{
    flex:0 1 auto;max-width:none;padding:2px 8px!important;
    height:38px;line-height:1.1!important;box-sizing:border-box
  }
}
@media (max-width:360px){
  html.hs-tpl header.hdr,
  html.hs-tpl header.hdr .hdr-row,
  html.hs-tpl header.hdr .hdr-r{gap:3px}
  html.hs-tpl header.hdr .hdr-row{padding-inline:4px}
  html.hs-tpl header.hdr #hx-wheel,
  html.hs-tpl header.hdr #hx-wheel.hx-wf-hid{
    width:32px!important;height:32px!important;min-width:32px!important
  }
  html.hs-tpl header.hdr .hdr-reg,
  html.hs-tpl header.hdr #login-btn,
  html.hs-tpl header.hdr .hdr-login,
  html.hs-tpl header.hdr .hb-green,
  html.hs-tpl header.hdr .hb-blue{
    height:34px;padding:0 4px!important;font-size:8px!important;line-height:34px;letter-spacing:0
  }
  html.hs-tpl header.hdr .hb-bal{
    height:38px;padding:2px 6px!important;font-size:inherit;
    line-height:1.1!important;letter-spacing:0;box-sizing:border-box
  }
}

/* Mobile: hide lobby PROMOTIONS row (gift + cards). Promo page #/promo stays. No gap. */
@media (max-width:1023px){
  html.hs-tpl:not(.hs-promopg) section.wl-prow,
  html.hs-tpl:not(.hs-promopg) .wl-prow,
  html.hs-tpl:not(.hs-promopg) .hm-prow,
  html.hs-tpl:not(.hs-promopg) .wl-prow-h,
  html.hs-tpl:not(.hs-promopg) .wl-prow-r{
    display:none!important;visibility:hidden!important;
    height:0!important;max-height:0!important;margin:0!important;padding:0!important;
    overflow:hidden!important;border:0!important;pointer-events:none!important
  }
  /* Mobile subcategory filter in place (no anchor scroll) */
  html.hs-tpl.hs-subf #gx-hub .gx-sub:not(.hs-sel){display:none!important}
  html.hs-tpl.hs-subf #gx-hub .gx-sub.hs-sel .gx-sub-more{display:none!important}
}

/* Hillside: "Casino Vip" not all-caps. Source label may be PO CASINO VIP; don't edit PO. */
html.hs-tpl a[href*="casino-vip"],
html.hs-tpl a[href*="casino-vip"] span,
html.hs-tpl a[href*="casino-vip"] .wl-tl,
html.hs-tpl [data-hs-slug="casino-vip"],
html.hs-tpl [data-hs-slug="casino-vip"] span,
html.hs-tpl .tn-item[href*="casino-vip"],
html.hs-tpl .bn-item[href*="casino-vip"],
html.hs-tpl .bn-item[href*="casino-vip"] .wl-tl,
html.hs-tpl .dr-item[href*="casino-vip"],
html.hs-tpl .ptitle[data-hs-vip="1"]{
  text-transform:none!important;letter-spacing:normal
}

/* Hillside PWA/standalone only: 18+ bar below iOS status bar, no header gap.
   tab Safari unchanged (html.pwa is standalone). Status bar stays black-translucent. */
html.hs-tpl.pwa{--hs-sat:env(safe-area-inset-top,0px);--hs-sab:env(safe-area-inset-bottom,0px)}
html.hs-tpl.pwa{--hs-mtop:calc(34px + var(--hs-sat,0px))}
html.hs-tpl.pwa.hs-rsv-app{--hs-mtop:calc(80px + var(--hs-sat,0px))}
html.hs-tpl.pwa #hs-mtop,html.hs-tpl.pwa.hs-mcas #hs-mtop{
  padding-top:var(--hs-sat,0px);background:#1f1f1f;box-sizing:border-box;min-height:var(--hs-mtop)!important
}
html.hs-tpl.pwa.hs-mcas .hsm-rg{height:34px;padding:0 12px;background:#1f1f1f;box-sizing:border-box}
html.hs-tpl.pwa header.hdr,html.hs-tpl.pwa .hdr{padding-top:0!important}
html.hs-tpl.pwa nav.bnav,html.hs-tpl.pwa nav.bnav.wl-glass{
  padding-bottom:var(--hs-sab,0px)!important;padding-top:0!important;
  height:calc(66px + var(--hs-sab,0px))!important;box-sizing:border-box
}
html.hs-tpl.pwa nav.bnav .wl-bub,html.hs-tpl.pwa nav.bnav.wl-glass .wl-bub{
  top:7px!important;bottom:calc(7px + var(--hs-sab,env(safe-area-inset-bottom,0px)))!important
}
html.hs-tpl.pwa nav.bnav .wl-ti:not(.wl-mid),html.hs-tpl.pwa nav.bnav .bn-item:not(.wl-mid){
  height:66px;max-height:66px;align-self:flex-start
}

/* Hillside: no empty-category flash while lobby games are loading. */
html.hs-tpl:not(.hs-cat-ready) #grid-wrap>.empty,html.hs-tpl:not(.hs-cat-ready) #grid-wrap>.wl-cat-empty,html.hs-tpl:not(.hs-cat-ready) .panel.games .wl-cat-empty,html.hs-tpl:not(.hs-cat-ready) .wl-cat-empty{display:none!important}html.hs-tpl:not(.hs-cat-ready):not(.hs-sbk):not(.hs-promopg) section.panel.games:not(#gx-hub){display:none!important}html.hs-tpl.hs-cat-ready:has(#gx-hub:not([hidden])) section.panel.games:not(#gx-hub){display:none!important}html.hs-tpl:not(.hs-cat-ready) #grid-wrap,html.hs-tpl:not(.hs-cat-ready) #gx-hub[hidden]{position:relative;min-height:185px}html.hs-tpl:not(.hs-cat-ready) #gx-hub[hidden]{display:block!important;visibility:visible!important}html.hs-tpl:not(.hs-cat-ready) #grid-wrap::after,html.hs-tpl:not(.hs-cat-ready) #gx-hub[hidden]::after{content:"";display:block;width:100%;height:185px;border-radius:10px;background-image:linear-gradient(to right,rgba(255,255,255,.08) calc(100% - 8px),transparent 0);background-size:calc((100% - 16px)/3 + 8px) 100%;background-repeat:repeat-x}@media (min-width:768px){html.hs-tpl:not(.hs-cat-ready) #grid-wrap,html.hs-tpl:not(.hs-cat-ready) #gx-hub[hidden],html.hs-tpl:not(.hs-cat-ready) #grid-wrap::after,html.hs-tpl:not(.hs-cat-ready) #gx-hub[hidden]::after{min-height:220px;height:220px}html.hs-tpl:not(.hs-cat-ready) #grid-wrap::after,html.hs-tpl:not(.hs-cat-ready) #gx-hub[hidden]::after{background-size:calc((100% - 32px)/5 + 8px) 100%}}@media (min-width:1024px){html.hs-tpl:not(.hs-cat-ready) #grid-wrap,html.hs-tpl:not(.hs-cat-ready) #gx-hub[hidden],html.hs-tpl:not(.hs-cat-ready) #grid-wrap::after,html.hs-tpl:not(.hs-cat-ready) #gx-hub[hidden]::after{min-height:253px;height:253px}html.hs-tpl:not(.hs-cat-ready) #grid-wrap::after,html.hs-tpl:not(.hs-cat-ready) #gx-hub[hidden]::after{background-size:calc((100% - 50px)/6 + 10px) 100%}}@media (min-width:1280px){html.hs-tpl:not(.hs-cat-ready) #grid-wrap::after,html.hs-tpl:not(.hs-cat-ready) #gx-hub[hidden]::after{background-size:calc((100% - 70px)/8 + 10px) 100%}}

/* Hillside: selected deposit/withdrawal method tabs stay readable on the mint CTA background.
   Mobile mdark rule `html.hs-tpl .on { color: var(--accent) !important }` made icon+label
   the same mint as the tab background. Same .wl-pay-tab.on is used on Retrait. */
html.hs-tpl .wl-pay-tab.on,
html.hs-tpl .wl-pay-tab[aria-selected="true"]{
  color:#06281c !important;
}
html.hs-tpl .wl-pay-tab.on svg,
html.hs-tpl .wl-pay-tab[aria-selected="true"] svg{
  color:#06281c !important;
  stroke:#06281c !important;
}