/* Painel do afiliado — só o que o Hub não tem.
   Tudo que é casca (sidebar, topbar, card, tile, tag, botão) vem de
   styles.css, para as duas telas não divergirem com o tempo. */

.pa-anel{display:flex;align-items:center;gap:20px;margin-top:16px;flex-wrap:wrap}
.pa-anel p{flex:1;min-width:170px;margin:0}

/* aviso de privacidade da lista de indicados: precisa ler como compromisso,
   não como rodapé jurídico, então ganha destaque e ícone */
.pa-privacidade{display:flex;gap:14px;align-items:flex-start;
  border-color:rgba(69,217,126,.45);background:rgba(69,217,126,.05)}
.pa-cadeado{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;
  background:rgba(69,217,126,.16);color:#0E7A5A}
.pa-privacidade p{margin:0}

.tabela-rol{overflow-x:auto;margin-top:14px}
/* saques: o aviso da nota fiscal fica à vista, antes do formulário */
.sq-nf{display:flex;flex-direction:column;gap:4px;padding:14px 16px;border-radius:12px;
  background:#fdf8ec;border:1px solid #f0dfae;color:#5c4a0c;font-size:13px;line-height:1.55}
.sq-nf b{color:#3f3208}
.sq-valor{display:flex;gap:8px;align-items:center}
.sq-valor .input{flex:1;min-width:0}
.sq-obs{white-space:normal;max-width:34ch;font-size:12.5px;color:#6e6e6e}
/* verificação de identidade: as duas fotos lado a lado, uma embaixo da
   outra no celular */
.kyc-slots{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.kyc-slot{display:flex;align-items:center;gap:12px;padding:12px;border:1px dashed #d5dcd9;border-radius:12px}
.kyc-slot.is-ok{border-style:solid;border-color:rgba(69,217,126,.55);background:rgba(69,217,126,.05)}
.kyc-prev{flex:none;width:56px;height:56px;border-radius:10px;overflow:hidden;display:grid;place-items:center;
  background:#f2f4f3;color:#6e6e6e}
.kyc-slot.is-ok .kyc-prev{color:#0E7A5A}
.kyc-prev img{width:100%;height:100%;object-fit:cover}
.kyc-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.kyc-botao{flex:none;cursor:pointer}
@media(max-width:640px){
  .kyc-slots{grid-template-columns:1fr}
  /* no telefone o botão desce para baixo do texto, que fica com a largura toda */
  .kyc-slot{flex-wrap:wrap}
  .kyc-txt{min-width:160px}
  .kyc-botao{flex:1 1 100%;justify-content:center}
}
.pa-tabela{width:100%;border-collapse:collapse;font-size:13.5px}
.pa-tabela th{text-align:left;font-size:10px;letter-spacing:.32px;text-transform:uppercase;
  color:#6e6e6e;font-weight:500;padding:10px 14px;border-bottom:1px solid #e6eae8;white-space:nowrap}
.pa-tabela td{padding:12px 14px;border-bottom:1px solid #f0f2f1;white-space:nowrap}
.pa-tabela tr:last-child td{border-bottom:none}
.pa-tabela .dir{text-align:right}
.pa-tabela .vazio{text-align:center;color:#8a8a8a;padding:26px}

/* o apelido é o dado principal da linha: monoespaçado para alinhar coluna */
.pa-id{font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12.5px;
  background:#f2f4f3;padding:3px 8px;border-radius:4px;color:#111}
.pa-tag{font-size:10px;color:#0E7A5A;margin-left:8px}
.pa-uf{display:inline-block;min-width:30px;text-align:center;font-size:11.5px;font-weight:500;
  background:#eef1f0;padding:3px 7px;border-radius:4px}

.pa-paginas{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end;padding-top:14px}

/* cartão de leitura única: o número que responde a pergunta da tela */
.pa-destaque{background:linear-gradient(135deg,rgba(69,217,126,.10),rgba(69,217,126,.02))}
.pa-destaque-v{font-size:30px;font-weight:500;letter-spacing:-.5px;margin:6px 0 4px}

.pa-canais{display:grid;gap:10px}
.pa-canal{display:flex;align-items:center;gap:14px;padding:12px 14px;
  border:1px solid #e6eae8;border-radius:10px;background:#f9f9f9}
.pa-canal>div{flex:1;min-width:0}
.pa-canal-url{display:block;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:11.5px;
  color:#565656;margin-top:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.pa-dicas{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.pa-dicas li{position:relative;padding-left:20px;font-size:13.5px;line-height:1.55;color:#565656}
.pa-dicas li::before{content:"";position:absolute;left:4px;top:8px;width:6px;height:6px;
  border-radius:50%;background:#45D97E}
.pa-dicas i{font-style:italic}

@media(max-width:760px){
  .pa-canal{flex-direction:column;align-items:flex-start;gap:8px}
  .pa-canal .btn{align-self:stretch}
}

/* ao vivo: o painel se atualiza sozinho */
.pa-pulso{display:inline-block;width:8px;height:8px;margin-right:4px;border-radius:50%;background:#2fa863;vertical-align:middle;box-shadow:0 0 0 0 rgba(47,168,99,.6);animation:paPulso 1.8s ease-out infinite}
@keyframes paPulso{0%{box-shadow:0 0 0 0 rgba(47,168,99,.55)}70%{box-shadow:0 0 0 8px rgba(47,168,99,0)}100%{box-shadow:0 0 0 0 rgba(47,168,99,0)}}
/* celular estreito: o topo (nível, apoios, sair e a inicial) cabia por pouco e
   empurrava a página para o lado; a inicial sai e os botões apertam */
@media (max-width:400px){
  .topbar-right{gap:6px;min-width:0}
  .topbar-right .avatar{display:none}
}