/*
  Virando a Chave — admin shell
  ---------------------------------------------------------------------------
  This stylesheet is intentionally scoped by the hostname flag added in
  index.html.  The public directory is shared by several SaaS tenants, so no
  rule in this file may affect a different domain.

  The interface takes inspiration from the calm, high-density admin pattern
  requested for Virando a Chave: a graphite navigation rail, quiet white
  work surfaces, compact controls and a clear blue focus state.  It keeps the
  Virando a Chave identity and does not use Shopify assets or branding.
*/

html.vac-virando-theme {
  background: #f6f6f7;
  color-scheme: light;
}

html.vac-virando-theme body {
  --bg: #f6f6f7 !important;
  --bg1: #ffffff !important;
  --bg2: #ffffff !important;
  --bg3: #f1f1f1 !important;
  --panel: #ffffff !important;
  --border: #e1e3e5 !important;
  --text: #202223 !important;
  --text1: #202223 !important;
  --text2: #5c5f62 !important;
  --text3: #8c9196 !important;
  --accent: #2c6ecb !important;
  --accent-dim: #ebf5ff !important;
  --accent-border: #78a9f8 !important;
  --green: #008060 !important;
  --green-dark: #006e52 !important;
  --red: #d72c0d !important;
  --blue: #2c6ecb !important;
  --purple: #7a4dd8 !important;
  background: #f6f6f7 !important;
  color: #202223 !important;
  font-family: 'Inter var', Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  font-feature-settings: 'kern' 1, 'liga' 1, 'cv02' 1, 'cv03' 1;
}

/* Login and connection screens use the same quiet surface. */
html.vac-virando-theme #screen-login,
html.vac-virando-theme #screen-connect {
  background: #f6f6f7 !important;
}

html.vac-virando-theme .connect-box {
  background: #fff !important;
  border: 1px solid #e1e3e5 !important;
  border-radius: 14px !important;
  box-shadow: 0 12px 30px rgba(32, 34, 35, .10) !important;
}

/* ── Main navigation ───────────────────────────────────────────────────── */
html.vac-virando-theme #screen-dashboard #sidebar {
  background: linear-gradient(180deg, #141414 0%, #0b0b0c 100%) !important;
  border-right: 1px solid #292929 !important;
  box-shadow: 1px 0 0 rgba(255, 255, 255, .035) !important;
  color: #f1f1f1 !important;
  padding: 12px 10px 14px !important;
}

@media (min-width: 861px) {
  html.vac-virando-theme #screen-dashboard #sidebar:not(.sidebar--collapsed) {
    width: 288px;
  }
}

html.vac-virando-theme #screen-dashboard #sidebar .sidebar-logo {
  gap: 10px !important;
  margin: 0 0 8px !important;
  padding: 8px 10px 15px !important;
  border: 0 !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .sidebar-logo-icon {
  display: grid !important;
  width: 32px !important;
  height: 32px !important;
  place-items: center !important;
  border-radius: 9px !important;
  background: linear-gradient(145deg, #3b82f6, #245fc3) !important;
  color: #fff !important;
  filter: none !important;
  box-shadow: 0 5px 14px rgba(44, 110, 203, .34) !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .sidebar-logo-icon svg {
  width: 18px !important;
  height: 18px !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .sidebar-logo-title {
  color: #f6f6f7 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: -.012em !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .sidebar-status {
  color: #65d69d !important;
  font-size: 11px !important;
  font-weight: 500 !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .status-dot {
  width: 6px !important;
  height: 6px !important;
  box-shadow: 0 0 0 3px rgba(101, 214, 157, .12) !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .sidebar-toggle {
  width: 28px !important;
  height: 28px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid transparent !important;
  border-radius: 7px !important;
  color: #aeb0b3 !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .sidebar-toggle:hover {
  background: #262626 !important;
  border-color: #3a3a3a !important;
  color: #fff !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .sidebar-nav {
  gap: 2px !important;
  padding: 0 !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .nav-item {
  min-height: 40px !important;
  gap: 10px !important;
  padding: 0 10px !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #d0d0d2 !important;
  font-size: 13px !important;
  font-weight: 560 !important;
  letter-spacing: -.005em !important;
  line-height: 1.2 !important;
  transition: background-color 140ms ease, border-color 140ms ease, box-shadow 140ms ease, color 140ms ease, transform 140ms ease !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .nav-item .nav-icon,
html.vac-virando-theme #screen-dashboard #sidebar .nav-item > svg:not(.nav-chevron) {
  width: 18px !important;
  height: 18px !important;
  color: #b9b9bd !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .nav-item:hover {
  background: linear-gradient(180deg, #303030, #292929) !important;
  border-color: #404040 !important;
  color: #fff !important;
  box-shadow: 0 5px 14px rgba(0, 0, 0, .25) !important;
  transform: translateY(-1px) !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .nav-item:hover .nav-icon,
html.vac-virando-theme #screen-dashboard #sidebar .nav-item:hover > svg:not(.nav-chevron) {
  color: #fff !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .nav-item.active {
  background: linear-gradient(180deg, #373737, #2d2d2d) !important;
  border-color: #505050 !important;
  color: #fff !important;
  box-shadow: 0 0 0 2px rgba(111, 137, 255, .92), 0 6px 16px rgba(0, 0, 0, .28) !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .nav-item.active .nav-icon,
html.vac-virando-theme #screen-dashboard #sidebar .nav-item.active > svg:not(.nav-chevron) {
  color: #fff !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .nav-submenu {
  margin: 2px 0 3px 10px !important;
  padding: 3px 0 3px 10px !important;
  border-left: 1px solid #343434 !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .nav-subitem {
  min-height: 34px !important;
  border-radius: 7px !important;
  color: #aaaab0 !important;
  font-size: 12px !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .nav-badge {
  background: #414141 !important;
  color: #fff !important;
  box-shadow: none !important;
  font-size: 10px !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .sidebar-footer {
  margin-top: 12px !important;
  padding: 12px 0 0 !important;
  border-top: 1px solid #292929 !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .sidebar-footer > .btn-sidebar-action {
  min-height: 36px !important;
  gap: 9px !important;
  padding: 0 10px !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: #b7b7bb !important;
  font-size: 12px !important;
  font-weight: 520 !important;
  transition: background-color 140ms ease, border-color 140ms ease, color 140ms ease !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .sidebar-footer > .btn-sidebar-action:hover {
  background: #282828 !important;
  border-color: #3a3a3a !important;
  color: #fff !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .btn-restart {
  color: #ff9a8f !important;
}

html.vac-virando-theme #screen-dashboard #sidebar .sidebar-resize:hover,
html.vac-virando-theme #screen-dashboard #sidebar .sidebar-resize.dragging {
  background: #6f89ff !important;
}

/* The compact rail remains deliberate instead of inheriting the old large tiles. */
html.vac-virando-theme #screen-dashboard #sidebar.sidebar--collapsed {
  width: 68px !important;
  min-width: 68px !important;
  padding: 12px 8px !important;
}

html.vac-virando-theme #screen-dashboard #sidebar.sidebar--collapsed .sidebar-logo {
  margin-bottom: 8px !important;
  padding: 8px 0 14px !important;
}

html.vac-virando-theme #screen-dashboard #sidebar.sidebar--collapsed .sidebar-logo-icon {
  width: 32px !important;
  height: 32px !important;
}

html.vac-virando-theme #screen-dashboard #sidebar.sidebar--collapsed .sidebar-toggle {
  width: 28px !important;
  height: 28px !important;
  background: transparent !important;
  border-color: transparent !important;
}

html.vac-virando-theme #screen-dashboard #sidebar.sidebar--collapsed .sidebar-nav {
  gap: 3px !important;
}

html.vac-virando-theme #screen-dashboard #sidebar.sidebar--collapsed .nav-item,
html.vac-virando-theme #screen-dashboard #sidebar.sidebar--collapsed .sidebar-footer > .btn-sidebar-action {
  width: 44px !important;
  min-width: 44px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 !important;
  border-radius: 8px !important;
}

html.vac-virando-theme #screen-dashboard #sidebar.sidebar--collapsed .nav-item.active {
  box-shadow: 0 0 0 2px rgba(111, 137, 255, .82) !important;
}

html.vac-virando-theme #screen-dashboard #sidebar.sidebar--collapsed .sidebar-footer {
  gap: 3px !important;
  padding-top: 10px !important;
}

/* ── Work surface and type ─────────────────────────────────────────────── */
html.vac-virando-theme #screen-dashboard #main-content.main {
  background: #f6f6f7 !important;
  background-image: none !important;
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #main-content.main:not(.chat-mode):not(.crm-chat-mode):not(.ws-mode) {
  padding: 30px 34px 46px !important;
}

html.vac-virando-theme #screen-dashboard .page-header {
  margin-bottom: 22px !important;
}

html.vac-virando-theme #screen-dashboard .page-header h2,
html.vac-virando-theme #screen-dashboard .ws-top h2,
html.vac-virando-theme #screen-dashboard .crm-top h2 {
  color: #202223 !important;
  font-family: 'Inter var', Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
  font-size: 24px !important;
  font-weight: 690 !important;
  letter-spacing: -.028em !important;
  line-height: 1.2 !important;
}

html.vac-virando-theme #screen-dashboard .page-header p,
html.vac-virando-theme #screen-dashboard .ws-top p,
html.vac-virando-theme #screen-dashboard .crm-top p {
  color: #6d7175 !important;
  font-size: 13px !important;
  line-height: 1.5 !important;
}

html.vac-virando-theme #screen-dashboard .card,
html.vac-virando-theme #screen-dashboard .connection-banner,
html.vac-virando-theme #screen-dashboard .connection-card {
  background: #fff !important;
  border: 1px solid #e1e3e5 !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 2px rgba(32, 34, 35, .05) !important;
}

html.vac-virando-theme #screen-dashboard .card {
  padding: 22px !important;
}

html.vac-virando-theme #screen-dashboard .connection-banner:hover,
html.vac-virando-theme #screen-dashboard .card:not(.crm-card):hover,
html.vac-virando-theme #screen-dashboard .connection-card:hover {
  border-color: #c9cccf !important;
  box-shadow: 0 7px 18px rgba(32, 34, 35, .08) !important;
}

html.vac-virando-theme #screen-dashboard .card-title,
html.vac-virando-theme #screen-dashboard .form-label {
  color: #5c5f62 !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  letter-spacing: .045em !important;
}

html.vac-virando-theme #screen-dashboard .form-input,
html.vac-virando-theme #screen-dashboard .form-textarea,
html.vac-virando-theme #screen-dashboard .form-datetime,
html.vac-virando-theme #screen-dashboard .cfg-inp,
html.vac-virando-theme #screen-dashboard select.form-input {
  background: #fff !important;
  border: 1px solid #c9cccf !important;
  border-radius: 8px !important;
  color: #202223 !important;
  box-shadow: inset 0 1px 0 rgba(0, 0, 0, .02) !important;
  font-family: inherit !important;
}

html.vac-virando-theme #screen-dashboard .form-input:focus,
html.vac-virando-theme #screen-dashboard .form-textarea:focus,
html.vac-virando-theme #screen-dashboard .form-datetime:focus,
html.vac-virando-theme #screen-dashboard .cfg-inp:focus {
  border-color: #2c6ecb !important;
  box-shadow: 0 0 0 1px #2c6ecb !important;
}

html.vac-virando-theme #screen-dashboard .btn-primary {
  /* An inline width (used by a few full-form actions) remains authoritative. */
  width: auto;
  min-height: 36px !important;
  padding: 8px 14px !important;
  border: 1px solid #202223 !important;
  border-radius: 8px !important;
  background: #202223 !important;
  box-shadow: 0 1px 2px rgba(32, 34, 35, .20) !important;
  color: #fff !important;
  font-size: 13px !important;
  font-weight: 650 !important;
  letter-spacing: -.005em !important;
  transform: none !important;
}

html.vac-virando-theme #screen-dashboard .btn-primary:hover:not(:disabled) {
  background: #363636 !important;
  border-color: #363636 !important;
  box-shadow: 0 3px 8px rgba(32, 34, 35, .20) !important;
  opacity: 1 !important;
  transform: translateY(-1px) !important;
}

html.vac-virando-theme #screen-dashboard .btn-primary:disabled {
  background: #b7b7b7 !important;
  border-color: #b7b7b7 !important;
  color: #f1f1f1 !important;
}

html.vac-virando-theme #screen-dashboard .connect-action-btn,
html.vac-virando-theme #screen-dashboard .btn-file,
html.vac-virando-theme #screen-dashboard .crm-back-btn {
  background: #fff !important;
  border: 1px solid #c9cccf !important;
  border-radius: 8px !important;
  color: #303030 !important;
  box-shadow: 0 1px 1px rgba(32, 34, 35, .04) !important;
  font-weight: 600 !important;
}

html.vac-virando-theme #screen-dashboard .connect-action-btn:hover,
html.vac-virando-theme #screen-dashboard .btn-file:hover,
html.vac-virando-theme #screen-dashboard .crm-back-btn:hover {
  background: #f6f6f7 !important;
  border-color: #8c9196 !important;
  color: #202223 !important;
}

/* Tables and compact indicators inherit one quiet admin rhythm. */
html.vac-virando-theme #screen-dashboard table {
  background: #fff !important;
  color: #303030 !important;
}

html.vac-virando-theme #screen-dashboard table thead th {
  background: #f6f6f7 !important;
  border-color: #e1e3e5 !important;
  color: #5c5f62 !important;
  font-weight: 650 !important;
}

html.vac-virando-theme #screen-dashboard table tbody tr {
  border-color: #edeeef !important;
}

html.vac-virando-theme #screen-dashboard table tbody tr:hover td {
  background: #f9fafb !important;
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard .stat-card,
html.vac-virando-theme #screen-dashboard .odash-card,
html.vac-virando-theme #screen-dashboard .odash-stat,
html.vac-virando-theme #screen-dashboard .odash-square,
html.vac-virando-theme #screen-dashboard .odash-traffic-stage,
html.vac-virando-theme #screen-dashboard .odash-traffic-summary,
html.vac-virando-theme #screen-dashboard .odash-empty {
  background: #fff !important;
  border: 1px solid #e1e3e5 !important;
  box-shadow: 0 1px 2px rgba(32, 34, 35, .05) !important;
}

html.vac-virando-theme #screen-dashboard .stat-card:hover,
html.vac-virando-theme #screen-dashboard .odash-card:hover,
html.vac-virando-theme #screen-dashboard .odash-stat:hover {
  border-color: #c9cccf !important;
  box-shadow: 0 7px 18px rgba(32, 34, 35, .08) !important;
}

/* CRM board: the board stays dense, but uses paper-like columns instead of a dark sheet. */
html.vac-virando-theme #screen-dashboard #tab-crm,
html.vac-virando-theme #screen-dashboard #crm-board-view {
  background: #f6f6f7 !important;
}

html.vac-virando-theme #screen-dashboard #tab-crm .crm-action-bar {
  border-color: #e1e3e5 !important;
}

html.vac-virando-theme #screen-dashboard #tab-crm .crm-column {
  background: #fff !important;
  border: 1px solid #e1e3e5 !important;
  border-radius: 10px !important;
  box-shadow: 0 1px 2px rgba(32, 34, 35, .05) !important;
}

html.vac-virando-theme #screen-dashboard #tab-crm .crm-col-header {
  border-bottom: 1px solid #e1e3e5 !important;
}

html.vac-virando-theme #screen-dashboard #tab-crm .crm-col-title,
html.vac-virando-theme #screen-dashboard #tab-crm .crm-card-name {
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #tab-crm .crm-col-count {
  background: #f1f1f1 !important;
  color: #5c5f62 !important;
}

html.vac-virando-theme #screen-dashboard #tab-crm .crm-card {
  background: #fff !important;
  border: 1px solid #e1e3e5 !important;
  box-shadow: 0 1px 2px rgba(32, 34, 35, .05) !important;
}

html.vac-virando-theme #screen-dashboard #tab-crm .crm-card:hover {
  border-color: #8c9196 !important;
  box-shadow: 0 7px 18px rgba(32, 34, 35, .10) !important;
}

html.vac-virando-theme #screen-dashboard #tab-crm .crm-card-info,
html.vac-virando-theme #screen-dashboard #tab-crm .crm-card-note,
html.vac-virando-theme #screen-dashboard #tab-crm .crm-empty-col {
  color: #6d7175 !important;
}

/* Modal dialogs need to feel like part of the same application, not overlays from another theme. */
html.vac-virando-theme body .modal-overlay,
html.vac-virando-theme body .ca-modal-ov {
  background: rgba(0, 0, 0, .42) !important;
  backdrop-filter: blur(3px) !important;
}

html.vac-virando-theme body .modal-box,
html.vac-virando-theme body .modal-content,
html.vac-virando-theme body .ca-modal {
  background: #fff !important;
  border: 1px solid #e1e3e5 !important;
  border-radius: 14px !important;
  box-shadow: 0 18px 48px rgba(32, 34, 35, .20) !important;
  color: #202223 !important;
}

html.vac-virando-theme body .modal-header {
  border-bottom-color: #e1e3e5 !important;
}

html.vac-virando-theme body .modal-header h3,
html.vac-virando-theme body .modal-close {
  color: #202223 !important;
}

/* Blue is reserved for focus and selection — never for decorative noise. */
html.vac-virando-theme #screen-dashboard :is(button, input, textarea, select):focus-visible {
  outline: 2px solid #2c6ecb !important;
  outline-offset: 2px !important;
}

html.vac-virando-theme #screen-dashboard ::selection {
  background: #c9e1ff !important;
  color: #202223 !important;
}

@media (max-width: 860px) {
  html.vac-virando-theme #screen-dashboard #sidebar {
    background: #101010 !important;
  }

  html.vac-virando-theme #screen-dashboard #main-content.main:not(.chat-mode):not(.crm-chat-mode):not(.ws-mode) {
    padding: 68px 16px 30px !important;
  }

  html.vac-virando-theme #screen-dashboard .page-header h2 {
    font-size: 22px !important;
  }
}

/* ─────────────────────────────────────────────────────────────────────────
   Chat ao vivo — Virando a Chave
   A conversa é uma área de trabalho, não uma cópia do WhatsApp.  Este bloco
   vem depois dos três temas legados do chat e, por isso, restabelece uma única
   linguagem visual: superfícies claras, hierarquia silenciosa e azul apenas
   para foco/seleção.  Tudo fica preso ao domínio da Virando a Chave.
   ───────────────────────────────────────────────────────────────────────── */
html.vac-virando-theme #screen-dashboard #tab-chat {
  box-sizing: border-box !important;
  padding: 16px !important;
  background: #f6f6f7 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-layout {
  height: auto !important;
  flex: 1 1 auto !important;
  min-height: 0 !important;
  overflow: hidden !important;
  background: #ffffff !important;
  border: 1px solid #e1e3e5 !important;
  border-radius: 12px !important;
  box-shadow: 0 1px 2px rgba(32, 34, 35, .06) !important;
}

/* Lista de conversas */
html.vac-virando-theme #screen-dashboard #tab-chat .wa-sidebar {
  width: 356px !important;
  min-width: 302px !important;
  background: #ffffff !important;
  border-right: 1px solid #e1e3e5 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-sidebar-header {
  min-height: 68px !important;
  padding: 18px 18px 10px !important;
  background: #ffffff !important;
  border: 0 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-sidebar-title {
  color: #202223 !important;
  font-family: Inter, "Inter var", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  letter-spacing: -.02em !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-sidebar-status {
  margin-top: 3px !important;
  color: #6d7175 !important;
  font-size: 12px !important;
  line-height: 1.35 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #chat-connection-filter {
  min-height: 0 !important;
  padding: 4px 16px 3px !important;
  gap: 6px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #chat-connection-filter > div > button {
  min-height: 32px !important;
  padding: 6px 10px !important;
  border: 1px solid #d2d5d8 !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  color: #202223 !important;
  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  box-shadow: none !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #chat-connection-filter > div > button:hover {
  border-color: #8c9196 !important;
  background: #f6f6f7 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #conn-dropdown {
  min-width: 232px !important;
  padding: 4px !important;
  background: #ffffff !important;
  border: 1px solid #d2d5d8 !important;
  border-radius: 9px !important;
  box-shadow: 0 10px 28px rgba(32, 34, 35, .16) !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #conn-dropdown label {
  border-radius: 6px !important;
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #conn-dropdown label:hover {
  background: #f6f6f7 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-sidebar > div[style*="padding:8px 12px 0"] {
  padding: 7px 16px 7px !important;
  gap: 6px !important;
  border-bottom: 1px solid #f1f1f1 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat :is(.wa-unread-toggle, .wa-sound-toggle, .wa-crmf-toggle, .wa-type-toggle) {
  min-height: 32px !important;
  border: 1px solid #d2d5d8 !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  color: #5c5f62 !important;
  box-shadow: none !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-unread-toggle {
  padding: 5px 9px !important;
  gap: 5px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-unread-toggle svg,
html.vac-virando-theme #screen-dashboard #tab-chat .wa-type-toggle svg:first-child {
  color: #2c6ecb !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-unread-toggle span {
  min-width: 17px !important;
  padding: 1px 5px !important;
  border-radius: 5px !important;
  background: #f1f1f1 !important;
  color: #5c5f62 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat :is(.wa-unread-toggle, .wa-sound-toggle, .wa-crmf-toggle, .wa-type-toggle):hover {
  border-color: #8c9196 !important;
  background: #f6f6f7 !important;
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-unread-toggle.active,
html.vac-virando-theme #screen-dashboard #tab-chat .wa-type-toggle.active,
html.vac-virando-theme #screen-dashboard #tab-chat .wa-crmf-toggle.aberto {
  border-color: #2c6ecb !important;
  background: #ebf5ff !important;
  color: #1a5eac !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat :is(.wa-unread-toggle.active, .wa-type-toggle.active, .wa-crmf-toggle.aberto) :is(svg, span) {
  color: #1a5eac !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-unread-toggle.active span {
  background: #d9edff !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-sound-toggle,
html.vac-virando-theme #screen-dashboard #tab-chat .wa-crmf-toggle-compact {
  width: 32px !important;
  height: 32px !important;
  padding: 0 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-type-toggle {
  padding: 5px 9px !important;
  font-size: 12px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-type-menu {
  overflow: hidden !important;
  padding: 4px !important;
  background: #ffffff !important;
  border: 1px solid #d2d5d8 !important;
  border-radius: 9px !important;
  box-shadow: 0 10px 28px rgba(32, 34, 35, .16) !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-type-menu button {
  color: #202223 !important;
  border-radius: 6px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-type-menu button:hover {
  background: #f6f6f7 !important;
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-crm-filters {
  gap: 6px !important;
  padding: 8px 16px !important;
  border-bottom: 1px solid #f1f1f1 !important;
  background: #fafafa !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-crm-filter,
html.vac-virando-theme #screen-dashboard #tab-chat :is(#chat-hoje-btn, #chat-datefilter-trigger, #chat-datefilter-clear) {
  min-height: 31px !important;
  border: 1px solid #d2d5d8 !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  color: #5c5f62 !important;
  font-family: inherit !important;
  font-size: 11.5px !important;
  box-shadow: none !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-search-wrap {
  padding: 10px 16px 12px !important;
  background: #ffffff !important;
  border-bottom: 1px solid #e1e3e5 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-search-box {
  min-height: 38px !important;
  padding: 0 11px !important;
  border: 1px solid #c9cccf !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #6d7175 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-search-box:focus-within {
  border-color: #2c6ecb !important;
  box-shadow: 0 0 0 1px #2c6ecb !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-search-input {
  color: #202223 !important;
  font-family: inherit !important;
  font-size: 13px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-search-input::placeholder {
  color: #8c9196 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-conv-list {
  background: #ffffff !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-conv-list::-webkit-scrollbar {
  width: 8px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-conv-list::-webkit-scrollbar-thumb {
  border: 2px solid #ffffff !important;
  border-radius: 8px !important;
  background: #c9cccf !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-empty,
html.vac-virando-theme #screen-dashboard #tab-chat .wa-sync-empty {
  color: #6d7175 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .conv-item {
  min-height: 74px !important;
  box-sizing: border-box !important;
  gap: 11px !important;
  padding: 11px 16px !important;
  border: 0 !important;
  border-bottom: 1px solid #f1f1f1 !important;
  background: #ffffff !important;
  transition: background .12s ease, box-shadow .12s ease !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .conv-item:hover {
  background: #f6f6f7 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .conv-item.active {
  background: #ebf5ff !important;
  box-shadow: inset 3px 0 0 #2c6ecb !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .conv-item.crm-conv-unread {
  border-left: 3px solid #2c6ecb !important;
  box-shadow: inset 3px 0 0 #2c6ecb !important;
  animation: none !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .conv-item.active.crm-conv-unread {
  border-left-color: transparent !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .conv-item-info,
html.vac-virando-theme #screen-dashboard #tab-chat .wa-convo-info {
  min-width: 0 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .conv-name {
  overflow: hidden !important;
  color: #202223 !important;
  font-family: inherit !important;
  font-size: 13.5px !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .conv-time,
html.vac-virando-theme #screen-dashboard #tab-chat .conv-last {
  color: #6d7175 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .conv-time {
  font-size: 11px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .conv-last {
  font-size: 12px !important;
  line-height: 1.4 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .conv-item.active :is(.conv-name, .conv-time, .conv-last) {
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .conv-unread-badge {
  min-width: 18px !important;
  height: 18px !important;
  border-radius: 9px !important;
  background: #2c6ecb !important;
  color: #ffffff !important;
  font-size: 10px !important;
  font-weight: 700 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .def-avatar {
  background-color: #2c6ecb !important;
  background-image: none !important;
  color: #ffffff !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .def-avatar svg {
  display: block !important;
}

/* Área da conversa */
html.vac-virando-theme #screen-dashboard #tab-chat .wa-main {
  background: #f6f6f7 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-welcome {
  background: #f6f6f7 !important;
  color: #6d7175 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-welcome h3 {
  color: #202223 !important;
  font-family: Inter, "Inter var", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
  font-size: 21px !important;
  font-weight: 650 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-welcome-icon {
  color: #2c6ecb !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-convo-header {
  min-height: 68px !important;
  box-sizing: border-box !important;
  gap: 11px !important;
  padding: 10px 16px !important;
  background: #ffffff !important;
  border: 0 !important;
  border-bottom: 1px solid #e1e3e5 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #wa-convo-back {
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-convo-avatar {
  width: 38px !important;
  height: 38px !important;
  border-radius: 9px !important;
  background: #eaf3ff !important;
  color: #1a5eac !important;
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-convo-name {
  overflow: hidden !important;
  color: #202223 !important;
  font-family: inherit !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-convo-sub {
  overflow: hidden !important;
  color: #6d7175 !important;
  font-size: 11.5px !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-header-btn {
  width: 32px !important;
  height: 32px !important;
  padding: 0 !important;
  border: 1px solid transparent !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: #5c5f62 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-header-btn:hover {
  border-color: #d2d5d8 !important;
  background: #f6f6f7 !important;
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #wa-header-label-select,
html.vac-virando-theme #screen-dashboard #tab-chat .wa-leadctl-sel {
  min-height: 32px !important;
  border: 1px solid #d2d5d8 !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  color: #202223 !important;
  font-family: inherit !important;
  font-size: 11.5px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-messages {
  padding: 20px clamp(22px, 6vw, 80px) !important;
  background: #f6f6f7 !important;
  background-image: none !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-messages::-webkit-scrollbar {
  width: 8px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-messages::-webkit-scrollbar-thumb {
  border: 2px solid #f6f6f7 !important;
  border-radius: 8px !important;
  background: #c9cccf !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-empty-area {
  color: #6d7175 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-msg {
  max-width: min(680px, 68%) !important;
  margin-bottom: 5px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-bubble {
  padding: 10px 13px !important;
  border-radius: 10px !important;
  font-family: inherit !important;
  font-size: var(--vac-chat-font-size, 13.5px) !important;
  line-height: var(--vac-chat-font-line-height, 1.48) !important;
  box-shadow: none !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-msg.in .chat-bubble {
  border: 1px solid #e1e3e5 !important;
  border-bottom-left-radius: 3px !important;
  background: #ffffff !important;
  color: #202223 !important;
  box-shadow: 0 1px 1px rgba(32, 34, 35, .04) !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-msg.out .chat-bubble {
  border: 1px solid #2c6ecb !important;
  border-bottom-right-radius: 3px !important;
  background: #2c6ecb !important;
  color: #ffffff !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-msg .msg-meta span[style] {
  color: #6d7175 !important;
  font-family: inherit !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-msg.out .msg-meta span[style] {
  color: rgba(255, 255, 255, .78) !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-msg-reaction {
  border-color: #d2d5d8 !important;
  background: #ffffff !important;
  box-shadow: 0 1px 3px rgba(32, 34, 35, .12) !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-date-sep {
  margin: 14px 0 10px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-date-sep span {
  border: 1px solid #e1e3e5 !important;
  border-radius: 6px !important;
  background: #ffffff !important;
  color: #6d7175 !important;
  font-family: inherit !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  padding: 4px 9px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat :is(.msg-reaction-btn, .msg-reply-btn, .msg-forward-btn) {
  border: 1px solid #d2d5d8 !important;
  border-radius: 6px !important;
  background: #ffffff !important;
  color: #5c5f62 !important;
  box-shadow: 0 1px 2px rgba(32, 34, 35, .08) !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat :is(.msg-reaction-btn, .msg-reply-btn, .msg-forward-btn):hover {
  background: #f6f6f7 !important;
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .msg-quote {
  border-left-color: #2c6ecb !important;
  border-radius: 4px !important;
  background: #f1f8ff !important;
  color: #5c5f62 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-msg.out .msg-quote {
  border-left-color: rgba(255,255,255,.74) !important;
  background: rgba(255,255,255,.14) !important;
  color: rgba(255,255,255,.86) !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-reply-bar {
  margin: 0 16px !important;
  border-left-color: #2c6ecb !important;
  border-radius: 7px 7px 0 0 !important;
  background: #f1f8ff !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-reply-bar-text {
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-reply-bar-close {
  color: #6d7175 !important;
}

/* Ferramentas, templates e resposta */
html.vac-virando-theme #screen-dashboard #tab-chat #ai-result-panel {
  background: #f1f8ff !important;
  border-top: 1px solid #d9edff !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-result-panel > div:first-child > div {
  color: #1a5eac !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-result-text {
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-toolbar {
  min-height: 43px !important;
  padding: 6px 14px !important;
  border-top: 1px solid #e1e3e5 !important;
  background: #ffffff !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-toolbar .btn-sidebar-action,
html.vac-virando-theme #screen-dashboard #tab-chat #ai-chatbot-toggle {
  border: 1px solid #d2d5d8 !important;
  border-radius: 6px !important;
  background: #ffffff !important;
  color: #202223 !important;
  font-family: inherit !important;
  box-shadow: none !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-toolbar .btn-sidebar-action:hover,
html.vac-virando-theme #screen-dashboard #tab-chat #ai-chatbot-toggle:hover {
  border-color: #8c9196 !important;
  background: #f6f6f7 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat :is(#chat-direct-conn-bar, #chat-group-conn-bar) {
  border-top-color: #e1e3e5 !important;
  background: #ffffff !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat :is(#chat-direct-conn-select, #chat-group-conn-select) {
  border: 1px solid #d2d5d8 !important;
  border-radius: 6px !important;
  background: #ffffff !important;
  color: #202223 !important;
  font-family: inherit !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat :is(#chat-tpl-panel, #chat-qs-panel) {
  border-top: 1px solid #e1e3e5 !important;
  background: #ffffff !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-tpl-head {
  border-bottom-color: #e1e3e5 !important;
  background: #ffffff !important;
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-tpl-empty {
  color: #6d7175 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-tpl-item {
  border-bottom-color: #f1f1f1 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-tpl-item:hover {
  background: #f6f6f7 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-tpl-name,
html.vac-virando-theme #screen-dashboard #tab-chat .chat-tpl-body {
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-tpl-body {
  color: #6d7175 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-tpl-send {
  border-radius: 6px !important;
  background: #202223 !important;
  color: #ffffff !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-input-bar {
  gap: 8px !important;
  padding: 10px 14px !important;
  background: #ffffff !important;
  border-top: 1px solid #e1e3e5 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-input {
  min-height: 42px !important;
  border: 1px solid #c9cccf !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #202223 !important;
  font-family: inherit !important;
  font-size: 13.5px !important;
  padding: 10px 12px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-input:focus {
  border-color: #2c6ecb !important;
  box-shadow: 0 0 0 1px #2c6ecb !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-input::placeholder {
  color: #8c9196 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-tpl-btn,
html.vac-virando-theme #screen-dashboard #tab-chat .wa-input-bar .wa-header-btn {
  width: 40px !important;
  height: 40px !important;
  flex-shrink: 0 !important;
  border: 1px solid #d2d5d8 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #5c5f62 !important;
  box-shadow: none !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat :is(.wa-tpl-btn, .wa-input-bar .wa-header-btn):hover {
  border-color: #8c9196 !important;
  background: #f6f6f7 !important;
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-send-btn {
  width: 42px !important;
  height: 42px !important;
  border-radius: 8px !important;
  background: #202223 !important;
  color: #ffffff !important;
  box-shadow: none !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-send-btn:hover:not(:disabled) {
  background: #3f4245 !important;
  box-shadow: 0 2px 5px rgba(32, 34, 35, .18) !important;
}

/* Dados do lead: painel lateral do atendimento */
html.vac-virando-theme #screen-dashboard #tab-chat #live-lead-panel {
  width: 336px !important;
  padding: 16px !important;
  background: #ffffff !important;
  border-left: 1px solid #e1e3e5 !important;
  box-shadow: -8px 0 24px rgba(32, 34, 35, .08) !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-main.lead-open .wa-convo {
  margin-right: 336px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #live-lead-toggle {
  width: 34px !important;
  height: 34px !important;
  border: 1px solid #d2d5d8 !important;
  border-radius: 7px 0 0 7px !important;
  background: #ffffff !important;
  color: #2c6ecb !important;
  box-shadow: -2px 2px 8px rgba(32, 34, 35, .10) !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .lead-tabs {
  gap: 2px !important;
  margin: -16px -16px 16px !important;
  padding: 10px 12px 0 !important;
  border-bottom: 1px solid #e1e3e5 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .lead-tab {
  border: 0 !important;
  border-bottom: 2px solid transparent !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #6d7175 !important;
  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .lead-tab.active {
  border-bottom-color: #2c6ecb !important;
  background: transparent !important;
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat :is(.lead-title, .lead-empty, .crm-lead-info-row, .lead-hist-stat, .lead-hist-call, .lead-hist-col) {
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .lead-title {
  color: #6d7175 !important;
  letter-spacing: .08em !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .lead-callback-btn {
  border-color: #d2d5d8 !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .lead-callback-btn:hover,
html.vac-virando-theme #screen-dashboard #tab-chat .lead-callback-btn.active {
  border-color: #2c6ecb !important;
  background: #ebf5ff !important;
  color: #1a5eac !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #emoji-picker-panel,
html.vac-virando-theme #screen-dashboard #tab-chat #reaction-picker {
  border: 1px solid #d2d5d8 !important;
  background: #ffffff !important;
  box-shadow: 0 10px 28px rgba(32, 34, 35, .18) !important;
}

@media (max-width: 860px) {
  html.vac-virando-theme #screen-dashboard #tab-chat {
    padding: 0 !important;
    background: #ffffff !important;
  }

  html.vac-virando-theme #screen-dashboard #tab-chat .wa-layout {
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }

  html.vac-virando-theme #screen-dashboard #tab-chat .wa-sidebar {
    width: 100% !important;
    min-width: 0 !important;
    border-right: 0 !important;
  }

  html.vac-virando-theme body.wa-thread-open #screen-dashboard #tab-chat .wa-main,
  html.vac-virando-theme body.wa-thread-open #screen-dashboard #tab-chat #wa-convo {
    background: #f6f6f7 !important;
  }

  html.vac-virando-theme #screen-dashboard #tab-chat .wa-convo-header {
    min-height: 58px !important;
  }

  html.vac-virando-theme #screen-dashboard #tab-chat .wa-messages {
    padding: 14px 12px !important;
  }

  html.vac-virando-theme #screen-dashboard #tab-chat .chat-msg {
    max-width: 88% !important;
  }

  html.vac-virando-theme #screen-dashboard #tab-chat .wa-input-bar {
    padding: 8px 10px max(10px, env(safe-area-inset-bottom)) !important;
  }

  html.vac-virando-theme #screen-dashboard #tab-chat .wa-tpl-btn {
    width: 38px !important;
    height: 38px !important;
  }
}

/* Refinos do Chat ao vivo após uso real: área inteira, conversa sem moldura e
   estados de atendimento legíveis. Continua 100% isolado à Virando a Chave. */
html.vac-virando-theme {
  --vac-chat-outgoing: #2c6ecb;
}

html.vac-virando-theme #screen-dashboard #tab-chat {
  padding: 0 !important;
  background: #ffffff !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-layout {
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-main,
html.vac-virando-theme #screen-dashboard #tab-chat .wa-welcome,
html.vac-virando-theme #screen-dashboard #tab-chat .wa-messages {
  background: #ffffff !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-messages {
  padding: 14px 16px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-messages::-webkit-scrollbar-thumb {
  border-color: #ffffff !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-msg {
  max-width: 78% !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-msg.in .chat-bubble {
  border: 0 !important;
  background: #ffffff !important;
  box-shadow: 0 1px 2px rgba(32, 34, 35, .12) !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-msg.out:not(.ai-sent) .chat-bubble {
  border-color: var(--vac-chat-outgoing, #2c6ecb) !important;
  background: var(--vac-chat-outgoing, #2c6ecb) !important;
}

/* A IA é sempre laranja, independentemente da cor escolhida pelo atendente. */
html.vac-virando-theme #screen-dashboard #tab-chat .chat-msg.out.ai-sent .chat-bubble {
  border-color: #f17b25 !important;
  background: #f17b25 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #chat-contact-btn {
  display: none !important;
}

/* Estado e comandos da IA: compacto e com semântica visual clara. */
html.vac-virando-theme #screen-dashboard #tab-chat #ai-toolbar {
  min-height: 50px !important;
  box-sizing: border-box !important;
  gap: 7px !important;
  padding: 7px 14px !important;
  border-top: 1px solid #e1e3e5 !important;
  border-bottom: 1px solid #e1e3e5 !important;
  background: #ffffff !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-chatbot-status {
  min-height: 30px !important;
  box-sizing: border-box !important;
  gap: 6px !important;
  padding: 5px 9px !important;
  border: 1px solid #d2d5d8 !important;
  border-radius: 7px !important;
  background: #f6f6f7 !important;
  color: #5c5f62 !important;
  font-size: 11.5px !important;
  font-weight: 650 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-chatbot-status.is-paused {
  border-color: #fed7aa !important;
  background: #fff7ed !important;
  color: #b45309 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-chatbot-status.is-active {
  border-color: #bbf7d0 !important;
  background: #f0fdf4 !important;
  color: #167a45 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-toolbar .btn-sidebar-action,
html.vac-virando-theme #screen-dashboard #tab-chat #ai-chatbot-assumir-btn {
  min-height: 30px !important;
  padding: 4px 9px !important;
  border: 1px solid #d2d5d8 !important;
  border-radius: 6px !important;
  background: #ffffff !important;
  color: #202223 !important;
  font-family: inherit !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-toolbar .btn-sidebar-action:hover,
html.vac-virando-theme #screen-dashboard #tab-chat #ai-chatbot-assumir-btn:hover {
  border-color: #8c9196 !important;
  background: #f6f6f7 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-toolbar > div:last-child {
  margin-left: auto !important;
  gap: 7px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-toolbar > div:last-child > span {
  color: #6d7175 !important;
  font-family: inherit !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-chatbot-toggle {
  min-width: 44px !important;
  min-height: 30px !important;
  padding: 4px 9px !important;
  border: 1px solid #d2d5d8 !important;
  border-radius: 6px !important;
  background: #f6f6f7 !important;
  color: #5c5f62 !important;
  font-family: inherit !important;
  font-size: 11px !important;
  font-weight: 700 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-chatbot-toggle[data-state="active"] {
  border-color: #bbf7d0 !important;
  background: #f0fdf4 !important;
  color: #167a45 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-chatbot-toggle[data-state="paused"] {
  border-color: #fed7aa !important;
  background: #fff7ed !important;
  color: #b45309 !important;
}

/* Escolha individual da cor das mensagens do atendente. */
html.vac-virando-theme #screen-dashboard #tab-chat .wa-sidebar-header {
  position: relative !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-control {
  position: relative !important;
  z-index: 70 !important;
  flex: 0 0 auto !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-trigger {
  width: 32px !important;
  height: 32px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  border: 1px solid #d2d5d8 !important;
  border-radius: 7px !important;
  background: #ffffff !important;
  cursor: pointer !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-trigger:hover,
html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-trigger[aria-expanded="true"] {
  border-color: #8c9196 !important;
  background: #f6f6f7 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-current {
  width: 14px !important;
  height: 14px !important;
  display: block !important;
  border: 2px solid #ffffff !important;
  border-radius: 50% !important;
  box-shadow: 0 0 0 1px rgba(32, 34, 35, .22) !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-menu {
  position: absolute !important;
  top: calc(100% + 7px) !important;
  right: 0 !important;
  width: 214px !important;
  display: none !important;
  padding: 12px !important;
  border: 1px solid #d2d5d8 !important;
  border-radius: 9px !important;
  background: #ffffff !important;
  box-shadow: 0 12px 30px rgba(32, 34, 35, .18) !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-menu.open {
  display: block !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-menu-title {
  margin-bottom: 10px !important;
  color: #202223 !important;
  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-options {
  display: flex !important;
  gap: 7px !important;
  margin-bottom: 12px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-options button {
  width: 28px !important;
  height: 28px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  border: 1px solid transparent !important;
  border-radius: 50% !important;
  background: transparent !important;
  cursor: pointer !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-options button span {
  width: 18px !important;
  height: 18px !important;
  display: block !important;
  border-radius: 50% !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-options button:hover,
html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-options button.selected {
  border-color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-custom-label {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding-top: 10px !important;
  border-top: 1px solid #e1e3e5 !important;
  color: #6d7175 !important;
  font-family: inherit !important;
  font-size: 11.5px !important;
  font-weight: 600 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #chat-color-custom {
  width: 29px !important;
  height: 24px !important;
  padding: 1px !important;
  border: 1px solid #d2d5d8 !important;
  border-radius: 5px !important;
  background: #ffffff !important;
  cursor: pointer !important;
}

@media (max-width: 860px) {
  html.vac-virando-theme body.wa-thread-open #screen-dashboard #tab-chat .wa-main,
  html.vac-virando-theme body.wa-thread-open #screen-dashboard #tab-chat #wa-convo {
    background: #ffffff !important;
  }

  html.vac-virando-theme #screen-dashboard #tab-chat .wa-messages {
    padding: 12px 10px !important;
  }

  html.vac-virando-theme #screen-dashboard #tab-chat .chat-msg {
    max-width: 90% !important;
  }
}

/* Acabamento final do Chat: controles consistentes, seleção inequívoca e
   preferências visuais individuais. Tudo permanece exclusivo da Virando. */
html.vac-virando-theme {
  --vac-chat-background: #ffffff;
}

/* Ao recolher, a barra lateral vira um trilho de ícones de verdade. */
html.vac-virando-theme #screen-dashboard #sidebar.sidebar--collapsed {
  width: 68px !important;
  min-width: 68px !important;
  overflow: hidden !important;
}

html.vac-virando-theme #screen-dashboard #sidebar.sidebar--collapsed :is(.nav-item, .btn-sidebar-action) {
  justify-content: center !important;
  gap: 0 !important;
  overflow: hidden !important;
  font-size: 0 !important;
  line-height: 0 !important;
}

html.vac-virando-theme #screen-dashboard #sidebar.sidebar--collapsed :is(.nav-item, .btn-sidebar-action) > span,
html.vac-virando-theme #screen-dashboard #sidebar.sidebar--collapsed :is(.nav-label, .btn-label, .nav-badge, .nav-chevron, .sidebar-logo-text, .nav-submenu) {
  display: none !important;
}

html.vac-virando-theme #screen-dashboard #sidebar.sidebar--collapsed :is(.nav-item, .btn-sidebar-action) svg,
html.vac-virando-theme #screen-dashboard #sidebar.sidebar--collapsed .nav-icon {
  width: 20px !important;
  height: 20px !important;
  min-width: 20px !important;
  flex: 0 0 20px !important;
}

/* A conversa em foco precisa continuar visível mesmo numa lista cheia. */
html.vac-virando-theme #screen-dashboard #tab-chat .conv-item.active,
html.vac-virando-theme #screen-dashboard #tab-chat .conv-item.active.crm-conv-unread {
  border-bottom-color: #b9d5f5 !important;
  background: #dbeafe !important;
  box-shadow: inset 4px 0 0 #1f6feb, inset 0 0 0 1px #93c5fd !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .conv-item.active :is(.conv-name, .conv-time, .conv-last) {
  color: #163f73 !important;
}

/* Controles de texto: pílulas discretas, como os comandos do Shopify. */
html.vac-virando-theme #screen-dashboard #tab-chat :is(#wa-header-label-select, .wa-leadctl-sel, #chat-direct-conn-select, #chat-group-conn-select) {
  min-height: 38px !important;
  height: 38px !important;
  padding: 0 34px 0 13px !important;
  border: 1px solid #c9cccf !important;
  border-radius: 12px !important;
  background: #ffffff !important;
  color: #202223 !important;
  box-shadow: 0 1px 1px rgba(32, 34, 35, .05) !important;
  font-size: 13px !important;
  font-weight: 560 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #chat-connection-filter > div > button,
html.vac-virando-theme #screen-dashboard #tab-chat :is(.wa-unread-toggle, .wa-type-toggle),
html.vac-virando-theme #screen-dashboard #tab-chat #ai-toolbar :is(.btn-sidebar-action, #ai-chatbot-assumir-btn, #ai-chatbot-toggle) {
  min-height: 36px !important;
  height: 36px !important;
  padding: 0 13px !important;
  border: 1px solid #c9cccf !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  color: #202223 !important;
  box-shadow: 0 1px 1px rgba(32, 34, 35, .05) !important;
  font-size: 12.5px !important;
  font-weight: 600 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat :is(.wa-sound-toggle, .wa-crmf-toggle, .wa-header-btn) {
  width: 36px !important;
  min-width: 36px !important;
  height: 36px !important;
  padding: 0 !important;
  border: 1px solid #c9cccf !important;
  border-radius: 10px !important;
  background: #ffffff !important;
  color: #5c5f62 !important;
  box-shadow: 0 1px 1px rgba(32, 34, 35, .05) !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat :is(#wa-header-label-select, .wa-leadctl-sel, #chat-direct-conn-select, #chat-group-conn-select, #chat-connection-filter > div > button, .wa-unread-toggle, .wa-type-toggle, .wa-sound-toggle, .wa-crmf-toggle, .wa-header-btn, #ai-toolbar .btn-sidebar-action, #ai-chatbot-assumir-btn, #ai-chatbot-toggle):hover {
  border-color: #8c9196 !important;
  background: #f6f6f7 !important;
  color: #202223 !important;
}

/* Responsável e etiqueta continuam sendo selects nativos: só a apresentação vira ícone. */
html.vac-virando-theme #screen-dashboard #tab-chat :is(#wa-header-label-select, .wa-leadctl-sel.wa-leadctl-owner-icon) {
  width: 36px !important;
  min-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 !important;
  border: 1px solid #c9cccf !important;
  border-radius: 10px !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  color: transparent !important;
  font-size: 1px !important;
  line-height: 1 !important;
  text-indent: -9999px !important;
  cursor: pointer;
  background-color: #ffffff !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: 18px 18px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-leadctl-sel.wa-leadctl-owner-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%235c5f62' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='3.5'/%3E%3Cpath d='M5 21a7 7 0 0 1 14 0'/%3E%3C/svg%3E") !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #wa-header-label-select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%235c5f62' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20.59 13.41 11 23l-8.59-8.59a2 2 0 0 1 0-2.82L11 3h8a2 2 0 0 1 2 2v8a2 2 0 0 1-.41 1.41Z'/%3E%3Ccircle cx='16' cy='8' r='1'/%3E%3C/svg%3E") !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat :is(#wa-header-label-select, .wa-leadctl-sel.wa-leadctl-owner-icon):hover {
  border-color: #8c9196 !important;
  background-color: #f6f6f7 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat :is(#wa-header-label-select, .wa-leadctl-sel.wa-leadctl-owner-icon):focus-visible {
  outline: 2px solid #2c6ecb !important;
  outline-offset: 2px !important;
  box-shadow: none !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat :is(#wa-header-label-select, .wa-leadctl-sel.wa-leadctl-owner-icon) option {
  color: #202223 !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  text-indent: 0 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-chatbot-status {
  min-height: 36px !important;
  padding: 0 13px !important;
  border-radius: 999px !important;
  font-size: 12.5px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-chatbot-toggle[data-state="active"] {
  border-color: #bbf7d0 !important;
  background: #f0fdf4 !important;
  color: #167a45 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-chatbot-toggle[data-state="paused"] {
  border-color: #fed7aa !important;
  background: #fff7ed !important;
  color: #b45309 !important;
}

/* Ícones do compositor: quadrados suaves; enviar continua sendo o CTA escuro. */
html.vac-virando-theme #screen-dashboard #tab-chat .wa-input {
  min-height: 42px !important;
  border-radius: 12px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat :is(.wa-tpl-btn, .wa-input-bar .wa-header-btn) {
  width: 42px !important;
  height: 42px !important;
  border-color: #c9cccf !important;
  border-radius: 11px !important;
  box-shadow: 0 1px 1px rgba(32, 34, 35, .05) !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-send-btn {
  width: 42px !important;
  height: 42px !important;
  border-radius: 11px !important;
  background: #202223 !important;
  box-shadow: 0 1px 2px rgba(32, 34, 35, .18) !important;
}

/* A cor escolhida muda só o canvas da conversa; cabeçalho e compositor ficam claros. */
html.vac-virando-theme #screen-dashboard #tab-chat :is(.wa-messages, .wa-welcome) {
  background: var(--vac-chat-background, #ffffff) !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-messages::-webkit-scrollbar-thumb {
  border-color: var(--vac-chat-background, #ffffff) !important;
}

/* A bolinha abre as duas preferências: mensagem enviada e fundo da conversa. */
html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-trigger {
  width: 42px !important;
  height: 36px !important;
  border-radius: 999px !important;
  box-shadow: 0 1px 1px rgba(32, 34, 35, .05) !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-swatches {
  display: inline-flex !important;
  align-items: center !important;
  gap: 3px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-current {
  width: 12px !important;
  height: 12px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-background-current {
  border-color: #f1f1f1 !important;
  box-shadow: 0 0 0 1px rgba(32, 34, 35, .42) !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-menu {
  width: 236px !important;
  padding: 14px !important;
  border-radius: 12px !important;
  box-shadow: 0 14px 34px rgba(32, 34, 35, .18) !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-section-divider {
  height: 1px !important;
  margin: 13px 0 12px !important;
  background: #e1e3e5 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-background-title {
  margin-bottom: 10px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat :is(#chat-color-custom, #chat-background-custom) {
  width: 31px !important;
  height: 25px !important;
  border-radius: 7px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-background-custom-label {
  padding-top: 0 !important;
  border-top: 0 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-background-options button span {
  box-shadow: inset 0 0 0 1px rgba(32, 34, 35, .18) !important;
}

/* Tipografia das mensagens: preferência individual do atendente. */
html.vac-virando-theme #screen-dashboard #tab-chat .chat-font-size-options {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 6px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-font-size-options button {
  min-height: 48px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  padding: 6px 4px !important;
  border: 1px solid #d2d5d8 !important;
  border-radius: 8px !important;
  background: #ffffff !important;
  color: #5c5f62 !important;
  cursor: pointer !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-font-size-options button:hover,
html.vac-virando-theme #screen-dashboard #tab-chat .chat-font-size-options button.selected {
  border-color: #2c6ecb !important;
  background: #f0f5ff !important;
  color: #202223 !important;
  box-shadow: inset 0 0 0 1px #2c6ecb !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-font-size-preview {
  font-weight: 700 !important;
  line-height: 1 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-font-size-options button:nth-child(1) .chat-font-size-preview { font-size: 12px !important; }
html.vac-virando-theme #screen-dashboard #tab-chat .chat-font-size-options button:nth-child(2) .chat-font-size-preview { font-size: 14px !important; }
html.vac-virando-theme #screen-dashboard #tab-chat .chat-font-size-options button:nth-child(3) .chat-font-size-preview { font-size: 16px !important; }

html.vac-virando-theme #screen-dashboard #tab-chat .chat-font-size-label {
  font-size: 10px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
}

@media (max-width: 860px) {
  html.vac-virando-theme body.wa-thread-open #screen-dashboard #tab-chat :is(.wa-main, #wa-convo, .wa-messages) {
    background: var(--vac-chat-background, #ffffff) !important;
  }

  html.vac-virando-theme body.wa-thread-open #screen-dashboard #tab-chat :is(.wa-convo-header, .wa-input-bar, #ai-toolbar, #chat-direct-conn-bar, #chat-group-conn-bar) {
    background: #ffffff !important;
  }
}

/* Controles finais: menos ruído, ícones de sistema e ações secundárias discretas. */
html.vac-virando-theme #screen-dashboard #tab-chat :is(#btn-reactivate-bot, #btn-rename-chat-contact, #btn-mark-chat-unread) {
  display: none !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-convo-header > div:last-child {
  gap: 4px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-convo-header .wa-header-btn {
  width: 32px !important;
  min-width: 32px !important;
  height: 32px !important;
  border: 0 !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #8c9196 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .wa-convo-header .wa-header-btn:hover {
  background: #f1f1f1 !important;
  color: #202223 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-toolbar {
  min-height: 44px !important;
  padding: 5px 14px !important;
  gap: 6px !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat #ai-toolbar :is(#ai-chatbot-status, .btn-sidebar-action, #ai-chatbot-assumir-btn, #ai-chatbot-toggle) {
  min-height: 32px !important;
  height: 32px !important;
  font-size: 12px !important;
}

html.vac-virando-theme #screen-dashboard :is(.ai-tool-btn, .crm-ai-tool) {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
}

html.vac-virando-theme #screen-dashboard .ai-tool-icon {
  width: 15px !important;
  height: 15px !important;
  flex: 0 0 15px !important;
}

/* O lápis discreto abre as mesmas opções de cor sem ocupar a tela. */
html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-trigger {
  width: 30px !important;
  height: 30px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #a8adb3 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-trigger:hover,
html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-trigger[aria-expanded="true"] {
  border: 0 !important;
  background: #f1f1f1 !important;
  color: #5c5f62 !important;
}

html.vac-virando-theme #screen-dashboard #tab-chat .chat-color-pencil {
  width: 16px !important;
  height: 16px !important;
}

/* O detalhe do CRM reutiliza exatamente as preferências escolhidas no Chat ao vivo. */
html.vac-virando-theme #screen-dashboard #crm-detail-view :is(.crm-detail-right.wa-main, .crm-wa-convo) {
  background: #ffffff !important;
}

html.vac-virando-theme #screen-dashboard #crm-detail-view #crm-detail-chat-header,
html.vac-virando-theme #screen-dashboard #crm-detail-view .crm-detail-input-area {
  background: #ffffff !important;
}

html.vac-virando-theme #screen-dashboard #crm-detail-view #crm-detail-messages {
  background: var(--vac-chat-background, #ffffff) !important;
  background-image: none !important;
}

html.vac-virando-theme #screen-dashboard #crm-detail-view #crm-detail-messages::-webkit-scrollbar-thumb {
  border-color: var(--vac-chat-background, #ffffff) !important;
}

html.vac-virando-theme #screen-dashboard #crm-detail-view .chat-msg.out:not(.ai-sent) .chat-bubble {
  border-color: var(--vac-chat-outgoing, #2c6ecb) !important;
  background: var(--vac-chat-outgoing, #2c6ecb) !important;
  color: #ffffff !important;
}

html.vac-virando-theme #screen-dashboard #crm-detail-view .chat-msg.out.ai-sent .chat-bubble {
  border-color: #f17b25 !important;
  background: #f17b25 !important;
  color: #ffffff !important;
}

html.vac-virando-theme #screen-dashboard #crm-detail-view .chat-msg.in .chat-bubble {
  border: 0 !important;
  background: #ffffff !important;
  color: #202223 !important;
  box-shadow: 0 1px 2px rgba(32, 34, 35, .12) !important;
}

html.vac-virando-theme #screen-dashboard #crm-detail-view #crm-ai-toolbar {
  min-height: 42px !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 5px 12px !important;
  border-top: 1px solid #e1e3e5 !important;
  border-bottom: 1px solid #e1e3e5 !important;
  background: #ffffff !important;
}

html.vac-virando-theme #screen-dashboard #crm-detail-view :is(#crm-ai-status, #crm-ai-toolbar .btn-sidebar-action, #crm-ai-assumir, #crm-ai-toggle) {
  min-height: 32px !important;
  height: 32px !important;
  padding: 0 11px !important;
  border: 1px solid #c9cccf !important;
  border-radius: 999px !important;
  background: #ffffff !important;
  color: #202223 !important;
  box-shadow: 0 1px 1px rgba(32, 34, 35, .05) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

html.vac-virando-theme #screen-dashboard #crm-detail-view #crm-ai-status.is-active,
html.vac-virando-theme #screen-dashboard #crm-detail-view #crm-ai-toggle[data-state="active"] {
  border-color: #bbf7d0 !important;
  background: #f0fdf4 !important;
  color: #167a45 !important;
}

html.vac-virando-theme #screen-dashboard #crm-detail-view #crm-ai-status.is-paused,
html.vac-virando-theme #screen-dashboard #crm-detail-view #crm-ai-toggle[data-state="paused"] {
  border-color: #fed7aa !important;
  background: #fff7ed !important;
  color: #b45309 !important;
}