/* marca-dedikar.css: o fundo azul da Dedikar (só nesta VPS, local/aplicar-marca.py).
   A rede de pontinhos (marca-fundo.js) fica num canvas fixo atrás de tudo (z-index -1); aqui o fundo verde da
   conversa e da tela de entrada vira o azul da logo. */
:root{--dk-azul:#0a3979;--dk-ciano:#15c8e8}
body.dk-fundo{background:
    radial-gradient(ellipse at 18% 0%,rgba(30,110,200,.55),transparent 60%),
    radial-gradient(ellipse at 90% 100%,rgba(21,200,232,.18),transparent 55%),
    linear-gradient(165deg,#0b3d82 0%,#082d63 50%,#051d42 100%) !important;
  background-attachment:fixed !important}
#dkFundo{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:-1;pointer-events:none}
body.dk-fundo #chat{background:transparent !important}
/* O que fica solto no fundo azul (fora dos balões) precisa de contraste. */
body.dk-fundo #chat .dia span{background:rgba(255,255,255,.92)}
/* Balões de entrega e de pedido: claros nos dois temas, com a cor da borda de cada um. */
body.dk-fundo #chat .row.alerta-entrega .bub{background:#eaf8ee !important;color:#0f1c14 !important;border-color:#2e9e58 !important}
body.dk-fundo #chat .row.alerta-pedido .bub{background:#fff8db !important;color:#0f1c14 !important;border-color:#d39e12 !important}
body.dk-fundo #chat .row.alerta-entrega .bub a,body.dk-fundo #chat .row.alerta-pedido .bub a{color:#1f5fae !important}
body.dk-fundo #chat .row.alerta-entrega .bub .meta,body.dk-fundo #chat .row.alerta-pedido .bub .meta{color:#5d6f63 !important}
/* A linha "rodou N comandos" fica solta no fundo azul. */
body.dk-fundo #chat .row.trilha details,body.dk-fundo #chat .row.trilha summary{color:#d5e6f7}
/* A faixa "o agente está trabalhando", que era verde. */
body.dk-fundo #atividade{background:#dcebf8;color:#0a3979}
body.dk-fundo #atividade .atv-ponto{background:#1aa6d6}
/* Os agentes lado a lado no topo (marca-agentes.js): no lugar do nome e do "trocar de agente". */
#mlTroca{display:none !important}
.dk-agentes{display:flex;align-items:center;gap:4px;min-width:0;flex:0 1 auto;overflow-x:auto;overflow-y:hidden;
  scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:2px 2px 0}
.dk-agentes::-webkit-scrollbar{display:none}
.dk-ag{display:flex;flex-direction:column;align-items:center;gap:2px;flex:0 0 auto;width:58px;padding:2px 0;
  text-decoration:none;color:#4b5a6b;border-radius:10px}
.dk-ag:hover{background:rgba(10,57,121,.06)}
.dk-av{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;overflow:hidden;
  color:#fff;font-size:15px;font-weight:700;box-shadow:0 0 0 2px #fff,0 0 0 3px rgba(10,57,121,.18)}
.dk-av img{width:100%;height:100%;object-fit:cover;display:block}
.dk-nome{font-size:10.5px;line-height:1.1;max-width:56px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dk-ag.atual .dk-av{box-shadow:0 0 0 2px #fff,0 0 0 4px #15b8de}
.dk-ag.atual .dk-nome{color:#0a3979;font-weight:700}
body.dk-com-agentes #cabecalho > #av,body.dk-com-agentes header > .av{display:none !important}
body.dk-com-agentes #nomeAgente{display:none !important}
body.dk-com-agentes #who{flex:1 1 auto;min-width:0}
body.dk-com-agentes #who #estado{font-size:12px}
@media (max-width:640px){body.dk-com-agentes #who{display:none !important}}
html[data-tema="escuro"] .dk-ag{color:#c9d6e6}
html[data-tema="escuro"] .dk-ag.atual .dk-nome{color:#8fd8f0}
html[data-tema="escuro"] .dk-av{box-shadow:0 0 0 2px #1b222b,0 0 0 3px rgba(255,255,255,.15)}
html[data-tema="escuro"] .dk-ag.atual .dk-av{box-shadow:0 0 0 2px #1b222b,0 0 0 4px #15b8de}
/* O número de entregas e pedidos não vistos de cada agente. */
.dk-ag{position:relative}
.dk-selo{position:absolute;top:0;right:6px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:#e11d48;
  color:#fff;font-size:10.5px;font-weight:700;line-height:17px;text-align:center;box-shadow:0 0 0 2px #fff}
html[data-tema="escuro"] .dk-selo{box-shadow:0 0 0 2px #1b222b}

/* o atalho da Central (central.html) no começo da fileira de agentes */
.dk-central .dk-av{color:#7ff0ff;font-size:18px;box-shadow:0 0 0 2px #fff,0 0 0 3px #15c8e8,0 0 10px rgba(21,200,232,.6)}

/* Rodapé padrão da Dedikar (tela de entrada e licenças). */
.dk-rodape{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:6px 12px;margin:22px auto 18px;
  padding:0 16px;max-width:560px;font-size:11.5px;line-height:1.4;color:rgba(235,242,250,.82);text-align:center}
.dk-rodape img{border-radius:5px;background:#fff}
.dk-rodape a{color:#9fe8f4}
.dk-rodape .dk-licencas{color:rgba(235,242,250,.6);font-size:10.5px;text-decoration:underline}