.workshop-flow{padding:22px;margin:22px 0;border:1px solid #d5e5de;border-radius:14px;background:#f8fbfa;color:#173d32}.workshop-flow h3{margin-top:0}.wf-stages{display:flex;flex-wrap:wrap;gap:7px;list-style:none;padding:0}.wf-stages li{font-size:12px;padding:8px 10px;border-radius:8px;background:#e9efec;color:#657b73}.wf-stages .done{background:#dcf3e8;color:#176647}.wf-stages .current{background:#175c46;color:white}.wf-actions{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin:14px 0}.wf-actions button,.wf-link{display:inline-flex;align-items:center;min-height:38px;padding:9px 13px;border:0;border-radius:8px;background:#175c46;color:#fff;font:inherit;font-size:13px;text-decoration:none;cursor:pointer}.wf-actions .secondary{background:#e7efeb;color:#234e40}.wf-help{font-size:13px;color:#61776f;line-height:1.6}.workshop-flow [role=alert]{color:#b43125}.wf-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;padding:18px;border:1px solid #d5e5de;border-radius:10px;background:white}.wf-full{grid-column:1/-1}.workshop-flow label{display:flex;flex-direction:column;gap:6px;font-size:13px}.workshop-flow input,.workshop-flow select,.workshop-flow textarea{box-sizing:border-box;width:100%;min-width:0;padding:10px;border:1px solid #c8ddd3;border-radius:7px;background:white;color:#173d32;font:inherit}.workshop-flow .wf-check{flex-direction:row;align-items:center}.wf-check input{width:auto}.wf-quotation{margin-top:20px;overflow-x:auto}.wf-line{display:grid;grid-template-columns:minmax(180px,3fr) 1fr 1fr 80px 36px;align-items:center;gap:10px;padding:12px 0;border-bottom:1px solid #d5e5de}.wf-line button{border:0;border-radius:7px;padding:8px;cursor:pointer}.wf-invoice{background:#eaf5ef;padding:15px;border-radius:10px}.workshop-flow table{width:100%;border-collapse:collapse}.workshop-flow th,.workshop-flow td{text-align:left;padding:10px;border-bottom:1px solid #d5e5de}.workshop-flow summary{cursor:pointer;font-weight:600;padding:10px 0}.wf-print{font:14px Arial,sans-serif;color:#173d32;max-width:900px;margin:35px auto;padding:25px}.wf-print header{border-bottom:3px solid #175c46;padding-bottom:20px}.wf-print h1{font-size:28px}.wf-print table{width:100%;border-collapse:collapse;margin:25px 0}.wf-print th,.wf-print td{padding:12px 9px;border-bottom:1px solid #d5e5de;text-align:left}.wf-print th{background:#eaf3ef}.wf-print p{line-height:1.7;white-space:pre-wrap}.wf-print footer{border-top:1px solid #d5e5de;margin-top:45px;padding-top:25px}.wf-print dl{display:grid;grid-template-columns:1fr 2fr;gap:15px}.wf-total{text-align:right;font-size:18px;font-weight:bold}@media(max-width:700px){.wf-line{grid-template-columns:1fr 1fr}.wf-line>label:first-child{grid-column:1/-1}.wf-form{grid-template-columns:1fr}.workshop-flow{padding:13px}}@media print{.wf-print{margin:0;padding:0;max-width:none}.wf-print header{break-after:avoid}.wf-print tr{break-inside:avoid}@page{size:A4;margin:16mm}}

/* Workflow hierarchy shared by ERP and Workshop staff portal. */
.workshop-flow{background:#fff;padding:24px;border-color:#dce6e1;box-shadow:0 3px 16px #163e3105}
.workshop-flow .wf-heading{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-bottom:20px;border-bottom:1px solid #e5ece8}
.wf-eyebrow{font-size:10px;letter-spacing:1.8px;font-weight:700;color:#6f847c}.workshop-flow .wf-heading h3{font-size:22px;margin:5px 0 6px}.wf-heading p{font-size:13px;color:#70827a;margin:0}
.workshop-flow button,.workshop-flow .wf-link{font-family:inherit;font-size:13px;font-weight:600;border-radius:8px;min-height:40px;padding:10px 16px;cursor:pointer;box-sizing:border-box;transition:background .15s,box-shadow .15s}
.workshop-flow button:focus-visible,.workshop-flow .wf-link:focus-visible{outline:3px solid #62b9e6;outline-offset:3px}.workshop-flow button:disabled{opacity:.5;cursor:wait}
.workshop-flow [data-wf-refresh]{background:#fff;color:#52695f;border:1px solid #d5e0da;white-space:nowrap;display:flex;align-items:center;gap:8px}
.wf-progress-key{display:flex;gap:20px;font-size:11px;color:#73857c;margin-top:20px}.wf-progress-key span:before{content:'';display:inline-block;width:7px;height:7px;border-radius:50%;margin-right:6px;background:#dbe3df}.wf-progress-key span:first-child:before{background:#479b78}.wf-progress-key span:nth-child(2):before{background:#18694b}
.workshop-flow .wf-stages{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin:12px 0 20px}.workshop-flow .wf-stages li{display:flex;align-items:center;gap:9px;min-height:48px;padding:9px 12px;background:#f6f8f7;border:1px solid #e8eeea;color:#7b8b83;font-size:12px;line-height:1.4}.wf-step-number{flex-shrink:0;display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:#e9eeeb;font-size:11px;font-weight:700}.workshop-flow .wf-stages .done{background:#f1f8f4;color:#337451;border-color:#dceee3}.done .wf-step-number{background:#dcefe2;color:#267047}.workshop-flow .wf-stages .current{background:#175c46;color:#fff;border-color:#175c46;box-shadow:0 2px 5px #175c4618}.current .wf-step-number{background:#ffffff24;color:#fff}
.workshop-flow [role=alert]:empty{display:none}.workshop-flow .wf-current-status{background:#f4f8f6;border-left:3px solid #318465;border-radius:0 8px 8px 0;padding:13px 16px;font-size:13px;color:#526b5f;margin:16px 0}
.workshop-flow .wf-actions{gap:10px}.workshop-flow .wf-actions[hidden]{display:none}.wf-tool-label{font-size:10px;letter-spacing:1.2px;font-weight:700;color:#7e8d85;margin-right:5px}.wf-document-tools{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:14px 0;border-bottom:1px solid #e8eeea}.workshop-flow .wf-document-tools button{background:#fff;border:1px solid #dbe3df;color:#496255;min-height:36px;font-size:12px;padding:8px 12px}.workshop-flow .wf-actions [data-wf-op=skip_quotation]{background:#fff8e9;color:#875b15;border:1px solid #ead7ab}.workshop-flow .wf-actions [data-wf-op=reopen]{background:#fff;color:#6a6252;border:1px solid #ddd8cd}.workshop-flow .wf-actions [data-wf-op=gate_out],.workshop-flow .wf-actions [data-wf-op=gate_return]{background:#235b83}.workshop-flow .wf-actions [data-wf-op=invoice_sent]{background:#f0f5fb;color:#315f85;border:1px solid #d2dfed}
.workshop-flow .wf-quotation{border:1px solid #dce6e0;border-radius:12px;margin-top:22px;background:#fff;overflow:hidden}.workshop-flow .wf-quotation>summary{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;background:#f7f9f8;font-size:15px;border-bottom:1px solid #e2e9e4}.wf-quotation>summary>span:first-child:before{content:'\25B8 ';margin-right:10px;color:#70877a}.wf-quotation[open]>summary>span:first-child:before{content:'\25BE '}.wf-revision{font-size:11px;color:#6a8174;background:#e8efea;padding:5px 9px;border-radius:5px;font-weight:500}.workshop-flow [data-wf-quote]{padding:18px 20px}.workshop-flow .wf-line{grid-template-columns:minmax(180px,3fr) 1fr 1fr 80px 36px;align-items:end;padding:15px 0;gap:12px}.workshop-flow [data-q-total]{align-self:center;text-align:right;font-weight:600;color:#315845;font-variant-numeric:tabular-nums}.workshop-flow [data-q-remove]{background:#fff2f1;color:#bd4c43;border:1px solid #f1d7d3;min-height:36px;padding:7px;font-size:18px;align-self:center}.workshop-flow .wf-actions .wf-add-part{background:#edf5fa;color:#2c6289;border:1px solid #cbdfea}.workshop-flow .wf-actions .wf-add-labour{background:#f2eff9;color:#68518b;border:1px solid #ded5ed}.workshop-flow [data-wf-total]{text-align:right;padding:14px;background:#f7f9f8;border-radius:8px;font-size:14px;font-weight:600;color:#315845}.wf-quote-footer{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:18px;border-top:1px solid #e5ebe7;padding-top:18px}.wf-quote-footer>span{font-size:12px;color:#7c8b82}.workshop-flow .wf-quote-footer button{background:#175c46;color:white;border:1px solid #175c46;white-space:nowrap}.workshop-flow .wf-help{font-size:12px;padding:4px 0;color:#7b8a82;max-width:900px}
@media(max-width:900px){.workshop-flow .wf-stages{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:700px){.workshop-flow{padding:15px}.workshop-flow .wf-heading{align-items:flex-start}.workshop-flow .wf-heading h3{font-size:19px}.workshop-flow [data-wf-refresh]{font-size:11px;padding:8px}.workshop-flow .wf-stages{grid-template-columns:repeat(2,minmax(0,1fr))}.workshop-flow .wf-stages li{padding:8px;font-size:11px}.workshop-flow [data-wf-quote]{padding:12px}.workshop-flow .wf-line{grid-template-columns:1fr 1fr}.workshop-flow .wf-line>label:first-child{grid-column:1/-1}.wf-quote-footer{align-items:stretch;flex-direction:column}.wf-tool-label{width:100%}.wf-progress-key{gap:12px;font-size:10px}.workshop-flow .wf-quotation>summary{padding:14px}}

.workshop-flow .wf-stages li:has(.wf-stage-button){padding:0}.workshop-flow .wf-stage-button{display:flex;align-items:center;gap:9px;width:100%;min-height:48px;padding:9px 12px;background:transparent;color:inherit;border:0;text-align:left;font-size:12px;line-height:1.4;font-weight:inherit;border-radius:8px}.workshop-flow .wf-stage-button:hover{background:#00000006}.workshop-flow .wf-stages .wf-selected{outline:2px solid #3886ad;outline-offset:2px}.wf-stage-view{border:1px solid #d3e2eb;background:#f7fafc;border-radius:10px;padding:18px;margin:18px 0}.wf-stage-view[hidden]{display:none!important}.wf-stage-heading{display:flex;align-items:center;justify-content:space-between;gap:10px}.wf-stage-heading h4{margin:0;font-size:15px;color:#2b5269}.workshop-flow .wf-stage-heading button{border:1px solid #d9e3e9;background:white;color:#536d7c;font-size:18px;padding:4px 10px;min-height:30px}.wf-stage-view dl{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:18px 0}.wf-stage-view dt{font-size:11px;color:#7c8d96;margin-bottom:5px}.wf-stage-view dd{margin:0;font-size:13px;color:#315345;overflow-wrap:anywhere}.wf-stage-table{overflow:auto}.wf-stage-view .wf-actions:empty{display:none}@media(max-width:700px){.wf-stage-view{padding:13px}.wf-stage-view dl{grid-template-columns:1fr 1fr}.workshop-flow .wf-stage-button{padding:8px;font-size:11px}}

.wf-temporary{margin:0 20px 20px;padding:16px;border:1px solid #ecd8b2;background:#fffbf2;border-radius:9px}.wf-temporary h4{margin:0 0 8px;color:#7c5e28;font-size:14px}.wf-temporary h4 small{margin-left:8px;border:1px solid #dfc893;border-radius:4px;padding:3px 6px;font-size:10px;font-weight:500}.wf-temporary p{font-size:12px;color:#8a7857;line-height:1.6}.wf-temporary table{font-size:12px}.workshop-flow [data-wf-add-temp]{background:#fff8e9;color:#875b15;border:1px solid #ead7ab}@media print{.wf-temporary{display:none!important}}

/* Compact Proforma line editor */
.workshop-flow .wf-parts-table{border:1px solid #d6e4df;border-radius:10px;margin-bottom:12px;background:#fff}
.workshop-flow .wf-parts-head,.workshop-flow .wf-line{display:grid;grid-template-columns:32px minmax(95px,.8fr) minmax(220px,2.4fr) minmax(70px,.55fr) minmax(90px,.7fr) minmax(95px,.75fr) 34px;gap:12px;align-items:center;padding:10px 12px;margin:0;border:0;border-bottom:1px solid #e1ebe7}
.workshop-flow .wf-parts-head{font-size:10px;text-transform:uppercase;letter-spacing:.06em;background:#f7faf9;color:#627b71;border-radius:10px 10px 0 0}
.workshop-flow .wf-line:last-child{border-bottom:0}.workshop-flow .wf-line label{margin:0;min-width:0}.workshop-flow .wf-line label>span{display:none}.workshop-flow .wf-line input{margin:0;min-height:36px;padding:8px 10px;font-size:13px;width:100%;box-sizing:border-box}.workshop-flow .wf-line [hidden]{display:none!important}
.workshop-flow .wf-code-cell input,.workshop-flow .wf-line [data-q-total]{background:#f2f7f5}.workshop-flow .wf-line [data-q-total]{padding:9px 10px;border:1px solid #d6e4df;border-radius:7px;text-align:right;font-size:13px}.workshop-flow .wf-row-number{border-radius:7px;background:#edf5f1;text-align:center;padding:5px;font-size:12px}.workshop-flow .wf-line [data-q-remove]{width:32px;height:34px;min-height:0;padding:0;margin:0}.workshop-flow .wf-product-cell{position:relative;min-width:0}.workshop-flow .wf-product-cell [data-q-desc]:not([hidden]){margin-top:6px}.workshop-flow [data-q-kind]:empty{display:none}.workshop-flow [data-q-kind]{font-size:11px;color:#8d631c}.workshop-flow .wf-product-results{position:absolute;top:38px;left:0;right:0;z-index:25;max-height:240px;overflow:auto;border:1px solid #b9d6c9;background:#fff;border-radius:8px;box-shadow:0 8px 22px #153d3026;padding:5px;font-size:12px}.workshop-flow .wf-product-results button{display:flex;gap:8px;align-items:center;width:100%;text-align:left;background:#fff;color:#214b3b;border:0;padding:9px 7px;margin:0;border-radius:5px;font-weight:400;min-height:36px}.workshop-flow .wf-product-results button:hover,.workshop-flow .wf-product-results button:focus{background:#eaf5ef}.workshop-flow .wf-product-results button span{flex:1}.workshop-flow .wf-product-results button small{white-space:nowrap}
@media(max-width:800px){.workshop-flow .wf-parts-head{display:none}.workshop-flow .wf-line{grid-template-columns:30px minmax(0,1fr) minmax(0,1fr) 34px;gap:8px}.workshop-flow .wf-code-cell{grid-column:2/4}.workshop-flow .wf-product-cell{grid-column:1/-1}.workshop-flow .wf-line label>span{display:block;font-size:11px;margin-bottom:4px}.workshop-flow .wf-line [data-q-remove]{grid-column:4;grid-row:1}.workshop-flow .wf-line [data-q-total]{grid-column:3/5}.workshop-flow .wf-product-results{top:56px}}

/* One compact, horizontally scrollable stage strip on every screen size. */
.workshop-flow{padding-top:12px;padding-bottom:12px}
.workshop-flow .wf-progress-key{margin-top:0;gap:14px;font-size:10px}
.workshop-flow .wf-stages{display:flex;flex-wrap:nowrap;gap:5px;margin:8px 0 10px;padding:2px 2px 7px;max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:thin}
.workshop-flow .wf-stages li{box-sizing:border-box;flex:0 0 auto;min-height:34px;padding:5px 8px;gap:6px;font-size:11px;white-space:nowrap;border-radius:6px}
.workshop-flow .wf-stages li:has(.wf-stage-button){padding:0}
.workshop-flow .wf-stages .wf-stage-button{width:auto;min-height:34px;padding:5px 8px;gap:6px;font-size:11px;white-space:nowrap;border-radius:6px}
.workshop-flow .wf-stages .wf-step-number{width:19px;height:19px;font-size:10px}
@media(pointer:coarse){.workshop-flow .wf-stages li,.workshop-flow .wf-stages .wf-stage-button{min-height:40px}}
@media print{.workshop-flow .wf-stages{flex-wrap:wrap;overflow:visible}}

.wf-job-heading-row{display:flex;align-items:baseline;gap:10px 20px;flex-wrap:wrap;margin:0 0 12px}.wf-job-heading-row h2{margin:0!important;flex-shrink:0}.wf-job-heading-row .wf-completed-text{font-size:12px;line-height:1.6;color:#327a59;flex:1;min-width:180px}html[data-ui-theme=dark] .wf-job-heading-row .wf-completed-text{color:#b6d4c3}

.wf-accept-panel{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px;margin-bottom:18px;border:1px solid #8dbfa7;border-radius:12px;background:#edf8f1}.wf-accept-panel h3{margin:0 0 5px}.wf-accept-panel p{margin:0;font-size:13px}.workshop-flow .wf-accept-panel button{min-height:58px;padding:15px 26px;background:#176247;color:#fff;border:1px solid #176247;font-size:17px;font-weight:700}.wf-accepted-note{color:#26704e;font-size:13px}html[data-ui-theme=dark] .wf-accept-panel{background:#244737!important;border-color:#568e72!important;color:#e3eee9!important}html[data-ui-theme=dark] .wf-accepted-note{color:#b6e2ca}@media(max-width:700px){.wf-accept-panel{flex-direction:column;align-items:stretch}.wf-accept-panel button{width:100%}}

@media screen {
 html[data-ui-theme="dark"] .workshop-flow{background:#1b3027!important;color:#dfede5!important;border-color:#3f5e4c!important}
 html[data-ui-theme="dark"] .workshop-flow :is(.wf-quotation,.wf-form,.wf-invoice,.wf-product-results){background:#1b3027!important;color:#dfece5!important;border-color:#3f5e4c!important}
 html[data-ui-theme="dark"] .workshop-flow .wf-quotation>summary{background:#243e31!important;color:#dfede5!important;border-color:#456352!important}
 html[data-ui-theme="dark"] .workshop-flow :is(.wf-revision,.wf-line,.wf-row-number,[data-wf-total]){background:#284636!important;color:#dceee2!important;border-color:#456352!important}
 html[data-ui-theme="dark"] .workshop-flow :is(label,[data-q-total],.wf-quote-footer>span,.wf-help){color:#bfd5c7!important}
 html[data-ui-theme="dark"] .workshop-flow :is(input,select,textarea){background:#142a20!important;color:#e2eee6!important;border-color:#537461!important}
 html[data-ui-theme="dark"] .workshop-flow :is(input,textarea)::placeholder{color:#a9c2b3!important}
 html[data-ui-theme="dark"] .workshop-flow .wf-product-results button{background:#1b3027!important;color:#dceee2!important}
 html[data-ui-theme="dark"] .workshop-flow .wf-product-results button:is(:hover,:focus){background:#30523e!important}
 html[data-ui-theme="dark"] .workshop-flow .wf-quote-footer{border-color:#456352!important}
 html[data-ui-theme="dark"] .workshop-flow [data-q-remove]{background:#482b29!important;color:#ffb7ac!important;border-color:#785049!important}
}
.workshop-flow .wf-line [data-q-remove]{display:inline-flex!important;align-items:center;justify-content:center;width:34px!important;height:36px;min-height:36px;padding:0!important;line-height:1;overflow:hidden}
.workshop-flow .wf-line [data-q-remove] svg{width:16px!important;height:16px!important;flex:0 0 16px}
.workshop-flow .wf-line [data-q-remove]:has(svg){font-size:0!important}