/* AppMail — pílulas de domínio ACIMA do campo e dica "Você quis dizer"
   abaixo (ver appmail.js). Acima porque a lista de autofill do navegador
   cobre o que estiver logo abaixo do input. Cores por variável para o tema
   escuro do site e o claro do painel. */
.appmail { position: relative; display: block; }
.appmail_list { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 8px; }
.appmail_item {
    display: inline-flex; align-items: center; max-width: 100%; padding: 6px 11px;
    border: 1px solid var(--appmail-line, #d9dcdf); border-radius: 999px;
    background: var(--appmail-bg, #fff); color: var(--appmail-ink, #202223);
    font: inherit; font-size: .88em; line-height: 1.2; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.appmail_item span { opacity: .6; }
.appmail_item b { font-weight: 600; }
.appmail_item:hover, .appmail_item.is-active { background: var(--appmail-hover, #eef2ff); border-color: var(--appmail-accent, #2f5bff); }
.appmail_item:focus-visible { outline: 2px solid var(--appmail-accent, #2f5bff); outline-offset: 1px; }
.appmail_hint {
    display: block; margin-top: 6px; padding: 0; border: 0; background: none;
    color: var(--appmail-accent, #2f5bff); font: inherit; font-size: .88em; text-align: left;
    text-decoration: underline; cursor: pointer;
}
.appmail_hint:hover { text-decoration: none; }
