/* =============================================================================
   Selo "Serviços financeiros Asaas" — APP-V2-8.2 (js/selo-asaas.js)
   A imagem é a oficial da Asaas (remota). O texto só aparece se ela falhar
   (fora do ar ou bloqueada pela CSP): continua dizendo quem presta o serviço.
   ========================================================================== */
.selo-asaas {
  display: inline-flex; align-items: center; align-self: flex-start; min-height: 40px;
  color: var(--t-base); text-decoration: none; border-radius: var(--r-control);
}
.selo-asaas-img { display: block; height: 40px; width: auto; max-width: 100%; }
.selo-asaas:not(.selo-asaas--falhou) .selo-asaas-txt { display: none; }
.selo-asaas--falhou .selo-asaas-img { display: none; }
.selo-asaas-txt {
  display: inline-flex; align-items: baseline; gap: 4px; padding: 6px 10px;
  border: 1px solid var(--border); border-radius: var(--r-control); background: var(--bg-muted);
  font-size: 12px; line-height: 1.2; white-space: nowrap;
}
.selo-asaas-txt b { font-size: 13px; letter-spacing: .02em; }
.selo-asaas--escuro .selo-asaas-txt { background: transparent; border-color: rgba(255,255,255,.35); color: #fff; }
a.selo-asaas:focus-visible { outline: 2px solid var(--primary); outline-offset: 3px; }
a.selo-asaas:hover .selo-asaas-img { opacity: .88; }

/* card de conta Asaas em Extratos: o selo fica no topo, abaixo do nome */
.cconta-selo { display: flex; margin-top: -2px; }
.cconta-selo .selo-asaas-img { height: 32px; }
.cconta-selo .selo-asaas { min-height: 32px; }
