/* Barra da demonstração, por cima das telas do sistema */
.dm-barra{position:fixed;left:50%;bottom:14px;transform:translateX(-50%);z-index:2147483000;display:flex;align-items:center;gap:12px;max-width:calc(100vw - 24px);padding:8px 8px 8px 16px;border-radius:999px;background:#0b0f0c;color:#fff;font:500 13px/1.2 Inter,system-ui,sans-serif;box-shadow:0 10px 34px rgba(0,0,0,.35)}
.dm-barra b{font-weight:600;color:#53ff5d;white-space:nowrap}
.dm-barra>span{color:rgba(255,255,255,.65);white-space:nowrap}
.dm-telas select{height:32px;max-width:150px;padding:0 8px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:#1a211c;color:#fff;font:inherit;cursor:pointer}
.dm-oculto{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.dm-cta{display:inline-flex;align-items:center;height:34px;padding:0 14px;border-radius:999px;background:#53ff5d;color:#07140a!important;font-weight:600;white-space:nowrap;text-decoration:none}
.dm-sair{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;color:#fff!important;font-size:18px;text-decoration:none}
.dm-aviso{position:fixed;left:50%;bottom:70px;transform:translate(-50%,8px);z-index:2147483000;width:max-content;max-width:calc(100vw - 32px);padding:10px 14px;border-radius:12px;background:#fff;color:#111;font:500 13px/1.4 Inter,system-ui,sans-serif;box-shadow:0 8px 28px rgba(0,0,0,.25);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}
.dm-aviso.on{opacity:1;transform:translate(-50%,0)}
@media (max-width:620px){.dm-barra{gap:8px;padding-left:12px}.dm-barra>span{display:none}.dm-telas select{max-width:110px}.dm-cta{padding:0 10px;font-size:12px}}
/* barra de cima do sistema e Inbox no celular: a lista primeiro, a conversa quando abre */
@media (min-width:1025px){.wz-topbar{display:grid!important}}
@media (max-width:767px){
  body:not(.dm-conversa-aberta) .dm-painel{display:none!important}
  body.dm-conversa-aberta .dm-coluna{display:none!important}
  body.dm-conversa-aberta .dm-painel{display:flex!important}
}
@media (max-width:767px){body:not(.dm-conversa-aberta) .dm-coluna{display:flex!important;flex-direction:column;width:100%!important;max-width:none!important;flex:1 1 100%}}
/* Inbox: o campo de digitar fica no pé da tela, e a barra da demonstração flutua sobre as mensagens */
.dm-msgs{padding-bottom:72px}
@media (min-width:768px){
  body.dm-inbox .dm-barra{left:calc(576px + (100vw - 576px)/2);bottom:172px}
  body.dm-inbox .dm-aviso{left:calc(576px + (100vw - 576px)/2);bottom:228px}
}
@media (max-width:767px){
  body.dm-inbox.dm-conversa-aberta .dm-barra{bottom:176px}
  body.dm-inbox.dm-conversa-aberta .dm-aviso{bottom:232px}
}
/* o sistema calcula a altura na hora; na captura ela ficou fixa em 844px. Aqui as telas ocupam a altura da janela de quem abre */
body.dm-inbox main>div,body.dm-inbox main>div>div,body.dm-inbox .ni-inbox{height:100%!important;max-height:none!important}
main [style*="height: 844px"]{height:100%!important;max-height:none!important}
/* painel de detalhes do Inbox */
.inbox-right-sidebar.dm-on{display:flex!important;width:360px!important;min-width:360px!important;transform:none!important;opacity:1!important;pointer-events:auto!important;border-left-color:#e2e8f0!important;overflow-y:auto}
.dm-fecha-lado{display:grid;place-items:center;width:32px;height:32px;margin-left:6px;border-radius:50%;background:transparent;color:#475569;font-size:20px;line-height:1;cursor:pointer}
.dm-fecha-lado:hover{background:#e2e8f0}
@media (max-width:1279px){.inbox-right-sidebar.dm-on{position:fixed;top:0;right:0;bottom:0;z-index:2000;width:min(360px,100vw)!important;min-width:0!important;background:#f8fafc;box-shadow:-12px 0 40px rgba(0,0,0,.2)}}
body.dm-lado-aberto .dm-barra{left:calc(576px + (100vw - 936px)/2)}
@media (max-width:1279px){body.dm-lado-aberto .dm-barra{display:none}}
/* trilha do áudio */
.dm-trilha{position:relative;height:6px;border-radius:999px;background:#cbd5e1;overflow:hidden}
.dm-trilha i{position:absolute;left:0;top:0;bottom:0;width:0;border-radius:999px;background:#059669}
@media (max-width:767px){
  body.dm-inbox main{padding:0!important;height:100dvh!important;max-height:100dvh!important}
  body.dm-inbox.dm-conversa-aberta .dm-barra{bottom:calc(env(safe-area-inset-bottom,0px) + 150px)}
}
