/* A CONVERSA COM A EQUIPE (ds/conversa-parceiro.js): a folha das classes .cp-*.
   Saiu do parceiro-orcamento.html em 13/10/2026, quando a página do CLIENTE
   ganhou o mesmo chat: as duas páginas a carregam, e uma regra mudada aqui
   vale nas duas. As regras presas à tela "conversa" do parceiro (sticky da
   caixa de escrever) continuam na folha dele, porque a tela é só dele. */
  /* A CONVERSA. Balões: o parceiro à direita, em dourado claro; a equipe à
     esquerda, no cartão claro — o desenho que todo celular já ensinou. A
     quebra de linha que a pessoa escreveu fica (pre-wrap). */
  .cp-topo { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; }
  /* …e a faixa das etapas na conversa (06/10/2026, ideia 3). */
  .cp-sit { margin: 0 0 12px; padding: 10px 12px; border-radius: 12px; border: 1px solid var(--ct-linha); background: var(--ct-superficie); }
  .cp-sit--espera { border-color: var(--ct-dourado-linha); background: var(--ct-dourado-suave); }
  .cp-sit--ok { border-color: var(--ct-ok-linha); background: var(--ct-ok-suave); }
  .cp-sit--info { border-color: var(--ct-info-linha); background: var(--ct-info-suave); }
  .cp-sit--alerta { border-color: var(--ct-alerta-linha); background: var(--ct-alerta-suave); }
  .cp-sit--neutro { background: var(--ct-rebaixo); }
  /* O requerimento e o "Informar pagamento" na conversa (07/10/2026). */
  .cp-req { margin: 0 0 12px; padding: 8px 12px; border-radius: 10px; border: 1px solid var(--ct-linha); font-size: 14px; color: var(--ct-tinta-2); }
  .cp-req b { color: var(--ct-tinta); font-weight: 800; }
  .cp-req--ok { border-color: var(--ct-ok-linha); background: var(--ct-ok-suave); }
  .cp-req--ok b { color: var(--ct-ok); }
  .cp-req--espera { border-color: var(--ct-dourado-linha); background: var(--ct-dourado-suave); }
  /* O requerimento pelo nome de quem assinou (13/10/2026): o link e o cartão de busca dentro da faixa. */
  .cp-req__achar { display: block; margin: 8px 0 0; padding: 0; border: 0; background: none; color: var(--ct-tinta); font: inherit; font-size: 13.5px; font-weight: 700; text-decoration: underline; cursor: pointer; text-align: left; }
  .cp-req__achar:focus-visible { outline: 3px solid var(--ct-anel); outline-offset: 2px; border-radius: 4px; }
  .cp-req__form { margin: 10px 0 0; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--ct-linha); background: var(--ct-superficie); }
  .cp-req__ajuda { margin: 0 0 8px; font-size: 13.5px; color: var(--ct-tinta-2); }
  .cp-atalho--pag { background: var(--ct-dourado-fill); color: var(--ct-dourado-sobre); border-color: var(--ct-dourado-fill); }
  .cp-pg__explica { margin: 0 0 10px; font-size: 14px; color: var(--ct-tinta-2); }
  .cp-pg__itens { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 6px; }
  .cp-pg__item { margin: 0; }
  .cp-pg__check { display: flex; align-items: flex-start; gap: 10px; padding: 8px 10px; border-radius: 10px; border: 1px solid var(--ct-linha); background: var(--ct-superficie); font-size: 14.5px; cursor: pointer; }
  .cp-pg__check input { margin-top: 3px; width: 18px; height: 18px; flex: 0 0 auto; }
  .cp-pg__item-txt b { color: var(--ct-tinta); }
  .cp-pg__modal { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin: 0 0 8px; }
  .cp-pg__opcao { display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 8px 6px; border-radius: 10px; border: 1px solid var(--ct-linha); background: var(--ct-superficie); font-size: 13.5px; text-align: center; cursor: pointer; }
  .cp-pg__opcao:has(input:checked) { border-color: var(--ct-dourado-fill); background: var(--ct-dourado-suave); }
  .cp-pg__opcao input { width: 18px; height: 18px; }
  .cp-pg__opcao-nome { font-weight: 800; color: var(--ct-tinta); }
  .cp-pg__opcao-mais { font-size: 12px; color: var(--ct-tinta-2); min-height: 1em; }
  .cp-pg__total { margin: 0 0 12px; font-size: 15px; font-weight: 800; color: var(--ct-tinta); }
  /* O bloco do pagamento dentro da caixa de escrever, e a folha de confirmação (07/10/2026, redesenho). */
  .cp-pag { margin: 10px 0 4px; padding: 12px; border-radius: 12px; border: 1px solid var(--ct-dourado-linha); background: var(--ct-dourado-suave); }
  .cp-pag__tit { margin: 0 0 10px; font-size: 14px; font-weight: 700; color: var(--ct-tinta); }
  .cp-pag__dados { margin-top: 8px; }
  .cp-enviar--pag { background: var(--ct-dourado-fill); color: var(--ct-dourado-sobre); border-color: var(--ct-dourado-fill); }
  .cp-folha { margin: 10px 0 0; padding: 14px; border-radius: 14px; border: 2px solid var(--ct-dourado-fill); background: var(--ct-superficie); box-shadow: 0 8px 24px rgba(0,0,0,.12); }
  .cp-folha__tit { margin: 0 0 6px; font-size: 16px; font-weight: 800; color: var(--ct-tinta); }
  .cp-folha__resumo { margin: 0 0 10px; font-size: 14px; color: var(--ct-tinta-2); }
  /* As quatro melhorias da conversa (07/10/2026): frases prontas, horário da equipe, miniatura do anexo e "visto pela equipe". */
  .cp-frases { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 8px; }
  .cp-frase { padding: 6px 12px; border-radius: 999px; border: 1px solid var(--ct-linha-forte); background: var(--ct-superficie); color: var(--ct-tinta); font-size: 13.5px; font-weight: 700; cursor: pointer; min-height: 36px; }
  .cp-frase:hover, .cp-frase:focus-visible { border-color: var(--ct-dourado-fill); background: var(--ct-dourado-suave); }
  .cp-horario { margin: -4px 0 12px; font-size: 13px; color: var(--ct-tinta-2); }
  .cp-pend__mini { width: 44px; height: 44px; object-fit: cover; border-radius: 8px; border: 1px solid var(--ct-linha); flex: 0 0 auto; }
  .cp-visto { display: block; margin-top: 2px; font-size: 11.5px; color: var(--ct-ok); font-weight: 700; }
  @media (max-width: 420px) { .cp-pg__modal { grid-template-columns: 1fr; } .cp-pg__opcao { flex-direction: row; justify-content: flex-start; } }
  .cp-sit__passos { list-style: none; margin: 0 0 6px; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 4px; counter-reset: passo; }
  .cp-sit__passo { position: relative; padding: 6px 0 0; text-align: center; font-size: 11.5px; font-weight: 700; color: var(--ct-tinta-3); border-top: 3px solid var(--ct-linha-forte); }
  .cp-sit__passo--feito { color: var(--ct-tinta-2); border-top-color: var(--ct-ok); }
  .cp-sit__passo--atual { color: var(--ct-tinta); border-top-color: var(--ct-tinta); }
  .cp-sit__rotulo { margin: 0; font-size: 14px; font-weight: 800; color: var(--ct-tinta); }
  .cp-sit__em { font-weight: 600; color: var(--ct-tinta-2); }
  .cp-sobre { margin: 0; flex: 1; min-width: 0; font-size: 14px; font-weight: 600; color: var(--ct-tinta-2); word-break: break-word; }
  .cp-voltar { flex: none; display: inline-flex; align-items: center; gap: 4px; min-height: 44px; padding: 0 14px 0 10px;
               border-radius: 10px; border: 1px solid var(--ct-linha-forte); background: transparent; color: var(--ct-tinta);
               font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
  .cp-voltar svg { width: 18px; height: 18px; flex: none; }
  .cp-explica { margin: 0 0 12px; padding: 10px 12px; border-radius: 10px; font-size: 14px; line-height: 1.45;
                background: var(--ct-dourado-suave); border: 1px solid var(--ct-dourado-linha); color: var(--ct-tinta); }
  .cp-atalhos { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0 0 14px; }
  .cp-atalho { display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 48px; padding: 8px 10px;
               border-radius: 12px; border: 1px solid var(--ct-linha-forte); background: var(--ct-superficie); color: var(--ct-tinta);
               font: inherit; font-size: 14px; font-weight: 700; line-height: 1.25; text-align: center; cursor: pointer; }
  .cp-atalho[aria-expanded="true"] { border-color: var(--ct-dourado-linha); background: var(--ct-dourado-suave); }
  .cp-atalho svg { width: 19px; height: 19px; flex: none; }
  .cp-dados__tit { margin: 0; font-size: 16px; font-weight: 700; color: var(--ct-tinta); }
  .cp-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
  .cp-msg { display: flex; }
  .cp-msg--eu { justify-content: flex-end; }
  .cp-msg--ct { justify-content: flex-start; }
  .cp-balao { max-width: 86%; min-width: 0; padding: 9px 12px 7px; border-radius: 14px; border: 1px solid var(--ct-linha);
              background: var(--ct-superficie); color: var(--ct-tinta); box-shadow: var(--ct-sombra-1); }
  .cp-msg--eu .cp-balao { background: var(--ct-dourado-suave); border-color: var(--ct-dourado-linha); border-bottom-right-radius: 4px; }
  .cp-msg--ct .cp-balao { border-bottom-left-radius: 4px; }
  .cp-msg--enviando .cp-balao { opacity: .7; }
  .cp-quem { display: block; font-size: 12px; font-weight: 800; color: var(--ct-tinta-2); }
  .cp-balao__texto { margin: 2px 0 0; font-size: 15px; line-height: 1.45; white-space: pre-wrap; word-break: break-word; }
  .cp-dadoscli { margin: 6px 0 0; padding: 8px 10px; border-radius: 10px; background: var(--ct-superficie); border: 1px solid var(--ct-linha); }
  .cp-dadoscli__tit { display: block; font-size: 12.5px; font-weight: 800; color: var(--ct-tinta-2); }
  .cp-dadoscli__lista { margin: 4px 0 0; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 10px; font-size: 14px; }
  .cp-dadoscli__lista dt { color: var(--ct-tinta-2); }
  .cp-dadoscli__lista dd { margin: 0; font-weight: 600; word-break: break-word; }
  .cp-anexos { list-style: none; margin: 6px 0 0; padding: 0; display: grid; gap: 6px; }
  .cp-anexo { display: inline-flex; align-items: center; min-height: 44px; max-width: 100%; padding: 6px 12px; border-radius: 10px;
              border: 1px solid var(--ct-linha-forte); background: var(--ct-superficie); color: var(--ct-tinta);
              font: inherit; font-size: 14px; font-weight: 600; text-align: left; text-decoration: underline;
              word-break: break-all; cursor: pointer; }
  .cp-anexo:disabled { cursor: default; text-decoration: none; }
  /* O ARQUIVO DO PARCEIRO É ETIQUETA, NÃO BOTÃO (04/10/2026, pedido da dona:
     os documentos ficam só no e-mail da CT, não no portal): sem sublinhado
     nem ponteiro, para não parecer que baixa. E a mensagem cujo arquivo se
     perdeu antes de virar e-mail ganha o aviso de mandar de novo. */
  .cp-anexo-etiqueta { display: inline-block; max-width: 100%; padding: 6px 10px; border-radius: 10px;
                       border: 1px solid var(--ct-linha); background: var(--ct-superficie); color: var(--ct-tinta-2);
                       font-size: 13.5px; font-weight: 600; line-height: 1.35; word-break: break-word; }
  .cp-anexo-etiqueta__onde { white-space: nowrap; }
  .cp-perdida { margin: 6px 0 0; padding: 7px 10px; border-radius: 10px; font-size: 14px; font-weight: 700; line-height: 1.4;
                background: var(--ct-alerta-suave); color: var(--ct-alerta); border: 1px solid var(--ct-alerta-linha); }
  .cp-hora { display: flex; justify-content: flex-end; flex-wrap: wrap; gap: 6px; margin-top: 4px; font-size: 12px; color: var(--ct-tinta-3); }
  .cp-recebido { font-weight: 700; color: var(--ct-ok); }
  .cp-msg--enviando .cp-recebido { color: var(--ct-tinta-3); }
  .cp-vazio { margin: 0; padding: 14px; border-radius: 12px; text-align: center; font-size: 14px; color: var(--ct-tinta-2); background: var(--ct-rebaixo); }
  .cp-estado { margin: 8px 0 0; min-height: 1.3em; font-size: 12.5px; color: var(--ct-tinta-3); text-align: center; }
  /* O "Atualizar" da conversa que parou sozinha (15 min sem ninguém mexer):
     largura do texto, no meio, logo abaixo da frase que explica. */
  .cp-retomar { width: auto; margin: 6px auto 0; padding: 0 22px; }
  /* Enquanto a mensagem vai, o Voltar e o atalho do comprovante param junto com o clipe. */
  .cp-voltar:disabled, .cp-atalho:disabled { opacity: .6; cursor: not-allowed; }
  /* A caixa de escrever vem depois da conversa, no fluxo da página. NÃO é
     presa ao pé da tela (medido em 360px): presa, ela cobria os campos do
     cartão "Dados do cliente" — com o teclado aberto, o campo em que a pessoa
     escreve. A conversa de um orçamento é curta; a mensagem nova rola até ela. */
  .cp-escrever { margin-top: 10px; padding: 10px 0 8px; border-top: 1px solid var(--ct-linha); }
  .cp-rotulo { display: block; margin-bottom: 5px; font-size: 13px; font-weight: 600; color: var(--ct-tinta-2); }
  .cp-linha { display: grid; grid-template-columns: 48px minmax(0, 1fr) 48px; gap: 8px; align-items: end; }
  .cp-texto { min-height: 48px; max-height: 160px; resize: vertical; line-height: 1.4; }
  .cp-anexar, .cp-enviar { width: 48px; height: 48px; display: inline-flex; align-items: center; justify-content: center;
                           border-radius: 12px; cursor: pointer; font: inherit; }
  .cp-anexar { border: 1px solid var(--ct-linha-forte); background: var(--ct-superficie); color: var(--ct-tinta); }
  .cp-enviar { border: 1px solid transparent; background: var(--ct-dourado-fill); color: var(--ct-dourado-sobre); }
  .cp-anexar svg, .cp-enviar svg { width: 22px; height: 22px; }
  .cp-anexar:disabled, .cp-enviar:disabled { opacity: .6; cursor: not-allowed; }
  /* ESCOLHER FOTO DA GALERIA (09/10/2026): o botão das multas e o da conversa, com o ícone da foto. */
  .pc-galeria { margin-top: 8px; gap: 8px; }
  .pc-galeria svg { width: 20px; height: 20px; flex: none; }
  .cp-galeria { display: inline-flex; align-items: center; gap: 7px; min-height: 44px; margin: 6px 0 0; padding: 6px 12px; border: 1px solid var(--ct-linha-forte);
                border-radius: 12px; background: var(--ct-superficie); color: var(--ct-tinta); font: 600 14px/1.2 var(--pc-fonte-titulo); cursor: pointer; }
  .cp-galeria svg { width: 19px; height: 19px; flex: none; }
  .cp-galeria:focus-visible { outline: 3px solid var(--ct-anel); outline-offset: 2px; }
  .cp-galeria:disabled { opacity: .6; cursor: not-allowed; }
  /* O aviso vazio não ocupa a linha (a caixa presa ao pé tem de ser baixa),
     mas continua no desenho: região que nasce escondida não é anunciada. */
  .cp-aviso { margin-top: 6px; min-height: 0; }
  .cp-aviso:empty { margin-top: 0; }
  .cp-nota { margin: 6px 0 0; font-size: 12.5px; color: var(--ct-tinta-3); line-height: 1.4; }
  .cp-pendentes, .cp-pg__pend { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 6px; }
  .cp-pend { display: flex; align-items: center; gap: 8px; padding: 4px 4px 4px 12px; border-radius: 10px;
             background: var(--ct-rebaixo); border: 1px solid var(--ct-linha); font-size: 14px; }
  .cp-pend__nome { flex: 1; min-width: 0; word-break: break-all; }
  /* O que a página leu do anexo (08/10/2026): uma linha discreta embaixo do nome. */
  .cp-pend__corpo { flex: 1; min-width: 0; display: grid; gap: 2px; }
  .cp-pend__leitura { font-size: 12.5px; line-height: 1.35; color: var(--ct-tinta-2); word-break: break-word; }
  .cp-pend__tirar { flex: none; min-height: 44px; padding: 0 12px; border-radius: 8px; border: 1px solid var(--ct-linha-forte);
                    background: transparent; color: var(--ct-tinta); font: inherit; font-size: 13.5px; font-weight: 700; cursor: pointer; }
  .cp-voltar:focus-visible, .cp-atalho:focus-visible, .cp-anexo:focus-visible, .cp-anexar:focus-visible,
  .cp-enviar:focus-visible, .cp-pend__tirar:focus-visible { outline: 3px solid var(--ct-anel); outline-offset: 2px; }