/* LokSan — Documentos comerciais (padrão exato do modelo editável).
   Escopado em .loksan-docs para não conflitar com o CSS do ERP.
   Padrão: navy #243A78, yellow #F7D920, folha A4, margens ABNT 3cm/2cm. */
.loksan-docs{
  --navy:#243A78; --navy-dark:#1A2760; --navy-deep:#141D48;
  --yellow:#F7D920; --yellow-soft:#FDF3B8;
  --ink:#1F2430; --line:#B9C0D4; --line-soft:#D8DDEA; --tint:#EEF1F8; --paper:#fff;
  background:#6E7590;color:var(--ink);
  font-family:Arial,"Helvetica Neue",Helvetica,sans-serif;
  margin:0;padding:0 0 24px;border-radius:12px;overflow:auto;
}
.loksan-docs,.loksan-docs *{box-sizing:border-box}

/* ---------- barra de ferramentas ---------- */
.loksan-docs .lk-toolbar,.loksan-docs .toolbar{position:sticky;top:0;z-index:60;display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  padding:10px 14px;background:var(--navy-deep);color:#fff;font-size:13px;box-shadow:0 2px 10px rgba(0,0,0,.35)}
.loksan-docs .lk-toolbar strong,.loksan-docs .toolbar strong{margin-right:4px}
.loksan-docs .lk-toolbar .hint,.loksan-docs .toolbar .hint{opacity:.72;font-size:12px;margin-left:auto}
.loksan-docs .btn{border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.08);color:#fff;
  padding:7px 12px;border-radius:4px;font:inherit;font-size:12.5px;cursor:pointer}
.loksan-docs .btn:hover{background:rgba(255,255,255,.18)}
.loksan-docs .btn:focus-visible{outline:2px solid var(--yellow);outline-offset:2px}
.loksan-docs .btn.primary{background:var(--yellow);border-color:var(--yellow);color:var(--navy-deep);font-weight:700}
.loksan-docs .btn.primary:hover{background:#ffe93f}
.loksan-docs select.btn{padding:7px 8px}
.loksan-docs select.btn option{color:#111}

/* ---------- folha A4 / margens ABNT ---------- */
.loksan-docs .sheet{width:210mm;min-height:297mm;background:var(--paper);margin:22px auto;
  padding:30mm 20mm 20mm 30mm;display:flex;flex-direction:column;position:relative;
  box-shadow:0 10px 40px rgba(0,0,0,.35);color:var(--ink)}

/* ---------- cabeçalho ---------- */
.loksan-docs .doc-head{display:flex;align-items:flex-start;justify-content:space-between;gap:10mm;margin-bottom:3mm}
.loksan-docs .logo-wrap{position:relative;flex:0 0 auto}
.loksan-docs .logo-wrap .logo{display:block;height:15mm;width:auto;max-width:60mm;object-fit:contain}
.loksan-docs .logo-wrap .swap{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:rgba(20,29,72,.78);color:#fff;font-size:10px;border-radius:4px;opacity:0;cursor:pointer}
.loksan-docs .logo-wrap:hover .swap{opacity:1}
.loksan-docs .refs{display:grid;grid-template-columns:repeat(2,minmax(34mm,1fr));gap:0;
  border:1px solid var(--line);border-width:1px 0 0 1px;min-width:74mm}
.loksan-docs .ref{border:1px solid var(--line);border-width:0 1px 1px 0;padding:1px 6px 2px}
.loksan-docs .ref label{display:block;font-size:6.6pt;font-weight:700;color:var(--navy);line-height:1.3}
.loksan-docs .ref .v{font-size:8.6pt;min-height:4.2mm;line-height:1.3}

.loksan-docs .title-bar{background:var(--navy);border-top:3px solid var(--yellow);
  clip-path:polygon(0 0,86% 0,93% 100%,0 100%);padding:4px 10px 5px;margin-bottom:3.5mm}
.loksan-docs .title-bar h1{margin:0;color:#fff;font-size:14pt;font-weight:700;letter-spacing:.3px;line-height:1.15}

/* ---------- corpo ---------- */
.loksan-docs .body{flex:1}
.loksan-docs .blk{margin-bottom:3.2mm;break-inside:avoid;position:relative}
.loksan-docs .blk h2{display:block;margin:0 0 1.4mm;background:var(--navy);color:#fff;
  font-size:9pt;font-weight:700;padding:2.5px 8px;border-left:4px solid var(--yellow)}
.loksan-docs .blk h2 b{color:var(--yellow);margin-right:4px}
.loksan-docs .two{display:grid;grid-template-columns:1.25fr .75fr;gap:6mm;align-items:start}
.loksan-docs .two .sub:first-child{margin-top:0}
.loksan-docs .sub{font-size:8.6pt;font-weight:700;color:var(--navy);margin:2mm 0 1mm}

/* ---------- campos de formulário ---------- */
.loksan-docs .grid{display:grid;border:1px solid var(--line);border-width:1px 0 0 1px;margin-bottom:1.5mm}
.loksan-docs .f{border:1px solid var(--line);border-width:0 1px 1px 0;padding:1px 5px 2px}
.loksan-docs .f label{display:block;font-size:6.8pt;font-weight:700;color:var(--navy);line-height:1.35}
.loksan-docs .f .v{font-size:9pt;min-height:4.2mm;line-height:1.35}

.loksan-docs .area{border:1px solid var(--line);padding:4px 7px;font-size:9pt;line-height:1.45}

/* ---------- tabelas ---------- */
.loksan-docs table.tbl{width:100%;border-collapse:collapse;font-size:8.2pt;table-layout:fixed;background:#fff}
.loksan-docs table.tbl.small{font-size:7.4pt}
.loksan-docs table.tbl th,.loksan-docs table.tbl td{border:1px solid var(--line);padding:2px 4px;vertical-align:middle;
  word-wrap:break-word;overflow-wrap:anywhere}
.loksan-docs table.tbl thead th{background:var(--navy);color:#fff;font-weight:700;text-align:left;line-height:1.25}
.loksan-docs table.tbl thead tr.grp th{background:var(--navy-deep);text-align:center;border-bottom:2px solid var(--yellow)}
.loksan-docs table.tbl tbody tr:nth-child(even) td{background:#F7F9FC}
.loksan-docs table.tbl td{height:5.4mm}
.loksan-docs table.tbl td.it,.loksan-docs table.tbl td.num{text-align:center}
.loksan-docs table.tbl td.num{text-align:right}
.loksan-docs table.tbl td.calc{background:var(--tint) !important;color:var(--navy-dark);font-weight:700}
.loksan-docs table.tbl.check td.cb{text-align:center;cursor:pointer;font-size:11pt;line-height:1}
.loksan-docs table.tbl.check td.cb:before{content:"☐";color:var(--navy)}
.loksan-docs table.tbl.check td.cb.on:before{content:"☑";color:var(--navy)}
.loksan-docs table.tbl.hist td{height:5mm}

.loksan-docs table.fin{width:100%;border-collapse:collapse;font-size:8.6pt;margin-bottom:1.5mm;background:#fff}
.loksan-docs table.fin td{border:1px solid var(--line);padding:1.9px 8px}
.loksan-docs table.fin td:first-child{width:auto}
.loksan-docs table.fin td.v{width:38mm;text-align:right;background:#F7F9FC}
.loksan-docs table.fin td.calc{background:var(--tint);font-weight:700;color:var(--navy-dark)}
.loksan-docs table.fin tr.tot td{background:var(--yellow-soft);font-weight:700;color:var(--navy-deep);
  border-top:2px solid var(--yellow)}
.loksan-docs .note{font-size:7.2pt;color:#5C6274;margin:1.2mm 0 0;line-height:1.35}
.loksan-docs .row-tools{display:flex;gap:6px;margin-top:4px}
.loksan-docs .mini{border:1px dashed var(--line);background:#fff;color:var(--navy);border-radius:3px;
  font:inherit;font-size:10px;padding:2px 8px;cursor:pointer}
.loksan-docs .mini:hover{background:var(--tint)}

/* ---------- assinaturas ---------- */
.loksan-docs .signs{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:9mm;margin-top:5.5mm}
.loksan-docs .sign .sg-line{border-top:1px solid var(--navy);margin-bottom:3px}
.loksan-docs .sign .sg-lb{font-size:8.4pt;font-weight:700;color:var(--navy);text-align:center;line-height:1.3}
.loksan-docs .sign .sg-sub{font-size:7.6pt;color:#5C6274;margin-top:2px}
.loksan-docs .sign .sg-sub span{display:inline-block;min-width:26mm;border-bottom:1px dotted var(--line-soft)}

/* ---------- rodapé ---------- */
.loksan-docs .doc-foot{margin-top:auto;padding-top:2.5mm;border-top:2px solid var(--yellow);
  display:flex;justify-content:space-between;gap:8mm;font-size:7.4pt;color:#4A5063;line-height:1.5}
.loksan-docs .doc-foot b{display:block;color:var(--navy);font-size:8.2pt}
.loksan-docs .doc-foot .fr{text-align:right;white-space:nowrap}
.loksan-docs .doc-foot .fr span{display:block}

/* ---------- edição ---------- */
.loksan-docs [contenteditable]{outline:none;border-radius:2px}
.loksan-docs [contenteditable="true"]:hover{box-shadow:inset 0 0 0 1px rgba(36,58,120,.3)}
.loksan-docs [contenteditable="true"]:focus{box-shadow:inset 0 0 0 2px var(--yellow);background:rgba(247,217,32,.14)}
.loksan-docs [contenteditable]:empty:before{content:attr(data-ph);color:#A3A9BA;font-style:italic}
.loksan-docs .title-bar [contenteditable]:empty:before{color:rgba(255,255,255,.5)}

/* ---------- construtor (arrastar campos) — não sai na impressão ---------- */
.loksan-docs .lk-builder{display:grid;grid-template-columns:280px 1fr;gap:12px;padding:12px;background:#e8ebf3}
.loksan-docs .lk-palette{background:#fff;border-radius:10px;padding:10px;max-height:80vh;overflow:auto;position:sticky;top:70px}
.loksan-docs .lk-palette h4{margin:8px 0 6px;font-size:12px;color:var(--navy-deep);text-transform:uppercase;letter-spacing:.4px}
.loksan-docs .lk-palette h4:first-child{margin-top:0}
.loksan-docs .lk-field{border:1px solid var(--line-soft);border-radius:8px;padding:7px 9px;margin-bottom:6px;background:#F7F9FC;
  font-size:12px;cursor:grab;display:flex;justify-content:space-between;align-items:center;gap:6px}
.loksan-docs .lk-field:hover{border-color:var(--navy);background:#EEF1F8}
.loksan-docs .lk-field:active{cursor:grabbing}
.loksan-docs .lk-field .add{border:1px solid var(--navy);color:var(--navy);border-radius:6px;background:#fff;font-size:11px;padding:1px 7px;cursor:pointer}
.loksan-docs .lk-field.dragging{opacity:.5}
.loksan-docs .lk-canvas{min-width:0}
.loksan-docs .lk-canvas .sheet{margin:0 auto 22px}
.loksan-docs .lk-drop-hint{outline:2px dashed var(--yellow);outline-offset:-6px}
.loksan-docs .lk-blk-tools{position:absolute;top:2px;right:2px;display:none;gap:4px;z-index:5}
.loksan-docs .blk:hover .lk-blk-tools{display:flex}
.loksan-docs .lk-blk-tools button{border:1px solid var(--navy);background:#fff;color:var(--navy);border-radius:6px;font-size:10px;padding:1px 6px;cursor:pointer}
.loksan-docs .lk-blk-tools button.danger{border-color:#dc2626;color:#dc2626}
.loksan-docs .lk-custom-form{background:#fff;border:1px dashed var(--line);border-radius:10px;padding:10px;margin-top:8px}
.loksan-docs .lk-custom-form input,.loksan-docs .lk-custom-form select{width:100%;border:1px solid var(--line);border-radius:6px;padding:6px;font-size:12px;margin-bottom:6px;background:#fff;color:var(--ink)}
.loksan-docs .lk-models{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:10px;padding:12px}
.loksan-docs .lk-model-card{background:#fff;border-radius:10px;padding:12px;border:1px solid var(--line-soft);display:flex;flex-direction:column;gap:8px}
.loksan-docs .lk-model-card strong{color:var(--navy-deep)}
.loksan-docs .lk-model-card .row{display:flex;gap:6px;flex-wrap:wrap}
.loksan-docs .lk-model-card .btn{border-color:var(--line);color:var(--navy-deep);background:#fff}
.loksan-docs .lk-model-card .btn.primary{background:var(--yellow);border-color:var(--yellow)}
.loksan-docs .lk-empty{background:#fff;border-radius:10px;padding:18px;text-align:center;color:#5C6274}

/* ---------- impressão ---------- */
@page{size:A4 portrait;margin:0}
@media print{
  body{background:#fff !important}
  #sidebar,#topbar,#nav,.nav-item,#toasts,#modal-root,.only-screen{display:none !important}
  #main{margin:0 !important;padding:0 !important}
  #view{padding:0 !important;margin:0 !important}
  .loksan-docs{background:#fff;padding:0;border-radius:0;overflow:visible}
  .loksan-docs .lk-toolbar,.loksan-docs .toolbar,.loksan-docs .row-tools,.loksan-docs .logo-wrap .swap,
  .loksan-docs .lk-builder,.loksan-docs .lk-palette,.loksan-docs .lk-blk-tools,.loksan-docs .lk-models,.loksan-docs .noprint{display:none !important}
  .loksan-docs .sheet{margin:0;box-shadow:none;break-after:page}
  .loksan-docs .sheet:last-of-type{break-after:auto}
  .loksan-docs [contenteditable]:hover,.loksan-docs [contenteditable]:focus{box-shadow:none;background:none}
  .loksan-docs [contenteditable]:empty:before{content:""}
  body.lk-only-orcamento .loksan-docs .sheet:not(#orcamento),
  body.lk-only-ordem-servico .loksan-docs .sheet:not(#ordem-servico),
  body.lk-only-boletim .loksan-docs .sheet:not(#boletim),
  body.lk-only-fatura .loksan-docs .sheet:not(#fatura){display:none !important}
  body.lk-only-custom .loksan-docs .sheet:not(#lk-custom-sheet){display:none !important}
  *{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}
@media screen and (max-width:1100px){
  .loksan-docs .lk-builder{grid-template-columns:1fr}
  .loksan-docs .lk-palette{position:static;max-height:none}
}
@media screen and (max-width:900px){
  .loksan-docs .sheet{width:100%;min-height:auto;padding:16px}
  .loksan-docs .doc-head{flex-direction:column;gap:10px}
  .loksan-docs .grid{grid-template-columns:1fr 1fr !important}
  .loksan-docs .two{grid-template-columns:1fr}
  .loksan-docs .signs{grid-auto-flow:row}
}

/* ============ Motor Contratual — folha .contract-doc (espelho do protótipo) ============
   Escopado em .loksan-docs para não conflitar com o ERP. Mesmas fontes, margens,
   h1-h4, tabelas th #efefef / bordas #333, .sig-grid e destaques .meta/.module-* */
.loksan-docs .contract-doc{font-family:Arial,sans-serif;color:#111;font-size:11px;line-height:1.38;background:#fff;padding:38px;border-radius:12px}
.loksan-docs .contract-doc h1{font-size:20px;text-align:center;margin:0}
.loksan-docs .contract-doc h2{font-size:13px;text-align:center;margin:4px 0 18px}
.loksan-docs .contract-doc h3{font-size:12px;margin:18px 0 8px;background:#171717;color:#fff;padding:7px 9px}
.loksan-docs .contract-doc h4{font-size:11.5px;margin:17px 0 7px}
.loksan-docs .contract-doc p{margin:6px 0;text-align:justify}
.loksan-docs .contract-doc table{border-collapse:collapse;width:100%;max-width:100%;margin:8px 0 14px;table-layout:fixed}
.loksan-docs .contract-doc th,.loksan-docs .contract-doc td{border:1px solid #333;padding:6px;vertical-align:top;overflow-wrap:break-word;word-wrap:break-word;overflow-wrap:anywhere}
.loksan-docs .contract-doc th{background:#efefef;text-align:left}
.loksan-docs .contract-doc table.t-items th,.loksan-docs .contract-doc table.t-items td{padding:4px;font-size:10px}
.loksan-docs .contract-doc table.t-items td:nth-child(4),.loksan-docs .contract-doc table.t-items td:nth-child(6),.loksan-docs .contract-doc table.t-items td:nth-child(7){text-align:center;white-space:nowrap}
.loksan-docs .contract-doc table.t-items td:nth-child(8),.loksan-docs .contract-doc table.t-items td:nth-child(9){text-align:right;white-space:nowrap}
.loksan-docs .contract-doc .meta{background:#faf5e6;border-left:4px solid #c69a32;padding:9px;margin:10px 0}
.loksan-docs .contract-doc .sig-grid{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin-top:52px}
.loksan-docs .contract-doc .sig{border-top:1px solid #111;text-align:center;padding-top:5px}
.loksan-docs .contract-doc .clause-title{font-weight:bold;text-transform:uppercase;margin-top:15px}
.loksan-docs .contract-doc .module-pontual{border-left:3px solid #d97706;padding-left:8px}
.loksan-docs .contract-doc .module-cont{border-left:3px solid #16a34a;padding-left:8px}
.loksan-docs .contract-doc .module-remote{border-left:3px solid #2563eb;padding-left:8px}
@media screen and (max-width:900px){
  .loksan-docs .contract-doc{font-size:10px;padding:18px 12px}
  .loksan-docs .contract-doc .sig-grid{grid-template-columns:1fr}
}
@media print{
  .loksan-docs .contract-doc{font-size:10pt;padding:0}
  .loksan-docs .contract-doc h1{font-size:17pt}
  .loksan-docs .contract-doc h2{font-size:11pt}
  .loksan-docs .contract-doc h3{font-size:10.5pt}
  .loksan-docs .contract-doc table{break-inside:avoid}
  .loksan-docs .contract-doc h3,.loksan-docs .contract-doc h4{break-after:avoid}
}
