/* Cazeus UI — load AFTER style.css
   Chips: dark + gold
   CTAs / search / tags / sidebar: blue #1755CA + gold frame + gold text
   No oversized CTA frames; banners untouched
*/

:root{
  --cz-blue:#1755CA;
  --cz-gold:#D4AF37;
  --cz-gold-text:#E8C76A;
  --cz-dark:#13182A;
  --casea-btn-blue:#1755CA !important;
  --casea-btn-gold:#D4AF37 !important;
  --chip-btn-face:#13182A !important;
  --chip-green-face:#13182A !important;
  --chip-green-frame:#D4AF37 !important;
}

/* ========== CHIPS: dark + gold ========== */
html body .chips,
html body main .chips,
html body .shell .chips{
  background:#13182A !important;
  background-color:#13182A !important;
  border:1.5px solid #D4AF37 !important;
  border-radius:999px !important;
  box-shadow:none !important;
}

html body .chips a.chip,
html body main .chips a.chip,
html body .shell .chips a.chip,
html body a.chip,
html body .chip,
html body a.chip.chip{
  background:#13182A !important;
  background-color:#13182A !important;
  background-image:none !important;
  border:1.5px solid #D4AF37 !important;
  border-color:#D4AF37 !important;
  border-radius:999px !important;
  color:#E8C76A !important;
  -webkit-text-fill-color:#E8C76A !important;
  text-shadow:none !important;
  box-shadow:none !important;
  filter:none !important;
}

html body .chips a.chip .chip-txt,
html body .chip .chip-txt,
html body .chips a.chip .chip-ico,
html body .chip .chip-ico,
html body .chips a.chip svg,
html body .chip svg,
html body .chips a.chip svg path,
html body .chip svg path{
  color:#E8C76A !important;
  -webkit-text-fill-color:#E8C76A !important;
  stroke:#E8C76A !important;
  fill:none !important;
}

html body .chips a.chip::before,
html body .chips a.chip::after,
html body .chip::before,
html body .chip::after{
  content:none !important;
  display:none !important;
  background:none !important;
  opacity:0 !important;
}

/* ========== BLUE + GOLD: search, CTAs, tags, sidebar ========== */
html body header .head-search-ico,
html body .head .head-search-ico,
html body .head-search-ico,
html body header .burger,
html body .head .burger,
html body .burger,
html body header .offers-trigger,
html body .head .offers-trigger,
html body .offers-trigger,
html body header .btn--login,
html body header .btn--reg,
html body .head .btn--login,
html body .head .btn--reg,
html body .btn--login,
html body .btn--reg,
html body .pulse-btn,
html body .vmore-btn,
html body .ft-btn,
html body .hero-cta,
html body .play,
html body .game-play-btn,
html body .home-section-tag,
html body .app-section-tag,
html body .app-tag,
html body #login#login > .home-section-tag,
html body #bonuses#bonuses > .home-section-tag,
html body #payments#payments > .home-section-tag,
html body #slots#slots > .home-section-tag,
html body #games#games > .home-section-tag,
html body #app#app > .home-section-tag,
html body #providers#providers > .home-section-tag,
html body #register#register > .home-section-tag,
html body .aside .nav a,
html body .aside .nav a.is-active,
html body .aside .nav a:hover,
html body .drawer .nav a,
html body .drawer .nav a.is-active,
html body .drawer .nav a:hover,
html body .shell > .aside .nav a,
html body #drawer .nav a,
html body #drawer .nav a.is-active,
html body #drawer .nav a:hover{
  background:#1755CA !important;
  background-color:#1755CA !important;
  background-image:none !important;
  border:1.5px solid #D4AF37 !important;
  border-color:#D4AF37 !important;
  color:#E8C76A !important;
  -webkit-text-fill-color:#E8C76A !important;
  text-shadow:none !important;
  box-shadow:none !important;
  filter:none !important;
  clip-path:none !important;
}

html body :is(.btn--login,.btn--reg,.pulse-btn,.vmore-btn,.ft-btn,.hero-cta,.aside .nav a,.drawer .nav a,#drawer .nav a,.home-section-tag,.app-section-tag,.app-tag){
  border-radius:999px !important;
}

html body :is(.head-search-ico,.burger,.offers-trigger){
  border-radius:10px !important;
  color:#E8C76A !important;
  -webkit-text-fill-color:#E8C76A !important;
}

/* Lupa / icons: gold (not black) */
html body .head-search-ico svg,
html body .head-search-ico svg path,
html body .head-search-ico svg circle,
html body .burger svg path,
html body .offers-trigger__ico{
  color:#E8C76A !important;
  stroke:#E8C76A !important;
  fill:none !important;
  filter:none !important;
  opacity:1 !important;
}

html body .aside .nav a .nav-txt,
html body .drawer .nav a .nav-txt,
html body #drawer .nav a .nav-txt{
  color:#E8C76A !important;
  -webkit-text-fill-color:#E8C76A !important;
}

html body .aside .nav a svg.nav-ico,
html body .drawer .nav a svg.nav-ico{
  color:#E8C76A !important;
  stroke:#E8C76A !important;
  filter:none !important;
}
html body .aside .nav a svg.nav-ico :is(path,circle,rect,line),
html body .drawer .nav a svg.nav-ico :is(path,circle,rect,line){
  stroke:#E8C76A !important;
}
html body .aside .nav a img.nav-ico,
html body .drawer .nav a img.nav-ico{
  filter:brightness(0) saturate(100%) invert(79%) sepia(46%) saturate(618%) hue-rotate(8deg) brightness(98%) contrast(92%) !important;
  opacity:1 !important;
}

html body :is(.btn--login,.btn--reg,.pulse-btn,.vmore-btn,.ft-btn,.head-search-ico,.burger,.offers-trigger,.aside .nav a,.drawer .nav a)::before,
html body :is(.btn--login,.btn--reg,.pulse-btn,.vmore-btn,.ft-btn,.head-search-ico,.burger,.offers-trigger,.aside .nav a,.drawer .nav a)::after{
  content:none !important;
  display:none !important;
  background:none !important;
  opacity:0 !important;
  box-shadow:none !important;
}

html body .game-play-btn{
  border-radius:12px !important;
  transform:translate(-50%,-50%) !important;
}

/* ========== LEGAL PAGES: blue + gold (no peach) ========== */
html body.legal-page #legal-guide#legal-guide > .legal-note::before{
  background:#1755CA !important;
  background-color:#1755CA !important;
  background-image:none !important;
  border:1.5px solid #D4AF37 !important;
  border-radius:999px !important;
  color:#E8C76A !important;
  -webkit-text-fill-color:#E8C76A !important;
  box-shadow:none !important;
}
html body.legal-page #legal-guide#legal-guide .legal-content-card,
html body.legal-page #legal-guide#legal-guide .legal-content-card--alt,
html body.legal-page #legal-guide#legal-guide .legal-content-card--warn{
  --legal-accent:#1755CA !important;
}
html body.legal-page #legal-guide#legal-guide .legal-content-card a:not(.pulse-btn){
  color:#E8C76A !important;
  -webkit-text-fill-color:#E8C76A !important;
  text-decoration-color:#D4AF37 !important;
}
html body.legal-page #legal-guide#legal-guide .legal-content-card > ul li::before,
html body.legal-page #legal-guide#legal-guide .legal-content-card > ol li::before,
html body.legal-page #legal-guide#legal-guide .legal-content-card--warn > ul li::before{
  background:#1755CA !important;
  background-color:#1755CA !important;
  border:1px solid #D4AF37 !important;
  color:#E8C76A !important;
  -webkit-text-fill-color:#E8C76A !important;
}
html body.legal-page #legal-guide#legal-guide .legal-content-card > h2{
  border-bottom-color:rgba(212,175,55,.45) !important;
}

/* ========== NO big gold frame around CTA-only buttons ========== */
html body main #casino-cta,
html body main #casino-cta.section,
html body main .cta-center,
html body .cta-center,
html body .login-banner-block__cta{
  border:none !important;
  border-color:transparent !important;
  box-shadow:none !important;
  outline:none !important;
  background:transparent !important;
}

/* ========== BLOCKS: full gold frame on all content sections ========== */
html body main :is(
  .section:not(#casino-cta),
  .intro--lead, .app-info-card, .legal-content-card,
  .bonus-content-card, .login-content-card, .home-intro-rating,
  .login-os-card, .home-app-guide-card, .frame,
  .table-wrapper, .app-info-card__table, .app-specs-table, .app-overview-table,
  .popular-games, .facts-info-section, .login-section
),
html body main :is(
  #bonus, #payments, #slots, #games, #app, #providers, #register, #login, #facts,
  #casino-intro, #bonuses
),
html body #login#login.login-section,
html body #bonuses#bonuses,
html body #payments#payments,
html body #slots#slots,
html body #games#games,
html body #app#app,
html body #providers#providers,
html body #register#register,
html body #facts#facts,
html body #casino-intro#casino-intro,
html body .shell > main,
html body main,
html body .aside,
html body .shell > .aside,
html body .drawer,
html body.app-page :is(
  .app-ecosystem-section, .app-features-section, .app-bonus-section,
  .app-feature-card, .app-bonus-card, .app-eco-card, .app-bonus-claim,
  .app-top-hero, .app-reference-section
){
  border:1.5px solid #D4AF37 !important;
  border-color:#D4AF37 !important;
  border-radius:16px !important;
}

/* 4th screen only: NO frame on slots intro paragraph */
html body #slots#slots > p:not(.home-section-tag),
html body main #slots > p:not(.home-section-tag){
  border:none !important;
  border-color:transparent !important;
  box-shadow:none !important;
  outline:none !important;
  background:transparent !important;
  padding-left:0 !important;
  padding-right:0 !important;
}

/* Game thumbs: no full card frame (section already framed) */
html body #slots#slots .popular-games__card,
html body #games#games .card,
html body main .popular-games__card,
html body main a.card{
  border:none !important;
}

/* Hero promo banners: no extra chrome on the image itself */
html body :is(.home-hero img, .hero img, .banner img){
  filter:none !important;
}

html body .home-hero,
html body .home-hero__link{
  border:none !important;
  box-shadow:none !important;
  outline:none !important;
  background:transparent !important;
}

/* Login form banner: only thin gold frame around the form image (no thick outer box) */
html body .login-banner-block,
html body #login#login .login-banner-block,
html body.acceso-page #login-guide#login-guide .login-banner-block,
html body.acceso-page #login-guide#login-guide .login-lead-combined > .login-banner-block{
  background:transparent !important;
  background-color:transparent !important;
  border:none !important;
  border-color:transparent !important;
  border-radius:0 !important;
  box-shadow:none !important;
  padding:0 !important;
  outline:none !important;
}

html body .login-banner-block__link,
html body #login#login .login-banner-block__link,
html body.acceso-page #login-guide#login-guide .login-banner-block__link,
html body.acceso-page #login-guide#login-guide .login-lead-combined .login-banner-block__link{
  display:block !important;
  overflow:hidden !important;
  border:1.5px solid #D4AF37 !important;
  border-color:#D4AF37 !important;
  border-radius:12px !important;
  background:#0B1020 !important;
  box-shadow:0 0 0 1px rgba(212,175,55,.18) inset !important;
  outline:none !important;
  padding:0 !important;
}

html body .login-banner-block__img,
html body #login#login .login-banner-block__img,
html body.acceso-page #login-guide#login-guide .login-banner-block__img,
html body img.login-banner-block__img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  max-height:none !important;
  object-fit:contain !important;
  border:none !important;
  border-radius:10px !important;
  box-shadow:none !important;
  filter:none !important;
  background:#0B1020 !important;
}

html body .login-banner-block__cta,
html body #login#login .login-banner-block__cta,
html body.acceso-page #login-guide#login-guide .login-banner-block__cta{
  margin-top:12px !important;
  border:none !important;
  background:transparent !important;
  box-shadow:none !important;
}

/* App page hero banner: full image, no crop */
html body.app-page .app-top-hero{
  align-items:start !important;
}
html body.app-page .app-top-hero__media{
  overflow:visible !important;
  background:#0B1020 !important;
  border:1.5px solid #D4AF37 !important;
  border-radius:16px !important;
  padding:0 !important;
  min-height:0 !important;
  max-height:none !important;
}
html body.app-page .app-top-hero__media img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  max-width:100% !important;
  max-height:none !important;
  min-height:0 !important;
  object-fit:contain !important;
  object-position:center top !important;
  border:none !important;
  border-radius:14px !important;
  background:transparent !important;
}
@media (max-width:860px){
  html body.app-page .app-top-hero__media{
    max-width:min(420px, 100%) !important;
    margin:0 auto !important;
  }
}

/* Ecosystem: laptop visual on the right — no frame */
html body.app-page .app-ecosystem-intro{
  grid-template-columns:minmax(0,1.2fr) minmax(220px,320px) !important;
  align-items:center !important;
  gap:28px !important;
}
html body.app-page .app-ecosystem-visual{
  background:#13182A !important;
  background-color:#13182A !important;
  border:none !important;
  box-shadow:none !important;
  outline:none !important;
  padding:12px !important;
  min-height:0 !important;
  overflow:hidden !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  border-radius:12px !important;
}
html body.app-page .app-ecosystem-visual img{
  width:min(320px,100%) !important;
  max-width:100% !important;
  height:auto !important;
  border:none !important;
  border-radius:0 !important;
  box-shadow:none !important;
  object-fit:contain !important;
  background:#13182A !important;
}
@media (max-width:900px){
  html body.app-page .app-ecosystem-intro{
    grid-template-columns:1fr !important;
  }
  html body.app-page .app-ecosystem-visual img{
    width:min(280px,70%) !important;
    margin:0 auto !important;
  }
}

/* Odds: text left + banner right (like reference layout) */
html body.app-page .app-odds-intro{
  display:grid !important;
  grid-template-columns:minmax(0,1.1fr) minmax(260px,1fr) !important;
  gap:22px !important;
  align-items:center !important;
  width:100% !important;
}
html body.app-page .app-odds-banner{
  position:relative !important;
  min-height:0 !important;
  overflow:hidden !important;
  padding:0 !important;
  background:transparent !important;
  border:none !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
html body.app-page .app-odds-banner > img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  min-height:0 !important;
  object-fit:contain !important;
  object-position:center !important;
  border:none !important;
  border-radius:0 !important;
}
html body.app-page .app-odds-lead{
  margin-top:16px !important;
}
@media (max-width:860px){
  html body.app-page .app-odds-intro{
    grid-template-columns:1fr !important;
  }
}

/* Compact single-phone shots: play / bonus / payments — no wasted space */
html body.app-page .app-play-layout,
html body.app-page .app-bonus-layout,
html body.app-page .app-payments-layout{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 210px !important;
  gap:16px !important;
  align-items:start !important;
}
html body.app-page .app-play-shots,
html body.app-page .app-play-shots.app-phone-shot,
html body.app-page .app-bonus-shots,
html body.app-page .app-bonus-shots.app-phone-shot,
html body.app-page .app-payment-phones,
html body.app-page .app-payment-phones.app-phone-shot{
  display:block !important;
  grid-template-columns:none !important;
  width:210px !important;
  max-width:210px !important;
  margin:0 0 0 auto !important;
  padding:0 !important;
  justify-self:end !important;
  gap:0 !important;
}
html body.app-page .app-play-shot,
html body.app-page .app-bonus-shots figure,
html body.app-page .app-bonus-shots.app-phone-shot figure,
html body.app-page .app-payment-phone{
  display:block !important;
  grid-template-rows:none !important;
  margin:0 !important;
  padding:0 !important;
  background:transparent !important;
  border:1.5px solid #D4AF37 !important;
  box-shadow:0 10px 22px rgba(0,0,0,.35) !important;
  overflow:hidden !important;
  border-radius:22px !important;
  height:auto !important;
  max-height:420px !important;
}
html body.app-page .app-play-shot img,
html body.app-page .app-bonus-shots img,
html body.app-page .app-bonus-shots.app-phone-shot img,
html body.app-page .app-payment-phone__screen > img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  max-height:420px !important;
  min-height:0 !important;
  object-fit:cover !important;
  object-position:top center !important;
  border:none !important;
  border-radius:0 !important;
  background:transparent !important;
  filter:none !important;
}
html body.app-page .app-payment-phone__screen{
  display:block !important;
  width:100% !important;
  height:auto !important;
  max-height:420px !important;
  min-height:0 !important;
  align-items:stretch !important;
  justify-content:stretch !important;
  border:none !important;
  box-shadow:none !important;
  background:transparent !important;
  padding:0 !important;
  aspect-ratio:auto !important;
  overflow:hidden !important;
}
html body.app-page .app-play-shot figcaption,
html body.app-page .app-bonus-shots figcaption,
html body.app-page .app-payment-phone figcaption{
  display:none !important;
}
html body.app-page .app-bonus-section .app-bonus-grid{
  gap:14px !important;
}
html body.app-page .app-bonus-section .app-bonus-card{
  min-height:0 !important;
  padding:18px 16px !important;
}
html body.app-page .app-play-section > .app-dl-row{
  margin-top:16px !important;
}
@media (max-width:900px){
  html body.app-page .app-play-layout,
  html body.app-page .app-bonus-layout,
  html body.app-page .app-payments-layout{
    grid-template-columns:1fr !important;
  }
  html body.app-page .app-play-shots,
  html body.app-page .app-play-shots.app-phone-shot,
  html body.app-page .app-bonus-shots,
  html body.app-page .app-bonus-shots.app-phone-shot,
  html body.app-page .app-payment-phones,
  html body.app-page .app-payment-phones.app-phone-shot{
    width:min(210px,72vw) !important;
    max-width:210px !important;
    margin:10px auto 0 !important;
    justify-self:center !important;
  }
}

/* App screenshots: show only top half of each phone screen */
html body.app-page .app-screenshots-section .app-shots,
html body.app-page .app-screenshots-section .app-shots--phones{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  gap:10px !important;
  height:260px !important;
  overflow:hidden !important;
  background:transparent !important;
  border:none !important;
}
html body.app-page .app-screenshots-section .app-shot{
  height:260px !important;
  min-height:0 !important;
  overflow:hidden !important;
  border:1.5px solid #D4AF37 !important;
  border-radius:14px 14px 0 0 !important;
  background:#0B1020 !important;
}
html body.app-page .app-screenshots-section .app-shot img{
  display:block !important;
  width:100% !important;
  height:auto !important;
  max-height:none !important;
  min-height:100% !important;
  object-fit:cover !important;
  object-position:top center !important;
  border-radius:0 !important;
}
@media (max-width:560px){
  html body.app-page .app-screenshots-section .app-shots,
  html body.app-page .app-screenshots-section .app-shots--phones{
    display:flex !important;
    grid-template-columns:none !important;
    height:250px !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
  }
  html body.app-page .app-screenshots-section .app-shot{
    flex:0 0 calc((100% - 10px) / 2.15) !important;
    height:250px !important;
  }
}