/* Submittals module styles. Scoped under .gch-m-submittals (the tool root), plus the construction-administration
   dialogs and menus (.ca-dlg, .ca-menu; dialogs live in #gch-layer, outside the tool root).
   This file also styles what Submittals and RFIs share (round 3): the list extras (.ca-*), the item page (.ip) and
   Configure (.cf). Those rules are not scoped to one tool root. */

.gch-m-submittals .sub-me{color:var(--o-txt);font-weight:700}
.gch-m-submittals .sub-late{color:var(--danger);font-weight:600}
.gch-m-submittals td.c-number{white-space:nowrap}
.gch-m-submittals td.c-number .gch-marker{margin-left:2px;vertical-align:-1px}
.gch-m-submittals td.c-rev{color:var(--ink2)}
.gch-m-submittals td.c-spec{color:var(--ink2)}
.gch-m-submittals td.c-type{color:var(--ink2)}
.gch-m-submittals td.c-response,.gch-m-submittals td.c-onsite,.gch-m-submittals td.c-lead{color:var(--ink2)}

/* bulk selection: a checkbox column and a toolbar that appears when rows are picked */
.gch-m-submittals th.c-sel,.gch-m-submittals td.c-sel{width:40px;padding-right:0;text-align:center}
.gch-m-submittals input.sub-sel{width:16px;height:16px;margin:0;vertical-align:middle;accent-color:var(--o);cursor:pointer}
.gch-m-submittals .sub-bulk{flex:none;display:flex;align-items:center;flex-wrap:wrap;gap:var(--s2);padding:var(--s2) var(--gut);border-bottom:1px solid var(--line);background:var(--bg2);box-shadow:inset 2px 0 0 var(--o)}
.gch-m-submittals .sub-bulk[hidden]{display:none}
.gch-m-submittals .sub-bulk .n{font-size:13.5px;margin-right:var(--s2)}
.gch-m-submittals .sub-bulk .n b{font-weight:700;color:var(--o-txt)}
.gch-m-submittals .sub-pkglink .n{margin-left:2px;font-size:12.5px;font-weight:600;color:var(--mid);font-variant-numeric:tabular-nums}
.gch-m-submittals .sub-phead .ip-back{flex-basis:100%;margin-left:-8px}

/* ------------------------------------------------------------------ shared: the list (Submittals and RFIs)
   The title cell holds the item link and the open-in-new-tab icon side by side. Scoped to these two tools: every
   other tool's list keeps the shared one-line title that ends in an ellipsis (base.css .gch-pane .cell-main). */
.ca-job{white-space:nowrap}
.ca-job .nm{color:var(--ink2)}
.gch-pane td a.ca-rl{color:inherit;text-decoration:none;padding:6px 0}
.gch-pane td a.ca-rl:hover{text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--edge)}
.gch-pane td a.ca-rl:focus-visible{outline:1px solid var(--o);outline-offset:2px}
.gch-m-submittals .gch-pane td.is-primary .cell-main,.gch-m-rfis .gch-pane td.is-primary .cell-main{display:flex;align-items:center;gap:var(--s2)}
.gch-m-submittals .gch-pane td.is-primary .cell-main > a.ca-rl,.gch-m-rfis .gch-pane td.is-primary .cell-main > a.ca-rl{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis}
.gch-pane a.ca-nt{flex:none;display:inline-grid;place-items:center;width:24px;height:24px;color:var(--mid);opacity:.55}
.gch-pane a.ca-nt .i{width:14px;height:14px}
.gch-pane tr:hover a.ca-nt,.gch-pane a.ca-nt:focus-visible{opacity:1;color:var(--ink)}
.gch-pane a.ca-nt:focus-visible{outline:1px solid var(--o)}
@container gchlist (max-width:620px){.gch-m-submittals .gch-pane td.is-primary .cell-main > a.ca-rl,.gch-m-rfis .gch-pane td.is-primary .cell-main > a.ca-rl{white-space:normal}.gch-pane a.ca-nt{display:none}}

.gch-phead .ca-viewbtn{gap:6px;border-color:var(--line2);font-weight:500}
.gch-phead .ca-viewbtn .k{font-size:11.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--mid)}
.gch-phead .ca-viewbtn .v{color:var(--ink);font-weight:600;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gch-phead .ca-viewbtn .ed{font-size:12px;font-weight:600;color:var(--o-txt)}
.gch-phead .ca-viewbtn .i{width:14px;height:14px;color:var(--mid)}
.gch-pop .ca-viewmenu .ca-mh{padding:10px var(--s3) 4px;font-size:11.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--mid);border-bottom:1px solid var(--line)}
.gch-pop .ca-viewmenu .ca-noi{flex:none;width:16px}
.gch-pop .ca-viewmenu button[aria-checked="true"] > span:not(.mid){font-weight:600}
.gch-pop .ca-viewmenu button[aria-checked="true"] .i{color:var(--o-txt)}

.gch-pop .ca-colp{display:flex;flex-direction:column;min-height:0}
.gch-pop .ca-colp-h{display:flex;align-items:center;justify-content:space-between;padding:var(--s2) var(--s3);border-bottom:1px solid var(--line)}
.gch-pop .ca-colp ul{list-style:none;margin:0;padding:var(--s1) 0;overflow:auto}
.gch-pop .ca-colp li{display:flex;align-items:center;gap:2px;min-height:34px;padding:0 var(--s2) 0 var(--s3)}
.gch-pop .ca-colp li label{flex:1;min-width:0;display:flex;align-items:center;gap:var(--s2);font-size:13.5px;color:var(--mid);cursor:pointer}
.gch-pop .ca-colp li.is-on label{color:var(--ink)}
.gch-pop .ca-colp li label span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gch-pop .ca-colp li .btn{min-height:28px;padding:0 6px}
.gch-pop .ca-colp-f{display:flex;justify-content:flex-end;padding:var(--s2) var(--s3);border-top:1px solid var(--line)}
.gch-dlg.ca-viewdlg .ff[data-field="cols"] .ff-multi{max-height:260px}
.gch-dlg.ca-viewdlg .ca-colrow{display:flex;align-items:center;gap:2px}
.gch-dlg.ca-viewdlg .ca-colrow .ff-check{flex:1;min-width:0}
.gch-dlg.ca-viewdlg .ca-colrow .btn{min-height:28px;padding:0 6px}

/* ------------------------------------------------------------------ shared: the item page */
.ip{flex:1;min-height:0;display:flex;flex-direction:column;background:var(--bg)}
.ip-head{flex:none;padding:var(--s1) var(--gut) var(--s4);border-bottom:1px solid var(--line2)}
.ip-bar{display:flex;align-items:center;gap:var(--s1);min-height:36px;margin-left:-8px}
.ip-back{display:inline-flex;align-items:center;gap:2px;min-height:32px;padding:0 10px 0 4px;color:var(--ink2);text-decoration:none;font-size:13.5px;font-weight:500}
.ip-back:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px}
.ip-back .i{width:16px;height:16px}
.ip-pos{margin:0 var(--s1) 0 var(--s3);font-size:12.5px;color:var(--mid);font-variant-numeric:tabular-nums;white-space:nowrap}
.ip-step.is-off{opacity:.35;cursor:default}
.ip-step.is-off:hover{background:none;border-color:transparent;color:var(--ink2)}
.ip-newtab{margin-left:auto}
.ip-id{display:flex;align-items:center;gap:var(--s2);flex-wrap:wrap;margin-top:var(--s1)}
.ip-id .gp-num{font-size:15px}
.ip-title{margin-top:2px;max-width:34em;font-family:var(--disp);font-weight:700;font-size:26px;line-height:1.18;letter-spacing:-.015em}
.ip-job{margin-top:4px;font-size:13px;color:var(--ink2)}
.ip-state{display:flex;align-items:flex-end;gap:var(--s3) var(--s6);flex-wrap:wrap;margin-top:var(--s3)}
.ip-state > .pill{align-self:center}
.ip-acts{margin-left:auto;display:flex;align-items:center;gap:var(--s1)}
.ip-acts .gp-actions{margin-top:0;justify-content:flex-end}
.ip-acts .gp-tools{margin:0}
.ip-acts .gp-more{min-height:var(--ctrl);padding:0 10px}
.ip-acts .gp-more .i{width:18px;height:18px}
.ip-scroll{flex:1;min-height:0;overflow:auto}
.ip-body{display:grid;grid-template-columns:minmax(0,2fr) minmax(320px,1fr);min-height:100%;max-width:1680px}
.ip-main{min-width:0;padding:0 var(--gut) var(--s12)}
.ip-side{min-width:0;padding:0 var(--gut) var(--s12) var(--s6);border-left:1px solid var(--line);background:var(--bg2)}
.ip-sec{margin-top:var(--s6)}
.ip-sec h2{display:flex;align-items:baseline;gap:var(--s2);font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink2)}
.ip-sec > h2{margin-bottom:var(--s3);padding-bottom:var(--s2);border-bottom:1px solid var(--line)}
.ip-sec h2 .n{color:var(--mid);font-variant-numeric:tabular-nums}
.ip-sec-t{margin-left:auto;letter-spacing:0;text-transform:none}
.ip-main .ip-sec-b > .gp-prose{max-width:76ch;font-size:15px;line-height:1.6}
.ip-main .gp-prose p + p{margin-top:var(--s3)}
.ip-main .gp-prose ul{margin:var(--s2) 0;padding-left:20px}
.ip-fold > summary{display:flex;align-items:center;gap:var(--s2);padding-bottom:var(--s2);border-bottom:1px solid var(--line);cursor:pointer;list-style:none}
.ip-fold > summary::-webkit-details-marker{display:none}
.ip-fold > summary h2{flex:1}
.ip-fold > summary:hover h2{color:var(--ink)}
.ip-fold > summary .car{width:16px;height:16px;color:var(--mid);transition:transform var(--t-hover) var(--ease)}
.ip-fold:not([open]) > summary .car{transform:rotate(-90deg)}
.ip-fold[open] > summary{margin-bottom:var(--s3)}
.ip-side .gp-people{grid-template-columns:1fr}
.ip-side .gp-hist li{grid-template-columns:92px minmax(0,1fr);row-gap:0}
.ip-side .gp-hist .what{grid-column:1 / -1;color:var(--ink)}

.ip-facts{margin:0}
.ip-facts > div{display:grid;grid-template-columns:128px minmax(0,1fr);gap:var(--s3);padding:7px 0;border-bottom:1px solid var(--line);font-size:13.5px;line-height:1.4}
.ip-facts > div:last-child{border-bottom:0}
.ip-facts dt{font-size:12.5px;color:var(--mid)}
.ip-facts dd{margin:0;min-width:0;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.ip-facts dd a{text-decoration:underline;text-decoration-color:var(--edge);text-underline-offset:3px}
.ip-facts .ip-nr dd{font-size:12.5px;line-height:1.45}

/* files: a plain page-shaped placeholder, the name, then size, who and which revision */
.ip-files{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:var(--s2)}
.ip-file{display:grid;grid-template-columns:36px minmax(0,1fr);column-gap:var(--s3);align-items:center;width:100%;min-height:60px;padding:var(--s2) var(--s3);background:var(--bg2);border:1px solid var(--line);text-align:left;cursor:pointer}
.ip-file:hover{border-color:var(--edge);background:var(--bg3)}
.ip-thumb{grid-row:1 / 3;display:grid;place-items:center;width:36px;height:44px;background:var(--bg3);border:1px solid var(--line2);font-size:9.5px;font-weight:700;letter-spacing:.04em;color:var(--mid)}
.ip-file .nm{align-self:end;font-size:13.5px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ip-file .sub{align-self:start;font-size:12.5px;color:var(--mid);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-variant-numeric:tabular-nums}

.ip-notes{list-style:none;margin:0;padding:0}
.ip-notes li{padding:var(--s2) 0;border-bottom:1px solid var(--line)}
.ip-notes li:first-child{padding-top:0}
.ip-notes .h{display:flex;align-items:center;gap:var(--s2);font-size:13px}
.ip-notes .h b{font-weight:600}
.ip-notes .h .mid{color:var(--mid);font-size:12.5px}
.ip-notes p{margin-top:4px;font-size:13.5px;line-height:1.5}
.ip-notebox{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s2);margin-top:var(--s3)}
.ip-notebox textarea{width:100%;min-height:60px;padding:8px 12px;resize:vertical;line-height:1.45}
.gp-flow .dur{margin-left:var(--s2);font-size:12.5px;color:var(--mid);font-variant-numeric:tabular-nums}
.gp-flow .dur::before{content:"· "}

/* a narrow main area (tablet, or the rail open on a small laptop) and phones stack main then side */
@container gchmain (max-width:980px){
  .ip-body{grid-template-columns:minmax(0,1fr)}
  .ip-side{padding-left:var(--gut);border-left:0;border-top:1px solid var(--line2)}
}
@media (max-width:759px){
  .ip{overflow:auto}
  .ip-scroll{flex:none;overflow:visible}
  .ip-head{padding:var(--s1) var(--s4) var(--s3)}
  .ip-title{font-size:21px}
  .ip-state{gap:var(--s3) var(--s4)}
  .ip-acts{margin-left:0;flex:1 0 100%}
  .ip-acts .gp-actions{flex:1;justify-content:flex-start}
  .ip-acts .gp-actions .btn{min-height:var(--tap)}
  .ip-main,.ip-side{padding-left:var(--s4);padding-right:var(--s4)}
  .ip-files{grid-template-columns:minmax(0,1fr)}
  .ip-facts > div{grid-template-columns:112px minmax(0,1fr)}
  .ip-pos{margin-left:var(--s1)}
}

/* ------------------------------------------------------------------ Submittals: item page pieces */
.gch-m-submittals .sub-arrow{color:var(--mid)}
.gch-m-submittals .sub-wfname{margin-bottom:var(--s2);font-size:13.5px;font-weight:600}
.gch-m-submittals .sub-remind{margin-top:var(--s2);font-size:12.5px;color:var(--mid)}
.sub-route-help{margin-bottom:var(--s3);font-size:12.5px;line-height:1.5;color:var(--mid)}
.sub-route-form{display:flex;flex-direction:column;gap:var(--s3)}
.sub-route-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--s2);min-width:0;margin:0;padding:var(--s2) var(--s3) var(--s3);border:1px solid var(--line)}
.sub-route-row legend{max-width:100%;padding:0 4px;font-size:13px;font-weight:600;line-height:1.4}
.sub-route-row legend span{display:block;font-size:11.5px;font-weight:400;color:var(--mid)}
.sub-route-row .ff-person,.sub-route-row p,.sub-route-move{grid-column:1 / -1}
.sub-route-row .ff{min-width:0;padding:0}
.sub-route-row .ff-l{font-size:11.5px}
.sub-route-row input{width:100%;min-width:0}
.sub-route-row .pk{min-width:0}
.sub-route-row.is-history{border-color:var(--line);background:var(--bg2)}
.sub-route-row p{font-size:12.5px;line-height:1.5;color:var(--mid)}
.sub-route-move{display:flex;justify-content:flex-end;gap:4px}
.sub-route-move .btn{min-width:32px;min-height:32px}
.sub-route-bar{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:var(--s2)}
.sub-route-bar [data-add-review]{margin-right:auto}
.sub-route-error{padding:var(--s2);font-size:13px;line-height:1.5;color:var(--danger);border-left:2px solid var(--danger)}
.sub-route-error[hidden]{display:none}
@media(max-width:759px){.sub-route-bar .btn,.sub-route-move .btn{min-height:var(--tap);min-width:var(--tap)}}
.sub-thread{list-style:none;margin:0;padding:0}
.sub-ev{display:flex;gap:var(--s3);padding:var(--s3) 0;border-bottom:1px solid var(--line)}
.sub-ev:first-child{padding-top:2px}
.sub-ev:last-child{border-bottom:0}
.sub-ev .b{flex:1;min-width:0}
.sub-ev .h{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px var(--s2)}
.sub-ev .h b{font-weight:600;font-size:14px}
.sub-ev .h .mid{font-size:12.5px;color:var(--mid)}
.sub-ev .h .when{margin-left:auto;font-size:12.5px;color:var(--mid);font-variant-numeric:tabular-nums;white-space:nowrap}
/* div.r is the result row of a review step. The element is named so the rule leaves the shared due date alone
   (ui.due writes <span class="r"> for "today" / "in 3 days", which this rule used to push onto its own line). */
.sub-ev div.r{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2);margin-top:6px;font-size:13.5px}
.sub-ev div.r .word{color:var(--ink2)}
.sub-ev div.r .mid{font-size:12.5px;color:var(--mid)}
.sub-ev .gp-prose{margin-top:6px;max-width:76ch;font-size:14.5px;line-height:1.55}
.sub-ev .wait{margin-top:4px;font-size:13.5px;color:var(--ink2)}
.sub-ev.is-current{margin-left:calc(-1 * var(--s3));padding-left:var(--s3);background:var(--bg2);box-shadow:inset 2px 0 0 var(--o)}
.sub-ev.is-returned .h b{color:var(--ink)}
.sub-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:var(--s2)}
.sub-chip{display:inline-flex;align-items:center;gap:4px;max-width:100%;padding:2px 8px;font-size:12.5px;background:var(--bg3);border:1px solid var(--line)}
.sub-chip .i{flex:none;width:14px;height:14px;color:var(--mid)}

/* Revisions: the current one, then the earlier ones with their review result */
.gch-m-submittals .sub-revs{list-style:none;margin:0;padding:0}
.gch-m-submittals .sub-revs li{border-bottom:1px solid var(--line)}
.gch-m-submittals .sub-revs li:last-child{border-bottom:0}
.gch-m-submittals .sub-revs a,.gch-m-submittals .sub-revs .row{display:flex;align-items:center;gap:var(--s2);min-height:40px;color:var(--ink);text-decoration:none}
.gch-m-submittals .sub-revs a:hover{background:var(--bg3)}
.gch-m-submittals .sub-revs .rv{font-weight:600;font-variant-numeric:tabular-nums;min-width:48px}
.gch-m-submittals .sub-revs .by{flex:1;min-width:0;font-size:12.5px;color:var(--mid);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gch-m-submittals .sub-revs .i{width:16px;height:16px;color:var(--mid)}
.gch-m-submittals .sub-revs li.is-cur{box-shadow:inset 2px 0 0 var(--o);padding-left:var(--s2);margin-left:calc(-1 * var(--s2))}
.gch-m-submittals .sub-rev-c{padding:0 0 var(--s2) 56px;font-size:13.5px;color:var(--ink2)}
.gch-m-submittals .sub-oldrev .ip-head{box-shadow:inset 0 2px 0 var(--line2)}

/* static tables: a package's submittals, and Preview as list in Configure */
.sub-ptable,.cf-ptable{overflow-x:auto;border:1px solid var(--line);background:var(--bg2)}
.sub-ptable table,.cf-ptable table{width:100%;border-collapse:collapse}
.sub-ptable th,.sub-ptable td,.cf-ptable th,.cf-ptable td{padding:8px var(--s3);text-align:left;vertical-align:middle;border-bottom:1px solid var(--line);font-size:13.5px;line-height:1.35;white-space:nowrap}
.sub-ptable th,.cf-ptable th{background:var(--bg);font-size:11.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--mid)}
.sub-ptable tr:last-child td,.cf-ptable tbody tr:last-child td{border-bottom:0}
.sub-ptable td.num,.sub-ptable th.num,.cf-ptable td.num,.cf-ptable th.num{text-align:right;font-variant-numeric:tabular-nums}
.sub-ptable td.id,.cf-ptable td.id{font-weight:600;font-variant-numeric:tabular-nums}
.sub-ptable td.t,.cf-ptable td.is-primary{width:100%;max-width:0;min-width:180px;overflow:hidden;text-overflow:ellipsis}
.sub-ptable td.id a{text-decoration:underline;text-decoration-color:var(--edge);text-underline-offset:3px}

/* a package's submittals on a narrow screen: number and status, then the title, then the response */
@container gchmain (max-width:700px){
  .sub-ptable thead{display:none}
  .sub-ptable table,.sub-ptable tbody{display:block}
  .sub-ptable tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px var(--s3);padding:10px var(--s3);border-bottom:1px solid var(--line)}
  .sub-ptable tr:last-child{border-bottom:0}
  .sub-ptable td{display:block;padding:0;border:0;white-space:normal}
  .sub-ptable td.t{grid-column:1 / -1;grid-row:2;width:auto;max-width:none;min-width:0}
  .sub-ptable td.num{display:none}
  .sub-ptable td:nth-child(4){grid-column:2;grid-row:1;justify-self:end}
  .sub-ptable td:nth-child(5){grid-column:1 / -1;grid-row:3;font-size:13px}
}

/* ------------------------------------------------------------------ shared: Configure */
.cf{flex:1;min-height:0;display:flex;flex-direction:column}
.cf-head{flex:none;padding:var(--s1) var(--gut) var(--s3);border-bottom:1px solid var(--line2)}
.cf-t{display:flex;align-items:baseline;gap:var(--s2) var(--s3);flex-wrap:wrap}
.cf-t h1{font-family:var(--disp);font-weight:700;font-size:22px;letter-spacing:-.01em;line-height:1.2}
.cf-t .meta{font-size:13px;color:var(--mid)}
.cf-cols{flex:1;min-height:0;display:grid;grid-template-columns:264px minmax(0,1fr)}
.cf-nav{display:flex;flex-direction:column;min-height:0;overflow:auto;padding:var(--s3) 0;border-right:1px solid var(--line)}
.cf-nav a{display:flex;align-items:center;gap:var(--s2);min-height:40px;padding:0 var(--s3) 0 var(--gut);color:var(--ink2);text-decoration:none;font-size:14px;white-space:nowrap}
.cf-nav a:hover{background:var(--bg3);color:var(--ink)}
.cf-nav a.is-on{color:var(--ink);font-weight:600;box-shadow:inset 2px 0 0 var(--o)}
.cf-dot{flex:none;margin-left:auto;width:7px;height:7px;background:var(--o)}
.cf-main{min-width:0;min-height:0;overflow:auto;padding:var(--s4) var(--gut) var(--s12)}
.cf-sec,.cf-prev{max-width:1180px}
.cf-h{display:flex;align-items:baseline;gap:var(--s2);margin-bottom:var(--s3);font-size:16px;font-weight:600}
.cf-h .n{font-size:13px;font-weight:400;color:var(--mid);font-variant-numeric:tabular-nums}
.cf-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:var(--s3) var(--s4)}
.cf-f{display:flex;flex-direction:column;gap:4px;min-width:0}
.cf-f .lbl,.cf-remind .lbl{font-size:12px;color:var(--mid)}
.cf-f input,.cf-f select{min-width:160px}
.cf-f.is-wide{flex:0 1 420px}
.cf-f.is-wide input{width:100%}
.cf-used{align-self:center;font-size:12.5px;color:var(--mid);white-space:nowrap}
.cf-check{display:inline-flex;align-items:center;gap:var(--s2);min-height:32px;font-size:13.5px;cursor:pointer}
.cf-add{display:flex;align-items:center;flex-wrap:wrap;gap:var(--s2) var(--s3);margin-top:var(--s3);font-size:13px}
.cf-add input{flex:0 1 280px;min-width:0}
.cf-add .btn:not([disabled]){border-color:var(--line2)}
.cf-err{margin-top:var(--s3);padding:8px 12px;font-size:13.5px;font-weight:500;color:var(--danger);background:var(--danger-tint);box-shadow:inset 2px 0 0 var(--danger)}
.cf-err[hidden]{display:none}
.cf-ex{margin-top:var(--s3);font-size:14px;color:var(--ink2)}
.cf-ex b{color:var(--ink);font-variant-numeric:tabular-nums}
.cf-ex a{text-decoration:underline;text-decoration-color:var(--edge);text-underline-offset:3px}
.cf-bar{display:flex;align-items:center;justify-content:flex-end;gap:var(--s2);margin-top:var(--s4);padding-top:var(--s3);border-top:1px solid var(--line)}
.cf-bar[hidden]{display:none}
.cf-bar .btn:not(.btn-p):not([disabled]){border-color:var(--line2)}
.cf-bar .btn[disabled]{opacity:1;color:var(--mid);border-color:var(--line)}
.cf-state{margin-right:auto;font-size:13px;color:var(--mid)}
.cf-state.is-dirty{color:var(--o-txt);font-weight:600}

.cf-list{list-style:none;margin:0;padding:0;max-width:720px}
.cf-list li{display:grid;grid-template-columns:minmax(0,1fr) 132px auto auto auto;align-items:center;gap:var(--s1);padding:3px 0}
.cf-list li input{width:100%;min-width:0}
.cf-list li .cf-used{padding:0 var(--s2);text-align:right}
.cf-fields{list-style:none;margin:0;padding:0}
.cf-fields li{display:grid;grid-template-columns:minmax(150px,1fr) 140px minmax(0,2fr) 170px auto;align-items:end;gap:var(--s3);padding:var(--s2) 0;border-bottom:1px solid var(--line)}
.cf-fields li .cf-f input,.cf-fields li .cf-f select{width:100%;min-width:0}
.cf-fields li .cf-f.is-off{visibility:hidden}
.cf-fields li .cf-used{align-self:end;padding-bottom:10px}
.cf-card{padding:var(--s4) 0;border-top:1px solid var(--line)}
.cf-card:first-child{border-top:0;padding-top:0}
.cf-card > * + *{margin-top:var(--s3)}
.cf-steps{border-collapse:collapse;width:100%;max-width:720px}
.cf-steps th,.cf-steps td{padding:5px var(--s3) 5px 0;text-align:left;border-bottom:1px solid var(--line);font-size:13.5px}
.cf-steps th{font-size:11.5px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--mid)}
.cf-steps input[type=number]{width:88px}
.cf-steps.cf-resp{max-width:none}
.cf-steps.cf-resp input[type=text]{width:100%;min-width:140px}
.cf-steps.cf-resp td:nth-child(2){width:210px}
.cf-steps.cf-resp td:nth-child(2) select{width:100%}
.cf-steps.cf-resp td:last-child{width:40px;padding-right:0}
.cf-remind{align-items:center;font-size:13.5px}
.cf-remind label{display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
.cf-remind input{width:64px}
.cf-jobpick{margin-bottom:var(--s3);align-items:center}
.cf-jobpick .cf-f{flex-direction:row;align-items:center;gap:var(--s2)}
.cf-jobpick .mid{font-size:13px;color:var(--mid)}
.cf-jobname{font-size:14px}
.cf-presets{margin-left:auto;display:inline-flex;gap:var(--s2);flex-wrap:wrap}
.cf-presets .btn:not([disabled]){border-color:var(--line2)}

.cf-views{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.cf-views li{display:flex;align-items:center;gap:var(--s3);border-bottom:1px solid var(--line)}
.cf-views li.is-on{box-shadow:inset 2px 0 0 var(--o);background:var(--bg2)}
.cf-vpick{flex:1;min-width:0;display:grid;grid-template-columns:minmax(0,1fr);gap:1px;padding:var(--s2) var(--s3);background:none;border:0;text-align:left;cursor:pointer}
.cf-vpick:hover b{text-decoration:underline;text-underline-offset:3px}
.cf-vpick b{font-size:14px;font-weight:600}
.cf-vpick .who{font-size:12.5px;color:var(--mid)}
.cf-vpick .what{font-size:12.5px;color:var(--ink2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cf-vacts{flex:none;display:inline-flex;gap:2px;padding-right:var(--s2)}

.cf-prev{margin-top:var(--s8)}
.cf-prev > h2{margin-bottom:var(--s2);font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink2)}
.cf-ptable tr.is-ex td{background:var(--bg3)}
.cf-ptable tr.is-ex td:first-child{box-shadow:inset 2px 0 0 var(--o)}
.cf-ptable th.is-new{color:var(--o-txt)}
.cf-ptable tr.cf-grp th{background:var(--bg);color:var(--ink2);text-transform:none;letter-spacing:0;font-size:12.5px}
.cf-pnote{margin-top:var(--s2);font-size:12.5px;color:var(--mid)}

@container gchmain (max-width:860px){
  .cf-cols{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr)}
  .cf-nav{flex-direction:row;overflow-x:auto;padding:0 var(--s2);border-right:0;border-bottom:1px solid var(--line)}
  .cf-nav a{padding:0 var(--s3)}
  .cf-nav a.is-on{box-shadow:inset 0 -2px 0 var(--o)}
  .cf-fields li{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .cf-fields li .cf-f.is-off{display:none}
  .cf-list li{grid-template-columns:minmax(0,1fr) auto auto auto}
  .cf-list li .cf-used{display:none}
  /* response choices: each choice becomes a block (wording, counts as, help), the remove button beside the wording */
  .cf-steps.cf-resp thead{display:none}
  .cf-steps.cf-resp,.cf-steps.cf-resp tbody{display:block}
  .cf-steps.cf-resp tr{display:grid;grid-template-columns:minmax(0,1fr) 40px;gap:6px var(--s2);padding:var(--s3) 0;border-bottom:1px solid var(--line)}
  .cf-steps.cf-resp td{display:block;padding:0;border:0;grid-column:1}
  .cf-steps.cf-resp td:nth-child(2){width:auto}
  .cf-steps.cf-resp td:last-child{grid-column:2;grid-row:1;width:auto}
  .cf-steps.cf-resp input[type=text]{min-width:0}
}
@media (max-width:759px){
  .cf-head{padding:var(--s1) var(--s4) var(--s3)}
  .cf-main{padding:var(--s4) var(--s4) var(--s12)}
  .cf-presets{margin-left:0}
  .cf-views li{flex-direction:column;align-items:stretch;gap:0}
  .cf-vacts{padding:0 var(--s2) var(--s2)}
  .cf-f input,.cf-f select{min-width:0}
}

/* ------------------------------------------------------------------ shared by the construction-administration dialogs */
.gch-dlg.ca-dlg .ca-err{margin:0 0 var(--s3);padding:var(--s2) var(--s3);border-left:2px solid var(--danger);background:var(--bg3);font-size:13px;color:var(--danger);font-weight:600}
.gch-dlg.ca-dlg .ff-multi{flex-direction:column;flex-wrap:nowrap;gap:0;max-height:220px;overflow-y:auto;padding:2px 0;border-bottom:1px solid var(--line)}
.gch-dlg.ca-dlg .ff-multi > *{flex:none}
.gch-dlg.ca-dlg .ff-multi .ff-check{align-items:flex-start;min-height:30px;padding:4px 0;font-size:13.5px;line-height:1.4}
.gch-dlg.ca-dlg .ff-multi .ff-check input{margin-top:3px;flex:none}
.gch-dlg.ca-dlg .ff-multi .ff-check[hidden],.gch-dlg.ca-dlg .ca-grp[hidden]{display:none}
.gch-dlg.ca-dlg .ca-grp{position:sticky;top:0;z-index:1;padding:6px 0 4px;background:var(--bg2);font-size:12px;letter-spacing:.03em;text-transform:uppercase;color:var(--mid);border-bottom:1px solid var(--line)}
.gch-dlg.ca-dlg .ca-grp b{color:var(--ink2);font-weight:700;font-variant-numeric:tabular-nums}
.gch-dlg.sub-dlg .ff[data-field="reqs"] .ff-multi{max-height:46vh}
.gch-dlg.ca-dlg .ca-tools{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2);margin-top:var(--s3)}
.gch-dlg.ca-dlg .ca-filter{flex:1 1 220px;min-width:0}
.gch-dlg.ca-dlg .dlg-intro .pill{vertical-align:1px}
.gch-dlg .ca-copy{width:100%;margin-top:var(--s2)}
.gch-pop .ca-menu{border:0}
.gch-pop .ca-menu button > span:not(.mid){flex:1;min-width:0}
.gch-pop .ca-menu button .mid{margin-left:auto;padding-left:var(--s3);font-size:12px;color:var(--mid);white-space:nowrap}
.gch-panel .gp-tools .gp-more .i{width:18px;height:18px}

@media (max-width:759px){
  .gch-m-submittals .sub-bulk{padding:var(--s2) var(--s3)}
  .gch-dlg.ca-dlg .ff-multi{max-height:40vh}
}

/* FX2: a section of Configure that is set per job says so on its own row */
.cf-tag{flex:none;margin-left:auto;padding:1px 5px;font-size:10.5px;font-weight:600;letter-spacing:.03em;text-transform:uppercase;color:var(--mid);background:var(--tag-bg);white-space:nowrap}
.cf-nav a .cf-tag + .cf-dot{margin-left:var(--s2)}

/* FX2 (laptop width): a long job name under Facts wraps inside the side column instead of running off the page */
.ip-facts dd{min-width:0}
.ip-facts dd .jobref,.ip-facts dd .jobref .nm{white-space:normal}
/* a long linked label (an activity name) wraps in the side column instead of widening the page */
.ip-side .gp-link .lbl{white-space:normal;overflow-wrap:anywhere}

/* FX2 laptop band. A 1366px window with the rail open leaves a list 1134px (1280px: 1048px), just above the width at
   which the shared list drops its fourth-priority columns, so the title was squeezed to its minimum and the table
   scrolled inside the pane. In this tool the columns that give way first go at 1220px, and the due date stacks (the
   date over "in 3 days"), so the title keeps the width. */
@container gchlist (max-width:1220px){
  .gch-m-submittals .gch-list .p4,.gch-m-submittals .gch-list .c-rev{display:none}
  .gch-m-submittals .gch-pane td .due{display:inline-flex;flex-direction:column;line-height:1.25;vertical-align:middle}
  .gch-m-submittals .gch-pane td .due .sep{display:none}
  .gch-m-submittals .gch-pane td .due .r{font-size:12.5px}
}
@container gchlist (max-width:1120px){
  .gch-m-submittals .gch-list .c-responsible{display:none}
}