/* Service agreement replica (see assets/sa_doc.js). 1 page = A4, 1in margins, like the Word template. */
@font-face{font-family:'SA Tinos';src:url(fonts/Tinos-400.woff2) format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'SA Tinos';src:url(fonts/Tinos-700.woff2) format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'SA Tinos';src:url(fonts/Tinos-400i.woff2) format('woff2');font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:'SA Tinos';src:url(fonts/Tinos-700i.woff2) format('woff2');font-weight:700;font-style:italic;font-display:swap}
@font-face{font-family:'SA Carlito';src:url(fonts/Carlito-400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'SA Carlito';src:url(fonts/Carlito-700.woff2) format('woff2');font-weight:700;font-display:swap}
@font-face{font-family:'SA Poppins';src:url(fonts/Poppins-400.woff2) format('woff2');font-weight:400;font-display:swap}
@font-face{font-family:'SA Poppins';src:url(fonts/Poppins-600.woff2) format('woff2');font-weight:600;font-display:swap}
@font-face{font-family:'SA Poppins';src:url(fonts/Poppins-700.woff2) format('woff2');font-weight:700;font-display:swap}
.sa-doc{--sa-tnr:'Times New Roman','SA Tinos',Tinos,'Liberation Serif',serif;--sa-cal:Calibri,'SA Carlito',Carlito,'Segoe UI',sans-serif;--sa-pop:Poppins,'SA Poppins',sans-serif;
  display:flex;flex-direction:column;align-items:center;gap:22px;padding:8px 0 24px;color:#000;-webkit-text-size-adjust:100%;text-size-adjust:100%}
.sa-page{--u:1mm;position:relative;box-sizing:border-box;width:210mm;min-height:297mm;background:#fff;padding:0;overflow:hidden;
  box-shadow:0 1px 3px rgba(16,24,40,.12),0 8px 24px rgba(16,24,40,.08);font-family:var(--sa-tnr);font-size:11pt;line-height:1.15;container-type:inline-size}
@supports (width:1cqw){.sa-hdr,.sa-flame,.sa-body{--u:calc(100cqw / 210)}}
.sa-body{position:relative;z-index:1;padding:calc(43.6mm + var(--sa-off,0mm)) 25.4mm 25.4mm}
.sa-body p{margin:0;font-family:var(--sa-tnr)}
.sa-body span{font-family:var(--sa-tnr)}
.sa-body [style*="--sa-cal"]{font-family:var(--sa-cal)}
.sa-num{display:inline-block;text-indent:0}
.sa-t{border-collapse:collapse;table-layout:fixed;max-width:100%}
.sa-t td{padding:0 5.4pt;border:0}
.sa-t td.sa-gb{border:0;background:none}
.sa-fv{color:#111}
.sa-sig{height:24pt;display:flex;align-items:flex-end;border-bottom:1.5pt solid #000;padding-bottom:1pt;margin-bottom:8pt}
.sa-sigimg{max-height:45pt;max-width:100%;display:block}
/* letterhead (positions measured from the template, in mm of an A4 page) */
.sa-hdr{position:absolute;left:0;top:0;width:100%;height:calc(var(--u)*45);pointer-events:none;z-index:0}
.sa-hdr *{position:absolute;margin:0}
.sa-bar{top:calc(var(--u)*5.56);width:calc(var(--u)*6.6);height:calc(var(--u)*32.38)}
.sa-bar.r{left:0;background:#E5382B}.sa-bar.n{right:0;background:#0A192A}
.sa-logo{left:calc(var(--u)*25.4);top:calc(var(--u)*3.46);width:calc(var(--u)*33.92);height:calc(var(--u)*35.19);object-fit:contain}
.sa-vl{left:calc(var(--u)*116.15);top:calc(var(--u)*2.82);width:calc(var(--u)*.8);height:calc(var(--u)*24.14);background:#0A192A}
.sa-co{left:calc(var(--u)*121.6);top:calc(var(--u)*4.1);font:700 calc(var(--u)*3.528)/1.2 var(--sa-pop);color:#000;white-space:nowrap;letter-spacing:.01em}
.sa-icons{left:calc(var(--u)*119.6);top:calc(var(--u)*10.4);width:calc(var(--u)*3.42);height:calc(var(--u)*19.9)}
.sa-addr{position:absolute;left:calc(var(--u)*124.4);top:calc(var(--u)*10.0);font:400 calc(var(--u)*3.175)/1 var(--sa-pop);color:#000;white-space:nowrap}
.sa-addr div{position:relative;height:calc(var(--u)*5.16);display:flex;align-items:center}
.sa-hl{left:0;right:0;top:calc(var(--u)*41.2);height:calc(var(--u)*.6);background:#0A192A}
.sa-flame{position:absolute;z-index:0;object-fit:contain;left:calc(var(--u)*131.5);top:calc(var(--u)*242.4);width:calc(var(--u)*57.54);height:calc(var(--u)*54.49);pointer-events:none}
.sa-sample{background:#fff4e5;border:1px solid #f5c58b;color:#8a4b0b;font:600 13px/1.4 Inter,system-ui,sans-serif;padding:8px 12px;border-radius:8px;max-width:210mm;width:100%;box-sizing:border-box;text-align:center}
/* fill-in inputs on the customer phone page */
.sa-in{width:100%;box-sizing:border-box;border:0;border-bottom:1.5px dashed #98a2b3;background:#f4f7fb;font:inherit;font-size:max(1em,16px);padding:3px 4px;border-radius:3px 3px 0 0;color:#000;min-height:30px}
.sa-in:focus{outline:2px solid #2563eb;outline-offset:1px;background:#fff}
.sa-edit .sa-sig{height:auto}
.sa-pad{position:relative;width:100%;height:110px;border:1.5px dashed #c8102e;border-radius:6px;background:#fff8f6;touch-action:none}
.sa-pad canvas{position:absolute;inset:0;width:100%;height:100%}
.sa-pad span{position:absolute;inset:auto 0 8px;text-align:center;color:#98a2b3;font:13px Inter,system-ui,sans-serif;pointer-events:none}
.sa-pad button{position:absolute;right:4px;top:4px;font:12px Inter,system-ui,sans-serif;border:1px solid #d0d5dd;background:#fff;border-radius:6px;padding:3px 8px;pointer-events:auto}
/* phones and narrow panes: one continuous sheet, letterhead scaled, text sized to read */
@media screen and (max-width:840px){
  .sa-doc{gap:0;padding:0}
  .sa-page{width:100%;min-height:0;padding:0;box-shadow:none;border-left:1px solid #eaecf0;border-right:1px solid #eaecf0}
  .sa-body{padding:6px 18px 6px}
  .sa-page:first-child .sa-body{padding-top:calc(var(--u) * 43.6)}
  .sa-page:last-child .sa-body{padding-bottom:calc(var(--u) * 40)}
  .sa-page:not(:first-child) .sa-hdr,.sa-page:not(:last-child) .sa-flame{display:none}
  .sa-page:first-child{border-top:1px solid #eaecf0;border-radius:10px 10px 0 0}
  .sa-page:last-child{border-bottom:1px solid #eaecf0;border-radius:0 0 10px 10px}
  .sa-page:last-child .sa-flame{top:auto;bottom:0}
  .sa-body p,.sa-body span{font-size:15px!important}
  .sa-body [style*="font-size:16pt"]{font-size:19px!important}
  .sa-body [style*="font-size:8pt"]{font-size:13px!important}
  .sa-body p{padding-right:0!important;text-align:left!important}
  .sa-body p[style*="text-align:center"]{text-align:center!important}
  .sa-body p[style*="text-align:right"]{text-align:right!important}
  .sa-e+.sa-e{display:none}
  .sa-body td span[style*="font-style:italic"]{font-size:12px!important}
  .sa-t{width:100%!important;min-width:0!important;margin-left:0!important}
  .sa-t td{padding:2px 5px}
  .sa-sample{border-radius:0}
}
@media print{
  .sa-doc{display:block;padding:0;gap:0}
  .sa-page{width:210mm;height:297mm;min-height:0;margin:0;box-shadow:none;border:0;break-after:page;page-break-after:always;padding:0}
  .sa-body{padding:calc(43.6mm + var(--sa-off,0mm)) 25.4mm 25.4mm}
  .sa-page:last-child{break-after:auto;page-break-after:auto}
  .sa-sample{display:none}
  .sa-hdr,.sa-flame,.sa-bar{-webkit-print-color-adjust:exact;print-color-adjust:exact}
}

/* v13: the customer fills the agreement in place — every blank is a light-yellow field right on its line */
.sa-edit .sa-in{background:#fff7c2;border-bottom:1.5px solid #c9a400;min-height:40px;padding:6px 8px;color:#111;-webkit-appearance:none;appearance:none}
.sa-edit .sa-in::placeholder{color:#8a7a3a;opacity:1}
.sa-edit .sa-in.sa-ok{background:#fffbe3;border-bottom-color:#d9c66a}
.sa-edit .sa-in:focus{background:#fff;outline:2px solid #2563eb;outline-offset:1px}
.sa-edit .sa-in.sa-bad{background:#fde8e6;border-bottom:2px solid #b42318}
.sa-edit .sa-v{margin-bottom:2pt!important}
.sa-fe,.sa-body .sa-fe{display:block;color:#b42318;font:600 13px/1.3 Inter,system-ui,sans-serif!important;margin:3px 0 4px}
.sa-signbtn{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;min-height:56px;border:1.5px dashed #c9a400;background:#fff7c2;border-radius:6px;color:#5c4d00;font:600 15px Inter,system-ui,sans-serif;cursor:pointer;padding:6px}
.sa-signbtn.sa-bad{background:#fde8e6;border-color:#b42318;color:#b42318}
.sa-signbtn img{max-height:52px;max-width:100%;display:block}
.sa-signbtn.has{background:#fffbe3;border-style:solid;border-color:#d9c66a}
.sa-edit .sa-sig{border-bottom:1.5pt solid #000}
@media screen and (max-width:600px){
  .sa-edit .sa-ct tr:first-child{display:none}
  .sa-edit .sa-ct,.sa-edit .sa-ct tbody,.sa-edit .sa-ct tr,.sa-edit .sa-ct td{display:block;width:100%!important;box-sizing:border-box}
  .sa-edit .sa-ct colgroup{display:none}
  .sa-edit .sa-ct tr{border:0.5pt solid #000;margin-bottom:8px;padding:4px 0;height:auto!important}
  .sa-edit .sa-ct td{border:0!important;height:auto}
  .sa-edit .sa-ct td:first-child p{text-align:left!important;margin:0!important;font-weight:700}
  .sa-edit .sa-ct td:first-child p span::before{content:'Emergency contact '}
  .sa-edit .sa-ct td p{margin:0 0 4px!important}
  .sa-edit .sa-bt td{height:auto}
  .sa-edit .sa-bt col:first-child{width:30%!important}
  .sa-edit .sa-st,.sa-edit .sa-st tbody,.sa-edit .sa-st tr{display:block;width:100%!important}
  .sa-edit .sa-st colgroup{display:none}
  .sa-edit .sa-st tr{display:grid;grid-template-columns:1fr 1fr;column-gap:10px}
  .sa-edit .sa-st td{display:block;padding:0}
  .sa-edit .sa-in{font-size:16px!important}
}

/* ===== v14: proposal (Proposal & Agreement, Shimon's template) on the company letterhead — see CSF_PR in sa_doc.js ===== */
.csf-lh{--sa-tnr:'Times New Roman','SA Tinos',Tinos,'Liberation Serif',serif;--sa-cal:Calibri,'SA Carlito',Carlito,'Segoe UI',sans-serif;--sa-pop:Poppins,'SA Poppins',sans-serif;position:relative;width:100%;aspect-ratio:210/45;container-type:inline-size;overflow:hidden;color:#000}
.csf-lh .sa-hdr{--u:calc(100cqw / 210)}
.pr-doc{display:flex;flex-direction:column;align-items:center;gap:10px;padding:8px 0 24px;color:#000;-webkit-text-size-adjust:100%;text-size-adjust:100%}
.pr-sheet{position:relative;box-sizing:border-box;width:210mm;max-width:100%;background:#fff;box-shadow:0 1px 3px rgba(16,24,40,.12),0 8px 24px rgba(16,24,40,.08);font:10pt/1.35 Arial,'Helvetica Neue',Helvetica,'Liberation Sans',sans-serif;color:#000;overflow:hidden}
.pr-body{padding:4mm 16mm 16mm}
.pr-sheet p{margin:0}
.pr-meta{text-align:right;font-size:9pt;line-height:1.45}
.pr-meta b{font-size:10pt}
.pr-h1{text-align:center;font:700 15pt/1.2 Arial,'Helvetica Neue',Helvetica,sans-serif;margin:3mm 0 1mm;color:#000;letter-spacing:0}
.pr-proj{text-align:center;font-size:10pt;margin:0 0 2mm}
.pr-parties{display:grid;grid-template-columns:1fr 1fr;gap:8mm;margin:5mm 0 4mm}
.pr-lbl{font-size:8.5pt;letter-spacing:.06em;color:#252931;border-bottom:1px solid #000;padding-bottom:2px;margin-bottom:5px}
.pr-pt{border-collapse:collapse;width:100%}
.pr-pt td{padding:1px 0;vertical-align:top}
.pr-pt td:first-child{width:24mm;padding-right:4px}
.pr-dear{margin-top:4mm!important}
.pr-intro{margin:1mm 0 4mm!important}
.pr-tw{width:100%}
.pr-lines{width:100%;border-collapse:collapse;font-size:9.5pt}
.pr-lines th{font-weight:400;color:#465366;text-align:left;border-bottom:1px solid #000;padding:4px 5px}
.pr-lines td{padding:6px 5px;border-bottom:1px solid #d0d5dd;vertical-align:top}
.pr-lines .pr-q{width:9mm}
.pr-lines .pr-n{width:22mm;text-align:right;white-space:nowrap}
.pr-lines .pr-x{width:10mm;text-align:center}
.pr-lines tr.pr-off td{color:#98a2b3}
.pr-lines tr.pr-off .pr-d{text-decoration:line-through}
.pr-lines tr.pr-off .pr-opt{text-decoration:none}
.pr-opt{display:inline-block;margin-left:6px;font-size:8.5pt;color:#344054;border:1px solid #98a2b3;border-radius:3px;padding:0 5px;text-decoration:none}
.pr-opt label{display:inline-flex;align-items:center;gap:5px;cursor:pointer}
.pr-opt input{width:18px;height:18px;margin:0}
.pr-none{color:#98a2b3;text-align:center}
.pr-totw{display:flex;justify-content:flex-end}
.pr-tt{border-collapse:collapse;margin-top:3px;font-size:9.5pt}
.pr-tt td{padding:3px 5px;text-align:right;white-space:nowrap}
.pr-tt td:last-child{width:26mm}
.pr-tt .pr-tb td{font-weight:700;font-size:10pt}
.pr-tt .pr-ts td{font-size:9pt}
.pr-taxnote{text-align:right;font-size:8.5pt;margin:2px 0 6mm!important}
.pr-h2{font-size:10pt;margin:0 0 3mm}
.pr-sec{margin:0 0 3mm 2mm}
.pr-st{font-weight:700;font-size:9.5pt;margin:0 0 2mm}
.pr-sec p{margin:0 0 1.5mm}
.pr-ul{margin:0 0 2mm;padding-left:9mm;font-size:9.5pt}
.pr-ul li{margin:0 0 1.2mm}
.pr-terms{margin:5mm 0 0 2mm;font-size:8.5pt;line-height:1.4}
.pr-h3{font-weight:700;font-size:9.5pt;margin:0 0 2mm}
.pr-terms p{margin:0 0 1.2mm}
.pr-closing{margin:7mm 0 6mm!important;font-size:9.5pt}
.pr-sigs{display:grid;grid-template-columns:1fr 1fr;gap:10mm;break-inside:avoid;page-break-inside:avoid}
.pr-sigline{min-height:18mm;display:flex;align-items:flex-end;margin:2mm 0 2mm}
.pr-sinc .pr-sigline{min-height:12mm}
.pr-acc .pr-sigline{border-bottom:1px solid #000}
.pr-sigimg{max-height:17mm;max-width:100%;display:block}
.pr-nm{margin-top:1mm}
.pr-date{margin-top:4mm}
.pr-esig{font-size:8pt;color:#475467;margin-top:2mm}
.pr-po{font-size:9pt;margin-top:1mm}
.pr-edit .sa-in{margin:0 0 6px}
.pr-edit .pr-sigline{border-bottom:0;min-height:0;display:block}
.pr-doc .sa-sample{max-width:210mm}
@media screen and (max-width:840px){
  .pr-doc:not(.pr-fixed){gap:0;padding:0}
  .pr-doc:not(.pr-fixed) .pr-sheet{width:100%;box-shadow:none;border:1px solid #eaecf0;border-radius:10px;font-size:15px}
  .pr-doc:not(.pr-fixed) .pr-body{padding:4px 16px 22px}
  .pr-doc:not(.pr-fixed) .pr-meta{font-size:13px}.pr-doc:not(.pr-fixed) .pr-meta b{font-size:14px}
  .pr-doc:not(.pr-fixed) .pr-h1{font-size:20px;margin:12px 0 4px}
  .pr-doc:not(.pr-fixed) .pr-parties{grid-template-columns:1fr;gap:12px;margin:14px 0}
  .pr-doc:not(.pr-fixed) .pr-lbl{font-size:12px}
  .pr-doc:not(.pr-fixed) .pr-pt td:first-child{width:52px}
  .pr-doc:not(.pr-fixed) .pr-lines{font-size:14px}
  .pr-doc:not(.pr-fixed) .pr-lines .pr-x{display:none}
  .pr-doc:not(.pr-fixed) .pr-lines .pr-q{width:28px}
  .pr-doc:not(.pr-fixed) .pr-lines .pr-n{width:auto}
  .pr-doc:not(.pr-fixed) .pr-lines th,.pr-doc:not(.pr-fixed) .pr-lines td{padding:7px 4px}
  .pr-doc:not(.pr-fixed) .pr-opt{font-size:13px;display:inline-block;margin:4px 0 0;padding:3px 7px}
  .pr-doc:not(.pr-fixed) .pr-tt,.pr-doc:not(.pr-fixed) .pr-ul,.pr-doc:not(.pr-fixed) .pr-st,.pr-doc:not(.pr-fixed) .pr-closing{font-size:14px}
  .pr-doc:not(.pr-fixed) .pr-tt .pr-tb td{font-size:15px}.pr-doc:not(.pr-fixed) .pr-tt .pr-ts td{font-size:13px}
  .pr-doc:not(.pr-fixed) .pr-taxnote{font-size:12px;text-align:left}
  .pr-doc:not(.pr-fixed) .pr-h2{font-size:15px}
  .pr-doc:not(.pr-fixed) .pr-terms{font-size:13px}.pr-doc:not(.pr-fixed) .pr-h3{font-size:15px}
  .pr-doc:not(.pr-fixed) .pr-sigs{grid-template-columns:1fr;gap:18px}
  .pr-doc:not(.pr-fixed) .sa-sample{border-radius:0}
  .pr-edit .sa-in{font-size:16px!important}
}
@media print{
  .pr-doc{display:block;padding:0}
  .pr-sheet{width:auto;box-shadow:none;border:0;overflow:visible}
  .pr-sheet .csf-lh,.pr-sheet .sa-bar,.pr-sheet .sa-hl{-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .pr-lines tr,.pr-terms p,.pr-sec li{break-inside:avoid;page-break-inside:avoid}
  .pr-doc .sa-sample{display:none}
}
/* the older docs (invoice, report, work order, price sheet) use the same letterhead via docHeader() in app.js */
.doc .csf-lh{margin:-48px -56px 14px;width:calc(100% + 112px)}
.doc-h.doc-h2{border-bottom:0;padding-bottom:0;margin-bottom:18px;justify-content:flex-end}
@media (max-width:767px){.doc .csf-lh{margin:-22px -18px 12px;width:calc(100% + 36px)}}
.pdf-inner .doc .csf-lh{margin:0 0 14px!important;width:100%!important}
.doc::before,.doc::after{display:none!important}
.pdf-inner .pr-doc{padding:0;display:block}.pdf-inner .pr-sheet{box-shadow:none!important;border:0!important;border-radius:0!important;width:100%!important}
