/* TE Smart Tabs Front (scoped, mobile-safe) */
.teTabs_wrap{
  font-family: var(--teTabs_font, Cinzel, serif);
  color:#fff;
  width:100%;
  max-width:1100px;
  margin:16px auto;
  padding:0 12px;
  box-sizing:border-box;
}
.teTabs_wrap *{ box-sizing:border-box; min-width:0; }

.teTabs_note,.teTabs_empty{
  padding:12px 14px;
  background:rgba(255,255,255,.06);
  border:1px solid var(--teTabs_border, #2a2a2a);
  border-radius:var(--teTabs_radius, 16px);
  color:rgba(255,255,255,.75);
  font-weight:700;
}

.teTabs_top{
  display:flex;
  gap:10px;
  padding:12px;
  border:1px solid var(--teTabs_border, #2a2a2a);
  border-radius:var(--teTabs_radius, 16px);
  background:rgba(255,255,255,.04);
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x;
  scrollbar-width:thin;
}
.teTabs_top::-webkit-scrollbar{height:8px}
.teTabs_top::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:99px}

.teTabs_topBtn{
  flex:0 0 auto;
  appearance:none;
  border:1px solid var(--teTabs_border, #2a2a2a);
  border-radius:999px;
  padding:10px 14px;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-weight:800;
  letter-spacing:.2px;
  background:var(--teTabs_inactive_bg, #111);
  color:var(--teTabs_inactive_text, #fff);
  transition:transform .15s ease, filter .15s ease;
  white-space:nowrap;
}
.teTabs_topBtn:hover{transform:translateY(-1px);filter:brightness(1.08)}
.teTabs_topBtn:focus{outline:none; box-shadow:0 0 0 3px rgba(243,208,106,.25)}

.teTabs_isGradient .teTabs_topBtn.is-active,
.teTabs_isGradient .teTabs_subBtn.is-active{
  background:linear-gradient(135deg,#ffe8a6,var(--teTabs_active_bg,#f3d06a),#b88a1f);
}
.teTabs_isSolid .teTabs_topBtn.is-active,
.teTabs_isSolid .teTabs_subBtn.is-active{
  background:var(--teTabs_active_bg,#f3d06a);
}
.teTabs_topBtn.is-active,
.teTabs_subBtn.is-active{
  color:var(--teTabs_active_text,#111);
  border-color:rgba(243,208,106,.55);
}

.teTabs_btnIcon{
  width:20px;height:20px;object-fit:cover;border-radius:6px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.08);
}

.teTabs_panels{margin-top:12px}
.teTabs_panel{
  border:1px solid var(--teTabs_border, #2a2a2a);
  border-radius:var(--teTabs_radius, 16px);
  background:var(--teTabs_panel_bg, #0b0b0b);
  overflow:hidden; /* keep layout locked */
  max-width:100%;
}

.teTabs_body--triple{
  display:grid;
  grid-template-columns:220px 1fr 220px;
  min-height:340px;
}
.teTabs_body--triple.no-left{grid-template-columns:1fr 220px;}
.teTabs_body--triple.no-right{grid-template-columns:220px 1fr;}

.teTabs_side{
  background:rgba(255,255,255,.03);
  padding:12px;
}
.teTabs_side--left{border-right:1px solid var(--teTabs_border, #2a2a2a)}
.teTabs_side--right{border-left:1px solid var(--teTabs_border, #2a2a2a)}

.teTabs_sub{display:flex;flex-direction:column;gap:10px;}

.teTabs_subBtn{
  appearance:none;
  border:1px solid var(--teTabs_border, #2a2a2a);
  border-radius:14px;
  padding:10px 12px;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:10px;
  text-align:left;
  font-weight:800;
  background:var(--teTabs_inactive_bg,#111);
  color:var(--teTabs_inactive_text,#fff);
  transition:transform .15s ease, filter .15s ease;
  white-space:nowrap;
}
.teTabs_subBtn:hover{transform:translateY(-1px);filter:brightness(1.08)}

.teTabs_content{padding:14px;background:rgba(255,255,255,.02);max-width:100%;}
.teTabs_content--single{padding:18px}

.teTabs_headerLogo{padding:10px 10px 0 10px;}
.teTabs_headerLogo img{
  max-height:54px;
  width:auto;
  display:block;
  filter:drop-shadow(0 8px 18px rgba(0,0,0,.35));
}

.teTabs_inner{padding-top:10px; overflow-wrap:anywhere;}
.teTabs_inner img, .teTabs_inner iframe, .teTabs_inner video{max-width:100%;}
.teTabs_inner iframe{width:100%;}

/* Mobile: sub menu jadi 1 bar swipe, side columns disembunyikan */
.teTabs_subMobile{
  display:none;
  gap:10px;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  touch-action:pan-x;
  padding:10px 4px 12px;
  border-bottom:1px solid var(--teTabs_border, #2a2a2a);
  scrollbar-width:thin;
}
.teTabs_subMobile::-webkit-scrollbar{height:8px}
.teTabs_subMobile::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:99px}
.teTabs_subBtn--mobile{flex:0 0 auto;border-radius:999px;}

@media (max-width: 860px){
  .teTabs_wrap{padding:0 10px;}
  .teTabs_body--triple,
  .teTabs_body--triple.no-left,
  .teTabs_body--triple.no-right{grid-template-columns:1fr;}
  .teTabs_side{display:none;}
  .teTabs_subMobile{display:flex;}
}
