/* Vchat 0.36.64 — production structure: AI cards, queues and departments */

/* ---------- Agent card breathing + compact actions ---------- */
.vchat-frontend-app .vchat-ai-agent-card{
  padding-top:0!important;
  overflow:hidden!important;
}
.vchat-frontend-app .vchat-ai-agent-card .vchat-ai-agent-body{
  padding:24px 26px 20px!important;
}
.vchat-frontend-app .vchat-ai-agent-card h2{
  margin:0 0 12px!important;
}
.vchat-frontend-app .vchat-ai-agent-card .vchat-ai-agent-body>p{
  margin:0 0 20px!important;
}
.vchat-frontend-app .vchat-ai-agent-card dl{
  margin-top:18px!important;
}
.vchat-frontend-app .vchat-ai-agent-card footer{
  padding:16px 20px 18px!important;
  gap:8px!important;
  border-top:1px solid #ebe7f1!important;
  background:#fcfbfe!important;
}
.vchat-frontend-app .vchat-ai-agent-card footer button{
  flex:1 1 0!important;
  min-width:72px!important;
  min-height:38px!important;
  padding:0 12px!important;
  white-space:nowrap!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
}

/* ---------- Queue operations ---------- */
.vchat-frontend-app [data-vchat-panel="queues"]{
  padding-bottom:52px!important;
}
.vchat-frontend-app [data-vchat-panel="queues"]>.vchat-page-heading{
  margin-bottom:20px!important;
}
.vchat-frontend-app .vchat-structure-guide{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto minmax(0,1fr)!important;
  align-items:center!important;
  gap:12px!important;
  margin:0 0 22px!important;
}
.vchat-frontend-app .vchat-structure-guide article{
  display:grid!important;
  grid-template-columns:38px minmax(0,1fr)!important;
  align-items:center!important;
  gap:12px!important;
  min-width:0!important;
  padding:14px 16px!important;
  border:1px solid #dfdbea!important;
  border-radius:16px!important;
  background:#fff!important;
}
.vchat-frontend-app .vchat-structure-guide article>span{
  display:grid!important;
  place-items:center!important;
  width:38px!important;
  height:38px!important;
  border-radius:12px!important;
  background:#f0ecfb!important;
  color:#5c49a7!important;
  font-size:13px!important;
  font-weight:900!important;
}
.vchat-frontend-app .vchat-structure-guide strong,
.vchat-frontend-app .vchat-structure-guide small{
  display:block!important;
}
.vchat-frontend-app .vchat-structure-guide strong{
  color:#2d2842!important;
  font-size:13px!important;
  line-height:1.25!important;
}
.vchat-frontend-app .vchat-structure-guide small{
  margin-top:3px!important;
  color:#817a8d!important;
  font-size:10px!important;
  line-height:1.4!important;
}
.vchat-frontend-app .vchat-structure-guide>i{
  color:#9a92ac!important;
  font-style:normal!important;
  font-size:18px!important;
}
.vchat-frontend-app .vchat-queue-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:16px!important;
  align-items:stretch!important;
}
.vchat-frontend-app .vchat-queue-card{
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
  min-height:300px!important;
  padding:22px!important;
  border:1px solid #dfdbea!important;
  border-radius:20px!important;
  background:#fff!important;
  box-shadow:0 12px 34px rgba(35,28,70,.045)!important;
  overflow:hidden!important;
}
.vchat-frontend-app .vchat-queue-card.is-linked{
  border-top:3px solid var(--queue-color,#6554b8)!important;
  padding-top:20px!important;
}
.vchat-frontend-app .vchat-queue-card-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  min-height:28px!important;
}
.vchat-frontend-app .vchat-queue-color{
  display:block!important;
  width:56px!important;
  height:7px!important;
  flex:0 0 auto!important;
  border-radius:999px!important;
  background:var(--queue-color,#6554b8)!important;
}
.vchat-frontend-app .vchat-queue-statuses{
  display:flex!important;
  flex-wrap:wrap!important;
  justify-content:flex-end!important;
  gap:6px!important;
  margin:0!important;
}
.vchat-frontend-app .vchat-queue-statuses em{
  display:inline-flex!important;
  align-items:center!important;
  min-height:25px!important;
  padding:0 8px!important;
  border-radius:999px!important;
  font-style:normal!important;
  font-size:9px!important;
  line-height:1!important;
  font-weight:850!important;
}
.vchat-frontend-app .vchat-queue-statuses .is-active{background:#eaf8ef!important;color:#2d7f55!important}
.vchat-frontend-app .vchat-queue-statuses .is-paused{background:#f5f1f1!important;color:#776b70!important}
.vchat-frontend-app .vchat-queue-statuses .is-linked{background:#f0ecfb!important;color:#5b49a5!important}
.vchat-frontend-app .vchat-queue-statuses .is-independent{background:#f5f3f8!important;color:#777181!important}
.vchat-frontend-app .vchat-queue-copy{
  display:block!important;
  margin-top:18px!important;
}
.vchat-frontend-app .vchat-queue-copy h2{
  margin:0 0 8px!important;
  color:#29243e!important;
  font-size:20px!important;
  line-height:1.2!important;
  letter-spacing:-.35px!important;
}
.vchat-frontend-app .vchat-queue-copy p{
  min-height:42px!important;
  margin:0!important;
  color:#777184!important;
  font-size:12px!important;
  line-height:1.5!important;
}
.vchat-frontend-app .vchat-queue-link-copy{
  display:block!important;
  margin-top:11px!important;
  color:#8a8396!important;
  font-size:10px!important;
  line-height:1.4!important;
}
.vchat-frontend-app .vchat-queue-link-copy strong{color:#5b4d91!important}
.vchat-frontend-app .vchat-queue-metrics{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important;
  margin:18px 0 0!important;
}
.vchat-frontend-app .vchat-queue-metrics>span{
  padding:13px 7px!important;
  border-radius:13px!important;
  background:#f8f7fb!important;
  text-align:center!important;
}
.vchat-frontend-app .vchat-queue-metrics b,
.vchat-frontend-app .vchat-queue-metrics small{display:block!important}
.vchat-frontend-app .vchat-queue-metrics b{color:#2d2841!important;font-size:18px!important;line-height:1!important}
.vchat-frontend-app .vchat-queue-metrics small{margin-top:5px!important;color:#8b8496!important;font-size:9px!important}
.vchat-frontend-app .vchat-queue-card footer{
  display:grid!important;
  grid-template-columns:1.25fr 1fr 1fr!important;
  gap:8px!important;
  margin-top:auto!important;
  padding-top:18px!important;
}
.vchat-frontend-app .vchat-queue-card footer button{
  min-width:0!important;
  min-height:38px!important;
  padding:0 10px!important;
  border:1px solid #ddd8ea!important;
  border-radius:11px!important;
  background:#fff!important;
  color:#59499f!important;
  font-size:10px!important;
  line-height:1!important;
  font-weight:850!important;
  white-space:nowrap!important;
}
.vchat-frontend-app .vchat-queue-card footer .vchat-queue-open{
  border-color:#5b49a6!important;
  background:#5b49a6!important;
  color:#fff!important;
}
.vchat-frontend-app .vchat-queue-card footer .danger{
  color:#a74456!important;
  border-color:#edcbd2!important;
}
.vchat-frontend-app .vchat-modal-context{
  margin:0 0 16px!important;
  padding:14px 15px!important;
  border:1px solid #e1ddeb!important;
  border-radius:14px!important;
  background:#f9f7fd!important;
}
.vchat-frontend-app .vchat-modal-context strong,
.vchat-frontend-app .vchat-modal-context p{display:block!important}
.vchat-frontend-app .vchat-modal-context strong{color:#332e48!important;font-size:12px!important}
.vchat-frontend-app .vchat-modal-context p{margin:5px 0 0!important;color:#7c7589!important;font-size:10.5px!important;line-height:1.45!important}

/* ---------- Departments ---------- */
.vchat-frontend-app [data-vchat-panel="departments"]{
  padding-bottom:52px!important;
}
.vchat-frontend-app [data-vchat-panel="departments"]>.vchat-heading-row{
  align-items:end!important;
  margin-bottom:20px!important;
}
.vchat-frontend-app .vchat-department-grid{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:16px!important;
  align-items:stretch!important;
}
.vchat-frontend-app .vchat-department-card{
  position:relative!important;
  display:flex!important;
  flex-direction:column!important;
  min-width:0!important;
  min-height:245px!important;
  padding:22px 22px 20px 26px!important;
  border:1px solid #dfdbea!important;
  border-radius:20px!important;
  background:#fff!important;
  box-shadow:0 12px 34px rgba(35,28,70,.045)!important;
  overflow:hidden!important;
}
.vchat-frontend-app .vchat-department-card:before{
  content:""!important;
  position:absolute!important;
  inset:0 auto 0 0!important;
  width:5px!important;
  background:var(--department-color,#6554b8)!important;
}
.vchat-frontend-app .vchat-department-card-head{
  position:relative!important;
  z-index:2!important;
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  min-height:30px!important;
  margin:0!important;
  overflow:visible!important;
}
.vchat-frontend-app .vchat-department-title{
  display:flex!important;
  visibility:visible!important;
  opacity:1!important;
  align-items:center!important;
  gap:9px!important;
  min-width:0!important;
  color:#28233d!important;
}
.vchat-frontend-app .vchat-department-title i{
  display:block!important;
  flex:0 0 10px!important;
  width:10px!important;
  height:10px!important;
  border-radius:999px!important;
  background:var(--department-color,#6554b8)!important;
}
.vchat-frontend-app .vchat-department-title b{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  min-width:0!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
  color:#28233d!important;
  font-size:17px!important;
  line-height:1.25!important;
  font-weight:900!important;
}
.vchat-frontend-app .vchat-department-card-head>em{
  display:inline-flex!important;
  visibility:visible!important;
  opacity:1!important;
  align-items:center!important;
  flex:0 0 auto!important;
  min-height:25px!important;
  padding:0 9px!important;
  border-radius:999px!important;
  background:#eaf8ef!important;
  color:#2e7e55!important;
  font-size:9px!important;
  line-height:1!important;
  font-style:normal!important;
  font-weight:850!important;
}
.vchat-frontend-app .vchat-department-card.is-archived .vchat-department-card-head>em{
  background:#f2eff3!important;color:#776f7a!important
}
.vchat-frontend-app .vchat-department-description{
  display:block!important;
  visibility:visible!important;
  opacity:1!important;
  min-height:42px!important;
  margin:14px 0 18px!important;
  color:#777184!important;
  font-size:12px!important;
  line-height:1.5!important;
}
.vchat-frontend-app .vchat-department-metrics{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important;
  margin:0!important;
}
.vchat-frontend-app .vchat-department-metrics>span{
  padding:13px 7px!important;
  border-radius:13px!important;
  background:#f8f7fb!important;
  text-align:center!important;
}
.vchat-frontend-app .vchat-department-metrics b,
.vchat-frontend-app .vchat-department-metrics small{display:block!important}
.vchat-frontend-app .vchat-department-metrics b{
  color:#2d2841!important;font-size:18px!important;line-height:1!important
}
.vchat-frontend-app .vchat-department-metrics small{
  margin-top:5px!important;color:#8b8496!important;font-size:9px!important
}
.vchat-frontend-app .vchat-department-card footer{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  margin-top:auto!important;
  padding-top:17px!important;
  border-top:1px solid #eeeaf3!important;
}
.vchat-frontend-app .vchat-department-card footer small{
  display:block!important;
  min-width:0!important;
  color:#8a8395!important;
  font-size:9px!important;
  line-height:1.3!important;
  white-space:normal!important;
}
.vchat-frontend-app .vchat-department-card footer small span,
.vchat-frontend-app .vchat-department-card footer small strong{display:block!important}
.vchat-frontend-app .vchat-department-card footer small strong{
  margin-top:3px!important;
  color:#504774!important;
  font-size:10.5px!important;
}
.vchat-frontend-app .vchat-department-card footer button{
  flex:0 0 auto!important;
  min-height:36px!important;
  padding:0 13px!important;
  border:1px solid #ddd8e9!important;
  border-radius:11px!important;
  background:#fff!important;
  color:#58499c!important;
  font-size:10px!important;
  font-weight:850!important;
}
.vchat-frontend-app .vchat-department-card.is-highlighted{
  box-shadow:0 0 0 3px rgba(101,84,184,.15),0 16px 40px rgba(35,28,70,.08)!important;
}

/* ---------- Responsive ---------- */
@media(max-width:1180px){
  .vchat-frontend-app .vchat-queue-grid,
  .vchat-frontend-app .vchat-department-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
}
@media(max-width:820px){
  .vchat-frontend-app .vchat-structure-guide{grid-template-columns:1fr!important}
  .vchat-frontend-app .vchat-structure-guide>i{display:none!important}
}
@media(max-width:680px){
  .vchat-frontend-app .vchat-queue-grid,
  .vchat-frontend-app .vchat-department-grid{grid-template-columns:1fr!important}
  .vchat-frontend-app .vchat-queue-card,
  .vchat-frontend-app .vchat-department-card{min-height:0!important;padding:18px!important}
  .vchat-frontend-app .vchat-queue-card footer{grid-template-columns:1fr!important}
  .vchat-frontend-app .vchat-department-card footer{align-items:stretch!important;flex-direction:column!important}
  .vchat-frontend-app .vchat-department-card footer button{width:100%!important}
  .vchat-frontend-app .vchat-ai-agent-card footer button{flex:1 1 calc(50% - 8px)!important}
}