/* Tokowebku modern colorful theme - mobile first */
:root{
  --twk-primary:#2563eb;
  --twk-primary2:#7c3aed;
  --twk-accent:#f97316;
  --twk-bg:#f6f7fb;
  --twk-card:#ffffff;
  --twk-border:rgba(17,24,39,.08);
  --twk-text:#111827;
  --twk-muted:rgba(17,24,39,.65);
  --twk-radius:18px;
}

/* anti horizontal scroll */
html, body{max-width:100%; overflow-x:hidden;}
*{box-sizing:border-box;}
img, video, iframe{max-width:100%; height:auto;}
.container{max-width:1100px;}
body{
  background: radial-gradient(1200px 600px at 10% -10%, rgba(124,58,237,.20), transparent 60%),
              radial-gradient(1200px 600px at 90% 0%, rgba(37,99,235,.18), transparent 55%),
              var(--twk-bg);
  color:var(--twk-text);
}

/* navbar */
.navbar{
  backdrop-filter:saturate(140%) blur(8px);
}
.navbar.bg-white{background:rgba(255,255,255,.88)!important;}
.navbar-brand{font-weight:900; letter-spacing:.2px;}
.navbar .btn, .navbar .nav-link{font-weight:700;}

/* cards */
.card{
  border:1px solid var(--twk-border)!important;
  border-radius:var(--twk-radius)!important;
  box-shadow: 0 10px 30px rgba(17,24,39,.06);
}
.card-img-top{border-top-left-radius:var(--twk-radius)!important; border-top-right-radius:var(--twk-radius)!important;}
.card-footer{border-top:0!important; border-bottom-left-radius:var(--twk-radius)!important; border-bottom-right-radius:var(--twk-radius)!important;}

/* buttons */
.btn{
  border-radius:14px!important;
}
.btn-primary{
  background: linear-gradient(135deg, var(--twk-primary), var(--twk-primary2))!important;
  border:0!important;
  box-shadow: 0 10px 22px rgba(37,99,235,.22);
}
.btn-outline-primary{
  border-color: rgba(37,99,235,.35)!important;
}

/* badges */
.badge{
  border-radius:999px!important;
  padding:.45rem .65rem!important;
}

/* sections */
.section-title{
  font-weight:900;
  letter-spacing:.2px;
}

/* category grid improvements (avoid overflow) */
.twk-cat-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:12px;
}
@media (max-width: 900px){
  .twk-cat-grid{grid-template-columns: repeat(4, minmax(0,1fr)); gap:10px;}
}
@media (max-width: 520px){
  .twk-cat-grid{grid-template-columns: repeat(3, minmax(0,1fr)); gap:10px;}
}

/* product list grids */
.twk-product-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap:14px;
}
@media (max-width: 900px){
  .twk-product-grid{grid-template-columns: repeat(2, minmax(0,1fr));}
}
@media (max-width: 520px){
  .twk-product-grid{grid-template-columns: 1fr;}
}

/* tables on mobile */
.table-responsive{overflow-x:auto; -webkit-overflow-scrolling:touch;}
table{width:100%;}

/* sticky bottom bar (product/cart) */
.twk-stickybar{
  position:sticky;
  bottom:10px;
  z-index:5;
  background:rgba(255,255,255,.92);
  border:1px solid var(--twk-border);
  border-radius:20px;
  padding:12px;
  box-shadow:0 20px 40px rgba(17,24,39,.10);
}

/* small helpers */
.twk-muted{color:var(--twk-muted);}