/* Gestor7 — componentes do app (usa os tokens de painel.css) */

:root{
  --cobalto-escuro:#2A58D6; --cobalto-claro:#EAF0FE; --cobalto-suave:#D6E2FB;
  --agua-claro:#E3F8F4; --cinza-claro:#F0F3F8;
  --raio:14px; --raio-p:10px;
}

/* ---------- CABEÇALHO DA PÁGINA ---------- */
.cabecalho{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.cabecalho h1{font-family:"Sora",sans-serif;font-weight:700;font-size:24px;letter-spacing:-.02em;line-height:1.2}
.cabecalho .sub{color:var(--tinta-suave);font-size:14px;margin-top:4px}
.cabecalho .acoes{display:flex;gap:10px;flex-wrap:wrap}
.trilha{display:inline-flex;align-items:center;gap:4px;color:var(--tinta-suave);font-size:13px;font-weight:600;margin-bottom:6px}
.trilha:hover{color:var(--cobalto)}
.trilha .icone{width:16px;height:16px;stroke-width:2.2}

/* ---------- BOTÕES ---------- */
.botao{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 16px;border-radius:var(--raio-p);
  border:1px solid var(--linha);background:#fff;color:var(--tinta);font:600 14px/1.1 "Manrope",sans-serif;
  cursor:pointer;transition:background .15s,border-color .15s,color .15s,box-shadow .15s;white-space:nowrap}
.botao:hover{border-color:#C9D4E6;background:var(--papel)}
.botao .icone{width:17px;height:17px;stroke-width:2.1}
.botao-primario{background:var(--cobalto);border-color:var(--cobalto);color:#fff;box-shadow:0 6px 16px -8px rgb(var(--cobalto-rgb) / .7)}
.botao-primario:hover{background:var(--cobalto-escuro);border-color:var(--cobalto-escuro);color:#fff}
.botao-sucesso{background:var(--ok);border-color:var(--ok);color:#fff}
.botao-sucesso:hover{background:#0B8A5F;border-color:#0B8A5F;color:#fff}
.botao-perigo{color:var(--erro);border-color:#F6C9C9}
.botao-perigo:hover{background:var(--erro-bg);border-color:var(--erro);color:var(--erro)}
.botao-fantasma{border-color:transparent;background:transparent}
.botao-fantasma:hover{background:var(--cinza-claro);border-color:transparent}
.botao-p{padding:7px 11px;font-size:13px;border-radius:8px}
.botao-p .icone{width:15px;height:15px}
.botao[disabled]{opacity:.55;cursor:not-allowed}
form.em-linha{display:inline}

/* ---------- CARTÕES ---------- */
.cartao{background:var(--cartao);border:1px solid var(--linha);border-radius:var(--raio);box-shadow:0 1px 2px rgba(11,18,32,.04)}
.cartao-corpo{padding:22px}
.cartao-topo{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px 22px;border-bottom:1px solid var(--linha)}
.cartao-topo h2{font-family:"Sora",sans-serif;font-size:16px;font-weight:600;letter-spacing:-.01em}
.cartao-topo .sub{font-size:13px;color:var(--tinta-suave)}
.cartao + .cartao{margin-top:18px}
.grade{display:grid;gap:18px}
.grade-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grade-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grade-lateral{grid-template-columns:minmax(0,1fr) 340px;align-items:start}

/* ---------- INDICADORES (KPIs) ---------- */
.indicadores{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:22px}
.indicador{background:var(--cartao);border:1px solid var(--linha);border-radius:var(--raio);padding:18px 20px;position:relative;overflow:hidden}
.indicador .rotulo{font-size:12.5px;font-weight:600;color:var(--tinta-suave);text-transform:uppercase;letter-spacing:.06em}
.indicador .numero{font-family:"Sora",sans-serif;font-size:26px;font-weight:700;letter-spacing:-.02em;margin-top:8px;font-variant-numeric:tabular-nums}
.indicador .detalhe{font-size:13px;color:var(--tinta-suave);margin-top:4px}
.indicador.destaque{background:linear-gradient(135deg,var(--cobalto-claro),var(--agua-claro));border-color:var(--cobalto-suave)}
.indicador.destaque::after{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--grad)}
.indicador a{color:var(--cobalto);font-weight:600}

/* ---------- TABELAS ---------- */
.tabela-rolagem{overflow-x:auto}
.tabela{width:100%;border-collapse:collapse;font-size:14px}
.tabela th{text-align:left;font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--tinta-suave);
  padding:12px 16px;border-bottom:1px solid var(--linha);background:#FAFBFD;white-space:nowrap}
.tabela td{padding:13px 16px;border-bottom:1px solid var(--linha);vertical-align:middle}
.tabela tr:last-child td{border-bottom:0}
.tabela tbody tr:hover{background:#FAFBFE}
.tabela .num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.tabela .acoes-linha{text-align:right;white-space:nowrap}
.tabela a.principal{font-weight:600;color:var(--tinta)}
.tabela a.principal:hover{color:var(--cobalto)}
.tabela .secundario{display:block;font-size:12.5px;color:var(--tinta-suave);margin-top:2px}
.tabela tfoot td{font-weight:700;background:#FAFBFD;border-top:1px solid var(--linha)}

.vazio{padding:48px 24px;text-align:center;color:var(--tinta-suave)}
.vazio strong{display:block;color:var(--tinta);font-family:"Sora",sans-serif;font-size:16px;margin-bottom:6px}
.vazio .botao{margin-top:16px}

/* ---------- ETIQUETAS (badges) ---------- */
.etiqueta{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:12px;font-weight:700;
  background:var(--cinza-claro);color:var(--tinta-suave);white-space:nowrap}
.etiqueta::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.etiqueta.verde{background:var(--ok-bg);color:var(--ok)}
.etiqueta.vermelha{background:var(--erro-bg);color:var(--erro)}
.etiqueta.amarela{background:var(--aviso-bg);color:var(--aviso)}
.etiqueta.azul{background:var(--info-bg);color:var(--info)}
.etiqueta.agua{background:var(--agua-claro);color:var(--agua-texto)}
.etiqueta.roxa{background:#F1ECFE;color:#6D4AE0}

/* ---------- FILTROS ---------- */
.filtros{display:flex;gap:10px;flex-wrap:wrap;align-items:center;padding:14px 16px;border-bottom:1px solid var(--linha)}
.filtros .busca{position:relative;flex:1;min-width:220px}
.filtros .busca .icone{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:17px;height:17px;color:var(--tinta-suave);stroke-width:2}
.filtros .busca input{padding-left:38px}
.filtros select,.filtros input{width:auto}
.abas{display:flex;gap:4px;padding:4px;background:var(--cinza-claro);border-radius:12px;width:max-content;max-width:100%;overflow-x:auto}
.abas a{padding:8px 14px;border-radius:9px;font-size:13.5px;font-weight:600;color:var(--tinta-suave);white-space:nowrap}
.abas a.ativa{background:#fff;color:var(--tinta);box-shadow:0 1px 3px rgba(11,18,32,.1)}
.abas a .contagem{margin-left:6px;font-size:12px;color:var(--tinta-suave)}

/* ---------- FORMULÁRIOS ---------- */
.formulario{display:grid;gap:18px}
.campos{display:grid;gap:16px;grid-template-columns:repeat(12,minmax(0,1fr))}
.campo{display:flex;flex-direction:column;gap:6px;grid-column:span 12;min-width:0}
.c2{grid-column:span 2}.c3{grid-column:span 3}.c4{grid-column:span 4}.c5{grid-column:span 5}.c6{grid-column:span 6}
.c7{grid-column:span 7}.c8{grid-column:span 8}.c9{grid-column:span 9}
.campo label,.rotulo-campo{font-size:13px;font-weight:600;color:var(--tinta)}
.campo label .opcional{font-weight:500;color:var(--tinta-suave)}
.campo .ajuda{font-size:12.5px;color:var(--tinta-suave)}
input[type=text],input[type=email],input[type=password],input[type=date],input[type=month],input[type=number],input[type=tel],input[type=search],select,textarea{
  width:100%;padding:10px 12px;border:1px solid #D5DDEA;border-radius:var(--raio-p);background:#fff;color:var(--tinta);
  font:500 14px/1.3 "Manrope",sans-serif;transition:border-color .15s,box-shadow .15s}
textarea{min-height:96px;resize:vertical;line-height:1.5}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--cobalto);box-shadow:0 0 0 4px rgb(var(--cobalto-rgb) / .14)}
input[readonly]{background:var(--papel);color:var(--tinta-suave)}
.com-erro input,.com-erro select,.com-erro textarea{border-color:var(--erro);box-shadow:0 0 0 4px rgba(220,38,38,.08)}
.erro-campo{font-size:12.5px;font-weight:600;color:var(--erro)}
.campo-grupo{display:flex}
.campo-grupo > *:first-child{border-top-right-radius:0;border-bottom-right-radius:0}
.campo-grupo > .botao{border-top-left-radius:0;border-bottom-left-radius:0;margin-left:-1px}
.campo-moeda{position:relative}
.campo-moeda::before{content:"R$";position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:13px;font-weight:600;color:var(--tinta-suave)}
.campo-moeda input{padding-left:36px;text-align:right;font-variant-numeric:tabular-nums}
.marcador{display:flex;gap:10px;align-items:flex-start;cursor:pointer;font-size:14px}
.marcador input{margin-top:3px;width:17px;height:17px;accent-color:var(--cobalto);flex:none}
.marcador .ajuda{display:block}
.secao-form{padding-top:6px}
.secao-form > h3{font-family:"Sora",sans-serif;font-size:14.5px;font-weight:600;margin-bottom:14px;display:flex;align-items:center;gap:10px}
.secao-form > h3::after{content:"";flex:1;height:1px;background:var(--linha)}
.rodape-form{display:flex;justify-content:flex-end;gap:10px;padding:16px 22px;border-top:1px solid var(--linha);background:#FAFBFD;border-radius:0 0 var(--raio) var(--raio)}

/* ---------- LISTA DE DADOS (detalhe) ---------- */
.dados{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:18px 24px}
.dados dt{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--tinta-suave)}
.dados dd{margin-top:4px;font-size:14.5px;font-weight:500;word-break:break-word}
.linha-tempo{list-style:none;display:flex;flex-direction:column}
.linha-tempo li{position:relative;padding:0 0 16px 22px;font-size:13.5px}
.linha-tempo li::before{content:"";position:absolute;left:4px;top:6px;width:8px;height:8px;border-radius:50%;background:var(--cobalto)}
.linha-tempo li::after{content:"";position:absolute;left:7.5px;top:18px;bottom:0;width:1px;background:var(--linha)}
.linha-tempo li:last-child::after{display:none}
.linha-tempo .quando{display:block;font-size:12px;color:var(--tinta-suave);margin-top:2px}

/* ---------- MÓDULOS NA PROPOSTA ---------- */
.lista-escolha{display:grid;gap:8px}
.opcao-modulo{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:12px 14px;border:1px solid var(--linha);
  border-radius:var(--raio-p);cursor:pointer;transition:border-color .15s,background .15s}
.opcao-modulo:hover{border-color:#C9D4E6}
.opcao-modulo:has(input:checked){border-color:var(--cobalto);background:var(--cobalto-claro)}
.opcao-modulo input{width:17px;height:17px;accent-color:var(--cobalto)}
.opcao-modulo .nome{font-weight:600;font-size:14px}
.opcao-modulo .desc{font-size:12.5px;color:var(--tinta-suave)}
.opcao-modulo .valores{text-align:right;font-size:12.5px;color:var(--tinta-suave);font-variant-numeric:tabular-nums}
.opcao-modulo .valores strong{display:block;color:var(--tinta);font-size:13.5px}
.itens-avulsos .linha-item{display:grid;grid-template-columns:1fr 90px 150px 130px 40px;gap:8px;align-items:center;margin-bottom:8px}
.itens-avulsos .total-item{text-align:right;font-weight:600;font-variant-numeric:tabular-nums;font-size:14px}
.resumo-valores{display:grid;gap:10px;font-size:14px}
.resumo-valores .linha{display:flex;justify-content:space-between;gap:10px}
.resumo-valores .linha span:last-child{font-variant-numeric:tabular-nums;font-weight:600}
.resumo-valores .desconto span:last-child{color:var(--ok)}
.resumo-valores .total{border-top:1px dashed var(--linha);padding-top:10px;font-size:16px}
.resumo-valores .total span:last-child{font-family:"Sora",sans-serif;font-weight:700}
.fixo{position:sticky;top:90px}

/* ---------- CRM (kanban) ---------- */
.quadro{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(205px,1fr);gap:14px;overflow-x:auto;padding-bottom:12px;align-items:start}
.coluna{background:var(--cinza-claro);border-radius:var(--raio);padding:10px;min-height:200px;transition:background .15s}
.coluna.alvo{background:var(--cobalto-claro);outline:2px dashed var(--cobalto);outline-offset:-2px}
.coluna-topo{display:flex;justify-content:space-between;align-items:center;padding:4px 6px 10px}
.coluna-topo h3{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.06em}
.coluna-topo .soma{font-size:12px;color:var(--tinta-suave);font-variant-numeric:tabular-nums}
.coluna-topo .qtd{background:#fff;border-radius:999px;padding:2px 9px;font-size:12px;font-weight:700}
.cartoes{display:flex;flex-direction:column;gap:8px;min-height:60px}
.cartao-crm{background:#fff;border:1px solid var(--linha);border-radius:12px;padding:12px 13px;cursor:grab;box-shadow:0 1px 2px rgba(11,18,32,.05)}
.cartao-crm:active{cursor:grabbing}
.cartao-crm.arrastando{opacity:.45}
.cartao-crm .nome{font-weight:700;font-size:14px;display:block}
.cartao-crm .meta{font-size:12.5px;color:var(--tinta-suave);margin-top:3px}
.cartao-crm .rodape{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font-size:12.5px}
.cartao-crm .valor{font-weight:700;font-variant-numeric:tabular-nums}
.cartao-crm .mini-avatar{width:24px;height:24px;border-radius:50%;background:var(--grad);color:#fff;font-size:10.5px;font-weight:700;display:grid;place-items:center}

/* ---------- JANELA (dialog) ---------- */
dialog.janela{border:0;border-radius:18px;padding:0;width:min(520px,calc(100vw - 32px));box-shadow:0 30px 80px -20px rgba(11,18,32,.45);color:var(--tinta)}
dialog.janela::backdrop{background:rgba(11,18,32,.45)}
.janela .cartao-topo button{background:none;border:0;cursor:pointer;color:var(--tinta-suave);padding:4px;border-radius:8px}
.janela .cartao-topo button .icone{width:18px;height:18px}

/* ---------- PAGINAÇÃO ---------- */
.paginacao{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;border-top:1px solid var(--linha);font-size:13px;color:var(--tinta-suave)}
.paginacao .botoes{display:flex;gap:6px}

/* ---------- TELA DE ENTRAR ---------- */
body.tela-entrar{min-height:100dvh;display:grid;place-items:center;padding:24px;
  background:#F5F8FC radial-gradient(60% 50% at 15% 0%,rgb(var(--cobalto-rgb) / .14),transparent 60%),radial-gradient(50% 50% at 95% 100%,rgb(var(--agua-rgb) / .12),transparent 60%)}
.caixa-entrar{width:min(420px,100%);background:#fff;border:1px solid var(--linha);border-radius:20px;padding:34px 30px;box-shadow:var(--sombra)}
.caixa-entrar .marca{display:flex;align-items:center;gap:12px;margin-bottom:26px}
.caixa-entrar .marca svg{width:42px;height:42px}
.caixa-entrar .marca .nome{font-family:"Sora",sans-serif;font-weight:700;font-size:22px;letter-spacing:-.02em}
.caixa-entrar .marca .nome .sete{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
.caixa-entrar h1{font-family:"Sora",sans-serif;font-size:20px;font-weight:700;letter-spacing:-.01em}
.caixa-entrar .sub{color:var(--tinta-suave);font-size:14px;margin:4px 0 22px}
.caixa-entrar .botao{width:100%;padding:12px}
.tela-publica-rodape{margin-top:18px;text-align:center;font-size:12.5px;color:var(--tinta-suave)}

/* ---------- UTILITÁRIOS ---------- */
.texto-suave{color:var(--tinta-suave)}
.texto-p{font-size:13px}
.texto-verde{color:var(--ok)} .texto-vermelho{color:var(--erro)} .texto-amarelo{color:var(--aviso)}
.forte{font-weight:700}
.mt{margin-top:18px}
.mb{margin-bottom:18px}
.fila{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.entre{justify-content:space-between}
.oculto{display:none!important}
.caixa-link{display:flex;gap:8px;align-items:center;padding:10px 12px;background:var(--papel);border:1px dashed #C9D4E6;border-radius:var(--raio-p);font-size:13px;word-break:break-all}
.caixa-link code{flex:1;font-family:ui-monospace,Menlo,monospace;font-size:12.5px}
.aviso-caixa{padding:14px 16px;border-radius:var(--raio-p);font-size:14px;background:var(--info-bg);color:#1E4FC2}
.aviso-caixa.verde{background:var(--ok-bg);color:#0B7A55}
.aviso-caixa.amarela{background:var(--aviso-bg);color:#94590A}
.aviso-caixa.vermelha{background:var(--erro-bg);color:#B01E1E}

@media (max-width:1100px){
  .grade-lateral{grid-template-columns:1fr}
  .fixo{position:static}
}
@media (max-width:760px){
  .area{padding:18px 16px}
  .grade-2,.grade-3{grid-template-columns:1fr}
  .c2,.c3,.c4,.c5,.c6,.c7,.c8,.c9{grid-column:span 12}
  .itens-avulsos .linha-item{grid-template-columns:1fr 70px;}
  .itens-avulsos .linha-item > :nth-child(3){grid-column:1}
  .tabela .ocultar-celular{display:none}
  .cabecalho h1{font-size:21px}
}

/* ---------- AJUSTES DO LAYOUT ---------- */
.barra-lateral .navegacao{flex:1}
.empresa-rodape{padding:14px 22px;border-top:1px solid var(--barra-borda);font-size:12.5px;font-weight:600;color:var(--barra-texto);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
a.usuario:hover{background:var(--papel)}
.marca-topo{color:inherit}
.grade > .cartao{margin-top:0}

/* ---------- SUPERADMIN ---------- */
.selo-superadmin{margin:14px 20px 0;padding:6px 10px;border-radius:8px;background:rgb(var(--agua-rgb) / .14);color:#6EE7D2;
  font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;text-align:center}
.endereco-previa{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:600;margin-top:2px}
.endereco-previa.livre{color:var(--ok)} .endereco-previa.ocupado{color:var(--erro)}
.campo-grupo .sufixo{display:flex;align-items:center;padding:0 12px;border:1px solid #D5DDEA;border-left:0;border-radius:0 var(--raio-p) var(--raio-p) 0;
  background:var(--papel);color:var(--tinta-suave);font-size:14px;font-weight:600;white-space:nowrap}
.campo-grupo input:first-child{border-top-right-radius:0;border-bottom-right-radius:0}

/* ---------- SELECT PADRONIZADO ---------- */
/* remove a aparência nativa (seta/fundo do sistema) e usa a mesma caixa dos inputs */
select{
  -webkit-appearance:none;-moz-appearance:none;appearance:none;
  height:42px;padding:0 38px 0 12px;line-height:40px;cursor:pointer;
  background-color:#fff;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2356678A' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;background-size:16px;
  text-overflow:ellipsis;white-space:nowrap;overflow:hidden}
select:hover{border-color:#B9C6DB}
select:focus{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%233B6EF6' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")}
select::-ms-expand{display:none}
select:disabled{background-color:var(--papel);color:var(--tinta-suave);cursor:not-allowed}
select option{font-weight:500;color:var(--tinta)}
/* inputs de uma linha com a mesma altura do select */
input[type=text],input[type=email],input[type=password],input[type=date],input[type=month],input[type=number],input[type=tel],input[type=search]{height:42px}
/* seletores nos filtros e topos de página: largura pelo conteúdo, com limite */
.filtros select,.cabecalho select{width:auto;min-width:190px;max-width:280px}
.filtros input[type=month]{width:auto}
.campo-grupo > .botao,.filtros .botao{height:42px}

/* .formulario é pilha de uma coluna: o span 12 do .campo só vale dentro de .campos (grade de 12) */
.formulario{grid-template-columns:minmax(0,1fr)}
.formulario > .campo,.formulario > *{grid-column:1 / -1;min-width:0}
/* widget em modo invisível: não ocupa lugar na grade do formulário */
.caixa-entrar .cf-turnstile{display:contents}
.caixa-entrar .cf-turnstile > div{position:absolute;width:0;height:0;overflow:hidden}
/* celular: área útil da caixa de login ≥ 300px (largura mínima do widget da Cloudflare) */
@media (max-width:440px){
  body.tela-entrar{padding:16px}
  .caixa-entrar{padding:28px 20px}
}

/* ---------- PROGRESSO E CHECKLIST ---------- */
.progresso{display:inline-block;vertical-align:middle;width:110px;height:8px;border-radius:99px;background:var(--cinza-claro);overflow:hidden}
.progresso > span{display:block;height:100%;background:var(--grad);border-radius:99px;transition:width .25s}
.progresso.grande{width:100%;height:10px}
.progresso-texto{margin-left:8px;font-size:12.5px;font-weight:600;color:var(--tinta-suave);font-variant-numeric:tabular-nums}
.checklist{list-style:none}
.checklist li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 22px;border-bottom:1px solid var(--linha)}
.checklist li:last-child{border-bottom:0}
.checklist .texto-item{display:block}
.checklist li.feito .texto-item{color:var(--tinta-suave);text-decoration:line-through;text-decoration-color:#B7C1D4}
.checklist .quem{display:block;font-size:12px;color:var(--tinta-suave);margin-top:2px}
.checklist .quem:empty{display:none}

/* ---------- SUPORTE ---------- */
.cartao-crm.prioridade-urgente{border-left:4px solid var(--erro)}
.cartao-crm.prioridade-alta{border-left:4px solid var(--aviso)}
.linha-tempo li.interacao-situacao,.linha-tempo li.interacao-atribuicao{color:var(--tinta-suave);font-size:13px}
.linha-tempo li.interacao-situacao::before,.linha-tempo li.interacao-atribuicao::before{background:#B7C1D4}

/* ---------- TAGS ---------- */
.lista-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:6px}
.etiqueta.tag{border-radius:6px;padding:3px 8px;font-size:11.5px}
.etiqueta.tag::before{display:none}
.escolha-tags{display:flex;flex-wrap:wrap;gap:10px}
.opcao-tag{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border:1px solid var(--linha);border-radius:10px;cursor:pointer}
.opcao-tag:has(input:checked){border-color:var(--cobalto);background:var(--cobalto-claro)}
.opcao-tag input{accent-color:var(--cobalto)}

/* ---------- LOGO ---------- */
.envio-logo{display:flex;gap:16px;align-items:center;flex-wrap:wrap}
.previa-logo{max-height:64px;max-width:220px;padding:8px;border:1px solid var(--linha);border-radius:10px;background:#fff}
.previa-logo.vazia{display:grid;place-items:center;width:140px;height:64px;color:var(--tinta-suave);font-size:12.5px;background:var(--papel)}
input[type=file]{font:500 13.5px "Manrope",sans-serif;color:var(--tinta-suave)}
input[type=file]::file-selector-button{margin-right:10px;padding:8px 14px;border:1px solid var(--linha);border-radius:8px;background:#fff;
  font:600 13px "Manrope",sans-serif;color:var(--tinta);cursor:pointer}
input[type=file]::file-selector-button:hover{background:var(--papel)}

/* ---------- NPS ---------- */
.notas-nps{display:grid;grid-template-columns:repeat(11,1fr);gap:6px}
.notas-nps label{cursor:pointer}
.notas-nps input{position:absolute;opacity:0;pointer-events:none}
.notas-nps span{display:grid;place-items:center;height:44px;border-radius:10px;border:1px solid var(--linha);font-weight:700;font-size:15px;transition:.15s}
.notas-nps label:hover span{border-color:#B9C6DB}
.notas-nps .detrator input:checked + span{background:var(--erro);border-color:var(--erro);color:#fff}
.notas-nps .neutro input:checked + span{background:var(--aviso);border-color:var(--aviso);color:#fff}
.notas-nps .promotor input:checked + span{background:var(--ok);border-color:var(--ok);color:#fff}
.notas-nps input:focus-visible + span{box-shadow:0 0 0 4px rgb(var(--cobalto-rgb) / .2)}
.legenda-nps{display:flex;justify-content:space-between;font-size:12px;color:var(--tinta-suave);margin-top:-8px}
.grafico-nps{display:grid;grid-template-columns:repeat(11,1fr);gap:8px;height:180px;align-items:end}
.coluna-nps{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:4px}
.coluna-nps .barra{width:100%;min-height:2px;border-radius:6px 6px 0 0}
.coluna-nps.detrator .barra{background:#F3A6A6} .coluna-nps.neutro .barra{background:#F2CB8B} .coluna-nps.promotor .barra{background:#8FD9BE}
.coluna-nps .qtd{font-size:12px;font-weight:700;color:var(--tinta-suave)}
.coluna-nps .nota{font-size:12.5px;font-weight:700}
.nota-circulo{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;font-weight:800;color:#fff}
.nota-circulo.detrator{background:var(--erro)} .nota-circulo.neutro{background:var(--aviso)} .nota-circulo.promotor{background:var(--ok)}
@media (max-width:520px){ .notas-nps{grid-template-columns:repeat(6,1fr)} }

/* ---------- FINANCEIRO ---------- */
.lista-categorias{display:flex;flex-direction:column;gap:14px}
.lista-categorias .progresso{margin-top:6px}

/* ---------- ATALHOS DE OPERAÇÃO (painel) ---------- */
.atalhos-operacao{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:12px}
.atalho{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:12px;background:#fff;border:1px solid var(--linha);font-size:13.5px;transition:border-color .15s}
.atalho:hover{border-color:var(--cobalto)}
.atalho .icone{width:22px;height:22px;stroke-width:1.9;color:var(--cobalto);flex:none}
.atalho strong{font-family:"Sora",sans-serif;font-size:16px;margin-right:2px}
.atalho.alerta-vermelho{border-color:#F6C9C9;background:#FFF8F8} .atalho.alerta-vermelho .icone{color:var(--erro)}
.atalho.alerta-amarelo{border-color:#F3DDB8;background:#FFFBF3} .atalho.alerta-amarelo .icone{color:var(--aviso)}

/* sidebar: com muitos itens a coluna rola; nada pode encolher (o rodapé era espremido e cortava o nome) */
.barra-lateral > *{flex-shrink:0}
.empresa-rodape{padding:16px 22px calc(22px + env(safe-area-inset-bottom));margin-bottom:6px;line-height:1.4}

/* ---------- REAJUSTE EM MASSA ---------- */
.barra-reajuste{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:12px 16px;border-bottom:1px solid var(--linha);background:#FAFBFD}
.tabela input[type=checkbox]{width:16px;height:16px;accent-color:var(--cobalto)}

/* ---------- MODELO DE CONTRATO ---------- */
.lista-variaveis{list-style:none;display:flex;flex-direction:column;gap:4px;font-size:12.5px}
.lista-variaveis li{display:flex;align-items:center;gap:8px}
.lista-variaveis code{font-size:11.5px;color:var(--cobalto)}
.lista-variaveis span{color:var(--tinta-suave)}
.texto-contrato{font-size:14px;line-height:1.7}
.texto-contrato h3{font-family:"Sora",sans-serif;font-size:16px;text-align:center;margin-bottom:14px}
.texto-contrato h4{font-family:"Sora",sans-serif;font-size:14px;margin:16px 0 6px}
.texto-contrato p{margin-bottom:8px}

/* ---------- VÁRIOS SISTEMAS NA PROPOSTA ---------- */
.lista-sistemas{display:flex;flex-direction:column;gap:10px}
.bloco-sistema{border:1px solid var(--linha);border-radius:12px;overflow:hidden}
.bloco-sistema .opcao-sistema{border:0;border-radius:0;background:#FAFBFD}
.bloco-sistema .opcao-sistema .nome{font-size:15px}
.bloco-sistema.marcado{border-color:var(--cobalto)}
.bloco-sistema.marcado .opcao-sistema{background:var(--cobalto-claro)}
.bloco-sistema .modulos-do-sistema{display:none;padding:10px 12px 12px 36px;border-top:1px solid var(--linha)}
.bloco-sistema.marcado .modulos-do-sistema{display:grid}
#aviso-minimo{color:var(--aviso);font-weight:600}
.link-discreto{background:none;border:0;padding:0;margin-left:6px;font:inherit;color:var(--tinta-suave);text-decoration:underline;cursor:pointer}
.link-discreto:hover{color:var(--erro)}
.progresso.limite > span{background:linear-gradient(90deg,var(--agua),#C2760C 70%,#DC2626)}
.notas-nps.pequeno span{height:36px;font-size:13.5px}
.opcoes-pergunta{display:flex;flex-direction:column;gap:8px}
.pergunta-extra{padding-top:14px;border-top:1px dashed var(--linha)}
.opcao-modulo.submodulo{margin-left:28px}
.opcao-modulo:has(input:disabled){opacity:.55}
.lista-capacidades{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}

/* ---------- MARCA DA EMPRESA (logo e paleta) ---------- */
.marca-topo.com-logo{padding:16px 16px 14px}
.logo-barra{display:flex;align-items:center;justify-content:center;width:100%;height:62px;padding:8px 14px;
  background:#fff;border-radius:12px;box-shadow:0 6px 18px -10px rgb(0 0 0 / .5)}
.logo-barra img{max-width:100%;max-height:46px;object-fit:contain}
.logo-barra.escuro{background:none;box-shadow:none;padding:4px 6px}
.logo-barra.escuro img{max-height:50px}
.previa-logo.escuro{background:#0F1A2E;border-color:#0F1A2E}
.previa-marca .pm-logo.escuro{background:none}
.caixa-entrar .marca.com-logo{justify-content:center}
.caixa-entrar .marca.com-logo img{max-width:240px;max-height:72px;object-fit:contain}
.paletas{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:10px}
.paleta{position:relative;cursor:pointer}
.paleta input{position:absolute;opacity:0;pointer-events:none}
.paleta span{display:flex;flex-direction:column;gap:8px;padding:10px;border:1px solid var(--linha);border-radius:var(--raio-p);
  background:#fff;font-size:13px;font-weight:600;transition:border-color .15s,box-shadow .15s}
.paleta span:hover{border-color:#C9D4E6}
.paleta i{display:block;height:26px;border-radius:7px;background:linear-gradient(135deg,var(--p) 0 55%,var(--d) 55%)}
.paleta input:checked + span{border-color:var(--p);box-shadow:0 0 0 3px color-mix(in srgb,var(--p) 22%,transparent)}
.paleta input:focus-visible + span{box-shadow:0 0 0 3px color-mix(in srgb,var(--p) 35%,transparent)}
.paleta.personalizada i{background:conic-gradient(#EF4444,#F59E0B,#22C55E,#06B6D4,#6366F1,#EC4899,#EF4444)}
.cores-personalizadas{display:flex;gap:18px;flex-wrap:wrap;margin-top:14px}
.cores-personalizadas[hidden]{display:none}
.cores-personalizadas label{display:flex;align-items:center;gap:10px;font-size:13.5px;font-weight:600}
.cores-personalizadas input[type=color]{width:46px;height:36px;padding:3px;border-radius:8px;cursor:pointer}
.previa-marca{display:grid;grid-template-columns:120px 1fr;border:1px solid var(--linha);border-radius:var(--raio-p);overflow:hidden;margin-top:16px;min-height:150px}
.previa-marca .pm-barra{background:var(--pm-barra);padding:12px 10px;display:flex;flex-direction:column;gap:6px}
.previa-marca .pm-logo{height:30px;border-radius:6px;background:#fff;display:flex;align-items:center;justify-content:center;margin-bottom:6px;overflow:hidden}
.previa-marca .pm-logo img{max-width:90%;max-height:22px;object-fit:contain}
.previa-marca .pm-item{height:9px;border-radius:4px;background:rgb(255 255 255 / .16)}
.previa-marca .pm-item.ativo{background:var(--pm-destaque);opacity:.8}
.previa-marca .pm-corpo{background:var(--papel);padding:16px;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.previa-marca .pm-titulo{height:10px;width:50%;border-radius:4px;background:#D5DDEA}
.previa-marca .pm-botao{padding:7px 12px;border-radius:8px;background:var(--pm-principal);color:#fff;font-size:12px;font-weight:700}
.previa-marca .pm-link{font-size:12px;font-weight:700;color:var(--pm-principal)}
.previa-marca .pm-etiqueta{padding:3px 9px;border-radius:999px;font-size:11px;font-weight:700;background:var(--pm-destaque-claro);color:var(--pm-destaque-texto)}
.caixa-dns{display:grid;grid-template-columns:auto 1fr;gap:4px 10px;margin-top:8px;padding:10px 12px;border-radius:var(--raio-p);background:var(--papel);font-size:12.5px}
.caixa-dns span{color:var(--tinta-suave);font-weight:600}
.caixa-dns code{font-size:12.5px;word-break:break-all}

/* ---------- TELA DE ACESSO (entrar / senha / painel) ---------- */
body.tela-acesso{min-height:100dvh;background:var(--cartao)}
.acesso{display:grid;grid-template-columns:minmax(0,11fr) minmax(0,9fr);min-height:100dvh}
.acesso-foto{position:relative;overflow:hidden;background:var(--barra-fundo);color:#fff;
  display:flex;flex-direction:column;justify-content:flex-start;padding:44px 48px}
.acesso-foto picture{display:contents}
.acesso-foto picture img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%}
.acesso-foto::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgb(11 18 32 / .42) 0%,rgb(var(--cobalto-rgb) / .24) 22%,rgb(var(--cobalto-rgb) / .42) 58%,rgb(11 18 32 / .8) 100%)}
.acesso-foto > :not(picture){position:relative;z-index:1}
.acesso-foto-marca{display:flex;align-items:center;gap:12px;min-height:88px;position:relative}
/* brilho branco bem dissipado atrás do logotipo da empresa */
.acesso-foto-marca::before{content:"";position:absolute;left:-160px;top:-130px;width:640px;max-width:calc(100% + 320px);height:calc(100% + 260px);pointer-events:none;
  background:radial-gradient(closest-side,rgb(255 255 255 / .95),rgb(255 255 255 / .6) 35%,rgb(255 255 255 / .25) 65%,transparent 100%)}
.acesso-foto-marca > *{position:relative}
.acesso-foto-marca img{max-height:88px;max-width:340px;object-fit:contain;
  filter:drop-shadow(0 0 18px rgb(255 255 255 / .85)) drop-shadow(0 8px 48px rgb(255 255 255 / .6))}
.acesso-foto-marca .simbolo{width:38px;height:38px;filter:drop-shadow(0 0 18px rgb(255 255 255 / .8)) drop-shadow(0 8px 44px rgb(255 255 255 / .55))}
.acesso-foto-marca .nome{font-family:"Sora",sans-serif;font-weight:700;font-size:22px;letter-spacing:-.02em;text-shadow:0 1px 8px rgb(0 0 0 / .3)}
.acesso-foto-texto{margin-top:auto}
.acesso-foto-texto .saudacao{font-family:"Sora",sans-serif;font-weight:700;font-size:clamp(40px,4.8vw,68px);letter-spacing:-.035em;line-height:.98}
.acesso-foto-texto .hoje{margin-top:14px;font-size:17px;font-weight:500;color:rgb(255 255 255 / .82)}
.acesso-painel{position:relative;display:flex;align-items:center;justify-content:center;padding:56px 32px;
  background:linear-gradient(135deg,rgb(var(--cobalto-rgb) / .09) 0%,#fff 42%,#fff 62%,rgb(var(--agua-rgb) / .08) 100%)}
.assinatura-gestor7{display:inline-flex;align-items:center;gap:8px;
  font-family:"Sora",sans-serif;font-weight:700;font-size:14px;letter-spacing:-.01em;color:var(--tinta-suave);opacity:.85;border-radius:8px;padding:4px 6px}
.assinatura-gestor7 svg{width:22px;height:22px}
.assinatura-gestor7 b{background:linear-gradient(135deg,#3B6EF6,#16C0A6);-webkit-background-clip:text;background-clip:text;color:transparent}
.assinatura-gestor7:hover{opacity:1;color:var(--tinta)}
.assinatura-gestor7:focus-visible{outline:2px solid var(--cobalto);outline-offset:2px}
.acesso-assinatura{position:absolute;right:28px;bottom:22px}
.rodape-area{display:flex;justify-content:flex-end;margin-top:50px;padding:0 28px 24px}
.acesso-form{width:min(400px,100%)}
.acesso-form h1{font-family:"Sora",sans-serif;font-weight:700;font-size:28px;letter-spacing:-.025em;line-height:1.15}
.acesso-form .sub{color:var(--tinta-suave);font-size:15px;line-height:1.5;margin:8px 0 30px}
.acesso-form .formulario{gap:16px}
.acesso-form input{padding:13px 14px;font-size:15px}
.acesso-form .botao{width:100%;padding:14px;font-size:15px;margin-top:6px}
.acesso-link{justify-self:start;font-size:14px;font-weight:600;color:var(--cobalto);border-radius:6px}
.acesso-link:hover{text-decoration:underline}
.acesso-link:focus-visible{outline:2px solid var(--cobalto);outline-offset:3px}
@media (prefers-reduced-motion:no-preference){
  .acesso-foto picture img{animation:acesso-assentar 1.4s cubic-bezier(.2,.7,.2,1) both}
  @keyframes acesso-assentar{from{transform:scale(1.05);opacity:0}to{transform:none;opacity:1}}
}
@media (max-width:860px){
  .acesso{grid-template-columns:1fr;grid-template-rows:auto 1fr}
  .acesso-foto{min-height:280px;padding:22px 20px}
  .acesso-foto-texto{margin-top:auto}
  .acesso-foto-marca{min-height:56px}
  .acesso-foto-marca img{max-height:56px;max-width:240px}
  .acesso-foto-texto .saudacao{font-size:38px}
  .acesso-foto-texto .hoje{margin-top:8px;font-size:15px}
  .acesso-painel{flex-direction:column;align-items:stretch;justify-content:flex-start;padding:30px 20px 24px}
  .acesso-form{width:100%}
  .acesso-assinatura{position:static;align-self:flex-end;margin-top:36px}
}

/* ---------- INTEGRAÇÕES › PAGAMENTOS ---------- */
.provedores{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:14px}
.provedor{display:flex;flex-direction:column;gap:10px;padding:16px;border:1px solid var(--linha);border-radius:var(--raio-p);background:#fff}
.provedor.em-uso{border-color:var(--cobalto);box-shadow:0 0 0 3px rgb(var(--cobalto-rgb) / .12)}
.provedor.em-breve{opacity:.72;background:var(--papel)}
.provedor-topo{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:16px}
.provedor p{flex:1;margin:0}
.passos{padding-left:20px;display:flex;flex-direction:column;gap:8px;font-size:14px;line-height:1.5}
.tabela.compacta td{padding:9px 14px}
.provedor-nome{display:inline-flex;align-items:center;gap:10px;min-width:0}
.provedor-logo{height:38px;width:auto;min-width:38px;max-width:110px;flex:none;object-fit:contain;padding:5px 6px;background:#fff;border:1px solid var(--linha);border-radius:10px}
.provedor-logo.grande{height:44px;min-width:44px;max-width:130px;vertical-align:middle;margin-right:10px}
.provedor.em-breve .provedor-logo{filter:grayscale(1);opacity:.7}

/* ---------- MENU DA CONTA (cabeçalho) ---------- */
.menu-conta{position:relative}
.menu-conta .usuario{border:0;background:none;cursor:pointer;font:inherit;color:inherit;text-align:left}
.menu-conta .usuario:hover,.menu-conta .usuario[aria-expanded=true]{background:var(--papel)}
.menu-conta .seta{color:var(--tinta-suave);transition:transform .18s}
.menu-conta .usuario[aria-expanded=true] .seta{transform:rotate(180deg)}
.menu-conta-lista{position:absolute;right:0;top:calc(100% + 8px);min-width:240px;padding:6px;background:var(--cartao);border:1px solid var(--linha);
  border-radius:14px;box-shadow:0 18px 40px -16px rgb(11 18 32 / .28),0 2px 6px rgb(11 18 32 / .06);z-index:50;
  transform-origin:top right;animation:menu-conta-abrir .16s cubic-bezier(.2,.7,.2,1)}
.menu-conta-lista[hidden]{display:none}
@keyframes menu-conta-abrir{from{opacity:0;transform:translateY(-6px) scale(.97)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.menu-conta-lista{animation:none}}
.menu-conta-topo{display:flex;flex-direction:column;gap:2px;padding:10px 12px 12px;margin-bottom:6px;border-bottom:1px solid var(--linha)}
.menu-conta-topo strong{font-size:14px}
.menu-conta-topo span{font-size:12.5px;color:var(--tinta-suave);word-break:break-all}
.menu-conta-lista a,.menu-conta-lista button{display:flex;align-items:center;gap:10px;width:100%;padding:9px 12px;border:0;background:none;
  border-radius:9px;font:600 14px/1.2 "Manrope",sans-serif;color:var(--tinta);cursor:pointer;text-align:left}
.menu-conta-lista a:hover,.menu-conta-lista button:hover,.menu-conta-lista a:focus-visible,.menu-conta-lista button:focus-visible{background:var(--papel);outline:0}
.menu-conta-lista .icone{width:17px;height:17px;stroke-width:2;color:var(--tinta-suave)}
.menu-conta-lista form{margin-top:6px;padding-top:6px;border-top:1px solid var(--linha)}
.menu-conta-lista .sair{color:var(--erro)} .menu-conta-lista .sair .icone{color:var(--erro)}
@media (max-width:760px){ .menu-conta .usuario .info{display:none} .menu-conta-lista{right:-8px} }

/* ---------- FOTO DE PERFIL ---------- */
img.avatar{object-fit:cover;background:var(--papel)}
.avatar-grande{width:88px;height:88px;font-size:30px;flex:none}
