/* E-mail Marketing e Automações (prefixo .e-). Cores só por variáveis; a prévia do e-mail usa as cores do próprio tema do e-mail. */
.e-beta{font-size:10px;padding:1px 7px}
.e-dica{margin:0;color:var(--muted);font-size:12.5px;font-weight:500}
.e-lab{display:block;font-weight:700;margin-bottom:8px}
.e-fila-aviso,.e-roda{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.e-fila-aviso span,.e-roda span{flex:1;min-width:200px}
.e-fila-aviso .btn{background:var(--surface)}

/* cartões de campanha, funil e automação */
.e-camp .e-assunto,.cartao .e-assunto{color:var(--fg);font-weight:600;overflow-wrap:anywhere}
.cartao .lin b{text-align:right;min-width:0;overflow-wrap:anywhere}
.e-tot{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding:10px 0 0;border-top:1px solid var(--line)}
.e-tot div{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;border-radius:10px;background:var(--surface-2)}
.e-tot b{font-family:var(--display);font-size:17px}
.e-tot small{color:var(--muted);font-size:11px;font-weight:700;text-align:center}
.cartao .pe{flex-wrap:wrap}
.cartao .pe .ib2.e-x{flex:none}
.e-x:hover{color:var(--bad);border-color:color-mix(in srgb,var(--bad) 40%,var(--line))}
.e-auto.off h3>span:first-child{color:var(--muted)}
.e-trecho{font-size:12.5px;white-space:pre-line;background:var(--surface-2);border:1px solid var(--line);border-radius:10px;padding:8px 10px;overflow-wrap:anywhere}
.e-sec{display:flex;align-items:baseline;gap:10px;margin-top:4px}
.e-sec small{font-family:var(--body);font-size:12px;color:var(--muted);font-weight:600}
.e-cats{flex-wrap:wrap;max-width:100%;align-self:flex-start}
.e-abas{align-self:flex-start}

/* interruptor liga/desliga */
.e-sw{position:relative;display:inline-flex;flex:none;cursor:pointer}
.e-sw input{position:absolute;opacity:0;width:100%;height:100%;margin:0;cursor:pointer}
.e-sw span{width:40px;height:23px;border-radius:99px;background:var(--line);position:relative;transition:background .15s}
.e-sw span::after{content:"";position:absolute;top:3px;left:3px;width:17px;height:17px;border-radius:50%;background:var(--surface);box-shadow:0 1px 2px rgba(0,0,0,.25);transition:transform .15s}
.e-sw input:checked+span{background:var(--accent)}
.e-sw input:checked+span::after{transform:translateX(17px)}
.e-sw input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}

/* chips de seleção (tags, canal) */
.e-chips,.e-canais{display:flex;gap:8px;flex-wrap:wrap}
.e-canais{border:0;padding:0;margin:0}
.e-canais legend{font-weight:700;margin-bottom:6px;padding:0}
.e-chip{position:relative;display:inline-flex;cursor:pointer;font-weight:600}
.e-chip input{position:absolute;opacity:0;width:1px;height:1px}
.e-chip span{padding:6px 12px;border-radius:99px;border:1px solid var(--line);background:var(--surface);color:var(--muted);font-size:13px}
.e-chip input:checked+span{background:var(--accent-soft);color:var(--accent-ink);border-color:var(--accent-line)}
.e-chip input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.fg .e-chip{flex-direction:row;align-self:end}
.e-vars{display:flex;gap:6px;flex-wrap:wrap;font-weight:500}
.e-vars .pill{cursor:pointer}
.e-vars .pill:hover{color:var(--accent-ink);border-color:var(--accent-line)}

/* editor de e-mail */
.e-ed-head{align-items:center}
.e-ed-head>div:nth-child(2){min-width:0;flex:1}
.e-ed{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:16px;align-items:start}
.e-lado{display:flex;flex-direction:column;gap:16px;min-width:0}
.e-add{display:flex;gap:6px;flex-wrap:wrap}
.e-blocos{display:flex;flex-direction:column;gap:8px}
.e-bl{border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.e-bl.on{border-color:var(--accent-line);box-shadow:0 0 0 3px var(--accent-soft)}
.e-bl-t{display:flex;align-items:center;gap:2px;padding:4px 6px 4px 4px}
.e-bl-nome{flex:1;min-width:0;display:flex;align-items:baseline;gap:10px;padding:8px;border-radius:9px;text-align:left}
.e-bl-nome b{flex:none}
.e-bl-nome span{color:var(--muted);font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.e-bl .x[disabled]{opacity:.3;cursor:default}
.e-bloco-ed{padding:4px 12px 14px;border-top:1px solid var(--line);padding-top:12px}
.e-cor{height:42px;padding:3px}
.e-atraso{display:flex;gap:8px}
.e-atraso input{flex:1;min-width:0}
.e-atraso select{width:auto}
.e-conta{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;padding:12px 14px;border-radius:12px;background:var(--accent-soft);color:var(--accent-ink);font-weight:700}
.e-conta b{font-family:var(--display);font-size:22px}
.e-conta small{flex-basis:100%;color:var(--muted);font-weight:600}
.e-prev{position:sticky;top:0;display:flex;flex-direction:column;gap:12px}
.e-prev-top{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.e-prev-top .seg{margin-left:auto}
.e-prev-top .seg button{display:inline-flex;align-items:center;gap:6px}
.e-moldura{border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--surface-2);transition:max-width .2s}
.e-moldura.cel{max-width:375px;margin-inline:auto;border-radius:26px;border-width:8px;border-color:var(--fg)}
.e-env{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr);gap:10px;padding:10px 14px;background:var(--surface);border-bottom:1px solid var(--line)}
.e-env small{display:block;color:var(--faint);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.e-env b{display:block;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.e-email{max-height:68vh;overflow:auto}
.e-email img{max-width:100%}

/* funil */
.e-fe{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;align-items:start}
.e-passos{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px;position:relative}
.e-passo{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2)}
.e-n{width:28px;height:28px;border-radius:50%;background:var(--accent);color:var(--on-accent);display:grid;place-items:center;font-weight:700;flex:none}
.e-passo-t{flex:1;min-width:160px}
.e-passo-t b{display:block;overflow-wrap:anywhere}
.e-passo-t span{color:var(--muted);font-size:12.5px}
.e-passo-a{display:flex;align-items:center;gap:2px}
.e-passo-a .x[disabled]{opacity:.3;cursor:default}
.e-tb td small{color:var(--muted)}
.e-tb tbody tr{cursor:default}

/* fila do WhatsApp */
.e-fila{display:flex;flex-direction:column;gap:12px}
.e-item{display:flex;flex-direction:column;gap:12px}
.e-item-t{display:flex;align-items:center;gap:12px}
.e-item-t .t{flex:1;min-width:0}
.e-item-t .t b{display:block}
.e-item-t .t span{color:var(--muted);font-size:12.5px;overflow-wrap:anywhere}
.e-quando{color:var(--faint);font-weight:600;white-space:nowrap}
.e-msg{white-space:pre-wrap;overflow-wrap:anywhere;background:var(--surface-2);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin:0;color:var(--fg)}
.e-item-a{display:flex;gap:8px;flex-wrap:wrap}
.e-item-a a.btn{text-decoration:none}
.e-cont{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:var(--bad);color:#fff;font-size:11px}
.g2e{grid-template-columns:repeat(2,minmax(0,1fr))}
.e-perigo{background:var(--bad)!important}

/* indicadores no dashboard */
.e-kpi{flex-direction:column;align-items:stretch;text-align:left;gap:0}

@media (max-width:1000px){ .e-ed,.e-fe,.g2e{grid-template-columns:minmax(0,1fr)} .e-prev{position:static} }
@media (max-width:640px){
  .e-ed-head .sp{width:100%} .e-ed-head .sp .btn{flex:1 1 auto;justify-content:center}
  .e-tot{grid-template-columns:repeat(2,minmax(0,1fr))}
  .e-env{grid-template-columns:minmax(0,1fr)}
  .e-item-t{flex-wrap:wrap} .e-quando{width:100%}
  .e-item-a>*{flex:1 1 auto;justify-content:center}
  .e-moldura.cel{border-width:6px}
}
