/* Ficha do lead e lista de leads. Depende de tokens, base, app, inbox e funil.css. */
.ficha { max-width: 1240px; margin: 0 auto; padding: 24px 28px 48px; display: flex; flex-direction: column; gap: 20px; }
.ficha-topo { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 20px 24px; background: var(--pn); border: 1px solid var(--ln); border-radius: var(--rc); }
.ficha-topo .avatar { width: 56px; height: 56px; font-size: 17px; }
.ficha-topo .info { flex: 1; min-width: 200px; display: flex; flex-direction: column; gap: 4px; }
.ficha-topo h1 { margin: 0; font-family: var(--fh); font-weight: var(--fhw); font-size: calc(28px * var(--hk)); line-height: 1.1; }
.ficha-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.ficha-grade { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 20px; align-items: start; }
.ficha-col { display: flex; flex-direction: column; gap: 20px; min-width: 0; }

.secao { background: var(--pn); border: 1px solid var(--ln); border-radius: var(--rc); }
.secao > summary { list-style: none; display: flex; align-items: center; gap: 10px; padding: 16px 20px; cursor: pointer; }
.secao > summary::-webkit-details-marker { display: none; }
.secao > summary h2 { margin: 0; flex: 1; font-family: var(--fh); font-weight: var(--fhw); font-size: calc(19px * var(--hk)); }
.secao > summary .seta { transition: transform .15s; color: var(--fa); }
.secao[open] > summary .seta { transform: rotate(180deg); }
.secao-corpo { padding: 0 20px 18px; display: flex; flex-direction: column; gap: 12px; }
.secao.privada { background: var(--sk); border-color: var(--lnS); }
.selo-privado { display: inline-flex; align-items: center; gap: 4px; padding: 2px 8px; background: var(--ink); color: var(--pn); font-size: 10.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; border-radius: var(--rt); }

/* Campos editaveis no lugar */
.campos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 4px 20px; }
.cfield { display: flex; flex-direction: column; gap: 3px; padding: 8px 10px; margin: 0 -10px; border-radius: var(--r); cursor: text; }
.cfield:hover { background: var(--hv); }
.cfield .rot { font-size: 12px; color: var(--mu); display: flex; align-items: center; gap: 6px; }
.cfield .rot i { opacity: 0; font-size: 12px; }
.cfield:hover .rot i { opacity: 1; }
.cfield .val { font-size: 14.5px; min-height: 22px; }
.cfield .val.vazio { color: var(--fa); }
.cfield.editando { background: transparent; cursor: default; }
.cfield .editor { display: flex; gap: 4px; flex-wrap: wrap; }
.cfield .editor .entrada { flex: 1 1 140px; min-width: 0; }
.cfield .editor .entrada { height: 36px; font-size: 14px; padding: 0 8px; }
.cfield .editor .btn-icone { width: 36px; height: 36px; border: 1px solid var(--lnS); }
.cfield .editor .salvar { background: var(--ink); color: var(--pn); border-color: var(--ink); }
.cfield.com-erro .entrada { border-color: var(--ac); background: var(--acS); }
.cfield .msg-erro { font-size: 12px; color: var(--acI); display: flex; gap: 4px; }
.cfield .msg-ok { font-size: 12px; color: var(--mu); }

.lin { display: grid; grid-template-columns: 96px minmax(0, 1fr) auto auto; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--ln); }
.lin:last-child { border-bottom: 0; }
.lin .valor { font-family: var(--fh); font-weight: var(--fhw); font-size: calc(17px * var(--hk)); }
.st { padding: 1px 8px; border-radius: var(--rt); font-size: 11px; font-weight: 600; background: var(--sk); }
.st.aprovado { background: var(--ink); color: var(--pn); }
.st.recusado, .st.substituido { background: transparent; border: 1px dashed var(--lnS); color: var(--mu); }
.st.aguardando_aprovacao { background: var(--acS); color: var(--acI); }

.galeria { display: grid; grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); gap: 8px; }
.galeria img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: calc(var(--rc) * .6); cursor: zoom-in; }

.tempo-linha { display: flex; flex-direction: column; }
.evento { display: grid; grid-template-columns: 14px minmax(0, 1fr); gap: 12px; padding-bottom: 14px; position: relative; }
.evento::before { content: ''; position: absolute; left: 6px; top: 16px; bottom: 0; width: 1px; background: var(--ln); }
.evento:last-child::before { display: none; }
.evento .ponto { width: 13px; height: 13px; margin-top: 4px; border-radius: 50%; border: 1.5px solid var(--lnS); background: var(--pn); }
.evento.etapa .ponto { background: var(--ink); border-color: var(--ink); }
.evento .quem { font-size: 12px; color: var(--fa); }

/* Lista de leads */
.leads-tabela { background: var(--pn); border: 1px solid var(--ln); border-radius: var(--rc); overflow: hidden; }
.leads-linha { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1.2fr) minmax(0, 1fr) minmax(0, 1fr) 90px auto; gap: 12px; align-items: center; padding: 12px 20px; border-bottom: 1px solid var(--ln); text-decoration: none; color: inherit; font-size: 13.5px; }
.leads-linha:hover { background: var(--hv); }
.leads-linha.cab { font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--fa); }
.leads-linha.cab:hover { background: transparent; }

@media (max-width: 900px) {
  .ficha { padding: 12px 12px 32px; gap: 12px; }
  .ficha-topo { padding: 16px; }
  .ficha-acoes { width: 100%; }
  .ficha-acoes .btn { flex: 1; }
  .ficha-grade { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .ficha-col { gap: 12px; }
  .campos { grid-template-columns: minmax(0, 1fr); }
  .lin { grid-template-columns: minmax(0, 1fr) auto; }
  .lin .quando { grid-column: 1 / -1; order: 3; font-size: 12px; color: var(--fa); }
  .leads-linha { grid-template-columns: minmax(0, 1fr) auto auto; }
  .leads-linha .opc { display: none; }
}
