/* BOT VIỆT AI V1.0.258 — Premium VIP Badges
   Scope: only the 2 user-topbar badges (credits + current plan). */

.v247-user-topbar .topbar-v258-badge{
  --vip-bg-1:#0a2341;
  --vip-bg-2:#07182d;
  --vip-line:rgba(87,167,255,.38);
  --vip-glow:rgba(33,118,255,.24);
  --vip-text:#f6fbff;
  --vip-sub:#8eb5da;
  --vip-icon-bg:#102c53;
  position:relative;
  isolation:isolate;
  min-height:42px;
  height:42px;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:0 13px 0 10px;
  border:1px solid var(--vip-line);
  border-radius:14px;
  overflow:hidden;
  background:
    radial-gradient(circle at 100% 0,rgba(113,74,255,.16),transparent 36%),
    radial-gradient(circle at 8% 14%,rgba(54,195,255,.14),transparent 28%),
    linear-gradient(145deg,var(--vip-bg-1),var(--vip-bg-2));
  color:var(--vip-text);
  box-shadow:
    0 12px 28px rgba(3,12,24,.28),
    inset 0 1px 0 rgba(255,255,255,.10),
    inset 0 -1px 0 rgba(73,137,255,.06),
    0 0 0 1px rgba(17,43,72,.55);
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,filter .22s ease;
}
.v247-user-topbar .topbar-v258-badge:hover{
  transform:translateY(-1px) scale(1.01);
  border-color:rgba(114,196,255,.64);
  box-shadow:
    0 16px 34px rgba(4,14,30,.34),
    inset 0 1px 0 rgba(255,255,255,.14),
    0 0 26px var(--vip-glow);
  filter:brightness(1.03);
}
.v247-user-topbar .topbar-v258-badge:active{transform:translateY(0) scale(.985)}
.v247-user-topbar .topbar-v258-plan{
  --vip-bg-1:#102656;
  --vip-bg-2:#081c38;
  --vip-line:rgba(104,164,255,.42);
  --vip-glow:rgba(109,91,255,.28);
  --vip-icon-bg:linear-gradient(145deg,#203f81,#0f2954);
}
.v247-user-topbar .topbar-v258-credit{
  --vip-bg-1:#092544;
  --vip-bg-2:#07172d;
  --vip-line:rgba(88,176,255,.40);
  --vip-glow:rgba(33,135,255,.25);
  --vip-icon-bg:linear-gradient(145deg,#143964,#0c2344);
}
.v247-user-topbar .topbar-v258-badge .topbar-v258-orbit{
  position:absolute;
  inset:auto auto -22px -18px;
  width:66px;height:66px;border:1px solid rgba(255,255,255,.08);border-radius:50%;
  opacity:.9;pointer-events:none;
}
.v247-user-topbar .topbar-v258-badge .topbar-v258-orbit::before,
.v247-user-topbar .topbar-v258-badge .topbar-v258-orbit::after{content:"";position:absolute;border-radius:50%}
.v247-user-topbar .topbar-v258-badge .topbar-v258-orbit::before{inset:8px;border:1px solid rgba(71,159,255,.16)}
.v247-user-topbar .topbar-v258-badge .topbar-v258-orbit::after{
  width:8px;height:8px;right:3px;top:12px;background:#8fdcff;box-shadow:0 0 12px rgba(143,220,255,.52);
  animation:v258VipOrbit 4.5s linear infinite;
}
.v247-user-topbar .topbar-v258-badge .topbar-v258-sheen{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none}
.v247-user-topbar .topbar-v258-badge .topbar-v258-sheen::after{
  content:"";position:absolute;top:-20%;left:-30%;width:34%;height:150%;
  transform:skewX(-24deg) translateX(-140%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.20),transparent);
  animation:v258VipSheen 5.6s ease-in-out infinite;
}
.v247-user-topbar .topbar-v258-icon-wrap{
  position:relative;flex:none;width:26px;height:26px;border-radius:10px;display:grid;place-items:center;
  background:var(--vip-icon-bg);border:1px solid rgba(122,189,255,.25);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 0 14px rgba(46,124,255,.15);color:#d9efff;
}
.v247-user-topbar .topbar-v258-icon-wrap svg{width:16px;height:16px;display:block;filter:drop-shadow(0 0 5px rgba(167,221,255,.22))}
.v247-user-topbar .topbar-v258-icon-wrap i{
  position:absolute;right:-2px;top:-2px;width:8px;height:8px;border-radius:50%;
  background:linear-gradient(180deg,#fff2b2,#ffbe3d);box-shadow:0 0 12px rgba(255,196,77,.68);
  border:1.5px solid #0a1e36;animation:v258VipSpark 1.9s ease-in-out infinite;
}
.v247-user-topbar .topbar-v258-copy{display:flex;flex-direction:column;min-width:0;line-height:1.05}
.v247-user-topbar .topbar-v258-copy small{
  font-size:8px;line-height:1;letter-spacing:.12em;text-transform:uppercase;color:#8eb5da;margin:0 0 4px;
}
.v247-user-topbar .topbar-v258-copy b{
  font-size:18px;line-height:1;color:#f6fbff;font-weight:900;letter-spacing:-.02em;white-space:nowrap;
  text-shadow:0 0 14px rgba(108,181,255,.10);
}
.v247-user-topbar .topbar-v258-credit .topbar-v258-copy b{color:#bdf3ff}
.v247-user-topbar .topbar-v258-plan .topbar-v258-copy b{color:#eef4ff;font-size:14px}
.v247-user-topbar .topbar-v258-pill{
  margin-left:6px;flex:none;height:24px;min-width:52px;padding:0 10px;display:inline-flex;align-items:center;justify-content:center;
  border-radius:999px;border:1px solid rgba(132,188,255,.28);
  background:linear-gradient(180deg,rgba(20,57,105,.90),rgba(10,33,66,.92));color:#8dffca;font-size:11px;font-weight:800;font-style:normal;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 0 12px rgba(51,229,155,.10);
}
.v247-user-topbar .topbar-v258-plan:hover .topbar-v258-pill{
  color:#b8ffd7;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 0 16px rgba(67,240,168,.16);
}
@keyframes v258VipSheen{
  0%,58%{transform:skewX(-24deg) translateX(-145%)}
  74%,100%{transform:skewX(-24deg) translateX(340%)}
}
@keyframes v258VipSpark{
  0%,100%{transform:scale(.92);opacity:.72}
  50%{transform:scale(1.12);opacity:1}
}
@keyframes v258VipOrbit{
  from{transform:rotate(0deg) translateY(0)}
  to{transform:rotate(360deg) translateY(0)}
}
body.dashboard-motion-off .v247-user-topbar .topbar-v258-badge .topbar-v258-orbit::after,
body.dashboard-motion-off .v247-user-topbar .topbar-v258-badge .topbar-v258-sheen::after,
body.dashboard-motion-off .v247-user-topbar .topbar-v258-icon-wrap i{animation:none!important}
@media(prefers-reduced-motion:reduce){
  .v247-user-topbar .topbar-v258-badge .topbar-v258-orbit::after,
  .v247-user-topbar .topbar-v258-badge .topbar-v258-sheen::after,
  .v247-user-topbar .topbar-v258-icon-wrap i{animation:none!important}
}
@media(max-width:1180px){
  .v247-user-topbar .topbar-v258-badge{padding-right:10px}
  .v247-user-topbar .topbar-v258-credit .topbar-v258-copy b{font-size:16px}
  .v247-user-topbar .topbar-v258-plan .topbar-v258-copy b{font-size:13px}
  .v247-user-topbar .topbar-v258-pill{min-width:46px;padding:0 8px}
}
