/* ============================================================
 * Inovare Sorrisos — Controle de Estoque
 * Para trocar as cores da marca, altere só as variáveis abaixo.
 * ============================================================ */
:root{
  --prim:#0e9aa7;          /* cor principal (turquesa) */
  --prim-esc:#0a7783;
  --prim-claro:#e3f6f7;
  --header-1:#0a6470;      /* degradê do topo */
  --header-2:#0e9aa7;
  --bg:#f1f7f8;--card:#fff;--txt:#14343a;--muted:#5f7b81;--borda:#dbe8ea;
  --ok:#1f9d6b;--aviso:#d68a14;--erro:#d6453d;
  --radius:14px;--sombra:0 1px 2px rgba(16,52,58,.06),0 4px 14px rgba(16,52,58,.06);
}
*{box-sizing:border-box}
html{font-size:16px}
body{margin:0;font-family:"Segoe UI",system-ui,-apple-system,Roboto,sans-serif;background:var(--bg);color:var(--txt);line-height:1.45}
h1{font-size:1.55rem;margin:.2rem 0 1rem;letter-spacing:-.01em}
h2{font-size:1.1rem;margin:1.5rem 0 .7rem;letter-spacing:-.01em}
a{color:var(--prim-esc);text-decoration:none}
a:hover{text-decoration:underline}
code{background:#e8f1f2;padding:1px 6px;border-radius:5px;font-size:.9em}
.muted{color:var(--muted)}

/* ---------- topo ---------- */
.topo{display:flex;align-items:center;gap:.8rem 1rem;flex-wrap:wrap;background:linear-gradient(90deg,var(--header-1),var(--header-2));color:var(--on-barra,#fff);padding:.55rem 1.2rem;position:sticky;top:0;z-index:20;box-shadow:0 2px 10px color-mix(in srgb,var(--prim) 30%,transparent)}
.topo a{color:var(--on-barra,#fff)}
.marca{display:flex;align-items:center;gap:.65rem;white-space:nowrap}
.marca:hover{text-decoration:none}
.logo{display:grid;place-items:center;width:38px;height:38px;border-radius:11px;background:#fff;color:var(--prim);box-shadow:0 2px 6px rgba(0,0,0,.15)}
.logo svg{width:24px;height:24px}
.marca-txt{display:flex;flex-direction:column;line-height:1.1}
.marca-txt strong{font-size:1.05rem;letter-spacing:.01em}
.marca-txt small{font-size:.72rem;opacity:.85;letter-spacing:.06em;text-transform:uppercase}
.menu{display:flex;gap:.1rem;flex:1;min-width:0;flex-wrap:wrap}
.menu a{padding:.4rem .6rem;border-radius:99px;font-size:.88rem;font-weight:600;color:color-mix(in srgb,var(--on-barra,#fff) 88%,transparent);white-space:nowrap}
.menu a:hover{background:color-mix(in srgb,var(--on-barra,#fff) 16%,transparent);text-decoration:none;color:var(--on-barra,#fff)}
.menu a.ativo{background:var(--on-barra,#fff);color:var(--barra,var(--prim-esc))}
.usuario{display:flex;gap:.6rem;align-items:center;font-size:.9rem;white-space:nowrap}
.usuario a:first-child{font-weight:600}
.usuario .sair{background:color-mix(in srgb,var(--on-barra,#fff) 16%,transparent);padding:.3rem .75rem;border-radius:99px;font-size:.83rem;font-weight:600}
.usuario .sair:hover{background:color-mix(in srgb,var(--on-barra,#fff) 28%,transparent);text-decoration:none}
.tag{font-size:.66rem;padding:2px 8px;border-radius:99px;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.tag-dono{background:#ffe08a;color:#5a3b00}
.tag-func{background:#c9f3e2;color:#0b5a3d}
.conteudo{max-width:1200px;margin:0 auto;padding:1.4rem 1.1rem 3rem}
.rodape{text-align:center;color:var(--muted);font-size:.8rem;padding:1.2rem}

/* ---------- cartões, grades ---------- */
.card{background:var(--card);border:1px solid var(--borda);border-radius:var(--radius);padding:1.1rem 1.3rem;margin-bottom:1rem;box-shadow:var(--sombra)}
.card.estreito{max-width:480px}
.grade{display:grid;gap:1rem}
.grade.c4{grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr))}
.grade.c2{grid-template-columns:repeat(auto-fit,minmax(min(340px,100%),1fr))}
.grade>*{min-width:0}
.alert{padding:.75rem 1rem;border-radius:10px;margin-bottom:1rem;border:1px solid}
.alert.ok{background:#e9f8f1;border-color:#b5e6d0;color:#0b5a3d}
.alert.erro{background:#fdeceb;border-color:#f5c4c0;color:#992a23}
.alert.aviso{background:#fff6e0;border-color:#f1d79a;color:#7a5200}

/* ---------- formulários ---------- */
label{display:block;font-size:.88rem;font-weight:600;margin:0 0 .8rem;color:#264a51}
input[type=text],input[type=password],input[type=number],input[type=search],input[type=date],input[type=file],select,textarea{
  display:block;width:100%;margin-top:.25rem;padding:.6rem .75rem;border:1px solid #c5d8db;border-radius:10px;font:inherit;background:#fff;color:var(--txt)}
input:focus,select:focus,textarea:focus{outline:3px solid color-mix(in srgb,var(--prim) 28%,#fff);border-color:var(--prim)}
.linha{display:flex;gap:.8rem;flex-wrap:wrap}
.linha>*{flex:1 1 160px}

/* ---------- botões ---------- */
.btn{display:inline-block;padding:.55rem 1.05rem;border-radius:10px;border:1px solid #c5d8db;background:#fff;color:var(--txt);font:inherit;font-weight:600;cursor:pointer;text-decoration:none;transition:background .12s,box-shadow .12s}
.btn:hover{background:var(--prim-claro);text-decoration:none}
.btn.primario{background:var(--prim);border-color:var(--prim);color:#fff;box-shadow:0 2px 6px color-mix(in srgb,var(--prim) 35%,transparent)}
.btn.primario:hover{background:var(--prim-esc)}
.btn.verde{background:var(--ok);border-color:var(--ok);color:#fff}
.btn.verde:hover{background:#17855a}
.btn.perigo{background:#fff;border-color:#f3c3bf;color:var(--erro)}
.btn.perigo:hover{background:#fdeceb}
.btn.grande{padding:.85rem 1.3rem;font-size:1.05rem;width:100%}
.btn.pequeno{padding:.3rem .65rem;font-size:.82rem;border-radius:8px}
.acoes{display:flex;gap:.5rem;flex-wrap:wrap;align-items:center}
.tabs{display:flex;gap:.4rem;flex-wrap:wrap;margin-bottom:1rem}
.tabs a{padding:.45rem .95rem;border-radius:99px;border:1px solid var(--borda);background:#fff;color:var(--txt);font-size:.9rem;font-weight:600}
.tabs a:hover{text-decoration:none;background:var(--prim-claro)}
.tabs a.ativo{background:var(--prim);color:#fff;border-color:var(--prim)}

/* ---------- tabelas ---------- */
.tabela-wrap{overflow-x:auto;background:var(--card);border:1px solid var(--borda);border-radius:var(--radius);box-shadow:var(--sombra)}
table{width:100%;border-collapse:collapse;font-size:.92rem}
th,td{padding:.65rem .85rem;text-align:left;border-bottom:1px solid var(--borda);vertical-align:middle}
th{background:#f4f9fa;font-size:.76rem;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);white-space:nowrap}
tr:last-child td{border-bottom:none}
tbody tr:hover td,table tr:hover td{background:#fafdfd}
td.num,th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
tr.grupo td,tr.grupo:hover td{background:#eaf5f6;font-weight:700}
.badge{display:inline-block;font-size:.72rem;font-weight:700;padding:2px 10px;border-radius:99px;color:#fff;white-space:nowrap}

/* Etiqueta de saldo: largura uniforme, texto centralizado, sem quebra de linha */
.st{display:inline-block;min-width:5.2rem;text-align:center;white-space:nowrap;line-height:1.5;font-size:.78rem;font-weight:700;padding:3px 12px;border-radius:99px}
.st.zerado{background:#fde4e2;color:#9b2a23}
.st.baixo{background:#fdf0cf;color:#8a5a00}
.st.ok{background:#d9f5e8;color:#0b5a3d}
.st.acima{background:#dcecfb;color:#1b4f8a}
td.num .st{min-width:5.2rem}

.barra{height:7px;background:#e1ecee;border-radius:99px;overflow:hidden;min-width:70px}
.barra>i{display:block;height:100%;background:var(--ok);border-radius:99px}
.barra.baixo>i{background:var(--aviso)}
.barra.zerado>i{background:var(--erro)}
.barra.acima>i{background:#3b82c4}
.filtros{display:flex;gap:.6rem;flex-wrap:wrap;margin-bottom:1rem}
.filtros input,.filtros select{margin-top:0}
.filtros>*{flex:1 1 180px}
.filtros .btn{flex:0 0 auto}
.vazio{padding:2rem;text-align:center;color:var(--muted)}

/* ---------- login ---------- */
.login-body{display:grid;place-items:center;min-height:100vh;background:radial-gradient(circle at 20% 15%,color-mix(in srgb,var(--prim) 60%,#fff) 0,transparent 45%),radial-gradient(circle at 85% 85%,var(--header-1) 0,transparent 50%),linear-gradient(135deg,var(--header-1),var(--prim))}
.login-card{background:#fff;border-radius:22px;padding:2.2rem 2rem 2rem;width:min(410px,92vw);box-shadow:0 24px 60px rgba(4,50,58,.35);text-align:center}
.login-card .logo{width:64px;height:64px;border-radius:18px;margin:0 auto .7rem;background:var(--prim-claro);box-shadow:none}
.login-card .logo svg{width:40px;height:40px}
.login-card h1{margin:.1rem 0 .1rem;font-size:1.5rem}
.login-card .sub{color:var(--muted);margin:0 0 1.3rem;font-size:.92rem;letter-spacing:.06em;text-transform:uppercase}
.login-card form{text-align:left}

/* ---------- painel inicial ---------- */
.hero{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;background:linear-gradient(120deg,#e3f6f7 0%,#fff 70%);border:1px solid var(--borda);border-radius:var(--radius);padding:1.3rem 1.5rem;margin-bottom:1rem;box-shadow:var(--sombra)}
.hero h1{margin:0 0 .15rem;font-size:1.6rem}
.hero p{margin:0;color:var(--muted)}
.hero .data{font-size:.85rem;color:var(--prim-esc);font-weight:600}
.aviso-repor{display:flex;align-items:center;gap:.8rem;padding:.85rem 1.1rem;border-radius:12px;margin-bottom:1.1rem;border:1px solid;color:inherit}
.aviso-repor:hover{text-decoration:none;filter:brightness(.98)}
.aviso-repor .ic{font-size:1.5rem;line-height:1}
.aviso-repor .go{margin-left:auto;font-weight:700;white-space:nowrap}
.aviso-repor>span:nth-child(2){min-width:0}
.aviso-repor.alerta{background:#fff6e0;border-color:#f1d79a;color:#6b4700}
.aviso-repor.tudo-ok{background:#e9f8f1;border-color:#b5e6d0;color:#0b5a3d}
.secao{display:flex;align-items:baseline;justify-content:space-between;margin:1.5rem 0 .7rem}
.secao h2{margin:0}
.secao a{font-size:.88rem;font-weight:600}
.atalhos{display:grid;gap:.85rem;grid-template-columns:repeat(var(--cols,4),1fr)}
.atalho{display:flex;align-items:center;gap:.85rem;background:var(--card);border:1px solid var(--borda);border-radius:var(--radius);padding:1rem 1.1rem;color:var(--txt);box-shadow:var(--sombra);transition:transform .12s,box-shadow .12s,border-color .12s}
.atalho:hover{text-decoration:none;transform:translateY(-2px);border-color:var(--prim);box-shadow:0 8px 20px color-mix(in srgb,var(--prim) 20%,transparent)}
.atalho .ico{flex:0 0 46px;height:46px;border-radius:13px;display:grid;place-items:center;font-size:1.45rem;background:var(--c,#e3f6f7)}
.atalho strong{display:block;font-size:1rem;line-height:1.25}
.atalho small{display:block;color:var(--muted);font-size:.82rem;line-height:1.3}
.atalho.destaque{background:linear-gradient(135deg,var(--header-1),var(--header-2));color:#fff;border-color:transparent}
.atalho.destaque small{color:rgba(255,255,255,.85)}
.atalho.destaque .ico{background:rgba(255,255,255,.2)}
.kpis{display:grid;gap:.85rem;grid-template-columns:repeat(auto-fit,minmax(210px,1fr))}
.kpi{display:flex;align-items:center;gap:.9rem;background:var(--card);border:1px solid var(--borda);border-radius:var(--radius);padding:1rem 1.2rem;box-shadow:var(--sombra)}
.kpi .ico{flex:0 0 46px;height:46px;border-radius:13px;display:grid;place-items:center;font-size:1.35rem;background:var(--prim-claro)}
.kpi .v{font-size:1.7rem;font-weight:800;line-height:1.1;letter-spacing:-.02em}
.kpi .r{color:var(--muted);font-size:.84rem}
.kpi.alerta .ico{background:#fdf0cf}.kpi.alerta .v{color:#8a5a00}
.kpi.perigo .ico{background:#fde4e2}.kpi.perigo .v{color:#9b2a23}
.kpi.ok .ico{background:#d9f5e8}
.cats{display:grid;gap:.85rem;grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.cat-card{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--borda);border-top:4px solid var(--c);border-radius:var(--radius);padding:1rem 1.15rem;color:var(--txt);box-shadow:var(--sombra);transition:transform .12s,box-shadow .12s}
.cat-card:hover{text-decoration:none;transform:translateY(-2px);box-shadow:0 8px 20px rgba(16,52,58,.12)}
.cat-card .topo-c{display:flex;align-items:center;gap:.6rem;margin-bottom:.5rem}
.cat-card .ico{font-size:1.5rem;line-height:1}
.cat-card .nome{font-weight:700;line-height:1.2}
.cat-card .desc{color:var(--muted);font-size:.8rem}
.cat-card .n{margin-top:auto;font-size:1.8rem;font-weight:800;letter-spacing:-.02em}
.cat-card .n small{font-size:.85rem;font-weight:500;color:var(--muted);letter-spacing:0}
.cat-card .barra{margin:.45rem 0 .4rem;background:#e8f0f1}
.cat-card .barra>i{background:var(--c)}
.cat-card .rod{font-size:.82rem;color:var(--muted)}
.cat-card .rod b{color:#8a5a00}
.cat-card .rod.ok b{color:var(--ok)}
.feed{list-style:none;margin:0;padding:0}
.feed li{display:flex;align-items:center;gap:.75rem;padding:.7rem 1rem;border-bottom:1px solid var(--borda)}
.feed li:last-child{border-bottom:none}
.feed .seta{flex:0 0 32px;height:32px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:.95rem}
.feed .seta.entrada{background:#d9f5e8;color:#0b5a3d}
.feed .seta.saida{background:#fde4e2;color:#9b2a23}
.feed .seta.ajuste{background:#dcecfb;color:#1b4f8a}
.feed .t{flex:1;min-width:0}
.feed .t strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.feed .t small{color:var(--muted)}
.feed .q{font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}
.passos{counter-reset:p;list-style:none;margin:0;padding:0;display:grid;gap:.7rem}
.passos li{counter-increment:p;display:flex;gap:.8rem;align-items:flex-start}
.passos li::before{content:counter(p);flex:0 0 28px;height:28px;border-radius:50%;background:var(--prim);color:#fff;font-weight:700;display:grid;place-items:center;font-size:.85rem}

/* ---------- leitor de código de barras ---------- */
.scan-box{border:2px dashed #7fd0d8;background:#eaf8f9;border-radius:var(--radius);padding:1rem;margin-bottom:1rem}
.scan-box input.scan{font-size:1.3rem;padding:.8rem;text-align:center;letter-spacing:.05em}
#leitor{max-width:420px;margin:.8rem auto 0;border-radius:12px;overflow:hidden;display:none}
#leitor video{width:100%;border-radius:12px}
.prod-card{display:none;border-left:5px solid var(--prim)}
.prod-card .nome{font-size:1.2rem;font-weight:700}
.prod-card .saldo{font-size:2rem;font-weight:800}
.seg{display:flex;gap:.5rem;margin-bottom:.8rem}
.seg label{flex:1;margin:0;cursor:pointer}
.seg input{position:absolute;opacity:0}
.seg span{display:block;text-align:center;padding:.7rem;border:2px solid var(--borda);border-radius:12px;font-weight:700;background:#fff}
.seg input:checked+span.ent{background:#d9f5e8;border-color:var(--ok);color:#0b5a3d}
.seg input:checked+span.sai{background:#fde4e2;border-color:var(--erro);color:#9b2a23}
.seg input:checked+span.aju{background:#dcecfb;border-color:#3b82c4;color:#1b4f8a}

/* lista de resultados da busca em Movimentar */
.resultados{margin-top:.7rem;background:#fff;border:1px solid var(--borda);border-radius:12px;box-shadow:var(--sombra);max-height:340px;overflow-y:auto;text-align:left}
.res-topo{padding:.5rem .9rem;font-size:.8rem;font-weight:600;color:var(--muted);background:#f4f9fa;border-bottom:1px solid var(--borda);position:sticky;top:0}
.res-item{display:flex;align-items:center;justify-content:space-between;gap:.8rem;width:100%;padding:.65rem .9rem;border:0;border-bottom:1px solid var(--borda);background:#fff;font:inherit;color:var(--txt);text-align:left;cursor:pointer}
.res-item:last-child{border-bottom:0}
.res-item:hover,.res-item.ativo{background:var(--prim-claro)}
.res-info{display:flex;flex-direction:column;gap:.15rem;min-width:0}
.res-info strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.res-info small{color:var(--muted);font-size:.78rem}

@media print{
  .topo,.lateral,.h-cab,.rodape,.filtros,.acoes,.tabs,.no-print{display:none!important}
  body{background:#fff}.card,.tabela-wrap{border:none;box-shadow:none}
}
@media (max-width:980px){
  .atalhos{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:860px){
  .topo{gap:.5rem .8rem;padding:.5rem .8rem}
  .menu{order:3;flex:1 0 100%;overflow-x:auto;padding-bottom:.2rem;scrollbar-width:none}
  .menu::-webkit-scrollbar{display:none}
  .usuario{margin-left:auto}
}
@media (max-width:600px){
  h1,.hero h1{font-size:1.3rem}
  .conteudo{padding:1rem .8rem 2.5rem}
  .marca-txt small{display:none}
  .hero{padding:1rem}
  .aviso-repor{flex-wrap:wrap}
  .aviso-repor .go{margin-left:0;flex:1 0 100%}
  .atalho{flex-direction:column;align-items:flex-start;gap:.5rem;padding:.9rem}
  .grade.c2{grid-template-columns:1fr}
}

/* Tela do local */
.local-hero{display:flex;align-items:center;gap:1rem;padding:1.1rem 1.3rem;margin-bottom:1rem;border-radius:var(--radius);color:#fff;background:linear-gradient(135deg,var(--cor-local),color-mix(in srgb,var(--cor-local) 70%,#000));box-shadow:var(--sombra)}
.local-hero .ico{flex:0 0 56px;height:56px;border-radius:16px;background:rgba(255,255,255,.2);display:grid;place-items:center;font-size:1.9rem}
.local-hero h1{margin:0;color:#fff}
.local-hero p{margin:.15rem 0 0;opacity:.92}
.baixa-form{display:flex;gap:.4rem;align-items:center;margin:0;flex-wrap:nowrap}
.baixa-form .qtd-in{width:5.5rem;margin:0;text-align:center}
.baixa-form .btn{white-space:nowrap}
#tab-local tr.destaque td{background:var(--prim-claro)}

/* Vencimento */
.cel-val{white-space:nowrap}
.cel-val .sem-data{display:inline-flex;gap:.3rem;align-items:center;margin:.25rem 0 0 .4rem;font-size:.82rem;font-weight:600;cursor:pointer}
.cel-val .sem-data input{width:auto;margin:0}
.cel-val.pendente{background:#fde4e2;box-shadow:inset 3px 0 0 #c0392b}
.venc{display:flex;flex-direction:column;gap:.35rem}
.venc-item{display:flex;align-items:center;gap:.7rem;padding:.55rem .8rem;border-radius:10px;background:#fdf0cf;color:#6b4500}
.venc-item.vencido{background:#fde4e2;color:#8c241d}
.venc-item .q{margin-left:auto;font-weight:700;white-space:nowrap}
.venc-item a{color:inherit;font-weight:700}

/* Gráfico de preços */
.graf{width:100%;height:auto;display:block}
.graf .gl{stroke:var(--borda);stroke-width:1}
.graf .gt{fill:var(--muted);font-size:11px;font-family:inherit}
.graf .gline{fill:none;stroke:var(--prim);stroke-width:2.5;stroke-linejoin:round;stroke-linecap:round}
.graf .gp{fill:#fff;stroke:var(--prim);stroke-width:2.5}
.graf .gp:hover{fill:var(--prim)}

/* ============================================================
 * TELA INICIAL (painel) — menu lateral + cards arredondados
 * Cores vêm de: Personalizar (--barra, --icones, --busca, --detalhe)
 * ============================================================ */
body.shell{
  --lat:clamp(230px,18vw,290px);--r:14px;
  background-color:#eaf0f8;
  background-image:linear-gradient(90deg,rgba(246,249,253,.58),rgba(246,249,253,.9)),var(--fundo-img,none);
  background-size:cover;background-position:center;background-attachment:fixed;
}
.app{display:grid;grid-template-columns:var(--lat) minmax(0,1fr);min-height:100vh}

/* barra lateral */
.lateral{background:var(--barra);color:var(--on-barra);padding:20px 16px 22px;position:sticky;top:0;height:100vh;overflow:auto;display:flex;flex-direction:column;gap:16px;box-shadow:2px 0 18px rgba(0,0,0,.12)}
.hamb{align-self:flex-start;width:44px;height:38px;border:0;background:transparent;cursor:pointer;display:flex;flex-direction:column;justify-content:center;gap:6px;padding:0 6px;border-radius:10px}
.hamb span{display:block;height:3px;border-radius:3px;background:var(--on-barra)}
.hamb:hover{background:color-mix(in srgb,var(--on-barra) 14%,transparent)}
.h-pill{display:block;background:rgba(255,255,255,.94);color:var(--barra);font-weight:800;letter-spacing:.05em;text-transform:uppercase;border-radius:10px;padding:7px 14px;text-align:center;font-size:.95rem}
.h-pill.claro{display:inline-block;text-align:left;margin-bottom:12px;box-shadow:0 1px 4px rgba(20,40,70,.1)}
.kpis-l{display:flex;flex-direction:column;gap:14px;flex:1}
.kpi-c{flex:1 1 0;min-height:88px;max-height:150px;background:#fff;border-radius:var(--r);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:10px 8px;color:inherit;box-shadow:0 2px 8px rgba(0,0,0,.12);transition:transform .12s}
.kpi-c:hover{text-decoration:none;transform:translateY(-2px)}
.kpi-c b{font-size:2.1rem;line-height:1.1;font-weight:800;color:var(--detalhe);letter-spacing:.01em}
.kpi-c span{margin-top:.2rem;font-weight:700;color:color-mix(in srgb,var(--barra) 70%,#000);font-size:.95rem}

/* área principal */
.principal{padding:18px clamp(16px,2.4vw,34px) 24px;min-width:0;display:flex;flex-direction:column;gap:22px}
.h-cab{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;min-height:96px}
.h-titulo{grid-column:2;margin:0;text-transform:uppercase;letter-spacing:.04em;color:var(--barra);font-size:clamp(1.25rem,2.2vw,1.9rem);text-align:center;font-weight:800}
.h-logo{grid-column:3;justify-self:end}
.h-logo img{display:block;max-height:104px;max-width:min(280px,32vw);object-fit:contain}
.h-marca{display:inline-flex;align-items:center;gap:.5rem;color:var(--barra)}
.h-marca svg{width:38px;height:38px}
.h-marca b{font-size:1.3rem}
.h-busca{display:flex;align-items:center;background:var(--busca);color:var(--on-busca);border-radius:var(--r);padding:4px 6px 4px 18px;max-width:680px;width:100%;box-shadow:inset 0 0 0 1px rgba(0,0,0,.06)}
.h-busca input{flex:1;border:0;background:transparent;margin:0;padding:.7rem 0;color:inherit;font:inherit;min-width:0;outline:none}
.h-busca input::placeholder{color:color-mix(in srgb,var(--on-busca) 60%,transparent)}
.h-busca button{border:0;background:var(--icones);color:var(--on-icones);width:42px;height:38px;border-radius:10px;display:grid;place-items:center;cursor:pointer}
.h-busca:focus-within{outline:3px solid color-mix(in srgb,var(--prim) 30%,#fff)}

.h-avisos{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(320px,100%),1fr));gap:14px}
.h-aviso{display:flex;align-items:center;gap:.8rem;padding:.8rem 1.1rem;border-radius:var(--r);background:rgba(255,255,255,.94);border-left:6px solid;color:var(--txt);box-shadow:0 1px 6px rgba(20,40,70,.08)}
a.h-aviso:hover{text-decoration:none;box-shadow:0 4px 14px rgba(20,40,70,.14)}
.h-aviso.amarelo{border-color:#d68a14}.h-aviso.vermelho{border-color:#c0392b}.h-aviso.verde{border-color:#1f9d6b}
.h-aviso .ic{font-size:1.5rem;line-height:1}
.h-aviso b{display:block}
.h-aviso small{color:var(--muted)}
.h-aviso em{margin-left:auto;font-style:normal;font-weight:700;white-space:nowrap;color:var(--barra)}

.h-tiles{display:grid;grid-template-columns:repeat(var(--cols,3),minmax(0,1fr));gap:16px}
.h-tile{background:var(--icones);color:var(--on-icones);border-radius:var(--r);min-height:92px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:12px 10px;box-shadow:0 3px 10px rgba(20,40,70,.18);transition:transform .12s,box-shadow .12s}
.h-tile:hover{text-decoration:none;transform:translateY(-3px);box-shadow:0 8px 18px rgba(20,40,70,.26)}
.h-tile strong{text-transform:uppercase;letter-spacing:.12em;font-size:1.02rem;font-weight:800}
.h-tile small{margin-top:.3rem;color:var(--detalhe);font-weight:700;letter-spacing:.1em;font-size:.72rem}

.h-cats{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(230px,100%),1fr));gap:16px}
.h-cat{background:var(--icones);color:var(--on-icones);border-radius:var(--r);padding:16px 16px 14px;display:flex;flex-direction:column;min-height:218px;box-shadow:0 3px 10px rgba(20,40,70,.18);transition:transform .12s,box-shadow .12s}
.h-cat:hover{text-decoration:none;transform:translateY(-3px);box-shadow:0 8px 18px rgba(20,40,70,.26)}
.h-cat .nome{font-weight:800;letter-spacing:.07em;font-size:1.05rem;line-height:1.25;display:flex;gap:.5rem;align-items:flex-start}
.h-cat .nome i{flex:0 0 10px;height:10px;border-radius:50%;margin-top:.4rem}
.h-cat .desc{color:var(--detalhe);font-weight:700;font-size:.72rem;letter-spacing:.1em;margin:.25rem 0 0 1.05rem;min-height:1.1rem}
.h-cat .n{margin-top:auto;font-size:1.3rem;font-weight:700;letter-spacing:.06em}
.h-cat .n b{font-size:2.8rem;line-height:1;font-weight:800;margin-right:.15rem}
.h-cat .barra{display:block;height:7px;border-radius:9px;background:color-mix(in srgb,var(--on-icones) 22%,transparent);margin:.7rem 0 .6rem;overflow:hidden}
.h-cat .barra u{display:block;height:100%;border-radius:9px;background:var(--on-icones);text-decoration:none}
.h-cat .rod{display:block;min-height:2.7em;font-size:.84rem;letter-spacing:.05em}
.h-cat .rod b{display:block;font-weight:800}
.h-cat .rod small{display:block;font-size:.8rem;font-weight:600;opacity:.9}

.h-painel{background:rgba(255,255,255,.94);border-radius:var(--r);padding:16px 18px 14px;box-shadow:0 2px 10px rgba(20,40,70,.1);min-width:0}
.h-painel .tabela-wrap{margin-bottom:.4rem}
.h-duplo{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(420px,100%),1fr));gap:16px;align-items:start}
.h-link{display:inline-block;margin-top:.5rem;font-weight:700;font-size:.9rem;color:var(--barra)}


@media (max-width:1100px){.h-tiles{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:860px){
  .app{grid-template-columns:1fr}
  .lateral{position:static;height:auto;overflow:visible;flex-direction:column;padding:14px 14px 16px;gap:12px}
  .kpis-l{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));flex:none}
  .kpi-c{max-height:none;min-height:84px}
  .h-cab{grid-template-columns:1fr;justify-items:center;min-height:0;gap:8px}
  .h-titulo,.h-logo{grid-column:1;justify-self:center}
  .h-logo img{max-height:70px}
}
@media (max-width:560px){.h-tiles{grid-template-columns:1fr}}

/* logo na barra / login */
.logo.logo-img{width:auto;height:42px;padding:3px 10px;border-radius:11px}
.logo.logo-img img{display:block;height:100%;width:auto;max-width:190px;object-fit:contain}
.login-logo{display:block;max-width:230px;max-height:96px;margin:0 auto .8rem;object-fit:contain}

/* tela Personalizar */
.pers-cab{display:flex;align-items:center;gap:.9rem;flex-wrap:wrap;margin-bottom:1rem}
.pers-ico{width:44px;height:44px;border-radius:12px;background:var(--prim-claro);display:grid;place-items:center;font-size:1.4rem}
.pers-campos{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(190px,100%),1fr));gap:1rem 1.1rem;border:1px solid var(--borda);border-radius:var(--r);padding:1rem}
.pers-campo>label{display:block;font-size:.8rem;font-weight:600;color:var(--muted);margin-bottom:.35rem}
.pers-campo input[type=text]{margin:0}
.cor-par{display:flex;gap:.5rem;align-items:center}
.cor-par input[type=color]{width:46px;height:42px;padding:3px;border:1px solid #c5d8db;border-radius:10px;background:#fff;cursor:pointer;flex:none}
.cor-par input[type=text]{font-family:ui-monospace,Menlo,Consolas,monospace;text-transform:uppercase}
.img-par{display:flex;gap:.5rem;align-items:center}
.thumb{width:62px;height:42px;border-radius:8px;border:1px solid var(--borda);background:#f4f7f9 center/cover no-repeat;display:grid;place-items:center;color:var(--muted);flex:none}
.thumb-logo{background-size:contain;background-color:#fff}
.img-par .x{border:0;background:transparent;color:var(--muted);font-size:1rem;cursor:pointer;width:30px;height:30px;border-radius:8px}
.img-par .x:hover{background:#fdeceb;color:var(--erro)}
.previa{position:relative;width:100%;overflow:hidden;border-radius:var(--r);border:1px solid var(--borda);box-shadow:var(--sombra);background:#fff}
.previa iframe{position:absolute;top:0;left:0;border:0;transform-origin:0 0;pointer-events:none}

[hidden]{display:none!important}
.kpi-c b.money{font-size:1.65rem;white-space:nowrap}


/* ============================================================
 * BARRA LATERAL EM TODAS AS TELAS (menu + resumo)
 * ============================================================ */
.lateral{gap:12px;padding:16px 14px 18px}
.lat-topo{display:flex;align-items:center;gap:.5rem}
.lat-nome{font-weight:800;color:var(--on-barra);letter-spacing:.02em;font-size:1.05rem;line-height:1.15}
.lat-nome:hover{text-decoration:none}
.lat-nav{display:flex;flex-direction:column;gap:3px}
.lateral[data-nav=fechada] .lat-nav{display:none}
.lat-nav a{color:var(--on-barra);padding:.5rem .85rem;border-radius:10px;font-weight:600;font-size:.95rem}
.lat-nav a:hover{text-decoration:none;background:color-mix(in srgb,var(--on-barra) 14%,transparent)}
.lat-nav a.ativo{background:var(--on-barra);color:var(--barra)}
.lat-resumo{display:flex;flex-direction:column;gap:10px}
.kpis-l{gap:10px;flex:none}
.kpi-c{flex:none;min-height:74px;max-height:none;padding:8px}
.kpi-c b{font-size:1.6rem}
.kpi-c b.money{font-size:1.3rem}
.kpi-c span{font-size:.82rem;margin-top:.1rem}
.lat-user{margin-top:auto;border-top:1px solid color-mix(in srgb,var(--on-barra) 25%,transparent);padding-top:12px;display:flex;align-items:center;gap:.5rem;justify-content:space-between}
.lat-user a{color:var(--on-barra)}
.lat-user a:first-child{display:flex;flex-direction:column;min-width:0;line-height:1.2}
.lat-user a:first-child:hover{text-decoration:none}
.lat-user strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.lat-user small{opacity:.8;font-size:.7rem;text-transform:uppercase;letter-spacing:.05em}
.lat-user .sair{background:color-mix(in srgb,var(--on-barra) 16%,transparent);padding:.3rem .8rem;border-radius:99px;font-size:.83rem;font-weight:600}
.lat-user .sair:hover{text-decoration:none;background:color-mix(in srgb,var(--on-barra) 28%,transparent)}

.shell .principal{gap:16px}
.shell .conteudo{max-width:1240px;width:100%;margin:0 auto;padding:0}
.shell .conteudo.larga{max-width:none;display:flex;flex-direction:column;gap:22px}
.shell .rodape{margin-top:auto;padding:.4rem}
.shell:not(.home) .h-cab{min-height:64px}
.shell:not(.home) .h-titulo{font-size:clamp(1.05rem,1.6vw,1.35rem)}
.shell:not(.home) .h-logo img{max-height:56px}
.shell .tabela-wrap,.shell .card{background-color:#fff}
.shell .conteudo>h1,.shell .conteudo>.acoes>h1{color:var(--barra)}

@media (max-width:860px){
  .lateral:not([data-nav]) .lat-nav{display:none}
  .lateral[data-nav=aberta] .lat-nav{display:flex}
  body:not(.home) .lat-resumo{display:none}
  .lat-user{margin-top:0}
  .h-cab{min-height:0}
}

/* compacta a barra lateral para caber em telas de ~900px de altura sem rolar */
.lateral{gap:10px;padding:14px 14px 14px}
.lat-nav{gap:2px}
.lat-nav a{padding:.36rem .85rem;font-size:.92rem}
.lat-resumo{gap:8px}
.kpis-l{gap:8px}
.kpi-c{min-height:62px;padding:6px 8px}
.kpi-c b{font-size:1.45rem}
.kpi-c b.money{font-size:1.2rem}
.kpi-c span{font-size:.78rem}
.h-pill{padding:5px 14px;font-size:.88rem}

/* Primeiro acesso: só a tela de nova senha */
body.solo{display:block}
.solo-wrap{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:28px 18px}
.solo-cab{display:flex;align-items:center;gap:.7rem;color:var(--barra);margin-bottom:22px}
.solo-cab img{max-height:84px;max-width:260px;object-fit:contain}
.solo-cab .logo{background:var(--prim-claro);color:var(--prim);width:46px;height:46px}
.solo-cab strong{font-size:1.4rem}
.solo-conteudo{width:100%;max-width:460px;flex:1}
.solo-conteudo h1{color:var(--barra);margin-top:0}
.solo-rod{padding:18px 0 4px}
.solo-rod a{font-weight:600;color:var(--muted)}

/* Barra lateral igual em todas as telas; ☰ recolhe para uma faixa fina (o botão nunca some) */
@media (min-width:861px){
  body.shell[data-nav=fechada]{--lat:68px}
  body.shell[data-nav=fechada] .lateral{padding-left:10px;padding-right:10px;align-items:center}
  .lateral[data-nav=fechada] .lat-nome,
  .lateral[data-nav=fechada] .lat-resumo,
  .lateral[data-nav=fechada] .lat-user{display:none}
}

/* Resumo no conteúdo do painel (a barra lateral é igual em todas as telas) */
.h-resumo{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin:0 0 18px}
.h-resumo .kpi-c{min-height:92px;max-height:none;background:var(--barra);box-shadow:0 2px 8px rgba(0,0,0,.14)}
.h-resumo .kpi-c b{font-size:2rem;color:var(--detalhe)}
.h-resumo .kpi-c b.money{font-size:1.6rem}
.h-resumo .kpi-c span{color:var(--on-barra);font-size:.9rem}
@media (max-width:560px){.h-resumo{grid-template-columns:repeat(2,minmax(0,1fr))}}