/* ============ GLASSMORPHISM — frosted layers over vibrant depth ============ */
html[data-dstyle="glassmorphism"] {
  --tb-bg: #070b18;
  --tb-surface: rgba(255,255,255,.08);
  --tb-border: rgba(255,255,255,.18);
  --tb-text: #f2f5fc;
  --tb-muted: #a8b1c7;
  --tb-faint: #6b7490;
  --tb-accent: #8b7cf6;
  --tb-accent-soft: rgba(139,124,246,.22);
  --tb-accent-ink: #efeaff;
  --tb-accent-glow: rgba(139,124,246,.5);
  --chart-text: #a8b1c7;
  --chart-grid: rgba(255,255,255,.08);
  --chart-tip-bg: rgba(10,14,28,.92);
  --chart-tip-text: #eef1f8;
  --chart-series: #a78bfa;
  --chart-area-from: rgba(167,139,250,.4);
  --chart-area-to: rgba(167,139,250,0);
}
html[data-dstyle="glassmorphism"] body.tb-body {
  font-family: 'Vazirmatn', 'Inter', Tahoma, sans-serif;
  color: #f2f5fc;
  background:
    radial-gradient(560px 560px at 12% 8%, rgba(56,189,248,.35), transparent 65%),
    radial-gradient(640px 640px at 88% 12%, rgba(168,85,247,.42), transparent 65%),
    radial-gradient(720px 720px at 55% 105%, rgba(52,211,153,.28), transparent 65%),
    radial-gradient(420px 420px at 78% 62%, rgba(244,114,182,.22), transparent 65%),
    #070b18;
  background-attachment: fixed;
}
/* frosted sheets */
html[data-dstyle="glassmorphism"] .tb-sidebar,
html[data-dstyle="glassmorphism"] .tb-card,
html[data-dstyle="glassmorphism"] .tb-dstyles {
  background: linear-gradient(160deg, rgba(255,255,255,.13), rgba(255,255,255,.04) 55%, rgba(255,255,255,.09));
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 22px;
  backdrop-filter: blur(18px) saturate(1.4);
  -webkit-backdrop-filter: blur(18px) saturate(1.4);
  box-shadow: 0 24px 60px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.35);
}
html[data-dstyle="glassmorphism"] .tb-sidebar { border-radius: 24px; }
html[data-dstyle="glassmorphism"] .tb-brand { border-bottom: 1px solid rgba(255,255,255,.14); }
html[data-dstyle="glassmorphism"] .tb-brand-name { color: #fff; font-weight: 800; text-shadow: 0 2px 12px rgba(139,124,246,.6); }
html[data-dstyle="glassmorphism"] .tb-bot-avatar {
  background: linear-gradient(135deg, rgba(96,165,250,.8), rgba(167,139,250,.8));
  border: 1px solid rgba(255,255,255,.4); border-radius: 14px;
  box-shadow: 0 8px 24px rgba(139,124,246,.55), inset 0 1px 0 rgba(255,255,255,.5);
}
html[data-dstyle="glassmorphism"] .tb-nav a {
  color: #c2c9dd; border: 1px solid transparent; border-radius: 14px; font-weight: 500;
}
html[data-dstyle="glassmorphism"] .tb-nav a:hover { background: rgba(255,255,255,.09); color: #fff; }
html[data-dstyle="glassmorphism"] .tb-nav a.tb-active {
  background: linear-gradient(120deg, rgba(139,124,246,.55), rgba(56,189,248,.3));
  border: 1px solid rgba(255,255,255,.35); color: #fff;
  box-shadow: 0 10px 30px rgba(139,124,246,.5), inset 0 1px 0 rgba(255,255,255,.45);
}
html[data-dstyle="glassmorphism"] .tb-nav .tb-ico { background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.12); border-radius: 12px; }
html[data-dstyle="glassmorphism"] .tb-nav .tb-tag {
  background: rgba(251,191,36,.2); color: #ffe1a1; border: 1px solid rgba(251,191,36,.4);
  backdrop-filter: blur(8px);
}
html[data-dstyle="glassmorphism"] .tb-promo {
  background: linear-gradient(170deg, rgba(56,189,248,.25), rgba(139,124,246,.18));
  border: 1px solid rgba(255,255,255,.25); border-radius: 20px; color: #eef1f8;
  box-shadow: 0 16px 44px rgba(56,189,248,.3), inset 0 1px 0 rgba(255,255,255,.4);
  backdrop-filter: blur(20px);
}
html[data-dstyle="glassmorphism"] .tb-promo p { color: #c2c9dd; }
/* topbar glass chips */
html[data-dstyle="glassmorphism"] .tb-search {
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.2);
  border-radius: 14px; backdrop-filter: blur(16px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 8px 24px rgba(0,0,0,.3);
}
html[data-dstyle="glassmorphism"] .tb-search input { color: #f2f5fc; }
html[data-dstyle="glassmorphism"] .tb-search input::placeholder { color: #6b7490; }
html[data-dstyle="glassmorphism"] .tb-icon-btn {
  width: 38px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.2);
  border-radius: 12px; color: #c2c9dd; backdrop-filter: blur(14px);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
}
html[data-dstyle="glassmorphism"] .tb-icon-btn:hover { color: #fff; border-color: rgba(255,255,255,.4); }
html[data-dstyle="glassmorphism"] .tb-avatar {
  background: linear-gradient(135deg, rgba(255,255,255,.25), rgba(255,255,255,.08));
  border: 1px solid rgba(255,255,255,.35); color: #fff; backdrop-filter: blur(10px);
}
html[data-dstyle="glassmorphism"] .tb-user-sub { color: #6ee7b7; }
/* titles float above glass */
html[data-dstyle="glassmorphism"] .tb-title { color: #fff; font-weight: 800; text-shadow: 0 2px 20px rgba(139,124,246,.5); }
html[data-dstyle="glassmorphism"] .tb-subtitle { color: #a8b1c7; }
html[data-dstyle="glassmorphism"] .tb-status-pill {
  background: rgba(52,211,153,.12); border: 1px solid rgba(52,211,153,.45); color: #8df0c6;
  border-radius: 999px; backdrop-filter: blur(12px);
  box-shadow: 0 0 24px rgba(52,211,153,.25), inset 0 1px 0 rgba(255,255,255,.3);
}
/* KPI: light numerals on frost */
html[data-dstyle="glassmorphism"] .tb-kpi::after { background: linear-gradient(180deg, var(--tb-kpi-accent, #a78bfa), transparent); box-shadow: 0 0 12px var(--tb-kpi-accent, #a78bfa); }
html[data-dstyle="glassmorphism"] .tb-kpi-label { color: #c2c9dd; }
html[data-dstyle="glassmorphism"] .tb-kpi-num { color: #fff; font-weight: 300; font-size: 34px; text-shadow: 0 0 30px rgba(167,139,250,.45); }
html[data-dstyle="glassmorphism"] .tb-kpi-ico {
  background: var(--tb-kpi-bg, rgba(167,139,250,.16)); color: var(--tb-kpi-accent, #a78bfa);
  border: 1px solid rgba(255,255,255,.2); border-radius: 14px; backdrop-filter: blur(8px);
}
html[data-dstyle="glassmorphism"] .tb-kpi-sub { color: #6b7490; }
/* buttons: glass slabs */
html[data-dstyle="glassmorphism"] .tb-btn, html[data-dstyle="glassmorphism"] .tb-dstyle {
  width: auto; background: linear-gradient(150deg, rgba(139,124,246,.5), rgba(99,102,241,.3));
  border: 1px solid rgba(255,255,255,.35); border-radius: 14px; color: #fff;
  backdrop-filter: blur(12px);
  box-shadow: 0 10px 28px rgba(139,124,246,.4), inset 0 1px 0 rgba(255,255,255,.5);
}
html[data-dstyle="glassmorphism"] .tb-btn:hover { border-color: rgba(255,255,255,.55); box-shadow: 0 12px 34px rgba(139,124,246,.55), inset 0 1px 0 rgba(255,255,255,.6); }
html[data-dstyle="glassmorphism"] .tb-btn:active { transform: translateY(1px); box-shadow: 0 4px 14px rgba(139,124,246,.4), inset 0 2px 8px rgba(0,0,0,.25); }
html[data-dstyle="glassmorphism"] .tb-btn.tb-green { background: linear-gradient(150deg, rgba(52,211,153,.45), rgba(16,185,129,.25)); box-shadow: 0 10px 28px rgba(52,211,153,.35), inset 0 1px 0 rgba(255,255,255,.5); }
html[data-dstyle="glassmorphism"] .tb-btn.tb-red { background: linear-gradient(150deg, rgba(248,113,113,.45), rgba(239,68,68,.25)); box-shadow: 0 10px 28px rgba(248,113,113,.35), inset 0 1px 0 rgba(255,255,255,.5); }
html[data-dstyle="glassmorphism"] .tb-btn.tb-ghost { background: rgba(255,255,255,.07); color: #c2c9dd; box-shadow: inset 0 1px 0 rgba(255,255,255,.2); }
html[data-dstyle="glassmorphism"] .tb-dstyle { background: rgba(255,255,255,.07); color: #c2c9dd; box-shadow: inset 0 1px 0 rgba(255,255,255,.2); }
html[data-dstyle="glassmorphism"] .tb-dstyle.tb-dstyle-on {
  background: linear-gradient(150deg, rgba(139,124,246,.55), rgba(56,189,248,.35)); color: #fff;
  border-color: rgba(255,255,255,.5);
  box-shadow: 0 8px 26px rgba(139,124,246,.55), inset 0 1px 0 rgba(255,255,255,.55);
}
/* pills + inputs */
html[data-dstyle="glassmorphism"] .tb-pill {
  background: rgba(255,255,255,.07); color: #c2c9dd; border: 1px solid rgba(255,255,255,.16);
  border-radius: 12px; backdrop-filter: blur(10px);
}
html[data-dstyle="glassmorphism"] .tb-pill.tb-on {
  background: linear-gradient(120deg, rgba(139,124,246,.5), rgba(56,189,248,.3)); color: #fff;
  border-color: rgba(255,255,255,.4);
}
html[data-dstyle="glassmorphism"] .tb-input {
  background: rgba(0,0,0,.25); border: 1px solid rgba(255,255,255,.2); border-radius: 12px; color: #f2f5fc;
  box-shadow: inset 0 2px 10px rgba(0,0,0,.4); backdrop-filter: blur(8px);
}
html[data-dstyle="glassmorphism"] .tb-input::placeholder { color: #6b7490; }
html[data-dstyle="glassmorphism"] select.tb-input { background: rgba(20,26,44,.7); }
html[data-dstyle="glassmorphism"] select.tb-input option { background: #141b2d; color: #eef1f8; }
/* tables */
html[data-dstyle="glassmorphism"] .tb-table thead th { color: #8b94ad; border-bottom: 1px solid rgba(255,255,255,.16); }
html[data-dstyle="glassmorphism"] .tb-table tbody td { color: #dfe4f0; border-bottom: 1px solid rgba(255,255,255,.07); }
html[data-dstyle="glassmorphism"] .tb-table tbody tr:hover { background: rgba(139,124,246,.1); }
html[data-dstyle="glassmorphism"] .tb-badge {
  border-radius: 999px; backdrop-filter: blur(8px);
  background: rgba(96,165,250,.16); color: #c4dbff; border: 1px solid rgba(96,165,250,.45);
  box-shadow: 0 0 16px rgba(96,165,250,.25);
}
html[data-dstyle="glassmorphism"] .tb-badge.tb-green { background: rgba(52,211,153,.14); color: #8df0c6; border-color: rgba(52,211,153,.45); }
html[data-dstyle="glassmorphism"] .tb-badge.tb-amber { background: rgba(251,191,36,.14); color: #ffe1a1; border-color: rgba(251,191,36,.45); }
html[data-dstyle="glassmorphism"] .tb-badge.tb-red { background: rgba(248,113,113,.14); color: #ffb4b4; border-color: rgba(248,113,113,.45); }
/* lists, alerts */
html[data-dstyle="glassmorphism"] .tb-sec-title { color: #fff; }
html[data-dstyle="glassmorphism"] .tb-item { border-bottom: 1px solid rgba(255,255,255,.08); }
html[data-dstyle="glassmorphism"] .tb-item-ico { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.14); border-radius: 14px; backdrop-filter: blur(8px); }
html[data-dstyle="glassmorphism"] .tb-item-title { color: #eef1f8; }
html[data-dstyle="glassmorphism"] .tb-alert { border-radius: 14px; backdrop-filter: blur(14px); }
html[data-dstyle="glassmorphism"] .tb-alert.tb-red { background: rgba(248,113,113,.12); border: 1px solid rgba(248,113,113,.4); color: #ffb4b4; }
html[data-dstyle="glassmorphism"] .tb-alert.tb-amber { background: rgba(251,191,36,.12); border: 1px solid rgba(251,191,36,.4); color: #ffe1a1; }
html[data-dstyle="glassmorphism"] .tb-note { background: rgba(251,191,36,.1); border: 1px solid rgba(251,191,36,.35); color: #ffe1a1; border-radius: 14px; backdrop-filter: blur(10px); }
html[data-dstyle="glassmorphism"] .tb-empty { color: #6b7490; }
html[data-dstyle="glassmorphism"] .tb-chart {
  background: rgba(0,0,0,.22); border: 1px solid rgba(255,255,255,.14); border-radius: 16px;
  box-shadow: inset 0 2px 18px rgba(0,0,0,.45);
}
html[data-dstyle="glassmorphism"] .tb-link { color: #9db8ff; }
html[data-dstyle="glassmorphism"] .tb-footer { color: #6b7490; }
html[data-dstyle="glassmorphism"] .tb-ok { color: #6ee7b7; }
html[data-dstyle="glassmorphism"] ::-webkit-scrollbar { width: 10px; }
html[data-dstyle="glassmorphism"] ::-webkit-scrollbar-track { background: transparent; }
html[data-dstyle="glassmorphism"] ::-webkit-scrollbar-thumb { background: rgba(255,255,255,.18); border-radius: 8px; border: 2px solid transparent; background-clip: content-box; }
html[data-dstyle="glassmorphism"] :focus-visible { outline: 2px solid #a78bfa; outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
  html[data-dstyle="glassmorphism"] * { transition-duration: .01ms !important; }
}