/* ============================================================
   GS — Camada visual dos orçamentos (aplica o layout aprovado)
   Só estilo. Carregar por ÚLTIMO. Não altera ids, HTML nem lógica.
   ============================================================ */
:root{
  --o-ac:#20789A; --o-ac2:#2a86a8; --o-ac-soft:#e8f2f6; --o-ac-line:#bcdbe6;
  --o-ink:#122436; --o-soft:#5B6B7D; --o-mute:#7C8CA0;
  --o-line:#E3EAF2; --o-line2:#eef2f7; --o-card:#fff; --o-bg:#F2F6FA;
  --o-green:#1E7A46; --o-green-soft:#e7f3ec; --o-rad:11px;
}

/* ---- grade principal ---- */
.layout{
  display:grid !important;
  grid-template-columns:232px minmax(0,1fr) 320px !important;
  gap:22px !important; align-items:start !important;
  max-width:none !important; width:100% !important; margin:0 !important; padding:6px 30px 60px !important;
}

/* ---- etapas ---- */
.steps{
  background:var(--o-card) !important; border:1px solid var(--o-line) !important;
  border-radius:14px !important; padding:10px !important;
  position:sticky !important; top:18px !important; box-shadow:0 2px 10px rgba(10,46,61,.04);
  display:flex; flex-direction:column; gap:2px;
}
.steps .step{
  display:flex !important; align-items:center; gap:11px;
  padding:10px 11px !important; border-radius:9px !important; cursor:pointer;
  border:0 !important; background:transparent !important; transition:.13s;
}
.steps .step:hover{ background:var(--o-line2) !important; }
.steps .step.active{ background:var(--o-ac-soft) !important; }
.steps .step .num{
  width:26px !important; height:26px !important; flex:0 0 26px; border-radius:8px !important;
  background:var(--o-bg) !important; color:var(--o-mute) !important;
  display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700;
}
.steps .step.active .num{ background:var(--o-ac) !important; color:#fff !important; }
.steps .step.done .num{ background:var(--o-green-soft) !important; color:var(--o-green) !important; }
.steps .step .txt{ font-size:13px !important; font-weight:600 !important; color:var(--o-ink) !important; line-height:1.25; }
.steps .step.active .txt{ color:var(--o-ac) !important; }
.steps .step .txt small{ display:block; font-size:11px !important; font-weight:500; color:var(--o-mute) !important; }

/* ---- coluna central preenche o espaço (sem vão até o resumo) ---- */
.content{ max-width:none !important; width:100% !important; padding:6px 6px 60px !important; overflow:visible !important; }

/* ---- painel ---- */
.content .panel{
  background:var(--o-card) !important; border:1px solid var(--o-line) !important;
  border-radius:14px !important; padding:22px 24px !important;
  box-shadow:0 2px 10px rgba(10,46,61,.04);
}
.panel-title{ font-size:18px !important; font-weight:700 !important; color:var(--o-ink) !important; margin:0 0 4px !important; }
.panel-desc{ font-size:13px !important; color:var(--o-soft) !important; margin:0 0 20px !important; }

/* ---- linhas de item ---- */
.item{
  display:flex !important; align-items:center; gap:13px;
  padding:13px !important; border:1px solid var(--o-line) !important;
  border-radius:var(--o-rad) !important; margin-bottom:11px !important;
  background:var(--o-card) !important; transition:.13s;
}
.item:hover{ border-color:var(--o-ac-line) !important; }
.item .check{ flex:0 0 auto; }
.item .info{ flex:1; min-width:0; }
.item .info .name,.item .name{ font-size:14px !important; font-weight:600 !important; color:var(--o-ink) !important; }
.item .info .desc,.item .desc{ font-size:12px !important; color:var(--o-soft) !important; }
.item .controls{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.item .controls .lbl{ font-size:11px !important; color:var(--o-soft) !important; font-weight:600; margin-bottom:3px; }
.item .controls input,.item .controls select{
  border:1.5px solid var(--o-line) !important; border-radius:8px !important;
  padding:9px 11px !important; font-size:14px !important; background:#fff !important; color:var(--o-ink) !important;
}
.item .controls input:focus,.item .controls select:focus{ border-color:var(--o-ac) !important; outline:none; }
.item .subtotal{ font-size:15px !important; font-weight:700 !important; color:var(--o-ink) !important; white-space:nowrap; min-width:92px; text-align:right; }

/* destaque azul na linha de combustível */
.item[data-row="combustivel"]{ background:var(--o-ac-soft) !important; border-color:var(--o-ac-line) !important; align-items:flex-start; }
.item[data-row="combustivel"] .subtotal{ color:var(--o-ac) !important; }

/* ---- campos gerais ---- */
.field label{ font-size:12px !important; font-weight:600 !important; color:var(--o-soft) !important; }
.field input,.field textarea,.field select,.ajuste input,.ctl input{
  border:1.5px solid var(--o-line) !important; border-radius:8px !important; background:#fff !important; color:var(--o-ink) !important;
}
.field input:focus,.field textarea:focus,.field select:focus{ border-color:var(--o-ac) !important; }

/* ---- botões / navegação ---- */
.nav-steps .primary,.btn-gerar,button.primary{
  background:linear-gradient(135deg,var(--o-ac2),var(--o-ac)) !important; color:#fff !important; border:0 !important;
  border-radius:10px !important; font-weight:600 !important;
}
.nav-steps .ghost,button.ghost{ background:transparent !important; border:1.5px solid transparent !important; color:var(--o-soft) !important; }
.nav-steps .primary:hover{ filter:brightness(1.06); }

/* cards de tipo (pagamento) — mantém seleção existente */
.tipo-card.selected{ border-color:var(--o-ac) !important; background:var(--o-ac-soft) !important; }

/* ---- RESUMO: de escuro pra claro, com total em destaque ---- */
.resumo{
  background:var(--o-card) !important; border:1px solid var(--o-line) !important;
  border-radius:14px !important; padding:18px !important; color:var(--o-ink) !important;
  box-shadow:0 2px 10px rgba(10,46,61,.04);
}
.resumo h2{ font-size:11px !important; font-weight:700 !important; letter-spacing:.6px; text-transform:uppercase; color:var(--o-mute) !important; margin-bottom:12px !important; }
.resumo .bd-row{ padding:8px 0 !important; border-bottom:1px solid var(--o-line2) !important; font-size:13px !important; }
.resumo .bd-row .lbl{ color:var(--o-soft) !important; }
.resumo .bd-row .val{ color:var(--o-ink) !important; font-weight:600 !important; }
.resumo .bd-row.sub .lbl{ color:var(--o-mute) !important; }
.resumo .bd-row.sub .val{ color:var(--o-mute) !important; font-weight:500 !important; }
.resumo .bd-row.total{ border-top:1.5px solid var(--o-line) !important; border-bottom:0 !important; margin-top:6px; padding-top:12px !important; }
.resumo .bd-row.total .lbl{ color:var(--o-ink) !important; font-weight:700; }
.resumo .bd-row.total .val{ color:var(--o-ink) !important; }

.resumo .preco-box{
  background:var(--o-ac-soft) !important; border:1px solid var(--o-ac-line) !important;
  border-radius:12px !important; padding:14px 16px !important; margin-top:14px !important; text-align:left;
}
.resumo .preco-box .l{ font-size:12px !important; color:var(--o-ac) !important; font-weight:600; }
.resumo .preco-box .v{ font-size:27px !important; font-weight:700 !important; letter-spacing:-.5px; color:var(--o-ac) !important; margin-top:2px; }

.resumo .indicadores{ display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:14px; }
.resumo .indicador{ background:var(--o-bg) !important; border-radius:10px !important; padding:10px 12px !important; }
.resumo .indicador .l{ font-size:11px !important; color:var(--o-mute) !important; }
.resumo .indicador .v{ font-size:16px !important; font-weight:700 !important; color:var(--o-ink) !important; }

.resumo .toggle-handle,.resumo .preview-mobile{ color:var(--o-ink) !important; }

/* ---- sinalizador de lucro (visível no tema claro) ---- */
.resumo .sinalizador{
  border:1px solid var(--o-line) !important; border-radius:12px !important;
  background:var(--o-bg) !important; box-shadow:none !important; padding:14px 16px !important; margin-top:14px !important;
  display:flex !important; align-items:center; gap:12px;
}
.resumo .sinal-icon{ font-size:26px !important; line-height:1; flex-shrink:0; }
.resumo .sinal-info{ min-width:0; }
.resumo .sinal-label{ font-size:13px !important; letter-spacing:.5px; }
.resumo .sinal-desc{ font-size:12px !important; margin-top:2px; }
.resumo .analise .titulo{ font-size:11px !important; text-transform:uppercase; letter-spacing:.5px; margin-bottom:8px !important; }
.resumo .analise .item-row{ display:flex !important; justify-content:space-between; padding:5px 0 !important; border-bottom:1px solid var(--o-line2) !important; font-size:13px; }
.resumo .analise .item-row:last-child{ border-bottom:0 !important; }
.resumo .sinalizador.lucro{ background:var(--o-green-soft) !important; border-color:#bfe0cd !important; }
.resumo .sinalizador.zero{ background:#f7eeda !important; border-color:#e6cfa1 !important; }
.resumo .sinalizador.preju{ background:#fbeaea !important; border-color:#eec2c0 !important; }
.resumo .sinal-label{ color:var(--o-ink) !important; font-weight:700 !important; }
.resumo .sinal-desc{ color:var(--o-soft) !important; }
.resumo .sinalizador.lucro .sinal-label{ color:#1E7A46 !important; }
.resumo .sinalizador.zero  .sinal-label{ color:#9a6410 !important; }
.resumo .sinalizador.preju .sinal-label{ color:#b23b30 !important; }

/* ---- análise interna (visível no tema claro) ---- */
.resumo .analise{
  background:var(--o-bg) !important; border:1px solid var(--o-line) !important;
  border-radius:12px !important; padding:12px 14px !important; margin-top:14px !important;
}
.resumo .analise .titulo{ color:var(--o-mute) !important; font-weight:700 !important; }
.resumo .analise .item-row{ border-color:var(--o-line2) !important; }
.resumo .analise .item-row .lbl{ color:var(--o-soft) !important; }
.resumo .analise .item-row .val{ color:var(--o-ink) !important; font-weight:600 !important; }

/* preview mobile do resumo legível */
.resumo .preview-mobile .l,.resumo .preview-mobile .v{ color:var(--o-ink) !important; }

@media(max-width:1080px){
  .layout{ grid-template-columns:1fr !important; }
  .steps,.resumo{ position:static !important; }
}
