/* Shared MCN interaction system. Screen-only so customer documents retain their layout. */
@media screen {
:root{--mcn-paper:#f5f5f3;--mcn-navigation:#eeefeb;--mcn-line:#e1e3dd;--ui-ease:cubic-bezier(.22,1,.36,1);--ui-shadow:0 3px 16px #18201806}
body>header{border-bottom-color:#e1e3dd}
#business-nav{padding:18px 10px;scrollbar-width:thin;scrollbar-color:#c5c8bf transparent}
#business-nav button,#business-nav .nav-drive-link{border-radius:10px;min-height:38px;transition:background-color 140ms ease,box-shadow 140ms ease,transform 100ms ease}
#business-nav button.active{background:#fff0a0;box-shadow:inset 0 0 0 1px #e4ca5770;color:#25261f;font-weight:650}
#business-nav button:hover:not(.active){background:#e0e3da}
#business-nav button:active{transform:scale(.98)}
#business-nav .nav-group summary{font-size:11px;padding-top:12px;padding-bottom:9px;letter-spacing:0;color:#656b60}
#business-nav .nav-group summary::after{transition:transform 160ms var(--ui-ease)}
main.data-view>aside{scrollbar-width:thin;scrollbar-color:#c5c8bf transparent;scroll-padding-top:24px}
main.data-view :is(.workspace-title,.settings-heading,.hr-directory-heading){align-items:center;gap:16px}
main.data-view :is(.workspace-title h1,.settings-heading h1){font-size:30px;line-height:1.15}
main.data-view :is(.register-shell,.settings-card,.hr-card,.additional-information,.profile-fields>.field-section,.module-list,.dashboard-card){border-radius:18px;border-color:var(--mcn-line);box-shadow:var(--ui-shadow)}
main.data-view :is(.register-toolbar,.hr-directory-controls){background:#fafbf8;padding:16px;gap:12px}
main.data-view .register-shell{overflow:hidden}
main.data-view .workspace-table th{background:#f7f8f4;color:#62685b;font-size:11px;font-weight:600;padding-top:14px;padding-bottom:14px}
main.data-view .workspace-table td{padding-top:16px;padding-bottom:16px;border-bottom-color:#eceee7;font-variant-numeric:tabular-nums}
main.data-view .workspace-table tbody tr:hover{background:#fffdf2}
main.data-view .workspace-table tbody tr:focus-within{background:#fff9db}
main.data-view :is(.insight-strip,.hr-metrics){border-radius:16px;background:#fff;border:1px solid var(--mcn-line);padding:20px}
main.data-view :is(.module-tabs,.profile-tabs){display:flex;flex-wrap:wrap;gap:4px;width:fit-content;max-width:100%;padding:5px;background:#eaece6;border:1px solid #e1e4dc;border-radius:13px}
main.data-view :is(.module-tabs,.profile-tabs) button{border:0;border-radius:9px;background:transparent;color:#596052;padding:9px 14px;min-height:36px}
main.data-view :is(.module-tabs,.profile-tabs) button.active{background:#fff;color:#25291f;box-shadow:0 1px 5px #18201818;font-weight:650}
:is(body>header,main.data-view>aside,dialog:not(.document-preview)) button:not(.business-marker):not(.dashboard-metric):not(:where(.gm-style *, .fleet-inline-map *)){border-radius:10px;transition:background-color 140ms ease,box-shadow 140ms ease,transform 100ms ease}
:is(body>header,main.data-view>aside,dialog:not(.document-preview)) button:enabled:active:not(.business-marker):not(.widget-drag-handle):not(:where(.gm-style *, .fleet-inline-map *)){transform:scale(.98)}
:is(main.data-view>aside,dialog:not(.document-preview)) button:disabled{cursor:default;opacity:.5}
:is(main.data-view>aside,dialog:not(.document-preview)) :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),select,textarea){border-radius:10px;background:#fafbf8;border:1px solid #dce0d5;padding:11px 12px;transition:border-color 140ms ease,box-shadow 140ms ease;min-width:0}
:is(main.data-view>aside,dialog:not(.document-preview)) :is(input,select,textarea):focus{outline:none;border-color:#9a8100;box-shadow:0 0 0 3px #ffd60a25;background:#fff}
:is(main.data-view>aside,dialog:not(.document-preview)) :is(input[type=checkbox],input[type=radio]){accent-color:#a98b00}
:is(main.data-view>aside,dialog:not(.document-preview)) :is(button,a,summary):focus-visible{outline:2px solid #9a8100;outline-offset:3px}
main.data-view .field-section{border-color:var(--mcn-line)}
main.data-view :is(.record-edit-toolbar,#record-top){gap:10px;padding:14px 0;background:var(--mcn-paper)}
main.data-view .hr-metrics>span{border:0;border-radius:0;box-shadow:none;background:transparent}
main.data-view .settings-card{padding:24px}
main.data-view .settings-actions{gap:9px}
main.data-view .module-board>div{border-radius:15px;background:#edeFE9;padding:12px}
main.data-view .module-board .module-card{border-radius:12px;box-shadow:var(--ui-shadow)}
dialog:not(.document-preview){border-radius:22px;border:1px solid #dfe3d8;box-shadow:0 24px 80px #18201833;padding:30px;animation:mcn-dialog-in 180ms var(--ui-ease)}
dialog::backdrop{background:#18201859}
dialog:not(.document-preview) h2{padding-right:28px;line-height:1.2}
#close-dialog{border-radius:50%;width:32px;height:32px;display:grid;place-items:center;padding:0;background:#eceee7;color:#4f5648;top:14px;right:14px}
#toast{border-radius:14px;box-shadow:0 8px 32px #18201825}
@keyframes mcn-dialog-in{from{opacity:0;transform:translateY(8px) scale(.985)}to{opacity:1;transform:none}}
@media(max-width:780px){main.data-view>aside{padding:22px 16px}main.data-view :is(.workspace-title h1,.settings-heading h1){font-size:26px}main.data-view :is(.module-tabs,.profile-tabs){width:100%;box-sizing:border-box;flex-wrap:nowrap;overflow-x:auto}main.data-view :is(.module-tabs,.profile-tabs) button{white-space:nowrap;flex-shrink:0}dialog:not(.document-preview){padding:24px 18px}}
.reduce-motion *, .reduce-motion *::after{animation:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){*,*::after{animation:none!important;transition:none!important}}
}

/* Statement: one letterhead, aligned amounts and a clear final balance. */
.customer-document.account-statement .document-meta{grid-template-columns:1fr 1fr;gap:24px;background:white;border-top:1px solid #dedede;padding:16px 0;margin-bottom:20px}
.customer-document.account-statement .document-meta>div:last-child{text-align:right;line-height:1.6}
.customer-document.account-statement .document-lines{width:100%;table-layout:auto;font-size:9pt}
.customer-document.account-statement .document-lines th,.customer-document.account-statement .document-lines td{padding:10px 6px;vertical-align:top}
.customer-document.account-statement .document-number{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.customer-document.account-statement .document-totals{width:360px;max-width:100%;margin:24px 0 20px auto;break-inside:avoid}
.customer-document.account-statement .document-totals>div{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:baseline}
.customer-document.account-statement .document-totals dd{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.customer-document.account-statement .document-grand-total{border-top:2px solid #e4bd00;padding-top:12px;font-weight:700;font-size:12pt}
.customer-document.account-statement .document-tax-note{font-size:8pt;line-height:1.5;color:#606060}
@media print{.customer-document.account-statement .document-letterhead{position:static}.customer-document.account-statement .document-meta{break-inside:avoid}}

/* Original MCN template list accents, verified against the source templates. */
.document-yellow-marker{color:#f1c40f!important;font-weight:inherit;print-color-adjust:exact;-webkit-print-color-adjust:exact}

.document-yellow-copy{background:transparent!important;color:#f1c40f!important;print-color-adjust:exact;-webkit-print-color-adjust:exact}.document-yellow-copy strong,.document-yellow-copy em{color:inherit!important}

/* Compact job register: neutral sort controls and consistent filter widths. */
#details .jobs-table-filters{display:flex;flex-direction:row;flex-wrap:wrap;gap:12px;margin-bottom:16px}
#details .jobs-table-filters select{width:190px;flex:0 1 190px;min-width:160px;margin:0}
#details .jobs-data-table th button,#details .jobs-data-table td .job-table-link{display:inline-flex;align-items:center;justify-content:flex-start;gap:6px;min-height:0;height:auto;padding:0!important;margin:0;border:0!important;background:transparent!important;box-shadow:none!important;font:inherit;line-height:1.5;text-align:left;white-space:normal}
#details .jobs-data-table th button{font-size:12px;font-weight:600;color:#646b75}
#details .jobs-data-table td .job-table-link{display:block;color:#303842}
#details .jobs-data-table th{padding:14px;vertical-align:middle}

#details .jobs-data-table select.job-status-select{width:100%;min-width:110px;min-height:34px;height:auto;margin:0;padding:6px 28px 6px 9px;border:1px solid transparent;border-radius:6px;font-size:12px;font-weight:600;line-height:1.4;background-position:right 8px center}#details .jobs-data-table select.job-status-select:hover{border-color:#c4c9d0}#details .jobs-data-table select.job-status-select:disabled{opacity:.6;cursor:wait}#details .jobs-data-table select.job-status-select:focus-visible{outline:2px solid #e6bf00;outline-offset:2px}

/* Unfilled template placeholders remain visible in previews and PDF output. */
.customer-document .document-placeholder,
.document-writing .writing-placeholder,
.customer-document .document-placeholder *,
.document-writing .writing-placeholder *{color:#b42318!important;background:#fee4e2!important;box-decoration-break:clone;-webkit-box-decoration-break:clone;border-radius:3px;print-color-adjust:exact;-webkit-print-color-adjust:exact}

#details .jobs-data-table .job-clickable-row{cursor:pointer}
#details .jobs-data-table .job-clickable-row:hover{background:#f8f9fa}
#details .jobs-data-table select.job-status-select{border-color:#d5d9df;cursor:pointer}

.jobs-data-table .job-table-number{display:block;margin-top:4px;font-size:12px;line-height:1.5;color:#737780;font-variant-numeric:tabular-nums}

#details .jobs-data-table th:first-child{width:17%}#details .jobs-data-table th:nth-child(2){width:17%}#details .jobs-data-table th:nth-child(4){width:17%}#details .jobs-data-table th:nth-child(5){width:12%}

/* Quote editor: one workflow, MCN controls, separate customer preview. */
dialog.quote-workspace{width:min(1200px,96vw);max-width:1200px}
.quote-workspace [hidden]{display:none!important}
.quote-tabs{display:flex;gap:24px;border-bottom:1px solid #ddd;margin-bottom:20px}
.quote-tabs button{border:0;border-radius:0;background:none;padding:12px 2px;color:#666}
.quote-tabs button[aria-selected=true]{border-bottom:3px solid #d3ad22;color:#17181a;font-weight:600}
.quote-details{gap:20px}.quote-details .template-picker{margin:0}
.quote-rich{min-height:160px;border:1px solid #d7d9dc;border-radius:6px;background:#fff;padding:18px;line-height:1.6;font-weight:400;color:#202326;max-height:460px;overflow:auto}
.quote-rich:focus{outline:2px solid #d3ad22;outline-offset:2px}
.quote-rich p{margin:0 0 12px}.quote-rich .document-placeholder{background:#fee4e2;color:#b42318;border-radius:3px}
.quote-save-actions{display:flex;gap:10px;flex-wrap:wrap;position:sticky;bottom:-24px;background:#fff;padding:18px 0;border-top:1px solid #ddd;z-index:2}
.quote-preview{background:#eee;padding:24px}.quote-preview .customer-document{max-width:850px;margin:auto;background:#fff;padding:36px}
.quote-workspace #quote-total{display:flex;justify-content:flex-end;gap:24px;flex-wrap:wrap}
.quote-workspace #quote-total span{display:grid;gap:6px}.quote-workspace #quote-total small{color:#666}
.customer-document .document-meta dl>div{grid-template-columns:90px minmax(0,1fr);gap:12px}
.customer-document .document-meta dt{white-space:normal}.customer-document .document-meta dd{margin:0;overflow-wrap:anywhere}
@media(max-width:700px){.quote-preview{padding:0}.quote-preview .customer-document{padding:20px}.quote-save-actions{bottom:0}.quote-save-actions button{flex:1}.quote-details{grid-template-columns:1fr}}
@media print{.quote-workspace .quote-tabs,.quote-workspace .quote-save-actions,.quote-workspace .quote-details{display:none!important}.quote-workspace .quote-preview{display:block!important;padding:0}.customer-document .document-meta dl>div{grid-template-columns:75px minmax(0,1fr)}}
#modal.quote-workspace{width:min(1200px,96vw);max-width:1200px}
.quote-workspace .document-item{display:grid;grid-template-columns:repeat(6,minmax(75px,1fr));gap:12px;border:1px solid #e1e2e4;padding:16px;border-radius:8px;margin-bottom:12px}
.quote-workspace .document-item .item-description{grid-column:span 3}
.quote-workspace .document-item .item-controls{grid-column:1/-1;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.quote-workspace .document-item .item-controls output{margin-right:auto}
.quote-pricing>button{margin-right:8px}
.document-signatures{display:grid;grid-template-columns:1fr 1fr;gap:36px;break-inside:avoid;margin:24px 0}
.document-signatures>div>p:first-child{min-height:32px;font-weight:600}
.document-signatures p:not(:first-child){display:grid;grid-template-columns:80px 1fr;align-items:end;gap:12px;min-height:38px}
.document-signatures span{display:block;min-height:30px;border-bottom:1px solid #777}
@media(max-width:700px){.quote-workspace .document-item{grid-template-columns:repeat(2,minmax(0,1fr))}.quote-workspace .document-item .item-description{grid-column:1/-1}.document-signatures{gap:18px}}
.stage-summary button.stage-stat{font:inherit;text-align:left;cursor:pointer;background:transparent;color:inherit;border:1px solid #deded8;border-radius:8px;padding:14px 18px}.stage-summary button.stage-stat[aria-pressed=true]{background:#fff4aa;border-color:#cfb500}.stage-summary button.stage-stat:focus-visible{outline:2px solid #252525;outline-offset:3px}.quote-delivery{padding:16px 0;border-bottom:1px solid #ddd;margin-bottom:18px}.quote-delivery input{max-width:320px}
/* Quote workspace: shared quiet surfaces, one primary save action. */
#modal.quote-workspace{--quote-line:#e2e4e8;--quote-muted:#707680;--quote-surface:#f7f8fa;padding:28px; background:var(--quote-surface);border:1px solid var(--quote-line);border-radius:12px}
#modal.quote-workspace>h2{font-size:26px;line-height:1.2;letter-spacing:-.025em;margin:0 0 24px;font-weight:650}
.quote-workspace .quote-tabs{display:inline-flex;justify-self:start;gap:4px;padding:4px;border:1px solid var(--quote-line);border-radius:10px;background:#eceef1;margin:0 0 8px}
.quote-workspace .quote-tabs button{border:0;border-radius:7px;padding:9px 18px;font-size:14px;line-height:1.4;transition:background .18s ease,color .18s ease}
.quote-workspace .quote-tabs button[aria-selected=true]{background:#fff;color:#25272b;box-shadow:0 1px 3px #18202a12;border:0}
.quote-workspace .quote-details{gap:20px 24px;padding:24px;background:#fff;border:1px solid var(--quote-line);border-radius:12px;min-width:0}
.quote-workspace label{font-size:13px;font-weight:500;line-height:1.5;gap:7px;min-width:0;color:#555c66}
.quote-workspace :is(input,select,textarea){font-size:14px;font-weight:400;line-height:1.5;min-width:0;max-width:100%;border-radius:8px}
.quote-workspace .quote-rich{border-radius:8px;padding:20px;font-size:14px;line-height:1.65;min-height:130px}
.quote-workspace .text-format-toolbar{display:flex;gap:4px;padding:6px 0;flex-wrap:wrap}
.quote-workspace .text-format-toolbar button{min-height:32px;padding:5px 10px;font-size:12px;box-shadow:none;background:#f7f8fa;border-color:transparent}
.quote-workspace .document-item{grid-template-columns:minmax(110px,1fr) minmax(180px,3fr) repeat(3,minmax(85px,1fr));gap:14px;padding:18px;border-radius:10px;background:#fafbfc}
.quote-workspace .document-item .item-description{grid-column:auto}
.quote-workspace .quote-line-options{grid-column:1/-1;border-top:1px solid var(--quote-line);padding-top:10px}
.quote-line-options summary{font-size:12px;color:var(--quote-muted);cursor:pointer;line-height:1.5;padding:4px 0}
.quote-line-options-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:12px;padding-top:14px}
.quote-workspace .quote-line-options-grid button{font-size:12px;min-height:34px;align-self:end}
.quote-workspace .item-controls{border:0;padding:0;justify-content:flex-end}.quote-workspace .item-controls output{margin:0;font-size:14px;font-weight:600;font-variant-numeric:tabular-nums}
.quote-workspace .quote-save-actions{display:flex;align-items:center;gap:12px;bottom:0;padding:16px 0 0;background:var(--quote-surface);border-color:var(--quote-line);margin-top:8px}
.quote-workspace .quote-save-actions .quote-delete{margin-right:auto;background:transparent;border-color:transparent;box-shadow:none;color:#ac3030}
.quote-workspace .quote-save-outcome{display:flex;align-items:center;gap:8px;margin:0}.quote-workspace .quote-save-outcome select{width:auto;min-width:145px}
.quote-workspace .quote-preview{border:1px solid var(--quote-line);border-radius:12px;background:#eceef1;padding:24px;overflow:auto}
@media(max-width:760px){#modal.quote-workspace{padding:16px}.quote-workspace .quote-details{padding:16px;gap:16px}.quote-workspace .document-item{grid-template-columns:repeat(2,minmax(0,1fr))}.quote-workspace .document-item .item-description{grid-column:1/-1}.quote-workspace .quote-save-actions{flex-wrap:wrap}.quote-workspace .quote-save-actions button{flex:0 1 auto}.quote-workspace .quote-save-outcome{flex:1 1 100%}.quote-workspace .quote-save-outcome select{flex:1}}
#modal.quote-workspace .quote-save-actions{justify-content:flex-end;padding:16px 0;align-items:center}
#modal.quote-workspace .quote-save-outcome{display:flex;flex-direction:row;align-items:center;gap:10px;white-space:nowrap}
#modal.quote-workspace .quote-save-outcome select{margin:0}
#modal.quote-workspace .template-picker{padding:0;border:0;background:transparent}
#modal.quote-workspace .document-item>label{align-self:start}
#modal.quote-workspace .quote-tabs button[aria-selected=false]{background:transparent;box-shadow:none}
@media(prefers-reduced-motion:reduce){.quote-workspace *{transition:none!important}}
/* Status filters share the dashboard's quiet metric-card hierarchy. */
#details .dashboard-status-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:0;background:#fff;border:1px solid #e2e4e8;border-radius:12px;overflow:hidden;margin:0 0 28px;padding:0}
#details .dashboard-status-summary button.stage-stat{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:12px;min-height:126px;padding:22px 24px;margin:0;border:0;border-right:1px solid #e2e4e8;border-radius:0;background:transparent;box-shadow:none;text-align:left;line-height:1.3;transition:background .18s ease}
#details .dashboard-status-summary button.stage-stat:last-child{border-right:0}
#details .dashboard-status-summary .stage-stat span{order:-1;font-size:13px;font-weight:500;color:#707680;line-height:1.4}
#details .dashboard-status-summary .stage-stat strong{font-size:32px;font-weight:650;letter-spacing:-.03em;line-height:1.15;font-variant-numeric:tabular-nums;color:#25272b}
#details .dashboard-status-summary button.stage-stat:hover{background:#f7f8fa}
#details .dashboard-status-summary button.stage-stat[aria-pressed=true]{background:#fff6c2;box-shadow:inset 0 -3px #ffda00}
#details .dashboard-status-summary button.stage-stat:focus-visible{outline:2px solid #25272b;outline-offset:-4px}
@media(max-width:600px){#details .dashboard-status-summary{grid-template-columns:repeat(2,minmax(0,1fr))}#details .dashboard-status-summary button.stage-stat{min-height:105px;padding:18px;border-bottom:1px solid #e2e4e8}}

/* Statement status sits beneath the due date, without widening the register. */
.customer-document.account-statement .statement-due-status{display:flex;align-items:center;gap:5px;margin-top:4px;color:#626975;font-size:8pt;font-weight:500;line-height:1.4;white-space:nowrap;print-color-adjust:exact;-webkit-print-color-adjust:exact}
.customer-document.account-statement .statement-due-status.is-overdue{color:#b42318}
.customer-document.account-statement .statement-due-dot{display:inline-block;flex:0 0 5px;width:5px;height:5px;border:1px solid currentColor;border-radius:50%;background:currentColor}
.customer-document.account-statement .statement-job-reference{min-width:100px;max-width:190px;white-space:normal;overflow-wrap:anywhere;text-align:left}