/* Vchat 0.51.1-alpha — Stripe Test Flow + AI Access Polish */
.vchat-billing-center{
  --vc-bill-card:#fff;
  --vc-bill-ink:#211b38;
  --vc-bill-muted:#756d8a;
  --vc-bill-line:#e8e1f4;
  --vc-bill-soft:#f8f6fc;
  --vc-bill-purple:#5f49b8;
}
.vchat-billing-center .vchat-billing-hero-actions{
  align-items:center!important;
  gap:10px!important;
}
.vchat-billing-center .vchat-billing-currency-switch,
.vchat-billing-center .vchat-billing-period-switch{
  display:flex!important;
  align-items:center!important;
  min-height:44px!important;
  border:1px solid var(--vc-bill-line)!important;
  border-radius:16px!important;
  background:#fff!important;
  box-shadow:0 10px 28px rgba(35,27,67,.04)!important;
  overflow:hidden!important;
}
.vchat-billing-center .vchat-billing-currency-switch{
  gap:8px!important;
  padding:0 12px!important;
}
.vchat-billing-center .vchat-billing-currency-switch span{
  color:#8a829b!important;
  font-size:10px!important;
  font-weight:900!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
}
.vchat-billing-center .vchat-billing-currency-switch select{
  border:0!important;
  background:transparent!important;
  min-height:40px!important;
  padding:0 20px 0 4px!important;
  color:var(--vc-bill-ink)!important;
  font-size:13px!important;
  font-weight:850!important;
  outline:none!important;
  box-shadow:none!important;
}
.vchat-billing-center .vchat-billing-period-switch{
  padding:4px!important;
  gap:4px!important;
}
.vchat-billing-center .vchat-billing-period-switch button{
  min-height:34px!important;
  padding:0 13px!important;
  border:0!important;
  border-radius:12px!important;
  background:transparent!important;
  color:#7b728d!important;
  box-shadow:none!important;
  font-size:12px!important;
  font-weight:850!important;
}
.vchat-billing-center .vchat-billing-period-switch button.is-active{
  background:#5f49b8!important;
  color:#fff!important;
}
.vchat-billing-center #vchat-billing-refresh,
.vchat-billing-center #vchat-billing-portal{
  min-height:44px!important;
  border-radius:16px!important;
}
.vchat-billing-center .vchat-billing-grid{
  gap:20px!important;
  margin-bottom:26px!important;
}
.vchat-billing-center .vchat-current-plan,
.vchat-billing-center .vchat-ai-wallet{
  border-radius:26px!important;
  padding:26px!important;
  border:1px solid var(--vc-bill-line)!important;
  background:linear-gradient(180deg,#fff,#fdfbff)!important;
  box-shadow:0 18px 48px rgba(35,27,67,.055)!important;
}
.vchat-billing-center #vchat-billing-current-features{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:12px!important;
}
.vchat-billing-center #vchat-billing-current-features li{
  min-height:54px!important;
  padding:14px 16px 14px 46px!important;
  border:1px solid #eee8f8!important;
  border-radius:17px!important;
  background:#fbfaff!important;
  line-height:1.35!important;
}
.vchat-billing-center #vchat-billing-current-features li::before{
  left:16px!important;
  width:18px!important;
  height:18px!important;
}
.vchat-billing-center .vchat-billing-plan-section-head{
  margin:0 0 16px!important;
  padding:0 2px!important;
}
.vchat-billing-center .vchat-billing-plan-section-head h2{
  font-size:23px!important;
  line-height:1.08!important;
  margin:0 0 6px!important;
}
.vchat-billing-center .vchat-billing-plan-section-head p{
  max-width:760px!important;
  color:var(--vc-bill-muted)!important;
  font-size:13px!important;
}
.vchat-billing-center .vchat-ai-topup-grid,
.vchat-billing-center .vchat-billing-plan-grid{
  gap:18px!important;
  align-items:stretch!important;
}
.vchat-billing-center .vchat-ai-topup-card,
.vchat-billing-center .vchat-billing-plan-card{
  border:1px solid var(--vc-bill-line)!important;
  background:#fff!important;
  border-radius:24px!important;
  box-shadow:0 16px 40px rgba(35,27,67,.05)!important;
}
.vchat-billing-center .vchat-ai-topup-card{
  min-height:176px!important;
  padding:22px!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:flex-start!important;
  gap:10px!important;
}
.vchat-billing-center .vchat-ai-topup-card span,
.vchat-billing-center .vchat-billing-badge{
  width:max-content!important;
  max-width:100%!important;
}
.vchat-billing-center .vchat-ai-topup-card strong{
  margin:0!important;
  color:var(--vc-bill-ink)!important;
  font-size:18px!important;
  line-height:1.2!important;
}
.vchat-billing-center .vchat-ai-topup-card b{
  margin:0!important;
  color:var(--vc-bill-purple)!important;
  font-size:24px!important;
  line-height:1!important;
}
.vchat-billing-center .vchat-ai-topup-card button{
  margin-top:auto!important;
  min-height:44px!important;
  border-radius:15px!important;
}
.vchat-billing-center .vchat-billing-plan-card{
  min-height:auto!important;
  padding:22px!important;
  gap:14px!important;
}
.vchat-billing-center .vchat-billing-plan-card header{
  display:grid!important;
  grid-template-columns:1fr!important;
  gap:12px!important;
}
.vchat-billing-center .vchat-billing-plan-card header strong{
  font-size:25px!important;
  line-height:1.05!important;
  margin:0 0 8px!important;
}
.vchat-billing-center .vchat-billing-plan-description{
  min-height:0!important;
  margin:0!important;
  font-size:13px!important;
  line-height:1.48!important;
}
.vchat-billing-center .vchat-billing-plan-pricebox{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:flex-end!important;
  gap:8px!important;
  padding:13px 0!important;
  border-top:1px solid #f0ebf8!important;
  border-bottom:1px solid #f0ebf8!important;
}
.vchat-billing-center .vchat-billing-plan-pricebox b{
  font-size:31px!important;
  line-height:1!important;
}
.vchat-billing-center .vchat-billing-plan-pricebox span{
  margin-bottom:3px!important;
}
.vchat-billing-center .vchat-billing-plan-bullets{
  gap:10px!important;
}
.vchat-billing-center .vchat-billing-plan-bullets li{
  padding-left:30px!important;
  font-size:13px!important;
  line-height:1.42!important;
}
.vchat-billing-center .vchat-billing-plan-bullets li::before{
  left:0!important;
  top:1px!important;
}
.vchat-billing-center .vchat-plan-details{
  margin:2px 0!important;
  padding:14px!important;
  border-radius:18px!important;
  max-height:260px!important;
}
.vchat-billing-center .vchat-plan-details li{
  min-height:40px!important;
  padding:10px 12px!important;
}
.vchat-billing-center .vchat-plan-details-toggle{
  align-self:flex-start!important;
  color:var(--vc-bill-purple)!important;
}
.vchat-billing-center .vchat-billing-plan-note{
  font-size:11.5px!important;
  line-height:1.4!important;
  color:#8a8299!important;
}
.vchat-billing-center .vchat-billing-plan-card > button[data-billing-checkout]{
  margin-top:0!important;
  min-height:47px!important;
  border-radius:16px!important;
}
.vchat-billing-center .vchat-billing-plan-card.is-featured{
  border-color:rgba(95,73,184,.32)!important;
  box-shadow:0 20px 50px rgba(95,73,184,.105)!important;
}
.vchat-frontend-app .vchat-nav button.is-feature-locked{
  position:relative!important;
  opacity:.72!important;
}
.vchat-frontend-app .vchat-nav button.is-feature-locked::after{
  content:'Bloq.';
  margin-left:auto;
  font-size:9px;
  font-weight:900;
  color:#8f83aa;
  background:#f0ecf8;
  border:1px solid #e3dbf2;
  border-radius:999px;
  padding:2px 6px;
}
.vchat-feature-lock-overlay{
  position:absolute!important;
  inset:12px!important;
  z-index:20!important;
  display:grid!important;
  place-items:center!important;
  border-radius:28px!important;
  background:rgba(248,246,252,.82)!important;
  backdrop-filter:blur(10px)!important;
}
.vchat-feature-lock-overlay>div{
  max-width:440px!important;
  padding:26px!important;
  border-radius:24px!important;
  border:1px solid #e4ddf2!important;
  background:#fff!important;
  box-shadow:0 22px 60px rgba(35,27,67,.12)!important;
  text-align:center!important;
}
.vchat-feature-lock-overlay b{
  display:block!important;
  color:var(--vc-bill-ink)!important;
  font-size:20px!important;
  margin-bottom:8px!important;
}
.vchat-feature-lock-overlay p{
  color:#756d8a!important;
  font-size:13px!important;
  line-height:1.55!important;
  margin:0 0 18px!important;
}
.vchat-feature-lock-overlay button{
  border:0!important;
  border-radius:15px!important;
  min-height:44px!important;
  padding:0 18px!important;
  background:var(--vc-bill-purple)!important;
  color:#fff!important;
  font-weight:850!important;
}
@media(max-width:1200px){
  .vchat-billing-center .vchat-billing-hero-actions{justify-content:flex-start!important;}
}
@media(max-width:760px){
  .vchat-billing-center .vchat-billing-hero-actions,
  .vchat-billing-center .vchat-billing-currency-switch,
  .vchat-billing-center .vchat-billing-period-switch,
  .vchat-billing-center #vchat-billing-refresh,
  .vchat-billing-center #vchat-billing-portal{
    width:100%!important;
  }
  .vchat-billing-center .vchat-billing-period-switch button{
    flex:1!important;
  }
  .vchat-billing-center #vchat-billing-current-features{
    grid-template-columns:1fr!important;
  }
}