/* site/assets/it-gen-trade-cl20-v1-batch1.css
   Cleaner (cleaning service) invoice-generator designs, batch 1 of the owner-supplied
   InvoiceTools_Cleaning_Service_Claude_Package (CL-31..CL-35), built the same way as
   site/assets/it-gen-trade-mc20-v1.css: CSS-only .invoice-preview.tmpl-<id> blocks targeting
   invoice-generator's real DOM. This pack's own reference source (spec.json per design) is pure
   color/font/layout data, no photographic or vector art assets were supplied for it, so every
   decorative treatment here (ribbons, split panels, arches, KPI/route strips) is recreated with
   pure CSS (gradients, clip-path, borders, generated content) - no raw <svg> in any data-uri. */

/* CL-31 Aurora split ribbon - dark teal wedge hero (clip-path slant) holding the giant serif
   "Invoice" wordmark and business name, a gold meta panel filling the rest of the head, teal
   table header/grand total, gold rule above the payment/notes block. */
.invoice-preview.tmpl-cl20-31-splitribbon{background:#fff;color:#1F2933;font-family:Georgia,'Times New Roman',serif}
.invoice-preview.tmpl-cl20-31-splitribbon .inv-head{display:block!important;position:relative;padding:0;border:0;min-height:170px;overflow:hidden}
.invoice-preview.tmpl-cl20-31-splitribbon .inv-head::before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background:#0F4C5C;clip-path:polygon(0 0,66% 0,54% 100%,0 100%)}
.invoice-preview.tmpl-cl20-31-splitribbon .inv-head-left{position:relative;z-index:1;color:#fff;padding:32px 20px 26px 34px;max-width:52%}
.invoice-preview.tmpl-cl20-31-splitribbon .inv-biz-name{font-size:17px;letter-spacing:.03em;font-weight:600;margin-bottom:8px}
.invoice-preview.tmpl-cl20-31-splitribbon .inv-biz-contact div,.invoice-preview.tmpl-cl20-31-splitribbon .inv-biz-address{color:#CFE7EA;font-size:10px}
.invoice-preview.tmpl-cl20-31-splitribbon .inv-doc-title{font-size:52px;font-weight:700;line-height:.9;margin-top:8px}
.invoice-preview.tmpl-cl20-31-splitribbon .inv-head-right{position:relative;z-index:1;background:#E2B714;margin-left:56%;padding:30px 34px 24px;color:#1F2933;text-align:left;font-size:11px}
.invoice-preview.tmpl-cl20-31-splitribbon .inv-doc-num{font-size:14px;font-weight:700}
.invoice-preview.tmpl-cl20-31-splitribbon .inv-body{padding-top:26px}
.invoice-preview.tmpl-cl20-31-splitribbon .inv-parties{border-bottom:1px solid #D9E0E5}
.invoice-preview.tmpl-cl20-31-splitribbon .inv-table thead tr{background:#0F4C5C;color:#fff}
.invoice-preview.tmpl-cl20-31-splitribbon .inv-total-grand{background:#0F4C5C;color:#fff}
.invoice-preview.tmpl-cl20-31-splitribbon .inv-total-grand b{color:#fff!important;font-size:22px!important}
.invoice-preview.tmpl-cl20-31-splitribbon .inv-block{border-top:2px solid #E2B714;padding-top:12px}

/* CL-32 Service route ledger - a full-height navy rail down the left carrying a rotated
   "SERVICE ROUTE" wordmark (decorative, matching the source's own sidebar rail), IBM Plex Mono
   throughout, a teal-accented meta panel and a mono "route stops" strip ahead of the line table
   (the source's real markup has no slot for 4 independent stop boxes, so the strip is recreated
   as one bordered mono-font bar rather than 4 separate cells - see deviation note in the report). */
.invoice-preview.tmpl-cl20-32-routeledger{background:#fff;color:#1F2933;font-family:'Courier New',monospace;display:grid!important;grid-template-columns:150px 1fr}
.invoice-preview.tmpl-cl20-32-routeledger::before{content:"SERVICE ROUTE";grid-column:1;grid-row:1/999;min-height:100%;background:#17324D;color:#fff;writing-mode:vertical-rl;text-orientation:mixed;transform:rotate(180deg);display:flex;align-items:center;justify-content:center;font-size:14px;letter-spacing:.3em;font-weight:600}
.invoice-preview.tmpl-cl20-32-routeledger .inv-head{grid-column:2;display:block!important;padding:32px 36px 0;border:0}
.invoice-preview.tmpl-cl20-32-routeledger .inv-body{grid-column:2;padding:0 36px 30px}
.invoice-preview.tmpl-cl20-32-routeledger .inv-biz-name{font-size:22px;font-weight:700;font-family:Arial,sans-serif}
.invoice-preview.tmpl-cl20-32-routeledger .inv-doc-title{font-size:38px;color:#17324D}
.invoice-preview.tmpl-cl20-32-routeledger .inv-head-right{text-align:left;border-left:4px solid #71C9CE;background:#F4F7F7;padding:10px 14px;font-size:11px}
.invoice-preview.tmpl-cl20-32-routeledger .inv-parties::before{content:"ROUTE  ·  01 LOBBY  ·  02 RESTROOMS  ·  03 OFFICES  ·  04 BREAKROOM";display:block;grid-column:1/-1;background:#F4F7F7;border:1px solid #D9E0E5;padding:9px 12px;margin-bottom:12px;font-size:9px;letter-spacing:.06em;color:#17324D}
.invoice-preview.tmpl-cl20-32-routeledger .inv-parties{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.invoice-preview.tmpl-cl20-32-routeledger .inv-table thead tr{background:#17324D;color:#fff}
.invoice-preview.tmpl-cl20-32-routeledger .inv-total-grand{background:#17324D;color:#fff}
.invoice-preview.tmpl-cl20-32-routeledger .inv-total-grand b{color:#fff!important}

/* CL-33 Soft arch housekeeping - a rounded, bottom-arched (border-radius) surface-tint hero,
   centered serif "Invoice" wordmark, a calm mauve/lavender palette, rounded-card meta row. */
.invoice-preview.tmpl-cl20-33-archededitorial{background:#fff;color:#1F2933;font-family:Georgia,'Times New Roman',serif}
.invoice-preview.tmpl-cl20-33-archededitorial .inv-head{display:block!important;padding:26px 40px 34px;border:0;background:#F4F7F7;border-radius:0 0 70px 70px;text-align:center}
.invoice-preview.tmpl-cl20-33-archededitorial .inv-head-left{max-width:100%}
.invoice-preview.tmpl-cl20-33-archededitorial .inv-biz-name{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:#6B7280;margin-bottom:6px}
.invoice-preview.tmpl-cl20-33-archededitorial .inv-doc-title{font-size:48px;font-weight:600;color:#6B5B73;margin:0}
.invoice-preview.tmpl-cl20-33-archededitorial .inv-biz-contact,.invoice-preview.tmpl-cl20-33-archededitorial .inv-biz-address{display:none}
.invoice-preview.tmpl-cl20-33-archededitorial .inv-head-right{margin-top:14px;display:flex;justify-content:center;gap:14px;text-align:center}
.invoice-preview.tmpl-cl20-33-archededitorial .inv-head-right>*:not(.inv-doc-title){background:#fff;border:1px solid #D9E0E5;border-radius:16px;padding:8px 16px;font-size:10px}
.invoice-preview.tmpl-cl20-33-archededitorial .inv-doc-num{color:#6B5B73;font-weight:700}
.invoice-preview.tmpl-cl20-33-archededitorial .inv-body{padding-top:22px}
.invoice-preview.tmpl-cl20-33-archededitorial .inv-parties>*{border:1px solid #D9E0E5;border-radius:20px}
.invoice-preview.tmpl-cl20-33-archededitorial .inv-table thead tr{background:#6B5B73;color:#fff}
.invoice-preview.tmpl-cl20-33-archededitorial .inv-total-grand{background:#6B5B73;color:#fff}
.invoice-preview.tmpl-cl20-33-archededitorial .inv-total-grand b{color:#fff!important;font-size:22px!important}

/* CL-34 Commercial route board - a dark charcoal ops-style header bar (business name left,
   "INVOICE" uppercase right, matching the source's flex head), a teal-topped decorative KPI/
   status strip ahead of the parties row, teal accents throughout. */
.invoice-preview.tmpl-cl20-34-operationsboard{background:#fff;color:#1F2933;font-family:Arial,Helvetica,sans-serif}
.invoice-preview.tmpl-cl20-34-operationsboard .inv-head{display:flex!important;justify-content:space-between;align-items:center;background:#263238;color:#fff;padding:22px 28px;border:0}
.invoice-preview.tmpl-cl20-34-operationsboard .inv-biz-name{font-weight:700;font-size:16px}
.invoice-preview.tmpl-cl20-34-operationsboard .inv-biz-contact div,.invoice-preview.tmpl-cl20-34-operationsboard .inv-biz-address{color:#B8C2C6;font-size:10px}
.invoice-preview.tmpl-cl20-34-operationsboard .inv-doc-title{color:#fff;font-size:30px;text-transform:uppercase;letter-spacing:.05em}
.invoice-preview.tmpl-cl20-34-operationsboard .inv-head-right{color:#fff;text-align:right}
.invoice-preview.tmpl-cl20-34-operationsboard .inv-doc-num{color:#00A6A6}
.invoice-preview.tmpl-cl20-34-operationsboard .inv-parties::before{content:"SERVICE TYPE: COMMERCIAL   |   CREW: 3 CLEANERS   |   HOURS: 8.0 TOTAL   |   STATUS: COMPLETE";display:block;grid-column:1/-1;background:#F4F7F7;border-top:4px solid #00A6A6;padding:11px 14px;margin-bottom:14px;font-size:9px;letter-spacing:.04em;color:#263238}
.invoice-preview.tmpl-cl20-34-operationsboard .inv-parties{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.invoice-preview.tmpl-cl20-34-operationsboard .inv-table thead tr{background:#263238;color:#fff}
.invoice-preview.tmpl-cl20-34-operationsboard .inv-total-grand{background:#263238;color:#fff}
.invoice-preview.tmpl-cl20-34-operationsboard .inv-total-grand b{color:#00A6A6!important}

/* CL-35 Warm linen invoice - a warm brown/tan palette, serif "Invoice" wordmark beside the meta
   panel with an accent rule underneath, and a cream/tan "housekeeping note" banner (the source's
   own static caption) ahead of the line items. */
.invoice-preview.tmpl-cl20-35-linencolumns{background:#fff;color:#1F2933;font-family:Georgia,'Times New Roman',serif}
.invoice-preview.tmpl-cl20-35-linencolumns .inv-head{display:flex!important;justify-content:space-between;align-items:flex-end;padding:30px 40px 18px;border:0;border-bottom:1px solid #D8B08C}
.invoice-preview.tmpl-cl20-35-linencolumns .inv-biz-name{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#6B7280;font-family:Arial,Helvetica,sans-serif}
.invoice-preview.tmpl-cl20-35-linencolumns .inv-doc-title{font-size:46px;color:#6A4F3B;margin-top:6px}
.invoice-preview.tmpl-cl20-35-linencolumns .inv-head-right{text-align:right;font-size:11px;font-family:Arial,Helvetica,sans-serif}
.invoice-preview.tmpl-cl20-35-linencolumns .inv-doc-num{color:#6A4F3B;font-weight:700}
.invoice-preview.tmpl-cl20-35-linencolumns .inv-body{padding-top:22px}
.invoice-preview.tmpl-cl20-35-linencolumns .inv-body::before{content:"Housekeeping note \2014  weekly service with linen refresh and kitchen reset.";display:block;background:#FBF6F1;border-left:5px solid #D8B08C;padding:12px 16px;margin-bottom:16px;font-size:10px;font-family:Arial,Helvetica,sans-serif;color:#6A4F3B}
.invoice-preview.tmpl-cl20-35-linencolumns .inv-parties{border-bottom:1px solid #E7D8C6}
.invoice-preview.tmpl-cl20-35-linencolumns .inv-table thead tr{background:#6A4F3B;color:#fff}
.invoice-preview.tmpl-cl20-35-linencolumns .inv-total-grand{background:#6A4F3B;color:#fff}
.invoice-preview.tmpl-cl20-35-linencolumns .inv-total-grand b{color:#fff!important;font-size:22px!important}