/* ===== MENU ⋯ POR MENSAGEM (Conversa v2 A1) — sobre o ds-v5 ================== Variáveis REAIS do projeto: --campo, --tinta, --linha, --hover, --sutil, --mut, --verm (ds-v5.css). NÃO existem --paper/--ink/--line no ds-v5 — o tema escuro é [data-theme="escuro"] no e redefine essas mesmas variáveis, então o menu troca de tema sozinho; só a sombra ganha override. ========================================================================== */ /* linha própria do ⋯ (respostas antigas, que a poda deixou sem a barra .acoes) */ #conversa .mac-linha{display:flex;align-items:center;gap:8px;margin-top:6px;min-height:28px} /* gatilho ⋯ — discreto: só aparece no hover/foco do turno. No toque, sempre. */ .mac-btn{ display:inline-flex;align-items:center;justify-content:center; width:30px;height:30px;flex:0 0 auto;padding:0; border:1px solid transparent;border-radius:9px;background:none; color:var(--sutil);font-size:16px;line-height:1;cursor:pointer; font-family:'Inter','Inter fallback',sans-serif; opacity:0;transition:opacity .14s ease,background .14s ease,color .14s ease; } #conversa .turno.tome:hover .mac-btn, #conversa .turno.tome:focus-within .mac-btn, .mac-btn:focus-visible, .mac-btn.mac-ativo{opacity:1} .mac-btn:hover{background:var(--hover);color:var(--tinta)} .mac-btn.mac-ativo{background:var(--hover);color:var(--tinta);border-color:var(--linha)} /* dentro da barra da última resposta: é o ÚLTIMO item da fila (mesma posição de leitura que ele ocupa sozinho nas respostas antigas — nada de pular pro canto) */ #conversa .acoes .mac-btn.mac-na-barra{margin-left:2px} /* confirmação curta ("Copiado ✓") ao lado do ⋯ */ .mac-aviso{font-size:12.5px;color:var(--mut);font-family:'Inter','Inter fallback',sans-serif} /* ---- o menu ------------------------------------------------------------- */ .mac-menu{ position:fixed;z-index:240;display:none;min-width:216px;max-width:calc(100vw - 16px); padding:6px;border:1px solid var(--linha);border-radius:12px;background:var(--campo); box-shadow:0 12px 40px rgba(13,13,13,.18); } .mac-menu.aberto{display:block} .mac-item{ display:flex;align-items:center;gap:10px;width:100%;text-align:left; padding:9px 12px;border:none;border-radius:8px;background:none;cursor:pointer; font-family:'Inter','Inter fallback',sans-serif;font-size:13.5px;color:var(--tinta); } .mac-item:hover,.mac-item:focus-visible{background:var(--hover)} .mac-item .mac-ic{width:16px;text-align:center;color:var(--sutil);flex:0 0 auto} /* tema escuro: só a sombra (as cores vêm das variáveis) */ [data-theme="escuro"] .mac-menu{box-shadow:0 18px 50px rgba(0,0,0,.55)} /* toque: sem hover, o ⋯ precisa estar sempre visível e com alvo de 44px */ @media (hover:none),(pointer:coarse){ .mac-btn{opacity:1;width:40px;height:40px} .mac-item{padding:12px 14px;font-size:14px} } @media (max-width:860px){ .mac-btn{opacity:1} .mac-menu{min-width:200px} } @media (prefers-reduced-motion:reduce){ .mac-btn{transition:none} }