/* Be Agent Connect — usa el símbolo blanco en la variante principal. */
.be-agent-connect {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 44px; padding: 7px 16px; border: 1px solid #6D3CE8; border-radius: 8px;
  background: #6D3CE8; color: #FFFFFF; font: 600 14px/1.4 system-ui, sans-serif;
  text-decoration: none; cursor: pointer;
}
.be-agent-connect__symbol { display: block; width: 30px; height: 30px; object-fit: contain; flex: none; }
.be-agent-connect:hover { background: #5928C4; border-color: #5928C4; }
.be-agent-connect:focus-visible { outline: 3px solid #3D7BFA; outline-offset: 3px; }
.be-agent-connect:disabled { opacity: .55; cursor: not-allowed; }
.be-agent-connect--outline { background: #FFFFFF; color: #2F0077; }
.be-agent-connect--outline:hover { background: #F6F6FF; border-color: #6D3CE8; }
.be-agent-connect--dark { background: #18181B; border-color: #18181B; }
.be-agent-connect--dark:hover { background: #2F0077; border-color: #2F0077; }
@media (prefers-reduced-motion: no-preference) {
  .be-agent-connect { transition: background-color .15s, border-color .15s; }
}