/* ===========================================================
   888bet tz - theme.css
   Prefix: wb6c0-
   Mobile-first HTML5 gaming layout (max-width 430px)
   Comments in English.
   =========================================================== */

:root{
  /* Brand palette */
  --wb6c0-bg:#273746;
  --wb6c0-bg-deep:#1c2a36;
  --wb6c0-primary:#1E90FF;
  --wb6c0-accent:#7FFF00;
  --wb6c0-text:#DEE2E6;
  --wb6c0-muted:#B0E0E6;
  --wb6c0-soft:#E0FFFF;
  --wb6c0-card:#233646;
  --wb6c0-line:rgba(176,224,230,.18);
  --wb6c0-gradient:linear-gradient(135deg,#1E90FF 0%,#7FFF00 100%);
  --wb6c0-shadow:0 .4rem 1.2rem rgba(0,0,0,.28);
}

*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent;}
html{font-size:62.5%;}
body{
  font-family:"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  background:var(--wb6c0-bg);
  background-image:radial-gradient(circle at 20% 0%,rgba(30,144,255,.18),transparent 55%),
                  radial-gradient(circle at 90% 30%,rgba(127,255,0,.10),transparent 50%);
  color:var(--wb6c0-text);
  line-height:1.5rem;
  font-size:1.4rem;
  min-height:100vh;
  overflow-x:hidden;
}
a{color:var(--wb6c0-accent);text-decoration:none;}
img{max-width:100%;display:block;}

/* Layout helpers */
.wb6c0-container{width:100%;max-width:430px;margin:0 auto;padding:0 1.2rem;}
.wb6c0-wrapper{padding-top:6.2rem;padding-bottom:8rem;}

/* Header */
.wb6c0-header{
  position:fixed;top:0;left:0;right:0;z-index:1000;
  background:rgba(28,42,54,.96);
  backdrop-filter:blur(10px);
  border-bottom:.1rem solid var(--wb6c0-line);
  box-shadow:var(--wb6c0-shadow);
}
.wb6c0-header-inner{
  max-width:430px;margin:0 auto;
  display:flex;align-items:center;justify-content:space-between;
  padding:.8rem 1.2rem;gap:.6rem;
}
.wb6c0-brand{display:flex;align-items:center;gap:.6rem;min-width:0;}
.wb6c0-brand img{width:3rem;height:3rem;border-radius:.6rem;}
.wb6c0-brand-name{
  font-size:1.6rem;font-weight:800;color:var(--wb6c0-soft);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.wb6c0-brand-name b{color:var(--wb6c0-accent);}
.wb6c0-header-actions{display:flex;align-items:center;gap:.5rem;}
.wb6c0-icon-btn{
  width:3.6rem;height:3.6rem;border-radius:.8rem;border:.1rem solid var(--wb6c0-line);
  background:rgba(255,255,255,.06);color:var(--wb6c0-soft);font-size:1.6rem;
  display:flex;align-items:center;justify-content:center;cursor:pointer;
}
.wb6c0-btn{
  border:none;border-radius:.8rem;padding:.7rem 1.2rem;font-size:1.3rem;
  font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:.4rem;
  transition:transform .15s ease,filter .15s ease;min-height:3.6rem;
}
.wb6c0-btn:active{transform:scale(.96);}
.wb6c0-btn-login{background:rgba(30,144,255,.18);color:var(--wb6c0-soft);border:.1rem solid var(--wb6c0-primary);}
.wb6c0-btn-register{background:var(--wb6c0-gradient);color:#0d2230;}

/* Expandable nav menu */
.wb6c0-nav{max-height:0;overflow:hidden;transition:max-height .3s ease;background:var(--wb6c0-bg-deep);}
.wb6c0-nav.wb6c0-open{max-height:60rem;}
.wb6c0-nav-grid{
  max-width:430px;margin:0 auto;padding:.6rem 1.2rem 1rem;
  display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem;
}
.wb6c0-nav-link{
  display:flex;align-items:center;gap:.6rem;padding:.9rem 1rem;
  background:rgba(255,255,255,.05);border:.1rem solid var(--wb6c0-line);
  border-radius:.8rem;color:var(--wb6c0-text);font-size:1.25rem;font-weight:600;
}
.wb6c0-nav-link i{color:var(--wb6c0-primary);font-size:1.6rem;}
.wb6c0-nav-link:active{background:rgba(30,144,255,.15);}

/* Hero / Carousel */
.wb6c0-hero{margin:1rem 0 1.4rem;}
.wb6c0-carousel{
  position:relative;border-radius:1.2rem;overflow:hidden;
  box-shadow:var(--wb6c0-shadow);border:.1rem solid var(--wb6c0-line);
}
.wb6c0-slides{display:flex;scroll-snap-type:x mandatory;overflow-x:auto;scrollbar-width:none;}
.wb6c0-slides::-webkit-scrollbar{display:none;}
.wb6c0-slide{flex:0 0 100%;scroll-snap-align:center;position:relative;cursor:pointer;}
.wb6c0-slide img{width:100%;height:auto;}
.wb6c0-slide-cap{
  position:absolute;left:0;right:0;bottom:0;padding:1rem 1.2rem;
  background:linear-gradient(transparent,rgba(13,34,48,.92));
}
.wb6c0-slide-cap h2{font-size:1.6rem;color:var(--wb6c0-soft);font-weight:800;}
.wb6c0-slide-cap p{font-size:1.2rem;color:var(--wb6c0-muted);}
.wb6c0-dots{display:flex;justify-content:center;gap:.5rem;padding:.6rem 0;}
.wb6c0-dot{width:.8rem;height:.8rem;border-radius:50%;background:rgba(255,255,255,.3);}
.wb6c0-dot.wb6c0-active{background:var(--wb6c0-accent);}

/* Section heads */
.wb6c0-section{margin:1.6rem 0;}
.wb6c0-section-title{
  display:flex;align-items:center;gap:.6rem;margin:0 0 1rem;
  font-size:1.6rem;font-weight:800;color:var(--wb6c0-soft);
}
.wb6c0-section-title i{color:var(--wb6c0-accent);}
.wb6c0-section-title span.wb6c0-pill{
  margin-left:auto;font-size:1.05rem;font-weight:600;
  padding:.25rem .7rem;border-radius:2rem;
  background:rgba(127,255,0,.15);color:var(--wb6c0-accent);
}

/* Game grid */
.wb6c0-game-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;
}
.wb6c0-game-card{
  display:flex;flex-direction:column;align-items:center;
  background:var(--wb6c0-card);border:.1rem solid var(--wb6c0-line);
  border-radius:.9rem;padding:.6rem;cursor:pointer;transition:transform .15s,box-shadow .15s;
}
.wb6c0-game-card:active{transform:scale(.95);}
.wb6c0-game-card img{
  width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:.6rem;
  border:.1rem solid var(--wb6c0-line);
}
.wb6c0-game-name{
  margin-top:.4rem;font-size:1.1rem;color:var(--wb6c0-text);text-align:center;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;
}
.wb6c0-game-tag{
  font-size:.95rem;color:var(--wb6c0-muted);margin-top:.2rem;
}

/* Cards / generic */
.wb6c0-card{
  background:var(--wb6c0-card);border:.1rem solid var(--wb6c0-line);
  border-radius:1rem;padding:1.2rem;box-shadow:var(--wb6c0-shadow);
}
.wb6c0-card h3{color:var(--wb6c0-soft);font-size:1.4rem;margin-bottom:.6rem;font-weight:700;}
.wb6c0-card p{color:var(--wb6c0-text);font-size:1.25rem;line-height:1.7rem;}
.wb6c0-card .wb6c0-cta{
  display:inline-block;margin-top:.8rem;font-weight:700;color:var(--wb6c0-accent);
}

/* Feature / steps list */
.wb6c0-list{list-style:none;display:flex;flex-direction:column;gap:.7rem;}
.wb6c0-list li{
  display:flex;gap:.7rem;align-items:flex-start;
  background:rgba(255,255,255,.04);border-radius:.7rem;padding:.7rem .9rem;
}
.wb6c0-list li i{color:var(--wb6c0-primary);font-size:1.5rem;margin-top:.2rem;}
.wb6c0-list li span{font-size:1.2rem;color:var(--wb6c0-text);line-height:1.6rem;}

/* Inline CTA bar */
.wb6c0-cta-bar{
  background:var(--wb6c0-gradient);border-radius:1rem;padding:1.1rem 1.2rem;
  display:flex;align-items:center;justify-content:space-between;gap:.6rem;
  color:#0d2230;box-shadow:var(--wb6c0-shadow);margin:1.4rem 0;
}
.wb6c0-cta-bar b{font-size:1.4rem;}
.wb6c0-cta-bar button{
  border:none;background:#0d2230;color:var(--wb6c0-soft);
  padding:.7rem 1.2rem;border-radius:.8rem;font-weight:700;font-size:1.25rem;cursor:pointer;
}

/* Stats / RTP mini-table */
.wb6c0-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:.7rem;}
.wb6c0-stat{
  background:rgba(255,255,255,.05);border:.1rem solid var(--wb6c0-line);
  border-radius:.8rem;padding:.9rem;text-align:center;
}
.wb6c0-stat b{display:block;font-size:1.6rem;color:var(--wb6c0-accent);}
.wb6c0-stat span{font-size:1.1rem;color:var(--wb6c0-muted);}

/* Testimonial */
.wb6c0-testi{
  background:var(--wb6c0-card);border:.1rem solid var(--wb6c0-line);
  border-radius:.9rem;padding:1rem;margin-bottom:.8rem;
}
.wb6c0-testi-head{display:flex;align-items:center;gap:.6rem;margin-bottom:.4rem;}
.wb6c0-testi-avatar{width:3rem;height:3rem;border-radius:50%;background:var(--wb6c0-gradient);color:#0d2230;font-weight:800;display:flex;align-items:center;justify-content:center;}
.wb6c0-testi-name{font-weight:700;color:var(--wb6c0-soft);font-size:1.25rem;}
.wb6c0-testi-stars{color:#FFD700;font-size:1.1rem;margin-left:auto;}
.wb6c0-testi p{font-size:1.18rem;color:var(--wb6c0-text);line-height:1.6rem;}

/* Winners ticker */
.wb6c0-winners{
  display:flex;gap:.7rem;overflow-x:auto;padding:.4rem 0;scrollbar-width:none;
}
.wb6c0-winners::-webkit-scrollbar{display:none;}
.wb6c0-winner{
  flex:0 0 auto;background:rgba(127,255,0,.08);border:.1rem solid var(--wb6c0-line);
  border-radius:.8rem;padding:.6rem .9rem;font-size:1.1rem;color:var(--wb6c0-soft);
}
.wb6c0-winner b{color:var(--wb6c0-accent);}

/* Payment chips */
.wb6c0-chips{display:flex;flex-wrap:wrap;gap:.6rem;}
.wb6c0-chip{
  background:rgba(255,255,255,.05);border:.1rem solid var(--wb6c0-line);
  padding:.55rem .9rem;border-radius:2rem;font-size:1.1rem;color:var(--wb6c0-muted);
  display:flex;align-items:center;gap:.4rem;
}

/* Footer */
.wb6c0-footer{
  margin-top:2rem;padding:1.6rem 1.2rem 9rem;
  background:var(--wb6c0-bg-deep);border-top:.1rem solid var(--wb6c0-line);
}
.wb6c0-footer-inner{max-width:430px;margin:0 auto;}
.wb6c0-footer-brand{color:var(--wb6c0-muted);font-size:1.2rem;line-height:1.6rem;margin-bottom:1rem;}
.wb6c0-footer-links{
  display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem;margin-bottom:1rem;
}
.wb6c0-footer-links a{
  font-size:1.15rem;color:var(--wb6c0-text);padding:.35rem 0;
  border-bottom:.05rem solid var(--wb6c0-line);
}
.wb6c0-footer-promo{
  display:flex;flex-wrap:wrap;gap:.5rem;margin:.6rem 0 1rem;
}
.wb6c0-footer-promo button{
  flex:1 1 40%;min-width:11rem;
  background:var(--wb6c0-gradient);color:#0d2230;border:none;border-radius:.7rem;
  padding:.7rem;font-weight:700;font-size:1.2rem;cursor:pointer;
}
.wb6c0-footer-copy{font-size:1.1rem;color:var(--wb6c0-muted);text-align:center;}

/* Mobile bottom nav */
.wb6c0-bottom-nav{
  position:fixed;left:0;right:0;bottom:0;z-index:1000;
  max-width:430px;margin:0 auto;
  background:rgba(28,42,54,.98);backdrop-filter:blur(10px);
  border-top:.1rem solid var(--wb6c0-line);
  display:flex;justify-content:space-around;align-items:stretch;
  height:6rem;box-shadow:0 -.3rem 1rem rgba(0,0,0,.35);
}
.wb6c0-bottom-nav a,.wb6c0-bottom-nav button{
  flex:1;background:none;border:none;color:var(--wb6c0-muted);
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:.2rem;font-size:1.05rem;cursor:pointer;text-decoration:none;padding:.3rem;
  transition:color .15s,transform .15s;position:relative;
}
.wb6c0-bottom-nav a i,.wb6c0-bottom-nav button i{font-size:2.2rem;}
.wb6c0-bottom-nav a:active,.wb6c0-bottom-nav button:active{transform:scale(.9);}
.wb6c0-bottom-nav .wb6c0-active{color:var(--wb6c0-accent);}
.wb6c0-bottom-nav .wb6c0-active::before{
  content:"";position:absolute;top:0;width:2.4rem;height:.25rem;border-radius:.2rem;
  background:var(--wb6c0-accent);
}

/* Desktop */
@media (min-width:769px){
  .wb6c0-bottom-nav{display:none;}
  .wb6c0-container,.wb6c0-header-inner,.wb6c0-nav-grid,.wb6c0-footer-inner{max-width:760px;}
  .wb6c0-game-grid{grid-template-columns:repeat(5,1fr);}
  .wb6c0-wrapper{padding-bottom:3rem;}
  .wb6c0-footer{padding-bottom:2rem;}
}
