/* =======================================================================
   Telas da plataforma (login, clientes, cadastro, usuários).
   Usa os mesmos tokens do dash (dash.css), então tudo fica no mesmo estilo.
   ======================================================================= */
a.ghost{display:inline-flex;align-items:center;text-decoration:none;white-space:nowrap}
.so-leitor{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.muted{color:var(--ink-2)}
.pequeno{font-size:12px}
.mono{font-family:var(--mono)}
.btn-primario{display:inline-flex;align-items:center;justify-content:center;gap:6px;background:var(--c-a);color:var(--ink-on-mark);
  border:0;border-radius:9px;padding:10px 16px;font:600 13px/1 var(--sans);text-decoration:none;cursor:pointer;white-space:nowrap}
.btn-primario:hover{filter:brightness(1.07)}
.btn-primario[disabled]{opacity:.55;cursor:default}
.btn-secundario{display:inline-flex;align-items:center;gap:6px;background:var(--accent-soft);color:var(--ink);border:1px solid var(--accent);
  border-radius:9px;padding:9px 14px;font:600 12.5px/1 var(--sans);cursor:pointer;white-space:nowrap}
.btn-secundario[disabled]{opacity:.55;cursor:default}
.btn-texto{background:none;border:0;color:var(--ink-2);font:500 12px var(--sans);cursor:pointer;padding:6px 4px;text-decoration:underline;text-underline-offset:3px}
.btn-texto:hover{color:var(--ink)}
.btn-texto.perigo:hover{color:#ff8a8a}
.alerta{margin-top:12px;padding:11px 14px;border-radius:var(--radius);border:1px solid var(--warn);border-left-width:3px;background:var(--surface);font-size:13px;color:var(--ink)}
.alerta.ok{border-color:var(--good)}
input[type="text"],input[type="email"],input[type="password"],input[type="search"],input[type="url"],textarea{
  width:100%;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:8px;padding:10px 11px;font:500 13.5px/1.3 var(--sans);min-width:0}
textarea{resize:vertical;min-height:64px;line-height:1.45}
input::placeholder,textarea::placeholder{color:var(--ink-3)}

/* topo das telas de admin */
.adm-nav{display:flex;gap:4px;margin-left:10px}
.adm-nav a{color:var(--ink-2);text-decoration:none;font-size:12.5px;font-weight:600;padding:7px 11px;border-radius:999px;border:1px solid transparent}
.adm-nav a:hover{color:var(--ink)}
.adm-nav a[aria-current="page"]{background:var(--accent-soft);border-color:var(--accent);color:var(--ink)}
.quem{font-size:12px;color:var(--ink-3)}
.quem em{font-style:normal;font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--c-a);border:1px solid var(--line);border-radius:5px;padding:2px 5px;margin-left:4px}
@media (max-width:760px){.quem{display:none}.adm-nav{margin-left:0}}

.adm{padding-top:26px}
.adm-cab{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-end;justify-content:space-between}
.adm-cab h1{margin:0;font-size:24px;letter-spacing:-.02em}
.adm-cab p{margin:6px 0 0;font-size:13px}
.adm-cab a.mono{color:var(--c-a)}
.adm-acoes{display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.adm-acoes input[type="search"]{width:240px}
.vazio{margin-top:24px;padding:40px 16px;text-align:center;border:1px dashed var(--line);border-radius:12px;color:var(--ink-2)}
.vazio a{color:var(--c-a)}

/* lista de clientes */
.cli-grid{display:grid;gap:12px;margin-top:22px;grid-template-columns:repeat(auto-fill,minmax(290px,1fr))}
.cli-card{position:relative;display:flex;flex-direction:column;gap:16px;padding:18px;border-radius:12px;background:var(--surface);border:1px solid var(--line-soft);transition:border-color .15s}
.cli-card:hover{border-color:var(--accent)}
.cli-link{position:absolute;inset:0;border-radius:12px;z-index:1}
.cli-link:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.cli-acoes{position:relative;z-index:2;display:flex;align-items:center;gap:10px}
.cli-top{display:flex;justify-content:space-between;gap:12px;align-items:center}
.cli-id{display:flex;gap:12px;align-items:center;min-width:0}
.cli-id h2{margin:0;font-size:16px;font-weight:600}
.cli-id .mono{font-size:12px}
.cli-logo{width:40px;height:40px;border-radius:10px;object-fit:contain;background:var(--surface-2);border:1px solid var(--line);padding:4px;flex:none}
:root[data-theme="light"] .cli-logo{filter:invert(1)}
.cli-ini{width:40px;height:40px;border-radius:10px;background:var(--surface-2);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--c-a);flex:none}
.status{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;white-space:nowrap}
.status::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor}
.status.ok{color:var(--good)} .status.warn{color:var(--warn)}
.cli-nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding-top:12px;border-top:1px dashed var(--line)}
.cli-nums span{display:block;font-size:10.5px;letter-spacing:.09em;text-transform:uppercase;color:var(--ink-3);font-weight:600}
.cli-nums b{font-family:var(--mono);font-size:19px;font-weight:600}
.cli-nums b.acc{color:var(--c-a)}
.cli-novo{min-height:170px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;border-radius:12px;
  border:1px dashed var(--line);color:var(--ink-2);text-decoration:none;font-size:13.5px}
.cli-novo span{font-size:26px;color:var(--c-a);line-height:1}
.cli-novo:hover{border-color:var(--accent);color:var(--ink)}

/* login e convite */
.pg-auth{min-height:100vh}
.auth{min-height:100vh;display:flex;flex-wrap:wrap}
.auth-hero{flex:1 1 520px;min-width:0;display:flex;flex-direction:column;justify-content:space-between;padding:32px;border-right:1px solid var(--line-soft);position:relative;overflow:hidden}
.auth-brand{display:flex;gap:11px;align-items:center}
.auth-brand p{margin:0;font-size:11px;color:var(--ink-3);letter-spacing:.06em;text-transform:uppercase;font-weight:600}
.auth-brand h1{margin:0;font-size:16px}
.auth-globo{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;padding:28px 0}
.auth-globo .halo{position:absolute;top:-30px;left:50%;width:560px;max-width:100%;height:380px;transform:translateX(-50%);pointer-events:none;
  background:radial-gradient(closest-side,var(--accent-soft),transparent 70%)}
.auth-globo canvas{width:300px;height:300px;display:block;position:relative}
.auth-globo h2{margin:4px 0 0;font-size:24px;letter-spacing:-.02em;position:relative;max-width:420px}
.auth-globo p{margin:8px 0 0;color:var(--ink-2);position:relative}
.auth-rodape{font-family:var(--mono);font-size:11px;color:var(--ink-3)}
.auth-form{flex:1 1 440px;min-width:0;display:flex;align-items:center;justify-content:center;padding:32px 16px}
.card-form{width:100%;max-width:380px;display:flex;flex-direction:column;gap:18px}
.card-form h2{margin:0;font-size:24px}
.card-form .muted{margin:6px 0 0;font-size:13.5px}
.card-form .btn-primario{padding:13px 16px;font-size:14px}
@media (max-width:760px){.auth-hero{border-right:0;border-bottom:1px solid var(--line-soft);padding:20px 16px}.auth-globo canvas{width:190px;height:190px}.auth-globo h2{font-size:19px}}
.vazio-pagina{max-width:460px;margin:12vh auto;padding:0 16px;text-align:center;display:flex;flex-direction:column;gap:14px;align-items:center}
.vazio-pagina h1{margin:0;font-size:24px}
.vazio-pagina p{margin:0}

/* cadastro de cliente */
.form-grid{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start;margin-top:20px}
.form-col{flex:999 1 620px;min-width:0;display:flex;flex-direction:column;gap:12px}
.previa{flex:1 1 300px;min-width:0;position:sticky;top:84px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:18px;
  background-image:radial-gradient(circle at 50% 0%,var(--accent-soft),transparent 60%)}
@media (max-width:1000px){.previa{position:static}}
.secao{background:var(--surface);border:1px solid var(--line-soft);border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:14px}
.secao-cab{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap}
.secao-cab h2{margin:0;font-size:16px;display:flex;align-items:center;gap:11px}
.num{width:27px;height:27px;border-radius:50%;border:1px solid var(--accent);color:var(--c-a);font:500 12.5px var(--mono);display:inline-flex;align-items:center;justify-content:center;flex:none}
.secao p.ajuda{margin:0;font-size:12.5px;color:var(--ink-2);line-height:1.5}
.grid-2{display:grid;gap:12px;grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.grid-3{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}
.linha{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.linha > .field{flex:1 1 260px}
.prefixo{display:flex;align-items:center;border:1px solid var(--line);border-radius:8px;background:var(--surface);overflow:hidden}
.prefixo span{padding:0 2px 0 11px;font:500 12.5px var(--mono);color:var(--ink-3);white-space:nowrap}
.prefixo input{border:0;border-radius:0;font-family:var(--mono);font-size:13px;padding-left:2px}
.caixa{padding:12px 14px;border-radius:10px;background:var(--bg);border:1px dashed var(--line);font-size:12.5px;color:var(--ink-2);display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between}
.caixa code{font:500 12px var(--mono);color:var(--c-a);word-break:break-all}
.estado{display:flex;align-items:center;gap:8px;font-size:12.5px}
.estado::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;flex:none}
.estado.ok{color:var(--good)} .estado.erro{color:var(--warn)} .estado.neutro{color:var(--ink-3)}
.logo-campo{display:flex;align-items:center;gap:12px}
.logo-prev{width:46px;height:46px;border-radius:10px;background:var(--surface-2);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;overflow:hidden;flex:none}
.logo-prev img{width:100%;height:100%;object-fit:contain}
.troca{display:inline-flex;align-items:center;gap:8px;font-size:13px;cursor:pointer}
.troca input{width:16px;height:16px;accent-color:var(--accent)}

.mapa{display:grid;gap:8px;grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}
.mapa-item{display:flex;align-items:center;gap:10px;padding:9px 11px;border-radius:10px;background:var(--bg);border:1px solid var(--line-soft)}
.mapa-item > span{flex:1 1 0;min-width:0;font-size:13.5px}
.mapa-item > span small{display:block;color:var(--ink-3);font-size:11px}
.mapa-item select{flex:1 1 0;min-width:0;font-family:var(--mono);font-size:12px;padding:7px 8px}
.dims{display:flex;flex-direction:column;gap:6px}
.dim{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px 11px;border-radius:10px;background:var(--bg);border:1px solid var(--line-soft)}
.dim.off{opacity:.62}
.dim .nome{font:500 12.5px var(--mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dim input[type="text"]{padding:7px 9px;font-size:12.5px}
.dim .pii{font-size:11px;color:var(--warn)}
@media (max-width:620px){.dim{grid-template-columns:1fr}}

.regra{border:1px solid var(--line-soft);border-radius:11px;background:var(--bg);padding:12px 14px;display:flex;flex-direction:column;gap:10px}
.faixa{border-left:3px solid var(--fx,var(--c-a))}
.faixa-cab{display:grid;grid-template-columns:minmax(0,160px) minmax(0,1fr) auto;gap:10px;align-items:end}
@media (max-width:620px){.faixa-cab{grid-template-columns:1fr}}
.cond{display:flex;flex-direction:column;gap:8px;padding:10px;border-radius:9px;background:var(--surface);border:1px solid var(--line-soft)}
.cond-cab{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.cond-cab select{width:auto;flex:1 1 170px;padding:7px 8px;font-size:12.5px}
.cond-cab .rotulo{font-size:12.5px;color:var(--ink-2)}
.chips-valores{display:flex;flex-wrap:wrap;gap:6px;max-height:190px;overflow:auto;padding:2px}
.chip-v{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--surface-2);color:var(--ink-2);border-radius:999px;
  padding:5px 10px;font:500 12px var(--sans);cursor:pointer;max-width:100%}
.chip-v span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.chip-v small{font:500 10.5px var(--mono);color:var(--ink-3)}
.chip-v[aria-pressed="true"]{background:var(--accent-soft);border-color:var(--accent);color:var(--ink)}
.chip-v[aria-pressed="true"] small{color:var(--ink-2)}
.adicionar{align-self:flex-start}

/* prévia */
.previa h2{margin:0 0 4px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-2)}
.previa p{margin:0 0 12px;font-size:12.5px;color:var(--ink-2);line-height:1.5}
.prev-linhas{display:flex;flex-direction:column;gap:9px;margin:10px 0 14px}
.prev-linhas div{display:flex;justify-content:space-between;align-items:center;font-size:13.5px}
.prev-linhas i{display:inline-block;width:10px;height:10px;border-radius:2px;margin-right:8px;vertical-align:-1px}
.prev-linhas b{font-family:var(--mono);font-weight:600}
.prev-sub{font-size:12px;color:var(--ink-3);display:flex;justify-content:space-between;padding-top:8px;border-top:1px solid var(--line-soft);margin-top:4px}
.prev-bloco{margin-top:12px;padding:12px;border-radius:10px;background:var(--bg);border:1px solid var(--line-soft);font-size:12.5px;color:var(--ink-2)}
.prev-bloco strong{display:block;color:var(--warn);font-size:12px;margin-bottom:6px}
.prev-bloco ul{margin:0;padding-left:16px;display:flex;flex-direction:column;gap:3px}
.prev-bloco li b{font-family:var(--mono);color:var(--ink)}
.previa .btn-secundario{width:100%;justify-content:center;margin-top:12px}

/* acessos */
.acessos{display:flex;flex-direction:column}
.acesso{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid var(--line-soft)}
.acesso .ini{width:32px;height:32px;border-radius:50%;background:var(--surface-2);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;font-size:12.5px;color:var(--c-a);flex:none}
.acesso .quem2{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;font-size:13.5px}
.acesso .quem2 small{font-size:11.5px;color:var(--ink-3)}
.link-convite{display:flex;gap:8px;align-items:center;margin-top:8px;padding:10px 12px;border-radius:10px;background:var(--bg);border:1px solid var(--good)}
.link-convite code{flex:1;min-width:0;font:500 12px var(--mono);color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* usuários */
.linha-form{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.linha-form .field{flex:1 1 200px}
.tab-usuarios td,.tab-usuarios th{text-align:left;white-space:normal}
.tab-usuarios td:last-child{text-align:right;white-space:nowrap}
.tag{display:inline-block;font-size:10.5px;letter-spacing:.07em;text-transform:uppercase;font-weight:600;padding:3px 7px;border-radius:5px;border:1px solid var(--line);color:var(--ink-2)}
.tag.admin{color:var(--c-a);border-color:var(--accent)}
.auth-brand .mark-fallback{width:34px;height:34px;flex:none;display:block;color:var(--ink)}

/* ---------- marca da agência (pasta marca/) ---------- */
.marca-ad{display:inline-flex;flex:none;width:34px;height:34px;position:relative}
.marca-ad img{width:100%;height:100%;object-fit:contain;display:block}
.marca-ad .marca-clara{display:none}
:root[data-theme="light"] .marca-ad .marca-escura,:root[data-theme="light"] .logo-flutua .marca-escura{display:none}
:root[data-theme="light"] .marca-ad .marca-clara,:root[data-theme="light"] .logo-flutua .marca-clara{display:block}

/* logo grande flutuando na tela de login */
.logo-flutua{position:relative;width:220px;height:250px;display:flex;flex-direction:column;align-items:center;margin:4px 0 18px}
.logo-flutua img{width:200px;height:200px;object-fit:contain;position:relative;z-index:1;
  filter:drop-shadow(0 18px 30px color-mix(in srgb,var(--accent) 38%,transparent));animation:flutua 5.5s ease-in-out infinite}
.logo-flutua .marca-clara{display:none}
.logo-sombra{position:absolute;bottom:6px;left:50%;width:120px;height:16px;margin-left:-60px;border-radius:50%;
  background:radial-gradient(closest-side,color-mix(in srgb,var(--accent) 50%,transparent),transparent);animation:sombra 5.5s ease-in-out infinite}
@keyframes flutua{0%,100%{transform:translateY(0) rotate(-1.5deg)}50%{transform:translateY(-16px) rotate(1.5deg)}}
@keyframes sombra{0%,100%{transform:scale(1);opacity:.9}50%{transform:scale(.72);opacity:.45}}
@media (max-width:760px){.logo-flutua{width:150px;height:175px}.logo-flutua img{width:136px;height:136px}}
@media (prefers-reduced-motion:reduce){.logo-flutua img,.logo-sombra{animation:none}}
.marca-texto{align-items:center;justify-content:center;border-radius:9px;background:var(--accent);color:#fff;font-weight:700;font-size:16px}

/* planilhas extras no cadastro */
.fonte-extra{border-left:3px solid var(--accent)}
.fonte-extra .secao-cab strong{font-size:13px}
.fonte-extra .linha input{flex:1;min-width:0}