body { font-family: 'Inter', sans-serif; }
        .s2-settings-nav button.active { color: #fff; background: #FF5500; box-shadow: 0 4px 12px #ff550033; }
        .s2-settings-panel[hidden] { display: none !important; }
        .s2-trade-chip[aria-pressed="true"] { background: #0B132B; border-color: #0B132B; color: #fff; }
        .s2-doc-accreditations img { max-width: 64px; max-height: 36px; object-fit: contain; }
        .s2-paper-invoice { position:relative; box-sizing:border-box; width:100%; min-height:900px; background:#fff; color:#111; font-size:13px; line-height:1.3; padding:38px 38px 55px; font-family:'DM Sans',Arial,sans-serif; }
        .s2-invoice-top,.s2-invoice-parties,.s2-invoice-bottom { display:grid; grid-template-columns:45% 1fr; column-gap:20%; }
        .s2-invoice-bottom { column-gap:17%; }
        .s2-invoice-top { min-height:135px; }
        .s2-invoice-logo { width:200px; height:93px; overflow:hidden; }
        .s2-invoice-logo img { display:block; width:100%; height:100%; object-fit:contain; object-position:left center; }
        .s2-invoice-logo-area .s2-doc-accreditations { display:flex; gap:6px; margin-top:10px; }
        .s2-invoice-business { white-space:pre-line; line-height:1.12; }
        .s2-invoice-business > * { margin:0; padding:0; }
        .s2-invoice-business strong { display:block; font-size:12px; }
        .s2-invoice-parties { margin:0 0 20px; }
        .s2-invoice-party,.s2-invoice-meta { border-top:1px solid #111; padding-top:17px; min-height:105px; }
        .s2-invoice-party strong,.s2-invoice-meta strong:first-child { display:block; font-size:18px; margin-bottom:12px; }
        .s2-invoice-party div { white-space:pre-line; margin:0; padding:0; line-height:1.28; }
        .s2-invoice-meta strong:nth-child(2) { display:block; margin-bottom:12px; }
        .s2-invoice-meta span { color:#585b60; font-weight:700; }
        .s2-invoice-lines table { width:100%; border-collapse:collapse; table-layout:fixed; }
        .s2-invoice-lines th { background:#080808; color:#fff; text-align:left; font-size:10px; letter-spacing:.07em; font-weight:500; text-transform:uppercase; padding:13px 10px; }
        .s2-invoice-lines th:nth-child(1) { width:11%; } .s2-invoice-lines th:nth-child(2) { width:59%; } .s2-invoice-lines th:nth-child(3),.s2-invoice-lines th:nth-child(4) { width:15%; text-align:right; white-space:nowrap; }
        .s2-invoice-lines td { background:#f6f7f8; padding:12px 10px; vertical-align:top; overflow-wrap:anywhere; white-space:pre-line; }
        .s2-invoice-lines td:nth-child(n+3) { text-align:right; white-space:nowrap; } .s2-invoice-lines td:last-child { font-weight:700; }
        .s2-invoice-totals { width:34%; min-height:135px; margin:42px 0 6px auto; }
        .s2-invoice-amount-row { display:flex; justify-content:space-between; gap:8px; padding:5px 0; }
        .s2-invoice-total,.s2-invoice-due { font-size:21px; font-weight:800; white-space:nowrap; }
        .s2-invoice-paid { font-size:11px; margin:24px 0 38px; }
        .s2-invoice-bottom { margin-top:0; }
        .s2-invoice-footer-block { border-top:1px solid #111; padding-top:44px; min-height:120px; }
        .s2-invoice-footer-block > strong { display:block; margin-bottom:12px; font-size:13px; }
        .s2-invoice-footer-block p { margin:3px 0; overflow-wrap:anywhere; }
        .s2-invoice-site { color:#585b60; font-weight:700; margin-top:48px; }
        .s2-invoice-note { color:#585b60; font-size:10px; margin-top:12px; }
        .s2-invoice-page { position:absolute; bottom:12px; left:0; right:0; color:#555; text-align:center; font-size:10px; }
        #modal-invoice-preview > div { max-width:850px; }
        @media (max-width:767px) {
            .s2-paper-invoice { min-width:620px; }
            #modal-invoice-preview > div { overflow-x:auto; }
        }
        @media print {
            @page { size:A4; margin:0; }
            html,body { height:auto!important; overflow:visible!important; margin:0!important; background:#fff!important; }
            body > #app { display:none!important; }
            #modal-invoice-preview:not(.hidden),#modal-certificate:not(.hidden) { display:block!important; position:static!important; padding:0!important; background:#fff!important; }
            #modal-certificate:not(.hidden) > div { max-height:none!important; overflow:visible!important; box-shadow:none!important; }
            #modal-invoice-preview:not(.hidden) > div { max-width:none!important; width:210mm!important; max-height:none!important; height:auto!important; padding:0!important; margin:0!important; overflow:visible!important; box-shadow:none!important; border:0!important; }
            #modal-invoice-preview .s2-paper-invoice { width:210mm!important; min-height:297mm!important; padding:11mm 10mm 15mm!important; font-size:10pt; print-color-adjust:exact; -webkit-print-color-adjust:exact; }
            #modal-invoice-preview .s2-invoice-top { min-height:36mm; }
            #modal-invoice-preview .s2-invoice-page { bottom:7mm; }
        }
        @media (max-width: 767px) {
            #sidebar { position: fixed; inset: 0 auto 0 0; width: min(82vw, 320px); height: 100dvh; transform: translateX(-100%); z-index: 60; }
            body.mobile-menu-open #sidebar { transform: translateX(0); }
            #mobile-menu-backdrop { display: none; position: fixed; inset: 0; background: rgba(2, 6, 23, .65); z-index: 50; }
            body.mobile-menu-open #mobile-menu-backdrop { display: block; }
            #content-viewport { padding: 1rem; }
            header > div:first-child { min-width: 0; flex: 1; }
            header > div:first-child > div { min-width: 0; }
            #page-title { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
            #view-jobs > div:first-child > div:last-child, #view-recurring > div:first-child > div:last-child { width: 100%; flex-wrap: wrap; }
            #view-jobs #job-search, #view-recurring #recurring-search { width: min(100%, 18rem); }
            #job-filter-tabs { flex-wrap: nowrap; overflow-x: auto; max-width: calc(100vw - 2rem); padding-bottom: .4rem; }
            #job-filter-tabs button { flex: none; min-height: 2.5rem; }
            .s2-settings-nav { max-width: calc(100vw - 2rem); overflow-x: auto; flex-wrap: nowrap !important; }
            .s2-settings-nav button { flex: none; }
            .tab-view { min-width: 0; }
            .tab-view .flex.items-center.justify-between { gap: .5rem; }
            #jobs-list table { min-width: 0; width: 100%; }
            #jobs-list thead { display: none; }
            #jobs-list tbody { display: block; padding: .75rem; background: #f1f5f9; }
            #jobs-list tbody tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .4rem .75rem; padding: 1rem; margin-bottom: .75rem; background: #fff; border: 1px solid #e2e8f0; border-radius: 1rem; }
            #jobs-list tbody td { display: block; min-width: 0; padding: .15rem 0; overflow-wrap: anywhere; }
            #jobs-list tbody td::before { content: attr(data-label); display: block; font-size: .65rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #64748b; margin-bottom: .15rem; }
            #jobs-list tbody td:first-child, #jobs-list tbody td:nth-child(2), #jobs-list tbody td:last-child { grid-column: 1 / -1; }
            #jobs-list tbody td:last-child { text-align: left; padding-top: .65rem; border-top: 1px solid #e2e8f0; white-space: normal; }
            #jobs-list tbody td:last-child button { min-height: 2.5rem; }
            #jobs-board > div { min-height: 0; }
            .tab-view .overflow-x-auto > table:not(#jobs-list table) { min-width: 680px; }
            #calendar-grid.grid-cols-7 { min-width: 620px; }
            #view-calendar .shadow-xs:has(> #calendar-grid) { overflow-x: auto; }
            .fixed[id^="modal-"] { padding: .5rem; align-items: flex-start; }
            .fixed[id^="modal-"] > div { width: 100%; max-height: calc(100dvh - 1rem); padding: 1.25rem; border-radius: 1rem; }
            .fixed[id^="modal-"] input, .fixed[id^="modal-"] select, .fixed[id^="modal-"] textarea { max-width: 100%; font-size: 16px; }
            #modal-job-title { font-size: 1rem; }
            #modal-job .flex.items-center.gap-3 { min-width: 0; }
            #modal-job .flex.items-center.gap-3 > h3 { overflow-wrap: anywhere; }
            #form-job > div:last-child { flex-wrap: wrap; gap: .75rem; }
            #form-job > div:last-child > div { flex-wrap: wrap; }
        }
        @media print {
            .no-print { display: none !important; }
            .print-only { display: block !important; }
            body { background: white !important; color: black !important; }
        }
        ::-webkit-scrollbar { width: 6px; height: 6px; }
        ::-webkit-scrollbar-track { background: #f1f5f9; }
        ::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 3px; }
        ::-webkit-scrollbar-thumb:hover { background: #94a3b8; }

/* Exact S2 reference invoice typography/spacing (INV-0007 supplied 25 Sep 2026) */
.s2-paper-invoice { font-family:'DM Sans',Arial,sans-serif; font-size:10px; line-height:1.28; }
.s2-invoice-business { font-size:10px; line-height:1.28; }
.s2-invoice-business strong { font-size:10px; font-weight:700; }
.s2-invoice-party,.s2-invoice-meta { padding-top:14px; }
.s2-invoice-party { font-size:10px; line-height:1.28; }
.s2-invoice-party strong,.s2-invoice-meta strong:first-child { font-size:14px; line-height:1.15; margin-bottom:18px; font-weight:700; }
.s2-invoice-party div { line-height:1.28; }
.s2-invoice-meta strong:nth-child(2) { font-size:11px; line-height:1.2; margin-bottom:18px; }
.s2-invoice-meta span { font-size:10px; line-height:1.2; }
.s2-invoice-lines th { font-size:8px; line-height:1; padding:12px 10px; letter-spacing:.07em; }
.s2-invoice-lines td { font-size:9px; line-height:1.2; padding:12px 10px; }
.s2-invoice-totals { width:34%; min-height:128px; margin:12px 0 6px auto; }
.s2-invoice-amount-row { padding:4px 0; }
.s2-invoice-total,.s2-invoice-due { font-size:16px; line-height:1.15; font-weight:800; }
.s2-invoice-paid { font-size:9px; line-height:1.2; margin:27px 0 23px; }
.s2-invoice-footer-block { padding-top:14px; min-height:120px; font-size:10px; line-height:1.28; }
.s2-invoice-footer-block > strong { margin-bottom:17px; font-size:11px; line-height:1.15; }
.s2-invoice-footer-block p { margin:3px 0; line-height:1.28; }
.s2-invoice-site { font-size:10px; line-height:1.2; margin-top:28px; }
.s2-invoice-note { font-size:10px; }
.s2-invoice-page { font-family:Arial,sans-serif; font-size:9px; }
@media print {
  #modal-invoice-preview .s2-paper-invoice { font-size:10px; line-height:1.28; }
}

/* 2026-09-25: invoice/quote typography correction to match supplied reference PDF */
.s2-paper-invoice { font-size:13px; line-height:1.28; }
.s2-invoice-business { font-size:13px; line-height:1.28; }
.s2-invoice-business strong { font-size:13px; font-weight:700; }
.s2-invoice-party { font-size:13px; line-height:1.28; }
.s2-invoice-party strong,.s2-invoice-meta strong:first-child { font-size:18px; line-height:1.15; margin-bottom:18px; font-weight:700; }
.s2-invoice-meta strong:nth-child(2) { font-size:14px; line-height:1.2; margin-bottom:18px; }
.s2-invoice-meta span { font-size:13px; line-height:1.2; }
.s2-invoice-lines th { font-size:10px; line-height:1; padding:13px 10px; letter-spacing:.07em; }
.s2-invoice-lines td { font-size:12px; line-height:1.2; padding:13px 10px; }
.s2-invoice-total,.s2-invoice-due { font-size:21px; line-height:1.15; font-weight:800; }
.s2-invoice-paid { font-size:11px; line-height:1.2; margin:27px 0 23px; }
.s2-invoice-footer-block { padding-top:14px; min-height:120px; font-size:12px; line-height:1.28; }
.s2-invoice-footer-block > strong { margin-bottom:17px; font-size:14px; line-height:1.15; }
.s2-invoice-site { font-size:11px; line-height:1.2; margin-top:28px; }
.s2-invoice-note { font-size:11px; }
.s2-invoice-page { font-size:10px; }
#modal-invoice-preview .s2-paper-invoice { font-size:13px; line-height:1.28; }
@media print {
  #modal-invoice-preview .s2-paper-invoice { font-size:10pt!important; line-height:1.28!important; }
}

/* 2026-09-25: remove vertical gaps between business-detail lines */
.s2-invoice-business {
  white-space: normal !important;
  line-height: 1 !important;
}
.s2-invoice-business > strong,
.s2-invoice-business > div {
  display: block !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
  min-height: 0 !important;
}
#prev-doc-address {
  white-space: pre-line !important;
}
#prev-doc-email,
#prev-doc-website,
#prev-doc-phone {
  white-space: nowrap !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 1 !important;
}
@media print {
  #modal-invoice-preview .s2-invoice-business,
  #modal-invoice-preview .s2-invoice-business > strong,
  #modal-invoice-preview .s2-invoice-business > div {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
  }
}

/* 2026-09-25: final reference-PDF scale pass — larger type, same compact line breaks */
.s2-paper-invoice { font-family:'DM Sans',Arial,sans-serif; font-size:14px; line-height:1.22; }
.s2-invoice-business { font-size:14px !important; line-height:1.08 !important; }
.s2-invoice-business > strong,.s2-invoice-business > div { font-size:14px !important; line-height:1.08 !important; margin:0 !important; padding:0 !important; }
.s2-invoice-business strong { font-weight:700; }
.s2-invoice-party { font-size:14px; line-height:1.22; }
.s2-invoice-party div { font-size:14px; line-height:1.22; }
.s2-invoice-party strong,.s2-invoice-meta strong:first-child { font-size:19px; line-height:1.12; margin-bottom:16px; font-weight:700; }
.s2-invoice-meta strong:nth-child(2) { font-size:15px; line-height:1.15; margin-bottom:16px; }
.s2-invoice-meta span { font-size:14px; line-height:1.18; }
.s2-invoice-lines th { font-size:10.5px; line-height:1; padding:13px 10px; }
.s2-invoice-lines td { font-size:12.5px; line-height:1.18; padding:13px 10px; }
.s2-invoice-total,.s2-invoice-due { font-size:22px; line-height:1.12; font-weight:800; }
.s2-invoice-paid { font-size:12px; line-height:1.18; }
.s2-invoice-footer-block { font-size:13px; line-height:1.22; }
.s2-invoice-footer-block > strong { font-size:15px; line-height:1.12; font-weight:700; }
.s2-invoice-footer-block p { line-height:1.22; }
.s2-invoice-site { font-size:12px; line-height:1.18; }
.s2-invoice-note { font-size:12px; }
@media print {
  #modal-invoice-preview .s2-paper-invoice { font-size:10.5pt!important; line-height:1.22!important; }
  #modal-invoice-preview .s2-invoice-business,
  #modal-invoice-preview .s2-invoice-business > strong,
  #modal-invoice-preview .s2-invoice-business > div { font-size:10.5pt!important; line-height:1.08!important; }
}

/* 2026-09-25: top-right business details — increase independently to match reference */
.s2-invoice-business,
.s2-invoice-business > strong,
.s2-invoice-business > div,
#prev-doc-business-name,
#prev-doc-address,
#prev-doc-email,
#prev-doc-website,
#prev-doc-phone {
  font-family:'DM Sans',Arial,sans-serif !important;
  font-size:16px !important;
  line-height:1.08 !important;
  margin:0 !important;
  padding:0 !important;
}
.s2-invoice-business > strong,
#prev-doc-business-name { font-weight:700 !important; }
@media print {
  #modal-invoice-preview .s2-invoice-business,
  #modal-invoice-preview .s2-invoice-business > strong,
  #modal-invoice-preview .s2-invoice-business > div,
  #modal-invoice-preview #prev-doc-business-name,
  #modal-invoice-preview #prev-doc-address,
  #modal-invoice-preview #prev-doc-email,
  #modal-invoice-preview #prev-doc-website,
  #modal-invoice-preview #prev-doc-phone {
    font-size:12pt !important;
    line-height:1.08 !important;
  }
}

/* 2026-09-25: reference layout — one deliberate break after company postcode */
#prev-doc-email { margin-top:10px !important; }
@media print {
  #modal-invoice-preview #prev-doc-email { margin-top:7.5pt !important; }
}

/* ONE LOCKED DOCUMENT SPEC — single source for preview/download/email (INV-0007 reference) */
#invoice-print-area.s2-paper-invoice {
  box-sizing:border-box !important; width:210mm !important; height:297mm !important; min-height:297mm !important;
  padding:11mm 10mm 15mm !important; overflow:hidden !important; background:#fff !important; color:#111 !important;
  font-family:'DM Sans',Arial,sans-serif !important; font-size:10pt !important; line-height:1.20 !important;
}
#invoice-print-area .s2-invoice-top,#invoice-print-area .s2-invoice-parties,#invoice-print-area .s2-invoice-bottom{grid-template-columns:45% 1fr !important;column-gap:20% !important}
#invoice-print-area .s2-invoice-bottom{column-gap:17% !important}
#invoice-print-area .s2-invoice-top{min-height:36mm !important}
#invoice-print-area .s2-invoice-logo{width:54mm !important;height:24mm !important}
#invoice-print-area .s2-invoice-business,#invoice-print-area .s2-invoice-business>*{font-size:10pt !important;line-height:1.08 !important;margin:0 !important;padding:0 !important}
#invoice-print-area #prev-doc-address{white-space:pre-line !important;margin-bottom:3mm !important}
#invoice-print-area .s2-invoice-parties{margin:0 0 6mm !important}
#invoice-print-area .s2-invoice-party,#invoice-print-area .s2-invoice-meta{padding-top:4mm !important;min-height:29mm !important;font-size:10pt !important;line-height:1.20 !important}
#invoice-print-area .s2-invoice-party strong,#invoice-print-area .s2-invoice-meta strong:first-child{font-size:14pt !important;line-height:1.1 !important;margin-bottom:5mm !important}
#invoice-print-area .s2-invoice-meta strong:nth-child(2){font-size:10.5pt !important;line-height:1.15 !important;margin-bottom:5mm !important}
#invoice-print-area .s2-invoice-meta span{font-size:9.5pt !important;line-height:1.15 !important}
#invoice-print-area .s2-invoice-lines th{font-size:7.5pt !important;padding:3.3mm 2.8mm !important;line-height:1 !important}
#invoice-print-area .s2-invoice-lines td{font-size:8.5pt !important;padding:3.4mm 2.8mm !important;line-height:1.15 !important}
#invoice-print-area .s2-invoice-totals{width:34% !important;min-height:34mm !important;margin:4mm 0 2mm auto !important}
#invoice-print-area .s2-invoice-amount-row{padding:1.2mm 0 !important}
#invoice-print-area .s2-invoice-total,#invoice-print-area .s2-invoice-due{font-size:16pt !important;line-height:1.1 !important}
#invoice-print-area .s2-invoice-paid{font-size:8.5pt !important;line-height:1.15 !important;margin:8mm 0 7mm !important}
#invoice-print-area .s2-invoice-footer-block{padding-top:5mm !important;min-height:34mm !important;font-size:9pt !important;line-height:1.22 !important}
#invoice-print-area .s2-invoice-footer-block>strong{font-size:10pt !important;margin-bottom:5mm !important;line-height:1.1 !important}
#invoice-print-area .s2-invoice-footer-block p{margin:1mm 0 !important;line-height:1.22 !important}
#invoice-print-area .s2-invoice-site{font-size:8.5pt !important;line-height:1.15 !important;margin-top:8mm !important}
#invoice-print-area .s2-invoice-note{font-size:8.5pt !important}
#invoice-print-area .s2-invoice-page{font-size:8pt !important;bottom:4mm !important}

/* S2 PDF ENGINE v2026.09.25-direct-canvas */

/* 2026-09-25: viewer-master finishing tweaks
   Keep a deliberate blank line after the company telephone number before the rule. */
#invoice-print-area #prev-doc-phone {
  display:block !important;
  margin-bottom:4mm !important;
}
#invoice-print-area .s2-invoice-top {
  min-height:40mm !important;
}
\n
/* === S2 INV-0007 MASTER — authoritative final viewer rules ===
   This block intentionally comes last and replaces all accumulated invoice overrides. */
#invoice-print-area.s2-paper-invoice{
  box-sizing:border-box!important;
  width:210mm!important;height:297mm!important;min-height:297mm!important;max-height:297mm!important;
  padding:7mm 10mm 15mm!important;overflow:hidden!important;
  font-family:'DM Sans',Arial,sans-serif!important;font-size:9pt!important;line-height:1.18!important;
}
#invoice-print-area .s2-invoice-top,
#invoice-print-area .s2-invoice-parties,
#invoice-print-area .s2-invoice-bottom{grid-template-columns:46% 35%!important;column-gap:19%!important}
#invoice-print-area .s2-invoice-top{min-height:37.5mm!important}
#invoice-print-area .s2-invoice-logo{width:54mm!important;height:23.5mm!important}
#invoice-print-area .s2-invoice-business,
#invoice-print-area .s2-invoice-business>*{font-size:9pt!important;line-height:1.12!important;margin:0!important;padding:0!important}
#invoice-print-area .s2-invoice-business strong{font-size:9pt!important;line-height:1.08!important;font-weight:700!important}
#invoice-print-area #prev-doc-address{margin:0 0 3mm!important;white-space:pre-line!important}
#invoice-print-area #prev-doc-email{margin:0!important}
#invoice-print-area #prev-doc-phone{display:block!important;margin:0!important}
#invoice-print-area .s2-invoice-parties{margin:0 0 6.5mm!important}
#invoice-print-area .s2-invoice-party,
#invoice-print-area .s2-invoice-meta{padding-top:4mm!important;min-height:28.5mm!important;font-size:9pt!important;line-height:1.18!important}
#invoice-print-area .s2-invoice-party strong,
#invoice-print-area .s2-invoice-meta strong:first-child{font-size:13pt!important;line-height:1.05!important;margin-bottom:5mm!important;font-weight:700!important}
#invoice-print-area #prev-doc-customer-email,
#invoice-print-area #prev-doc-customer-phone{display:none!important}
#invoice-print-area .s2-invoice-meta strong:nth-child(2){font-size:9.5pt!important;line-height:1.1!important;margin-bottom:5mm!important}
#invoice-print-area .s2-invoice-meta span{font-size:8.8pt!important;line-height:1.1!important}
#invoice-print-area .s2-invoice-lines th{font-size:7pt!important;line-height:1!important;padding:3.1mm 2.8mm!important}
#invoice-print-area .s2-invoice-lines td{font-size:8pt!important;line-height:1.1!important;padding:3.2mm 2.8mm!important}
#invoice-print-area .s2-invoice-totals{width:32%!important;min-height:33mm!important;margin:4mm 0 2mm auto!important}
#invoice-print-area .s2-invoice-amount-row{padding:1mm 0!important}
#invoice-print-area .s2-invoice-total,
#invoice-print-area .s2-invoice-due{font-size:15pt!important;line-height:1.05!important}
#invoice-print-area .s2-invoice-paid{font-size:8pt!important;line-height:1.1!important;margin:7mm 0 6mm!important}
#invoice-print-area .s2-invoice-bottom{grid-template-columns:46% 37%!important;column-gap:17%!important;margin-top:0!important}
#invoice-print-area .s2-invoice-footer-block{padding-top:5mm!important;min-height:33mm!important;font-size:8.5pt!important;line-height:1.18!important}
#invoice-print-area .s2-invoice-footer-block>strong{font-size:9.5pt!important;margin-bottom:4mm!important;line-height:1.05!important}
#invoice-print-area .s2-invoice-footer-block p{margin:.8mm 0!important;line-height:1.18!important}
#invoice-print-area .s2-invoice-site{font-size:8pt!important;line-height:1.1!important;margin-top:8mm!important}
#invoice-print-area .s2-invoice-note{font-size:8pt!important}
#invoice-print-area .s2-invoice-page{font-size:7.5pt!important;bottom:4mm!important}
@media print{
  #modal-invoice-preview .s2-paper-invoice{width:210mm!important;height:297mm!important;min-height:297mm!important;max-height:297mm!important;padding:7mm 10mm 15mm!important}
}

/* Final master spacing: preserve a blank line after the company telephone number. */
#invoice-print-area #prev-doc-phone{display:block!important;margin-bottom:4mm!important;}


/* 2026-09-25 REAL STRUCTURAL FIX — intentionally last in cascade. */
#invoice-print-area .s2-invoice-company-gap {
  display: block !important;
  height: 4mm !important;
  min-height: 4mm !important;
  width: 100% !important;
}
#invoice-print-area .s2-invoice-lines tbody td {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  vertical-align: middle !important;
}
#invoice-print-area .s2-line-cell-center {
  box-sizing: border-box !important;
  height: 10mm !important;
  min-height: 10mm !important;
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  line-height: 1.1 !important;
}
#invoice-print-area .s2-line-cell-right {
  justify-content: flex-end !important;
  text-align: right !important;
}

/* 2026-09-25 INV-0007 TYPOGRAPHY LOCK
   Font sizes only. Shared document viewer means this applies to invoices and quotes,
   including preview, download and email PDF capture. No spacing/layout rules here. */
#invoice-print-area.s2-paper-invoice { font-size:9pt !important; }
#invoice-print-area .s2-invoice-business,
#invoice-print-area .s2-invoice-business > div { font-size:9pt !important; }
#invoice-print-area .s2-invoice-business > strong,
#invoice-print-area #prev-doc-business-name { font-size:9pt !important; }
#invoice-print-area .s2-invoice-party,
#invoice-print-area .s2-invoice-party > div { font-size:9pt !important; }
#invoice-print-area .s2-invoice-party > strong { font-size:13pt !important; }
#invoice-print-area .s2-invoice-meta > strong:first-child { font-size:13pt !important; }
#invoice-print-area .s2-invoice-meta > strong:nth-child(2) { font-size:9.5pt !important; }
#invoice-print-area .s2-invoice-meta > span { font-size:8.8pt !important; }
#invoice-print-area .s2-invoice-lines th { font-size:7pt !important; }
#invoice-print-area .s2-invoice-lines td,
#invoice-print-area .s2-invoice-lines td * { font-size:8pt !important; }
#invoice-print-area .s2-invoice-total,
#invoice-print-area .s2-invoice-due { font-size:15pt !important; }
#invoice-print-area .s2-invoice-paid { font-size:8pt !important; }
#invoice-print-area .s2-invoice-footer-block { font-size:8.5pt !important; }
#invoice-print-area .s2-invoice-footer-block > strong { font-size:9.5pt !important; }
#invoice-print-area .s2-invoice-footer-block p,
#invoice-print-area .s2-invoice-footer-block p * { font-size:8.5pt !important; }
#invoice-print-area .s2-invoice-site,
#invoice-print-area .s2-invoice-note { font-size:8pt !important; }
#invoice-print-area .s2-invoice-page { font-size:7.5pt !important; }

/* S2 black + orange sidebar theme */
#sidebar {
    background: #050505 !important;
    color: #d4d4d4 !important;
    border-right: 1px solid #2b2b2b !important;
    box-shadow: 10px 0 30px rgba(0,0,0,.16);
}
#sidebar > div:first-of-type {
    background: #000 !important;
    border-bottom-color: #242424 !important;
}
#sidebar-logo-container {
    background: #000 !important;
    border: 1px solid #fd5d14;
    box-shadow: 0 0 0 3px rgba(253,93,20,.10), 0 8px 20px rgba(0,0,0,.35) !important;
}
#sidebar nav { background: #050505; }
#sidebar .nav-link {
    color: #b8b8b8 !important;
    border: 1px solid transparent;
    position: relative;
}
#sidebar .nav-link:hover {
    color: #fff !important;
    background: #151515 !important;
    border-color: #303030;
}
#sidebar .nav-link:hover > i { color: #fd5d14 !important; }
#sidebar .nav-link.bg-s2-orange {
    color: #fff !important;
    background: #fd5d14 !important;
    border-color: #fd5d14 !important;
    box-shadow: 0 8px 22px rgba(253,93,20,.22) !important;
}
#sidebar .nav-link.bg-s2-orange > i { color: #fff !important; }
#sidebar .nav-link #recurring-badge,
#sidebar .nav-link #chaser-badge {
    background: rgba(253,93,20,.14) !important;
    color: #ff7a3d !important;
    border-color: rgba(253,93,20,.38) !important;
}
#sidebar .nav-link.bg-s2-orange #recurring-badge,
#sidebar .nav-link.bg-s2-orange #chaser-badge {
    background: rgba(0,0,0,.20) !important;
    color: #fff !important;
    border-color: rgba(255,255,255,.28) !important;
}
#sidebar > div:last-child {
    background: #000 !important;
    border-top-color: #242424 !important;
}
#sidebar > div:last-child > div > div:first-child {
    background: rgba(253,93,20,.10) !important;
    border-color: rgba(253,93,20,.45) !important;
    color: #fd5d14 !important;
}
#sidebar #sidebar-engineer-name { color: #fff !important; }
#sidebar #sidebar-engineer-name + p { color: #fd5d14 !important; }
#sidebar button[onclick="crmLogout()"] {
    background: #0d0d0d !important;
    border-color: #333 !important;
    color: #e5e5e5 !important;
}
#sidebar button[onclick="crmLogout()"]:hover {
    background: #fd5d14 !important;
    border-color: #fd5d14 !important;
    color: #fff !important;
}
#sidebar button[onclick="crmLogout()"]:hover i { color: #fff !important; }
#sidebar button[onclick="resetDemoData()"]:hover {
    background: rgba(253,93,20,.10) !important;
    color: #fd5d14 !important;
}

/* Recurring Jobs due badge: match the cyan recurring icon, while retaining the Invoice Chaser pill shape */
#sidebar #recurring-badge,
#sidebar .nav-link #recurring-badge,
#sidebar .nav-link.bg-s2-orange #recurring-badge {
    background: rgba(34, 211, 238, .10) !important;
    color: #22d3ee !important;
    border: 1px solid rgba(34, 211, 238, .55) !important;
    border-radius: 9999px !important;
    padding: .125rem .5rem !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    line-height: 1rem !important;
    white-space: nowrap !important;
}

/* === S2 SIDEBAR REFERENCE MENU - FINAL ROOT OVERRIDE === */
@media (min-width: 768px) {
  #sidebar { width: 320px !important; min-width: 320px !important; }
}
#sidebar nav { padding-left: 16px !important; padding-right: 16px !important; }
#sidebar .nav-link {
  display: grid !important;
  grid-template-columns: 28px minmax(0,1fr) auto !important;
  align-items: center !important;
  column-gap: 14px !important;
  min-height: 48px !important;
  padding: 10px 14px !important;
  border-radius: 16px !important;
  white-space: nowrap !important;
  font-size: 15px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
}
#sidebar .nav-link > i { width: 22px !important; height: 22px !important; flex: none !important; }
#sidebar .nav-link[data-tab="recurring"] { color:#fff !important; }
#sidebar .nav-link[data-tab="recurring"] > i { color:#22d3ee !important; }
#sidebar #recurring-badge {
  margin-left: 8px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:72px !important;
  height:32px !important;
  padding:0 12px !important;
  border:2px solid #22d3ee !important;
  border-radius:9999px !important;
  background:rgba(34,211,238,.08) !important;
  color:#22d3ee !important;
  font-size:12px !important;
  font-weight:800 !important;
  line-height:1 !important;
  white-space:nowrap !important;
}
#sidebar .nav-link[data-tab="chaser"] { color:#fff !important; }
#sidebar .nav-link[data-tab="chaser"] > i { color:#facc15 !important; }
#sidebar #chaser-badge {
  margin-left:8px !important;
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-width:66px !important;
  height:32px !important;
  padding:0 14px !important;
  border:2px solid #facc15 !important;
  border-radius:9999px !important;
  background:rgba(250,204,21,.08) !important;
  color:#facc15 !important;
  font-size:12px !important;
  font-weight:800 !important;
  line-height:1 !important;
  white-space:nowrap !important;
}
#sidebar .nav-link.bg-s2-orange #recurring-badge,
#sidebar .nav-link.bg-s2-orange #chaser-badge { color:#fff !important; border-color:rgba(255,255,255,.8) !important; }

/* === 2026-09-26 COMPACT SIDEBAR PASS ===
   Keeps the reference look but fits the full menu on shorter screens. */
#sidebar nav {
  padding-top: 12px !important;
  padding-bottom: 12px !important;
}
#sidebar .nav-link {
  min-height: 40px !important;
  padding: 7px 12px !important;
  border-radius: 13px !important;
  column-gap: 12px !important;
  font-size: 14px !important;
  line-height: 1.15 !important;
}
#sidebar .nav-link > i {
  width: 20px !important;
  height: 20px !important;
}
#sidebar #recurring-badge,
#sidebar #chaser-badge {
  height: 28px !important;
  min-width: 58px !important;
  padding: 0 10px !important;
  font-size: 11px !important;
  border-width: 1.5px !important;
}
#sidebar #recurring-badge { min-width: 64px !important; }
#sidebar > div:first-of-type { height: 68px !important; min-height: 68px !important; }
#sidebar > div:last-child { padding: 10px 14px !important; }
#sidebar > div:last-child button[onclick="crmLogout()"] {
  margin-top: 8px !important;
  padding-top: 7px !important;
  padding-bottom: 7px !important;
}
@media (max-height: 760px) and (min-width: 768px) {
  #sidebar nav { padding-top: 8px !important; padding-bottom: 8px !important; }
  #sidebar .nav-link { min-height: 36px !important; padding-top: 5px !important; padding-bottom: 5px !important; font-size: 13px !important; }
  #sidebar .nav-link > i { width: 18px !important; height: 18px !important; }
  #sidebar #recurring-badge, #sidebar #chaser-badge { height: 25px !important; font-size: 10px !important; }
  #sidebar > div:first-of-type { height: 60px !important; min-height: 60px !important; }
  #sidebar > div:last-child { padding-top: 7px !important; padding-bottom: 7px !important; }
}

/* v8 sidebar brand: show the complete company logo and correct company name */
#sidebar > div:first-of-type { padding-left: 12px !important; padding-right: 12px !important; gap: 10px !important; }
#sidebar-logo-container { width: 72px !important; height: 58px !important; min-width: 72px !important; border-radius: 12px !important; padding: 3px !important; }
#sidebar-logo-img { width: 100% !important; height: 100% !important; object-fit: contain !important; object-position: center !important; }
#sidebar-brand-title { font-size: 15px !important; white-space: nowrap !important; overflow: visible !important; text-overflow: clip !important; letter-spacing: .01em !important; }

/* v10: remove all framing from the sidebar company logo */
#sidebar-logo-container {
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
}


/* v13: keep All / Unassigned pipeline tables aligned exactly like status views */
#jobs-list .overflow-x-auto { overflow-x: auto; }
#jobs-list .jobs-pipeline-table {
  width: 100% !important;
  min-width: 1180px !important;
  table-layout: fixed !important;
}
#jobs-list .jobs-pipeline-table th,
#jobs-list .jobs-pipeline-table td { box-sizing: border-box; }
#jobs-list .jobs-pipeline-table th:nth-child(1), #jobs-list .jobs-pipeline-table td:nth-child(1) { width: 10%; }
#jobs-list .jobs-pipeline-table th:nth-child(2), #jobs-list .jobs-pipeline-table td:nth-child(2) { width: 10%; }
#jobs-list .jobs-pipeline-table th:nth-child(3), #jobs-list .jobs-pipeline-table td:nth-child(3) { width: 6%; }
#jobs-list .jobs-pipeline-table th:nth-child(4), #jobs-list .jobs-pipeline-table td:nth-child(4) { width: 10%; }
#jobs-list .jobs-pipeline-table th:nth-child(5), #jobs-list .jobs-pipeline-table td:nth-child(5) { width: 8%; }
#jobs-list .jobs-pipeline-table th:nth-child(6), #jobs-list .jobs-pipeline-table td:nth-child(6) { width: 7%; }
#jobs-list .jobs-pipeline-table th:nth-child(7), #jobs-list .jobs-pipeline-table td:nth-child(7) { width: 10%; }
#jobs-list .jobs-pipeline-table th:nth-child(8), #jobs-list .jobs-pipeline-table td:nth-child(8) { width: 9%; }
#jobs-list .jobs-pipeline-table th:nth-child(9), #jobs-list .jobs-pipeline-table td:nth-child(9) { width: 7%; }
#jobs-list .jobs-pipeline-table th:nth-child(10), #jobs-list .jobs-pipeline-table td:nth-child(10) { width: 8%; }
#jobs-list .jobs-pipeline-table th:nth-child(11), #jobs-list .jobs-pipeline-table td:nth-child(11) { width: 15%; }
#jobs-list .jobs-pipeline-table td:nth-child(11) { white-space: normal !important; }
#jobs-list .jobs-pipeline-table td:nth-child(11) button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
  margin-top: 2px !important;
  margin-bottom: 2px !important;
}


/* v14: pipeline list fits the available screen width in every filter view */
#jobs-list .overflow-x-auto {
  overflow-x: hidden !important;
}
#jobs-list .jobs-pipeline-table {
  width: 100% !important;
  min-width: 0 !important;
  table-layout: fixed !important;
}
#jobs-list .jobs-pipeline-table th,
#jobs-list .jobs-pipeline-table td {
  box-sizing: border-box !important;
  padding-left: 10px !important;
  padding-right: 10px !important;
  overflow-wrap: anywhere;
}
#jobs-list .jobs-pipeline-table th { font-size: 10px !important; }
#jobs-list .jobs-pipeline-table td { font-size: 12px !important; }
#jobs-list .jobs-pipeline-table th:nth-child(1), #jobs-list .jobs-pipeline-table td:nth-child(1) { width: 9% !important; }
#jobs-list .jobs-pipeline-table th:nth-child(2), #jobs-list .jobs-pipeline-table td:nth-child(2) { width: 9% !important; }
#jobs-list .jobs-pipeline-table th:nth-child(3), #jobs-list .jobs-pipeline-table td:nth-child(3) { width: 5% !important; }
#jobs-list .jobs-pipeline-table th:nth-child(4), #jobs-list .jobs-pipeline-table td:nth-child(4) { width: 9% !important; }
#jobs-list .jobs-pipeline-table th:nth-child(5), #jobs-list .jobs-pipeline-table td:nth-child(5) { width: 7% !important; }
#jobs-list .jobs-pipeline-table th:nth-child(6), #jobs-list .jobs-pipeline-table td:nth-child(6) { width: 6% !important; }
#jobs-list .jobs-pipeline-table th:nth-child(7), #jobs-list .jobs-pipeline-table td:nth-child(7) { width: 9% !important; }
#jobs-list .jobs-pipeline-table th:nth-child(8), #jobs-list .jobs-pipeline-table td:nth-child(8) { width: 8% !important; }
#jobs-list .jobs-pipeline-table th:nth-child(9), #jobs-list .jobs-pipeline-table td:nth-child(9) { width: 7% !important; }
#jobs-list .jobs-pipeline-table th:nth-child(10), #jobs-list .jobs-pipeline-table td:nth-child(10) { width: 8% !important; }
#jobs-list .jobs-pipeline-table th:nth-child(11), #jobs-list .jobs-pipeline-table td:nth-child(11) { width: 23% !important; }
#jobs-list .jobs-pipeline-table td:nth-child(11) {
  white-space: normal !important;
  text-align: right !important;
}
#jobs-list .jobs-pipeline-table td:nth-child(11) button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  white-space: nowrap !important;
  margin: 2px 0 2px 8px !important;
  font-size: 11px !important;
}
#jobs-list .jobs-pipeline-table td:nth-child(11) button:first-child { margin-left: 0 !important; }
#jobs-list .jobs-pipeline-table td:nth-child(7) span { white-space: nowrap !important; padding-left: 9px !important; padding-right: 9px !important; }
@media (max-width: 1350px) {
  #jobs-list .jobs-pipeline-table th,
  #jobs-list .jobs-pipeline-table td { padding-left: 7px !important; padding-right: 7px !important; }
  #jobs-list .jobs-pipeline-table th { font-size: 9px !important; letter-spacing: .04em !important; }
  #jobs-list .jobs-pipeline-table td { font-size: 11px !important; }
  #jobs-list .jobs-pipeline-table td:nth-child(11) button { font-size: 10px !important; margin-left: 5px !important; }
}

/* v15: fit Recurring Jobs and Customer & Boiler Assets tables to the available CRM width */
@media (min-width: 769px) {
  #view-recurring .overflow-x-auto,
  #view-customers .overflow-x-auto {
    overflow-x: hidden !important;
  }

  #view-recurring table,
  #view-customers table {
    width: 100% !important;
    min-width: 0 !important;
    table-layout: fixed !important;
  }

  #view-recurring th, #view-recurring td,
  #view-customers th, #view-customers td {
    box-sizing: border-box !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
    overflow-wrap: anywhere;
  }

  #view-recurring th, #view-customers th { font-size: 10px !important; }
  #view-recurring td, #view-customers td { font-size: 12px !important; }

  /* Recurring Jobs: Customer, Service, Last, Next, Reminder, Status, Actions */
  #view-recurring th:nth-child(1), #view-recurring td:nth-child(1) { width: 20% !important; }
  #view-recurring th:nth-child(2), #view-recurring td:nth-child(2) { width: 13% !important; }
  #view-recurring th:nth-child(3), #view-recurring td:nth-child(3) { width: 12% !important; }
  #view-recurring th:nth-child(4), #view-recurring td:nth-child(4) { width: 12% !important; }
  #view-recurring th:nth-child(5), #view-recurring td:nth-child(5) { width: 16% !important; }
  #view-recurring th:nth-child(6), #view-recurring td:nth-child(6) { width: 15% !important; }
  #view-recurring th:nth-child(7), #view-recurring td:nth-child(7) { width: 12% !important; }
  #view-recurring td:nth-child(6) > *,
  #view-recurring td:nth-child(6) span { max-width: 100% !important; white-space: normal !important; }
  #view-recurring td:nth-child(7) { text-align: right !important; white-space: normal !important; }
  #view-recurring td:nth-child(7) button { white-space: nowrap !important; font-size: 11px !important; margin: 2px !important; }

  /* Customers & Assets: Name, Contact, Address, Asset, Last Service, Actions */
  #view-customers th:nth-child(1), #view-customers td:nth-child(1) { width: 13% !important; }
  #view-customers th:nth-child(2), #view-customers td:nth-child(2) { width: 13% !important; }
  #view-customers th:nth-child(3), #view-customers td:nth-child(3) { width: 23% !important; }
  #view-customers th:nth-child(4), #view-customers td:nth-child(4) { width: 22% !important; }
  #view-customers th:nth-child(5), #view-customers td:nth-child(5) { width: 11% !important; }
  #view-customers th:nth-child(6), #view-customers td:nth-child(6) { width: 18% !important; }
  #view-customers td:nth-child(5) { white-space: nowrap !important; overflow: visible !important; }
  #view-customers td:nth-child(6) { text-align: right !important; white-space: normal !important; }
  #view-customers td:nth-child(6) button { white-space: nowrap !important; font-size: 11px !important; margin: 2px !important; }
}

/* v17 field workspace */
.s2-work-card{background:#fff;border:1px solid #dfe3e8;border-radius:22px;padding:22px;box-shadow:0 2px 8px rgba(15,23,42,.06)}
.s2-work-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}.s2-work-head h4,.s2-card-title{font-size:18px;font-weight:800;color:#111827}.s2-work-head p,.s2-help{font-size:12px;color:#64748b;margin-top:3px}.s2-count-pill{min-width:44px;text-align:center;padding:6px 13px;border-radius:999px;background:#f3efff;color:#7c3aed;font-weight:800}.s2-muted-count{font-size:13px;color:#64748b;font-weight:500;margin-left:6px}
.s2-photo-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.s2-photo-folder{min-height:190px;border:2px solid #dbe4ff;border-radius:18px;padding:18px;display:flex;flex-direction:column}.s2-photo-folder.s2-during{border-color:#f3d7a7}.s2-photo-folder.s2-after{border-color:#c5e2d2}.s2-folder-top{display:flex;justify-content:space-between;align-items:center;font-size:35px;color:#4f6fe8}.s2-during .s2-folder-top{color:#c97818}.s2-after .s2-folder-top{color:#47996f}.s2-plus{width:38px;height:38px;border:1px solid #d1d5db;border-radius:50%;display:grid;place-items:center;font-size:25px;cursor:pointer;background:#fff}.s2-photo-folder strong{font-size:17px;margin-top:10px}.s2-photo-folder small{color:#64748b;margin-top:2px}.s2-thumbs{display:flex;gap:7px;flex-wrap:wrap;margin-top:auto;padding-top:14px}.s2-thumbs img{width:48px!important;height:48px!important;border-radius:50%!important;object-fit:cover}
.s2-doc-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}.s2-doc-folder{min-height:120px;border:2px solid #d7dcff;border-radius:18px;background:#fafaff;display:flex;flex-direction:column;align-items:center;justify-content:center;font-size:34px;color:#5548e8}.s2-doc-folder strong{font-size:15px;color:#111827;margin-top:7px}.s2-doc-folder small{font-size:11px;color:#64748b;margin-top:3px;text-align:center}.s2-outline-btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid #d1d5db;background:#fff;border-radius:999px;padding:9px 15px;font-size:13px;font-weight:700;color:#334155;cursor:pointer;white-space:nowrap}.s2-outline-btn:hover{background:#f8fafc}.s2-team-notes{width:100%;margin-top:14px;border:1px solid #d1d5db;border-radius:18px;background:#fafafa;padding:15px;font-size:14px;outline:none}.s2-empty-text{font-size:14px;color:#64748b}.s2-timeline{display:grid;gap:10px;margin-top:14px}.s2-time-row{display:flex;justify-content:space-between;gap:16px;color:#475569;font-size:14px}.s2-time-row strong{color:#111827}.s2-site-actions{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:16px 0 12px;color:#475569;font-size:14px}.s2-job-map{width:100%;height:300px;border:0;border-radius:18px;background:#f1f5f9}.s2-customer-link{color:#4f46e5;font-weight:700;cursor:pointer}.s2-customer-name{font-size:16px;font-weight:700}.s2-customer-address{color:#64748b;font-size:14px}
@media(max-width:760px){.s2-photo-grid{grid-template-columns:1fr}.s2-doc-grid{grid-template-columns:repeat(2,1fr)}.s2-site-actions{align-items:flex-start;flex-direction:column}.s2-job-map{height:240px}}

/* v22: sidebar inactive text colour correction */
#sidebar .nav-link[data-tab="recurring"]:not(.bg-s2-orange),
#sidebar .nav-link[data-tab="chaser"]:not(.bg-s2-orange) {
  color: #b8b8b8 !important;
}
#sidebar .nav-link[data-tab="recurring"]:not(.bg-s2-orange):hover,
#sidebar .nav-link[data-tab="chaser"]:not(.bg-s2-orange):hover {
  color: #ffffff !important;
}
#sidebar .nav-link[data-tab="recurring"].bg-s2-orange,
#sidebar .nav-link[data-tab="chaser"].bg-s2-orange {
  color: #ffffff !important;
}

.s2-upload-item,.s2-doc-file-wrap{position:relative;display:inline-flex}.s2-upload-delete{position:absolute;top:-7px;right:-7px;width:20px;height:20px;border-radius:999px;border:2px solid #fff;background:#dc2626;color:#fff;font-size:15px;line-height:15px;font-weight:700;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 1px 4px rgba(15,23,42,.28);z-index:3;opacity:.92}.s2-upload-delete:hover{transform:scale(1.08);opacity:1}.s2-upload-delete:disabled{opacity:.45;cursor:wait}.s2-doc-file-wrap{margin:0 1px}.s2-doc-delete{top:-5px;right:-5px}


/* v46 — verified mobile layouts; desktop remains unchanged */
@media (max-width: 768px) {
  /* iOS/Safari date inputs must be allowed to shrink inside grids/modals. */
  input[type="date"] {
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    box-sizing:border-box !important;
    -webkit-appearance:none;
    appearance:none;
  }
  #modal-invoice, #modal-invoice > div, #form-invoice,
  #form-invoice > div, #form-invoice label,
  .s2-invoice-date-grid, .s2-invoice-date-grid > * {
    min-width:0 !important;
    max-width:100% !important;
  }
  #inv-date, #inv-payment-date, #payment-date { min-height:46px !important; }

  /* Jobs Pipeline — mobile cards in All and every status filter. */
  #view-jobs { min-width:0 !important; }
  #view-jobs > div:first-child { align-items:stretch !important; }
  #view-jobs > div:first-child > div:last-child { width:100% !important; flex-wrap:wrap !important; }
  #job-search { width:100% !important; max-width:none !important; }
  #job-filter-tabs { width:100%; display:flex !important; flex-wrap:nowrap !important; overflow-x:auto !important; -webkit-overflow-scrolling:touch; scrollbar-width:thin; padding-bottom:5px; }
  #job-filter-tabs button { flex:0 0 auto !important; }
  #jobs-list, #jobs-list .overflow-x-auto { width:100% !important; min-width:0 !important; overflow:visible !important; }
  #jobs-list .jobs-pipeline-table { display:block !important; width:100% !important; min-width:0 !important; table-layout:auto !important; }
  #jobs-list .jobs-pipeline-table thead { display:none !important; }
  #jobs-list .jobs-pipeline-table tbody { display:block !important; width:100% !important; padding:10px !important; }
  #jobs-list .jobs-pipeline-table tr { display:block !important; width:100% !important; min-width:0 !important; margin:0 0 12px !important; padding:10px 12px !important; border:1px solid #e2e8f0 !important; border-radius:16px !important; background:#fff !important; }
  #jobs-list .jobs-pipeline-table td { display:grid !important; grid-template-columns:96px minmax(0,1fr) !important; width:100% !important; min-width:0 !important; gap:10px !important; padding:7px 0 !important; border:0 !important; text-align:left !important; white-space:normal !important; overflow:visible !important; overflow-wrap:anywhere !important; font-size:12px !important; }
  #jobs-list .jobs-pipeline-table td::before { align-self:start; font-size:10px; line-height:1.45; font-weight:800; text-transform:uppercase; letter-spacing:.04em; color:#94a3b8; }
  #jobs-list .jobs-pipeline-table td:nth-child(1)::before{content:"Customer"}
  #jobs-list .jobs-pipeline-table td:nth-child(2)::before{content:"Job title"}
  #jobs-list .jobs-pipeline-table td:nth-child(3)::before{content:"Job #"}
  #jobs-list .jobs-pipeline-table td:nth-child(4)::before{content:"Scheduled"}
  #jobs-list .jobs-pipeline-table td:nth-child(5)::before{content:"Duration"}
  #jobs-list .jobs-pipeline-table td:nth-child(6)::before{content:"Photos"}
  #jobs-list .jobs-pipeline-table td:nth-child(7)::before{content:"Status"}
  #jobs-list .jobs-pipeline-table td:nth-child(8)::before{content:"Assigned"}
  #jobs-list .jobs-pipeline-table td:nth-child(9)::before{content:"Quotes"}
  #jobs-list .jobs-pipeline-table td:nth-child(10)::before{content:"Financials"}
  #jobs-list .jobs-pipeline-table td:nth-child(11)::before{content:"Action"}
  #jobs-list .jobs-pipeline-table td:nth-child(11) { text-align:left !important; }
  #jobs-list .jobs-pipeline-table td:nth-child(11) button { margin:0 6px 5px 0 !important; font-size:11px !important; }

  /* Purchase order modal — true one-column mobile header/dates and safe item grid. */
  #po-modal { padding:8px !important; align-items:flex-start !important; overflow-y:auto !important; }
  #po-modal > div { width:100% !important; max-width:100% !important; max-height:none !important; margin:8px 0 !important; overflow:visible !important; }
  #po-modal form > .p-5 { padding:14px !important; }
  #po-modal .grid { min-width:0 !important; }
  #po-modal label, #po-modal input, #po-modal select, #po-modal textarea { min-width:0 !important; max-width:100% !important; }
  #po-date, #po-delivery-date { width:100% !important; min-height:46px !important; }
  #po-items { width:100% !important; min-width:0 !important; }
  #po-items .po-item { display:grid !important; grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important; width:100% !important; min-width:0 !important; gap:8px !important; padding:10px !important; border:1px solid #e2e8f0 !important; border-radius:12px !important; }
  #po-items .po-desc { grid-column:1 / -1 !important; grid-row:1 !important; width:100% !important; min-width:0 !important; }
  #po-items .po-qty { grid-column:1 !important; grid-row:2 !important; width:100% !important; }
  #po-items .po-price { grid-column:2 !important; grid-row:2 !important; width:100% !important; }
  #po-items .po-vat { grid-column:1 !important; grid-row:3 !important; width:100% !important; }
  #po-items .po-item > button { grid-column:2 !important; grid-row:3 !important; justify-self:end !important; min-width:40px !important; min-height:40px !important; }

  /* Settings tab content always fills the real white settings container. */
  #view-settings .s2-settings-panel { width:100% !important; min-width:0 !important; }
}

/* v47: verified mobile pipeline + mobile-only passkey */
.s2-mobile-passkey-only, #crm-passkey-login { display:none !important; }
@media (max-width: 768px) {
  .s2-mobile-passkey-only { display:block !important; }
  #crm-passkey-login { display:block !important; }
  /* Override desktop nth-child fixed widths: every field owns the full card width. */
  #jobs-list .jobs-pipeline-table tbody tr > td,
  #jobs-list .jobs-pipeline-table tbody tr > td:nth-child(n) {
    display:grid !important; grid-template-columns:88px minmax(0,1fr) !important;
    width:100% !important; min-width:0 !important; max-width:100% !important;
    white-space:normal !important; overflow:visible !important; word-break:normal !important; overflow-wrap:break-word !important;
  }
  #jobs-list .jobs-pipeline-table tbody tr > td > * { min-width:0 !important; max-width:100% !important; }
  #jobs-list .jobs-pipeline-table tbody tr > td:nth-child(1),
  #jobs-list .jobs-pipeline-table tbody tr > td:nth-child(2) { font-size:14px !important; font-weight:700; }
}


/* v48: mobile quote action + accurate connectivity indicator */
@media (max-width: 768px) {
  .s2-job-create-quote {
    background:#fd5d14 !important; color:#fff !important; border-radius:.5rem !important;
    padding:.375rem .75rem !important; text-decoration:none !important;
  }
  .s2-job-create-quote:hover { background:#ea580c !important; color:#fff !important; }
}

/* v55: Job Documents match Job Photos on mobile only */
@media (max-width:760px){
  .s2-doc-grid{grid-template-columns:1fr!important;gap:14px!important}
  .s2-doc-folder{
    min-height:190px!important;
    width:100%!important;
    padding:18px!important;
    border:2px solid #dbe4ff!important;
    border-radius:18px!important;
    background:#fff!important;
    align-items:flex-start!important;
    justify-content:flex-start!important;
    font-size:35px!important;
    text-align:left!important;
  }
  .s2-doc-folder .s2-doc-add{
    top:18px!important;right:18px!important;
    width:38px!important;height:38px!important;
    border-radius:50%!important;
  }
  .s2-doc-folder>strong{font-size:17px!important;margin-top:10px!important;color:#111827!important}
  .s2-doc-folder>small{font-size:13px!important;margin-top:2px!important;color:#64748b!important;text-align:left!important}
  .s2-doc-previews{
    width:100%!important;max-width:none!important;
    margin-top:auto!important;padding:14px 0 0!important;
    justify-content:flex-start!important;gap:10px!important;
  }
  .s2-doc-file-wrap{margin:0!important}
  .s2-doc-file{width:64px!important;gap:4px!important}
  .s2-doc-file-icon{width:52px!important;height:52px!important;border-radius:50%!important;font-size:24px!important}
  .s2-doc-file-name{width:64px!important;font-size:10px!important}
}

/* v56: Jobs Pipeline filter tabs - keep inactive hover text visible. */
#job-filter-tabs button:not(.bg-s2-orange):hover { color:#ea580c !important; background:#fff7ed !important; }
#job-filter-tabs button.bg-s2-orange,
#job-filter-tabs button.bg-s2-orange:hover { color:#fff !important; }


/* v59: S2 brand black is true #000000 on every device. */
:root { --s2-brand-black:#000000; }
#sidebar,
#sidebar > div:first-of-type,
#sidebar nav,
#sidebar > div:last-child,
.bg-slate-900,
.bg-gray-900,
.bg-neutral-900 { background-color:var(--s2-brand-black) !important; }
.hover\\:bg-slate-800:hover,
.hover\\:bg-gray-800:hover,
.hover\\:bg-neutral-800:hover { background-color:var(--s2-brand-black) !important; }
#sidebar .nav-link:hover { background:#000 !important; border-color:#333 !important; }
#sidebar button[onclick="crmLogout()"] { background:#000 !important; }
#crm-login-screen { background:#000 !important; }
.s2-login-form { background:#000 !important; }
#crm-startup-screen { background:#000 !important; }
#crm-sync-state { background:#000 !important; }

/* Customers & Assets: keep the mobile toolbar inside the viewport. */
@media (max-width:768px) {
  #view-customers { width:100% !important; min-width:0 !important; max-width:100% !important; overflow-x:hidden !important; }
  #view-customers > div:first-child { width:100% !important; min-width:0 !important; max-width:100% !important; }
  #view-customers > div:first-child > div:last-child {
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    width:100% !important;
    min-width:0 !important;
    max-width:100% !important;
    gap:8px !important;
  }
  #view-customers > div:first-child > div:last-child > .relative { min-width:0 !important; width:100% !important; }
  #customer-search { width:100% !important; min-width:0 !important; max-width:100% !important; }
  #view-customers button[onclick="openNewCustomerModal()"] {
    flex:0 0 auto !important;
    width:auto !important;
    min-width:max-content !important;
    white-space:nowrap !important;
    padding-left:12px !important;
    padding-right:12px !important;
  }
  #view-customers .overflow-x-auto { max-width:100% !important; }
}
@media (max-width:420px) {
  #view-customers > div:first-child > div:last-child { grid-template-columns:1fr !important; }
  #view-customers button[onclick="openNewCustomerModal()"] { width:100% !important; justify-content:center !important; }
}


/* v64 certificate combustion analysis */
.s2-combustion-block{border:1px solid #e2e8f0;border-radius:12px;padding:12px;background:#f8fafc}
.s2-combustion-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
@media(max-width:768px){.s2-combustion-grid{grid-template-columns:1fr 1fr}}
@media(max-width:430px){.s2-combustion-grid{grid-template-columns:1fr}}

/* v68 certificate safety check Pass / Fail / N/A controls */
.s2-cert-check-status{display:flex!important;align-items:center;justify-content:space-between;gap:10px}
.s2-cert-check-status span{flex:1;min-width:0}
.s2-cert-check-status select{width:auto;min-width:112px;border:1px solid #d1d5db;border-radius:8px;background:#fff;padding:7px 9px;font-size:12px;font-weight:700;color:#111}
.s2-cert-check-status select:has(option[value="fail"]:checked){color:#b91c1c;border-color:#fecaca;background:#fff7f7}
@media(max-width:640px){.s2-cert-check-status{align-items:flex-start;flex-direction:column}.s2-cert-check-status select{width:100%}}
/* v72 issued certificate quick email */
.s2-issued-email{border:0;background:transparent;color:#fd5d14;cursor:pointer;font-size:14px;line-height:1;padding:2px}
#offline-mode-btn.s2-offline-active{background:#083344;border-color:#22d3ee;color:#fff}#offline-mode-btn.s2-offline-active svg{color:#67e8f9}

/* v102: colour-code ONLY the sidebar Lucide icons.
   Lucide replaces <i> elements with <svg>, so target the rendered SVGs. */
#sidebar .nav-link > svg { color: inherit; stroke: currentColor; }
#sidebar .nav-link[data-tab="dashboard"] > svg { color:#ffb15c !important; }
#sidebar .nav-link[data-tab="jobs"] > svg { color:#60a5fa !important; }
#sidebar .nav-link[data-tab="recurring"] > svg { color:#22d3ee !important; }
#sidebar .nav-link[data-tab="customers"] > svg { color:#2dd4bf !important; }
#sidebar .nav-link[data-tab="calendar"] > svg { color:#c084fc !important; }
#sidebar .nav-link[data-tab="invoices"] > svg { color:#fbbf24 !important; }
#sidebar .nav-link[data-tab="purchase-orders"] > svg { color:#fb923c !important; }
#sidebar .nav-link[data-tab="chaser"] > svg { color:#facc15 !important; }
#sidebar .nav-link[data-tab="certificates"] > svg { color:#f87171 !important; }
#sidebar .nav-link[data-tab="integrations"] > svg { color:#818cf8 !important; }
#sidebar .nav-link[data-tab="settings"] > svg { color:#94a3b8 !important; }

/* v108 — S2 non-blocking notifications + branded action dialogs */
#s2-toast-stack{position:fixed;top:18px;right:18px;z-index:10050;display:flex;flex-direction:column;gap:10px;width:min(390px,calc(100vw - 28px));pointer-events:none}
.s2-toast{pointer-events:auto;background:#111;color:#fff;border:1px solid #2b2b2b;border-left:4px solid #fd5d14;border-radius:14px;box-shadow:0 14px 38px rgba(0,0,0,.28);padding:13px 14px;display:flex;gap:11px;align-items:flex-start;animation:s2ToastIn .2s ease-out;font:500 13px/1.4 Poppins,Arial,sans-serif}.s2-toast.s2-error{border-left-color:#ef4444}.s2-toast.s2-warning{border-left-color:#f59e0b}.s2-toast.s2-success{border-left-color:#22c55e}.s2-toast-icon{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;background:#fd5d14;color:#fff;font-weight:900;flex:0 0 24px}.s2-error .s2-toast-icon{background:#ef4444}.s2-warning .s2-toast-icon{background:#f59e0b}.s2-success .s2-toast-icon{background:#22c55e}.s2-toast-message{flex:1;padding-top:2px;white-space:pre-line}.s2-toast-close{border:0;background:transparent;color:#aaa;font-size:18px;line-height:20px;cursor:pointer;padding:0 0 0 4px}.s2-toast-out{opacity:0;transform:translateX(12px);transition:.18s ease}@keyframes s2ToastIn{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:none}}
#s2-dialog-overlay{position:fixed;inset:0;z-index:10060;background:rgba(0,0,0,.58);backdrop-filter:blur(3px);display:none;align-items:center;justify-content:center;padding:18px}#s2-dialog-overlay.open{display:flex}.s2-dialog{width:min(460px,100%);background:#fff;border-radius:20px;box-shadow:0 24px 70px rgba(0,0,0,.35);overflow:hidden;font-family:Poppins,Arial,sans-serif}.s2-dialog-head{background:#080808;border-bottom:4px solid #fd5d14;color:#fff;padding:18px 20px}.s2-dialog-head h3{margin:0;font-size:18px;font-weight:800}.s2-dialog-body{padding:20px;color:#334155;font-size:14px;line-height:1.55;white-space:pre-line}.s2-dialog-input{width:100%;margin-top:14px;border:1px solid #cbd5e1;border-radius:11px;padding:11px 12px;font:inherit;outline:none}.s2-dialog-input:focus{border-color:#fd5d14;box-shadow:0 0 0 3px rgba(253,93,20,.12)}.s2-dialog-actions{display:flex;justify-content:flex-end;gap:10px;padding:0 20px 20px}.s2-dialog-btn{border:0;border-radius:10px;padding:10px 16px;font-weight:800;cursor:pointer}.s2-dialog-cancel{background:#eef2f7;color:#334155}.s2-dialog-ok{background:#fd5d14;color:#fff}.s2-dialog-danger{background:#dc2626;color:#fff}@media(max-width:640px){#s2-toast-stack{top:12px;right:14px;left:14px;width:auto}.s2-dialog-actions{flex-direction:column-reverse}.s2-dialog-btn{width:100%}}