/* Vchat 0.36.57 — Button hardening + production AI Agent Studio */

/* ==========================================================
   HARD RESET: stop WordPress/theme styles leaking into buttons
   ========================================================== */
.vchat-frontend-app button{
  -webkit-appearance:none!important;
  appearance:none!important;
  font-family:inherit!important;
  text-transform:none!important;
  text-decoration:none!important;
  letter-spacing:normal!important;
}
.vchat-frontend-app .vchat-library-reply-card .vchat-library-overflow,
.vchat-frontend-app .vchat-library-reply-card [data-library-edit],
.vchat-frontend-app .vchat-library-reply-card button:not(.danger):not(:first-child){
  background:#fff!important;
  background-image:none!important;
  color:#554a6c!important;
  border:1px solid #dcd6e7!important;
  box-shadow:none!important;
}
.vchat-frontend-app .vchat-library-reply-card .vchat-library-overflow:hover,
.vchat-frontend-app .vchat-library-reply-card [data-library-edit]:hover,
.vchat-frontend-app .vchat-library-reply-card button:not(.danger):not(:first-child):hover{
  background:#f8f6fc!important;
  color:#514092!important;
  border-color:#c8bee0!important;
  box-shadow:0 5px 14px rgba(51,42,86,.06)!important;
}
.vchat-frontend-app .vchat-library-reply-card button.danger{
  background:#fff!important;
  background-image:none!important;
  color:#a34759!important;
  border:1px solid #e5cbd2!important;
}
.vchat-frontend-app .vchat-library-reply-card button.danger:hover{
  background:#fff7f8!important;
  color:#923b4d!important;
  border-color:#dcb9c2!important;
}

/* ===============================
   AI Agent Studio base typography
   =============================== */
.vchat-frontend-app .vchat-ai-studio{
  --ai-text:#29243e;
  --ai-muted:#7e778b;
  --ai-border:#dfd9e9;
  --ai-soft:#f7f5fb;
  --ai-primary:#5b49a5;
  --ai-success:#16865c;
  --ai-warning:#9a6b19;
  --ai-danger:#a34759;
  color:var(--ai-text)!important;
}
.vchat-frontend-app .vchat-ai-heading{margin-bottom:22px!important}
.vchat-frontend-app .vchat-ai-heading h1{
  margin:7px 0 8px!important;
  font-size:clamp(36px,3.2vw,52px)!important;
  line-height:1.02!important;
  letter-spacing:-1.6px!important;
}
.vchat-frontend-app .vchat-ai-heading p{
  max-width:760px!important;
  font-size:14px!important;
  line-height:1.55!important;
}

/* Provider */
.vchat-frontend-app .vchat-ai-provider-card{
  display:grid!important;
  grid-template-columns:52px minmax(0,1fr) auto!important;
  align-items:center!important;
  gap:16px!important;
  margin:0 0 18px!important;
  padding:18px 20px!important;
  border:1px solid var(--ai-border)!important;
  border-radius:18px!important;
  background:#fff!important;
  box-shadow:0 10px 26px rgba(42,32,82,.045)!important;
}
.vchat-frontend-app .vchat-ai-provider-card.is-ready{border-color:#cbe9dc!important}
.vchat-frontend-app .vchat-ai-provider-icon{
  width:50px!important;height:50px!important;border-radius:15px!important;
  display:grid!important;place-items:center!important;
  background:#eee9fb!important;color:var(--ai-primary)!important;
  font-size:14px!important;font-weight:900!important;
}
.vchat-frontend-app .vchat-ai-provider-card small{
  display:block!important;margin-bottom:4px!important;
  color:#938da0!important;font-size:10px!important;font-weight:850!important;
  text-transform:uppercase!important;letter-spacing:.075em!important;
}
.vchat-frontend-app .vchat-ai-provider-card strong{display:block!important;font-size:16px!important}
.vchat-frontend-app .vchat-ai-provider-card p{margin:5px 0 0!important;color:var(--ai-muted)!important;font-size:12px!important;line-height:1.5!important}
.vchat-frontend-app .vchat-ai-provider-card button{
  min-height:42px!important;padding:0 15px!important;border:1px solid #d8d1e5!important;border-radius:12px!important;
  background:#fff!important;color:#54449a!important;font-size:11px!important;font-weight:800!important;
}

/* KPI */
.vchat-frontend-app .vchat-ai-kpis{
  display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:14px!important;margin-bottom:18px!important;
}
.vchat-frontend-app .vchat-ai-kpis article{
  min-width:0!important;min-height:112px!important;padding:19px 20px!important;
  border:1px solid var(--ai-border)!important;border-radius:18px!important;background:#fff!important;
}
.vchat-frontend-app .vchat-ai-kpis article:first-child{
  background:linear-gradient(145deg,#4b3b89,#6855bb)!important;color:#fff!important;border-color:transparent!important;
}
.vchat-frontend-app .vchat-ai-kpis small{display:block!important;font-size:10.5px!important;font-weight:800!important;opacity:.72!important}
.vchat-frontend-app .vchat-ai-kpis strong{display:block!important;margin:8px 0 6px!important;font-size:29px!important;line-height:1!important}
.vchat-frontend-app .vchat-ai-kpis span{font-size:10.5px!important;line-height:1.4!important;color:#8b8497!important}
.vchat-frontend-app .vchat-ai-kpis article:first-child span{color:rgba(255,255,255,.74)!important}

/* Toolbar */
.vchat-frontend-app .vchat-ai-toolbar{
  display:flex!important;align-items:flex-end!important;justify-content:space-between!important;
  gap:18px!important;margin-bottom:18px!important;padding:16px 18px!important;
  border:1px solid var(--ai-border)!important;border-radius:17px!important;background:#fff!important;
}
.vchat-frontend-app .vchat-ai-toolbar label{display:grid!important;gap:7px!important;min-width:min(380px,100%)!important;font-size:10px!important;font-weight:800!important}
.vchat-frontend-app .vchat-ai-toolbar input{height:43px!important;padding:0 14px!important;border:1px solid #dcd6e7!important;border-radius:12px!important;font-size:12px!important}
.vchat-frontend-app .vchat-ai-toolbar>div{display:flex!important;gap:7px!important;flex-wrap:wrap!important}
.vchat-frontend-app .vchat-ai-toolbar button{
  min-height:38px!important;padding:0 13px!important;border:1px solid #ded8e8!important;border-radius:11px!important;
  background:#fff!important;color:#746d81!important;font-size:10.5px!important;font-weight:800!important;
}
.vchat-frontend-app .vchat-ai-toolbar button.is-active{background:#5b49a5!important;color:#fff!important;border-color:#5b49a5!important}

/* Cards */
.vchat-frontend-app .vchat-ai-agent-grid-live{
  display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:16px!important;align-items:stretch!important;
}
.vchat-frontend-app .vchat-ai-agent-card{
  display:flex!important;flex-direction:column!important;min-width:0!important;min-height:320px!important;
  border:1px solid var(--ai-border)!important;border-radius:20px!important;background:#fff!important;
  overflow:hidden!important;box-shadow:0 12px 28px rgba(43,35,74,.045)!important;
}
.vchat-frontend-app .vchat-ai-agent-card.is-active{border-top:3px solid #6654b8!important}
.vchat-frontend-app .vchat-ai-agent-card>header{
  display:flex!important;align-items:center!important;gap:11px!important;padding:18px 18px 14px!important;
}
.vchat-frontend-app .vchat-ai-avatar{
  width:45px!important;height:45px!important;flex:0 0 45px!important;border-radius:14px!important;
  display:grid!important;place-items:center!important;background:#eee9fb!important;color:#5b49a5!important;font-size:12px!important;font-weight:900!important;
}
.vchat-frontend-app .vchat-ai-agent-card>header>div:nth-child(2){display:grid!important;gap:3px!important;min-width:0!important}
.vchat-frontend-app .vchat-ai-status{width:max-content!important;padding:4px 8px!important;border-radius:999px!important;font-size:9px!important;font-weight:900!important}
.vchat-frontend-app .vchat-ai-status.is-active{background:#eaf7f0!important;color:#157651!important}
.vchat-frontend-app .vchat-ai-status.is-paused{background:#fff5df!important;color:#986517!important}
.vchat-frontend-app .vchat-ai-status.is-draft{background:#f1eef7!important;color:#756d84!important}
.vchat-frontend-app .vchat-ai-agent-card>header small{font-size:10px!important;color:#918a9d!important}
.vchat-frontend-app .vchat-ai-more{
  margin-left:auto!important;min-height:36px!important;padding:0 12px!important;
  background:#fff!important;color:#554a6c!important;border:1px solid #ddd7e8!important;border-radius:11px!important;
  font-size:10.5px!important;font-weight:800!important;
}
.vchat-frontend-app .vchat-ai-more:hover{background:#f8f6fc!important;color:#514092!important;border-color:#c8bee0!important}
.vchat-frontend-app .vchat-ai-agent-body{padding:0 18px 18px!important;flex:1!important}
.vchat-frontend-app .vchat-ai-agent-body h2{margin:3px 0 8px!important;font-size:20px!important;line-height:1.2!important;letter-spacing:-.3px!important}
.vchat-frontend-app .vchat-ai-agent-body>p{min-height:40px!important;margin:0 0 17px!important;color:#6e677a!important;font-size:12.5px!important;line-height:1.55!important}
.vchat-frontend-app .vchat-ai-agent-body dl{
  display:grid!important;grid-template-columns:1fr!important;gap:0!important;margin:0!important;border-top:1px solid #eeeaf3!important;
}
.vchat-frontend-app .vchat-ai-agent-body dl>div{display:flex!important;justify-content:space-between!important;gap:12px!important;padding:10px 0!important;border-bottom:1px solid #eeeaf3!important}
.vchat-frontend-app .vchat-ai-agent-body dt{font-size:10px!important;color:#938d9f!important}
.vchat-frontend-app .vchat-ai-agent-body dd{margin:0!important;max-width:62%!important;text-align:right!important;font-size:10px!important;font-weight:800!important;overflow-wrap:anywhere!important}
.vchat-frontend-app .vchat-ai-channel-pills{display:flex!important;gap:6px!important;flex-wrap:wrap!important;margin-top:14px!important}
.vchat-frontend-app .vchat-ai-channel-pills span{padding:5px 8px!important;border-radius:999px!important;background:#f4f1fa!important;color:#675a85!important;font-size:9px!important;font-weight:750!important}
.vchat-frontend-app .vchat-ai-agent-card>footer{
  display:flex!important;gap:8px!important;flex-wrap:wrap!important;padding:14px 18px 18px!important;border-top:1px solid #eeeaf3!important;background:#fcfbfd!important;
}
.vchat-frontend-app .vchat-ai-agent-card>footer button{
  min-height:38px!important;padding:0 12px!important;border:1px solid #dcd6e7!important;border-radius:11px!important;
  background:#fff!important;color:#554a6c!important;font-size:10.5px!important;font-weight:800!important;
}
.vchat-frontend-app .vchat-ai-agent-card>footer button:first-child{background:#5b49a5!important;color:#fff!important;border-color:#5b49a5!important}
.vchat-frontend-app .vchat-ai-agent-card>footer button.danger{margin-left:auto!important;color:#a34759!important;border-color:#e4cbd1!important;background:#fff!important}

/* Empty */
.vchat-frontend-app .vchat-ai-empty{
  grid-column:1/-1!important;min-height:300px!important;padding:38px!important;border:1px dashed #d8d1e5!important;
  border-radius:20px!important;background:rgba(255,255,255,.65)!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center!important;
}
.vchat-frontend-app .vchat-ai-empty>span{width:48px!important;height:48px!important;display:grid!important;place-items:center!important;border-radius:15px!important;background:#eee9fb!important;color:#5b49a5!important;font-weight:900!important}
.vchat-frontend-app .vchat-ai-empty strong{margin-top:13px!important;font-size:17px!important}
.vchat-frontend-app .vchat-ai-empty p{max-width:470px!important;margin:7px 0 15px!important;color:#7e778b!important;font-size:12px!important;line-height:1.55!important}
.vchat-frontend-app .vchat-ai-empty button{min-height:40px!important;padding:0 14px!important;border:0!important;border-radius:11px!important;background:#5b49a5!important;color:#fff!important;font-size:11px!important;font-weight:800!important}

/* Bottom */
.vchat-frontend-app .vchat-ai-bottom-grid{display:grid!important;grid-template-columns:minmax(280px,.8fr) minmax(0,1.2fr)!important;gap:16px!important;margin-top:18px!important}
.vchat-frontend-app .vchat-ai-information-card,.vchat-frontend-app .vchat-ai-runs-card{padding:20px!important;border:1px solid var(--ai-border)!important;border-radius:18px!important;background:#fff!important}
.vchat-frontend-app .vchat-ai-information-card>small,.vchat-frontend-app .vchat-ai-runs-card header small{font-size:9.5px!important;font-weight:900!important;letter-spacing:.075em!important;text-transform:uppercase!important;color:#6e5bb7!important}
.vchat-frontend-app .vchat-ai-information-card h2,.vchat-frontend-app .vchat-ai-runs-card h2{margin:5px 0 15px!important;font-size:18px!important}
.vchat-frontend-app .vchat-ai-information-card>div{display:grid!important;grid-template-columns:34px minmax(0,1fr)!important;gap:10px!important;padding:11px 0!important;border-top:1px solid #eeeaf3!important}
.vchat-frontend-app .vchat-ai-information-card>div span{width:30px!important;height:30px!important;display:grid!important;place-items:center!important;border-radius:9px!important;background:#f1edfb!important;color:#5b49a5!important;font-size:9px!important;font-weight:900!important}
.vchat-frontend-app .vchat-ai-information-card p{margin:0!important;color:#716a7e!important;font-size:11.5px!important;line-height:1.5!important}
.vchat-frontend-app .vchat-ai-runs-card header{display:flex!important;justify-content:space-between!important;gap:12px!important;align-items:flex-start!important}
.vchat-frontend-app .vchat-ai-runs-card header button{min-height:36px!important;padding:0 11px!important;background:#fff!important;border:1px solid #ddd7e8!important;border-radius:10px!important;color:#554a6c!important;font-size:10px!important}
.vchat-frontend-app .vchat-ai-run{display:grid!important;grid-template-columns:32px minmax(0,1fr) auto!important;gap:11px!important;align-items:start!important;padding:12px 0!important;border-top:1px solid #eeeaf3!important}
.vchat-frontend-app .vchat-ai-run>span{width:30px!important;height:30px!important;display:grid!important;place-items:center!important;border-radius:9px!important;background:#eaf7f0!important;color:#16865c!important;font-weight:900!important}
.vchat-frontend-app .vchat-ai-run.is-failed>span{background:#fff0f2!important;color:#a34759!important}
.vchat-frontend-app .vchat-ai-run strong{font-size:11.5px!important}
.vchat-frontend-app .vchat-ai-run p{display:-webkit-box!important;-webkit-line-clamp:2!important;-webkit-box-orient:vertical!important;overflow:hidden!important;margin:4px 0 0!important;color:#817a8e!important;font-size:10.5px!important;line-height:1.45!important}
.vchat-frontend-app .vchat-ai-run>small{font-size:9px!important;color:#a099aa!important;white-space:nowrap!important}

/* Modal / editor */
.vchat-frontend-app .vchat-ai-editor{display:grid!important;gap:17px!important}
.vchat-frontend-app .vchat-ai-editor-intro,.vchat-frontend-app .vchat-ai-test-note{
  display:grid!important;grid-template-columns:46px minmax(0,1fr)!important;gap:13px!important;align-items:center!important;padding:15px!important;border:1px solid #e4deed!important;border-radius:15px!important;background:#f9f7fd!important;
}
.vchat-frontend-app .vchat-ai-editor-intro>span,.vchat-frontend-app .vchat-ai-test-note>span{width:44px!important;height:44px!important;display:grid!important;place-items:center!important;border-radius:13px!important;background:#eae4fa!important;color:#5947a4!important;font-size:11px!important;font-weight:900!important}
.vchat-frontend-app .vchat-ai-editor-intro strong,.vchat-frontend-app .vchat-ai-test-note strong{font-size:13px!important}
.vchat-frontend-app .vchat-ai-editor-intro p,.vchat-frontend-app .vchat-ai-test-note p{margin:4px 0 0!important;color:#7d7689!important;font-size:10.5px!important;line-height:1.45!important}
.vchat-frontend-app .vchat-ai-editor-section{padding:16px!important;border:1px solid #e4deed!important;border-radius:15px!important;background:#fff!important}
.vchat-frontend-app .vchat-ai-editor-section>strong{font-size:13px!important}
.vchat-frontend-app .vchat-ai-editor-section>p{margin:4px 0 13px!important;color:#847d90!important;font-size:10.5px!important}
.vchat-frontend-app .vchat-ai-check-grid{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:9px!important}
.vchat-frontend-app .vchat-ai-check-grid>label{display:grid!important;grid-template-columns:20px minmax(0,1fr)!important;gap:9px!important;align-items:start!important;padding:11px!important;border:1px solid #e5dfed!important;border-radius:12px!important}
.vchat-frontend-app .vchat-ai-check-grid b{display:block!important;font-size:10.5px!important}
.vchat-frontend-app .vchat-ai-check-grid small{display:block!important;margin-top:3px!important;color:#8d8698!important;font-size:9px!important;line-height:1.35!important}
.vchat-frontend-app .vchat-ai-channel-checks{display:flex!important;gap:8px!important;flex-wrap:wrap!important}
.vchat-frontend-app .vchat-ai-channel-checks label{display:flex!important;align-items:center!important;gap:6px!important;padding:8px 10px!important;border:1px solid #e0dae9!important;border-radius:10px!important;font-size:10px!important}
.vchat-frontend-app .vchat-ai-test-live{display:grid!important;gap:15px!important}
.vchat-frontend-app .vchat-ai-test-live textarea{min-height:110px!important}
.vchat-frontend-app .vchat-ai-thinking{display:flex!important;align-items:center!important;gap:5px!important;padding:14px!important;border-radius:13px!important;background:#f6f3fc!important;color:#70697d!important;font-size:10.5px!important}
.vchat-frontend-app .vchat-ai-thinking i{width:6px!important;height:6px!important;border-radius:50%!important;background:#6554b8!important;animation:vchatAiDot 1s infinite!important}
.vchat-frontend-app .vchat-ai-thinking i:nth-child(2){animation-delay:.15s!important}.vchat-frontend-app .vchat-ai-thinking i:nth-child(3){animation-delay:.3s!important}
@keyframes vchatAiDot{0%,80%,100%{opacity:.25;transform:translateY(0)}40%{opacity:1;transform:translateY(-3px)}}
.vchat-frontend-app .vchat-ai-test-response{padding:15px!important;border:1px solid #dcd5e9!important;border-radius:14px!important;background:#fff!important}
.vchat-frontend-app .vchat-ai-test-response small{font-size:9px!important;font-weight:900!important;text-transform:uppercase!important;letter-spacing:.07em!important;color:#6a58b4!important}
.vchat-frontend-app .vchat-ai-test-response p{margin:8px 0!important;color:#393346!important;font-size:12.5px!important;line-height:1.6!important;white-space:pre-wrap!important}
.vchat-frontend-app .vchat-ai-test-response footer{display:flex!important;gap:12px!important;padding-top:9px!important;border-top:1px solid #eeeaf3!important;color:#9790a1!important;font-size:9px!important}
.vchat-frontend-app .vchat-ai-test-error{padding:14px!important;border:1px solid #ebcfd5!important;border-radius:13px!important;background:#fff7f8!important}
.vchat-frontend-app .vchat-ai-test-error strong{font-size:11px!important;color:#923b4d!important}.vchat-frontend-app .vchat-ai-test-error p{margin:5px 0 0!important;font-size:10.5px!important;line-height:1.45!important;color:#8a5863!important}

/* Responsive */
@media(max-width:1180px){
  .vchat-frontend-app .vchat-ai-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .vchat-frontend-app .vchat-ai-agent-grid-live{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:820px){
  .vchat-frontend-app .vchat-ai-provider-card{grid-template-columns:48px minmax(0,1fr)!important}
  .vchat-frontend-app .vchat-ai-provider-card>button{grid-column:1/-1!important;width:100%!important}
  .vchat-frontend-app .vchat-ai-toolbar{align-items:stretch!important;flex-direction:column!important}
  .vchat-frontend-app .vchat-ai-toolbar label{min-width:0!important;width:100%!important}
  .vchat-frontend-app .vchat-ai-agent-grid-live{grid-template-columns:1fr!important}
  .vchat-frontend-app .vchat-ai-bottom-grid{grid-template-columns:1fr!important}
}
@media(max-width:620px){
  .vchat-frontend-app .vchat-ai-heading h1{font-size:32px!important;letter-spacing:-.8px!important}
  .vchat-frontend-app .vchat-ai-heading p{font-size:13px!important}
  .vchat-frontend-app .vchat-ai-kpis{grid-template-columns:1fr!important}
  .vchat-frontend-app .vchat-ai-kpis article{min-height:100px!important}
  .vchat-frontend-app .vchat-ai-agent-card{min-height:0!important}
  .vchat-frontend-app .vchat-ai-agent-card>header,.vchat-frontend-app .vchat-ai-agent-body,.vchat-frontend-app .vchat-ai-agent-card>footer{padding-left:16px!important;padding-right:16px!important}
  .vchat-frontend-app .vchat-ai-agent-card>footer button{flex:1 1 calc(50% - 6px)!important}
  .vchat-frontend-app .vchat-ai-agent-card>footer button.danger{margin-left:0!important}
  .vchat-frontend-app .vchat-ai-check-grid{grid-template-columns:1fr!important}
  .vchat-frontend-app .vchat-ai-run{grid-template-columns:30px minmax(0,1fr)!important}
  .vchat-frontend-app .vchat-ai-run>small{grid-column:2!important}
}