:root{
  --azul:#2F5597; --azul-2:#3D67B0; --azul-claro:#DEEBF7; --azul-borda:#BDD7EE;
  --fundo:#F3F5F9; --card:#FFFFFF; --texto:#1C2433; --suave:#5B6474; --linha:#E2E7EF;
  --verm:#C62828; --verde:#2E7D32; --amarelo:#B7791F;
  --raio:10px; --sombra:0 1px 2px rgba(16,24,40,.06),0 1px 3px rgba(16,24,40,.08);
  font-family: "Segoe UI", system-ui, -apple-system, Roboto, "Helvetica Neue", Arial, sans-serif;
  color-scheme: light;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html,body{margin:0;overflow-x:hidden;background:var(--fundo);color:var(--texto);font-size:14px}
button,input,select,textarea{font:inherit;color:inherit}
.num{text-align:right;font-variant-numeric:tabular-nums}

/* ------------------------------------------------ topo */
.topo{position:sticky;top:0;z-index:20;background:var(--azul);color:#fff;display:flex;align-items:center;gap:20px;padding:0 20px;min-height:58px;box-shadow:0 2px 6px rgba(0,0,0,.15)}
.marca{display:flex;align-items:center;gap:10px;white-space:nowrap}
.marca .logo{width:34px;height:34px;border-radius:8px;background:#fff}
.marca strong{display:block;font-size:17px;letter-spacing:.2px}
.marca span{display:block;font-size:11px;opacity:.8}
.abas{display:flex;gap:2px;overflow-x:auto;margin-left:auto}
.abas button{background:none;border:0;color:#fff;opacity:.82;padding:19px 13px 17px;cursor:pointer;border-bottom:3px solid transparent;white-space:nowrap}
.abas button:hover{opacity:1}
.abas button.ativa{opacity:1;border-bottom-color:#fff;font-weight:600}
.menu-btn{display:none;margin-left:auto;background:none;border:0;color:#fff;font-size:24px;cursor:pointer}

main{max-width:1500px;margin:0 auto;padding:18px 20px 90px}
.aba{display:none}.aba.ativa{display:block}

/* ------------------------------------------------ cards e campos */
.card{background:var(--card);border:1px solid var(--linha);border-radius:var(--raio);box-shadow:var(--sombra);padding:16px 18px;margin-bottom:14px}
.card h2{font-size:13px;text-transform:uppercase;letter-spacing:.6px;color:var(--azul);margin:0 0 12px}
.card-tit{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.card-tit h2{margin:0}
.campos{display:grid;gap:10px 12px}
.c2{grid-template-columns:repeat(2,minmax(0,1fr))}
.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.c4{grid-template-columns:repeat(4,minmax(0,1fr))}
.span2{grid-column:span 2}.span4{grid-column:1/-1}
label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--suave);font-weight:500}
input,select,textarea{border:1px solid #CBD3DF;border-radius:7px;padding:8px 10px;background:#fff;font-size:14px;min-width:0;width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid var(--azul-borda);border-color:var(--azul)}
input[readonly]{background:#F6F8FB;color:var(--suave)}
input.destaque{font-weight:700;color:var(--azul);background:var(--azul-claro)}
textarea{resize:vertical}
label.check{flex-direction:row;align-items:center;gap:8px;margin-top:10px;font-size:13px;color:var(--texto)}
label.check input{width:auto}
.dica{font-size:12px;color:var(--suave);margin:8px 0 0}
.sub{font-size:12px;color:var(--suave);margin:12px 0 6px;font-weight:600}
.duas{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.duas .card{margin-bottom:14px}

/* ------------------------------------------------ botões */
.btn{border:1px solid #C3CCDA;background:#fff;border-radius:8px;padding:9px 15px;cursor:pointer;font-weight:600;color:var(--texto);transition:.12s}
.btn:hover{border-color:var(--azul);color:var(--azul)}
.btn.primario{background:var(--azul);border-color:var(--azul);color:#fff}
.btn.primario:hover{background:var(--azul-2)}
.btn.perigo{color:var(--verm);border-color:#E9B4B4}
.btn.pequeno{padding:6px 11px;font-size:12.5px}
.btn.largo{width:100%;padding:13px}
.btn:disabled{opacity:.55;cursor:wait}
.botoes{display:flex;gap:8px;flex-wrap:wrap}
.x{border:0;background:none;font-size:26px;line-height:1;cursor:pointer;color:var(--suave)}

/* ------------------------------------------------ barra de ações */
.barra-acoes{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.doc-id{display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.pill{background:var(--azul);color:#fff;padding:5px 12px;border-radius:99px;font-weight:700;font-size:13px;letter-spacing:.3px}
.pill.claro{background:var(--azul-claro);color:var(--azul)}
.pill.status{background:#EEF1F5;color:var(--suave);font-weight:600}
.aviso{background:#FFF8E1;border:1px solid #F3D98B;border-radius:8px;padding:9px 14px;margin-bottom:14px;display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;font-size:13px}

/* ------------------------------------------------ orçamento */
.grade-orc{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:16px;align-items:start}
.col-resumo{position:sticky;top:76px}
.resumo .linhas{display:grid;grid-template-columns:1fr auto;gap:6px 10px;margin:0}
.resumo dt{color:var(--suave)}.resumo dd{margin:0;text-align:right;font-variant-numeric:tabular-nums;font-weight:600}
.resumo .verm{color:var(--verm)}
.resumo .total{background:var(--azul);color:#fff;border-radius:8px;padding:12px 14px;margin:14px 0 6px;display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.resumo .total span{font-size:12px;font-weight:700;letter-spacing:.6px}
.resumo .total strong{font-size:23px;font-variant-numeric:tabular-nums}
.extenso{font-size:12px;color:var(--suave);font-style:italic;margin:0 0 12px;min-height:16px}
.linhas.mini{font-size:13px;border-top:1px solid var(--linha);padding-top:10px}
.embutidos{margin-top:12px;border-top:1px dashed var(--linha);padding-top:8px}
.embutidos summary{cursor:pointer;font-size:12px;color:var(--suave);font-weight:600;margin-bottom:8px}
.avisos{margin:10px 0 0;padding-left:18px;color:var(--amarelo);font-size:12.5px}
.avisos:empty{display:none}

.tabela-wrap{overflow:auto;border:1px solid var(--linha);border-radius:8px}
.tabela-wrap.alto{max-height:60vh}
.tabela{width:100%;border-collapse:collapse;font-size:13.5px}
.tabela th{background:var(--azul);color:#fff;text-align:left;padding:9px 10px;font-weight:600;position:sticky;top:0;z-index:1;white-space:nowrap}
.tabela td{padding:7px 10px;border-bottom:1px solid var(--linha);vertical-align:middle}
.tabela .n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.tabela tbody tr:nth-child(even){background:#FAFBFD}
.tabela.sel tbody tr{cursor:pointer}
.tabela.sel tbody tr:hover{background:var(--azul-claro)}
.tabela tr.marcada{background:var(--azul-claro)!important;box-shadow:inset 3px 0 0 var(--azul)}
.tabela tfoot td{font-weight:700;background:#F0F4FA;border-bottom:0}
.tabela td.grupo{background:#EEF2F8;font-weight:700;color:var(--azul);font-size:12px;text-transform:uppercase;letter-spacing:.5px}
.itens td{padding:5px 6px}
.itens input,.itens select{padding:7px 8px;border-color:#D9DFE8}
.itens td:first-child{min-width:280px;width:52%}
.itens td:nth-child(2){min-width:140px}
.itens td:nth-child(3){width:90px}
.itens .rm{border:0;background:none;color:#9AA3B2;font-size:18px;cursor:pointer;padding:4px 8px}
.itens .rm:hover{color:var(--verm)}
.itens tbody tr.vazio td{color:var(--suave);text-align:center;padding:18px;font-style:italic}

.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{border:1px solid #C9D2E0;background:#fff;border-radius:99px;padding:6px 12px;cursor:pointer;font-size:13px;user-select:none}
.chip.on{background:var(--azul);color:#fff;border-color:var(--azul)}
details.card>summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center}
details.card>summary::-webkit-details-marker{display:none}
details.card>summary h2{margin:0}
details.card>summary::after{content:"▾";color:var(--suave)}
details[open].card>summary::after{content:"▴"}
.contador{margin-left:auto;margin-right:10px;font-size:12px;color:var(--suave)}
#tblReq select{padding:4px 6px;font-size:12.5px;font-weight:600}
.st-OK{color:var(--verde)}.st-PENDENTE{color:var(--verm)}.st-OPCIONAL{color:var(--amarelo)}.st-DISPENSADO{color:#8A93A3}

.barra-movel{display:none}

/* ------------------------------------------------ histórico */
.kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}
.kpi{background:#fff;border:1px solid var(--linha);border-radius:var(--raio);padding:14px 16px;box-shadow:var(--sombra)}
.kpi small{color:var(--suave);font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.4px}
.kpi strong{display:block;font-size:22px;margin-top:4px;color:var(--azul);font-variant-numeric:tabular-nums}
.filtros{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.filtros input{width:280px}
.filtros select{width:auto}
.lnk{color:var(--azul);font-weight:600;text-decoration:none;margin-right:8px;cursor:pointer;background:none;border:0;padding:0}
.lnk:hover{text-decoration:underline}
.st-sel{padding:4px 8px;font-size:12.5px;border-radius:99px;font-weight:600;width:auto}
.st-Aprovado{background:#E6F4EA;color:var(--verde);border-color:#B7DEC2}
.st-Recusado,.st-Cancelado{background:#FDECEC;color:var(--verm);border-color:#F2C1C1}
.st-Enviado{background:#FFF6E0;color:var(--amarelo);border-color:#F1D9A4}

/* ------------------------------------------------ cadastros */
.cadastro{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(320px,1fr);gap:16px;align-items:start}
.cadastro .lista .tabela-wrap{max-height:calc(100vh - 230px)}
.busca{margin-bottom:10px}
.filtros .busca{margin:0;flex:1}
.form{display:flex;flex-direction:column;gap:10px;position:sticky;top:76px}
.form .botoes{margin-top:6px}
.calc-serv{background:var(--azul-claro);border-radius:8px;padding:10px 12px;font-size:13px;display:grid;grid-template-columns:1fr auto;gap:4px}
.calc-serv b{text-align:right}

/* ------------------------------------------------ estimador */
.estimador{display:grid;grid-template-columns:repeat(auto-fit,minmax(600px,1fr));gap:14px}
.estimador .tabela input{padding:4px 6px;text-align:right;width:84px}
.estimador .tabela td:first-child{font-size:12.5px}
.est-rodape{display:flex;justify-content:space-between;align-items:center;margin-top:10px;gap:8px;flex-wrap:wrap}
.est-rodape strong{font-size:16px;color:var(--azul)}

/* ------------------------------------------------ parâmetros */
.params{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 14px}
.params .span-todas{grid-column:1/-1}
.params .tabela input{padding:5px 8px}
.params .tabela td{padding:4px 6px}
#paramsBase label,#paramsPadrao label{font-size:11.5px}

/* ------------------------------------------------ diálogos */
.dlg{border:0;border-radius:14px;padding:18px 20px;width:min(520px,94vw);box-shadow:0 20px 60px rgba(0,0,0,.3)}
.dlg.largo{width:min(980px,96vw)}
.dlg::backdrop{background:rgba(20,30,50,.45)}
.dlg-tit{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.dlg-tit h2{margin:0;font-size:17px;color:var(--azul)}
.dlg>input{margin-bottom:10px}
.opcoes{display:flex;flex-direction:column;gap:8px}
.opcoes .btn{text-align:left;padding:12px 14px}
.opcoes .btn small{display:block;font-weight:400;color:var(--suave);margin-top:2px}
.opcoes .btn.primario small{color:#DCE6F5}
.arquivos{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0}

.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(30px);background:#1F2937;color:#fff;padding:11px 18px;border-radius:9px;opacity:0;pointer-events:none;transition:.25s;z-index:100;max-width:90vw;font-size:13.5px}
.toast.on{opacity:1;transform:translateX(-50%)}
.toast.erro{background:var(--verm)}

/* ------------------------------------------------ responsivo / mobile */
@media (max-width:1100px){
  .grade-orc{grid-template-columns:minmax(0,1fr)}
  .col-resumo{position:static}
  .cadastro{grid-template-columns:minmax(0,1fr)}
  .form{position:static}
  .kpis{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:760px){
  main{padding:12px 12px 96px}
  .topo{flex-wrap:wrap;padding:0 14px}
  .marca span{display:none}
  .menu-btn{display:block}
  .abas{display:none;width:100%;flex-direction:column;margin:0 0 8px}
  .abas.aberto{display:flex}
  .abas button{text-align:left;padding:11px 6px;border-bottom:0;border-left:3px solid transparent}
  .abas button.ativa{border-left-color:#fff}
  .duas,.params{grid-template-columns:minmax(0,1fr)}
  .c2,.c3,.c4{grid-template-columns:repeat(2,minmax(0,1fr))}
  /* tabela de serviços vira "cartões" no celular */
  .itens thead{display:none}
  .itens,.itens tbody,.itens tfoot{display:block;width:100%}
  .itens tr{display:grid;grid-template-columns:minmax(0,1fr) 92px 34px;gap:6px;padding:10px 8px;border-bottom:1px solid var(--linha)}
  .itens td{display:block;border:0;padding:0!important;min-width:0!important;width:auto!important}
  .itens td:first-child{grid-column:1/-1}
  .itens tbody td:nth-child(2){grid-column:1;grid-row:2}
  .itens tbody td:nth-child(3){grid-column:2;grid-row:2}
  .itens tbody td:nth-child(6){grid-column:3;grid-row:2;align-self:center}
  .itens tbody td.unit{grid-column:1;grid-row:3;align-self:center}
  .itens tbody td.tot{grid-row:3;text-align:right}
  .itens td.unit::before{content:"Unit. ";color:var(--suave);font-weight:400}
  .itens td.unit{text-align:left}
  .itens td.tot{grid-column:2/4;font-weight:700}
  .itens tbody tr.vazio{display:block}
  .itens tfoot tr{grid-template-columns:1fr auto auto}
  .itens tfoot td:empty{display:none}
  .span2,.span4{grid-column:1/-1}
  .barra-acoes .botoes{width:100%}
  .barra-acoes .botoes .btn{flex:1;padding:10px 8px;font-size:13px}
  #btnGerar2{display:none}
  .barra-movel{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:30;background:#fff;border-top:1px solid var(--linha);padding:10px 14px calc(10px + env(safe-area-inset-bottom));justify-content:space-between;align-items:center;box-shadow:0 -4px 14px rgba(0,0,0,.08)}
  .barra-movel small{display:block;color:var(--suave);font-size:11px}
  .barra-movel strong{font-size:20px;color:var(--azul)}
  .filtros input{width:100%}
  .estimador{grid-template-columns:minmax(0,1fr)}
  .estimador .tabela input{width:64px}
  .itens td:first-child{min-width:220px}
  .kpi strong{font-size:18px}
}
@media print{.topo,.barra-acoes,.barra-movel{display:none}}