/* Session 254: Quality checks (#quality-checks) and the appointment page (#appointment/<id>), qc.js.
   Light and Dark: the Dashboard's own saved choice (user_display_pref), applied as body.qc-dark while
   one of these two pages is open. Region dots use the Dashboard's region colours (REGION_COLOR). */
.qc{
  --qc-surface:var(--paper,#fff); --qc-surface-2:#f3f5f6; --qc-line:#e3e7e9; --qc-ink:#16181a; --qc-text:var(--text,#4a4f55);
  --qc-muted:var(--muted,#6b7378); --qc-accent:var(--teal-dark,#144d54); --qc-accent-2:#1d6e77; --qc-bad:#b3261e; --qc-wait:#8a5a00;
  --qc-bar-bg:#e3e7e9; --qc-bar:#2e9c7c;
  color:var(--qc-text); max-width:var(--wrap-max,1212px); margin:0 auto; box-sizing:border-box; min-width:0;
}
body.qc-dark{--page-bg:#0B1416}
body.qc-dark .qc{
  --qc-surface:#132024; --qc-surface-2:#1A2A2E; --qc-line:#24363B; --qc-ink:#EEF3F4; --qc-text:#C9D3D6; --qc-muted:#8C9AA0;
  --qc-accent:#6FD5D4; --qc-accent-2:#6FD5D4; --qc-bad:#FF7A66; --qc-wait:#F2B272; --qc-bar-bg:#24363B; --qc-bar:#6FD29A;
}
body.qc-dark .qc .btn{background:transparent;color:var(--qc-accent);border-color:var(--qc-accent)}
body.qc-dark .qc .btn-p{background:#e8743b;border-color:#e8743b;color:#fff}
body.qc-dark .qc .chip{background:var(--qc-surface);color:var(--qc-text);border-color:var(--qc-line)}
body.qc-dark .qc .chip.on{background:#1D6E77;border-color:#1D6E77;color:#fff}
body.qc-dark .qc .hint, body.qc-dark .qc .dim{color:var(--qc-muted)}
body.qc-dark .qc .crumb, body.qc-dark .qc a{color:var(--qc-accent)}
body.qc-dark .qc .warn{background:#33251A;color:#F2B272}
body.qc-dark .qc .errbox{background:#3A1C18;color:#FFB4A6}
body.qc-dark .qc .loading{color:var(--qc-muted)}

.qc *{box-sizing:border-box}
.qc a{color:var(--qc-accent)}
.qc-head{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;margin:4px 0 14px}
.qc-dnav{display:inline-flex;align-items:center;gap:8px;min-width:0}
.qc-h1{font-size:24px;line-height:1.2;margin:0;color:var(--qc-ink);font-weight:700;overflow-wrap:anywhere}
.qc-arrow{width:36px;height:36px;border-radius:10px;border:1px solid var(--qc-line);background:var(--qc-surface);color:var(--qc-ink);font-size:22px;line-height:1;padding:0;cursor:pointer;flex:none}
.qc-arrow:hover{border-color:var(--qc-accent-2)}
.qc-todayb{border:1px solid var(--qc-accent);color:var(--qc-accent);background:var(--qc-surface);border-radius:999px;padding:6px 14px;font-size:13px;font-weight:700;cursor:pointer}
.qc-todayb.dim{opacity:.45}
.qc-theme{display:inline-flex;margin-left:auto;background:var(--qc-surface);border:1px solid var(--qc-line);border-radius:999px;padding:2px}
.qc-theme button{border:none;background:transparent;color:var(--qc-text);border-radius:999px;padding:5px 12px;font-size:12px;font-weight:650;cursor:pointer}
.qc-theme button.on{background:#1D6E77;color:#fff}
.qc-search{display:flex;align-items:center;gap:8px;background:var(--qc-surface);border:1px solid var(--qc-line);border-radius:10px;padding:0 12px;height:44px;max-width:520px}
.qc-search svg{width:18px;height:18px;fill:none;stroke:var(--qc-muted);stroke-width:2;flex:none}
.qc-search input{border:none;outline:none;background:transparent;color:var(--qc-ink);font-size:16px;width:100%;min-width:0;height:40px;padding:0;box-shadow:none}
.qc-search:focus-within{border-color:var(--qc-accent-2);box-shadow:0 0 0 3px rgba(29,110,119,.18)}
.qc-searchout{margin:8px 0 0;max-width:720px}
.qc-searchout:empty{display:none}
.qc-props{display:flex;flex-direction:column;gap:6px}
.qc-prop{display:flex;flex-wrap:wrap;gap:2px 10px;align-items:baseline;text-align:left;border:1px solid var(--qc-line);background:var(--qc-surface);color:var(--qc-ink);border-radius:10px;padding:10px 12px;cursor:pointer;min-height:44px}
.qc-prop:hover{border-color:var(--qc-accent-2)}
.qc-pn{font-size:12.5px;color:var(--qc-muted)}
.qc-prophead{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:4px 0 8px;color:var(--qc-ink);font-size:15px;overflow-wrap:anywhere}
.qc-none{margin:6px 0;color:var(--qc-text);font-size:14px;line-height:1.5}
/* Session 296: the empty grid's line spans the whole row, never one narrow photo column (found session 290). */
.qc-grid > .qc-none{grid-column:1 / -1}
.qc-filter{display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 10px}
.qc-filter .chip{min-height:36px;padding:6px 14px;font-size:13px;cursor:pointer}
.qc-list{display:flex;flex-direction:column;gap:8px}
.qc-row{display:grid;grid-template-columns:78px minmax(0,1fr) auto;gap:4px 12px;align-items:center;background:var(--qc-surface);border:1px solid var(--qc-line);border-radius:10px;padding:12px 14px;text-decoration:none;color:var(--qc-text);min-height:64px}
.qc-row:hover{border-color:var(--qc-accent-2)}
.qc-time{font-weight:700;color:var(--qc-ink);font-size:15px;white-space:nowrap}
.qc-rdate{display:block;font-size:12px;font-weight:600;color:var(--qc-muted)}
.qc-main{min-width:0;display:flex;flex-direction:column;gap:3px}
.qc-pname{font-weight:650;color:var(--qc-ink);font-size:15px;overflow-wrap:anywhere}
.qc-meta{font-size:13px;color:var(--qc-muted);display:flex;align-items:center;flex-wrap:wrap;gap:0 6px;overflow-wrap:anywhere}
.qc-dot{display:inline-block;width:10px;height:10px;border-radius:50%;flex:none;border:1px solid rgba(0,0,0,.18);vertical-align:middle}
.qc-unas{color:var(--qc-wait);font-weight:600}
.qc-counts{display:flex;align-items:center;gap:10px;justify-self:end}
.qc-pc{font-size:13px;color:var(--qc-muted);white-space:nowrap}
.qc-pc.has{color:var(--qc-ink);font-weight:650}
.qc-memo svg{width:20px;height:20px;fill:none;stroke:var(--qc-muted);stroke-width:1.8;display:block}
.qc-memo.has svg{fill:var(--qc-accent-2);stroke:var(--qc-accent-2)}
.qc-memo.has svg path{fill:none}
.qc-empty{padding:16px;border:1px dashed var(--qc-line);border-radius:10px;color:var(--qc-text);font-size:14px;line-height:1.6}
.qc-link{background:none;border:none;padding:4px 0;color:var(--qc-accent);font-weight:650;font-size:13.5px;cursor:pointer;text-decoration:underline}

/* the appointment */
.qc-crumbs{display:flex;align-items:center;gap:10px;margin:4px 0 12px}
.qc-card{background:var(--qc-surface);border-radius:9px;padding:16px;margin:0 0 14px;border:1px solid var(--qc-line)}
.qc-ahead .qc-aname{font-size:22px;line-height:1.25;margin:0 0 8px;color:var(--qc-ink);display:flex;gap:10px;align-items:baseline;overflow-wrap:anywhere}
.qc-ahead .qc-aname .qc-dot{width:12px;height:12px;position:relative;top:-2px}
.qc-afacts{display:flex;flex-direction:column;gap:3px;font-size:14px;color:var(--qc-text)}
.qc-afacts b{color:var(--qc-ink)}
.qc-alinks{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px;font-size:14px;font-weight:650}
.qc-chead{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-bottom:10px;border-bottom:2px solid var(--page-bg,#edeff1);padding-bottom:8px}
.qc-chead h2{font-size:15px;font-weight:700;color:var(--qc-accent);margin:0}
.qc-cn{color:var(--qc-muted);font-weight:600}
.qc-cact{display:flex;flex-wrap:wrap;gap:8px;margin-left:auto}
.qc-cact .btn, .qc-addrow .btn{min-height:44px;padding:0 18px}
.qc-addrow{display:flex;flex-wrap:wrap;gap:8px}
.qc-hint{margin:8px 0 4px;font-size:12.5px;line-height:1.5}
.qc-prog{margin:4px 0 10px}
.qc-bar{height:8px;border-radius:999px;background:var(--qc-bar-bg);overflow:hidden}
.qc-bar i{display:block;height:100%;background:var(--qc-bar);transition:width .25s}
.qc-pl{margin-top:6px;font-size:14px;color:var(--qc-ink);line-height:1.5}
.qc-wait{color:var(--qc-wait);font-weight:600}
.qc-bad{color:var(--qc-bad);font-weight:650}
.qc-fails{display:flex;flex-direction:column;gap:6px}
.qc-fails:empty{display:none}
.qc-fails>.btn{align-self:flex-start}
.qc-fail{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:6px 10px;border:1px solid var(--qc-bad);border-radius:8px;padding:8px 10px;font-size:13px;color:var(--qc-bad);overflow-wrap:anywhere}
.qc-fail span{min-width:0;flex:1 1 180px}
.qc-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:6px}
.qc-tile{margin:0;position:relative;min-width:0}
.qc-thumb{display:block;width:100%;aspect-ratio:4/3;border:none;padding:0;border-radius:8px;overflow:hidden;background:var(--qc-surface-2);cursor:zoom-in}
.qc-thumb img{width:100%;height:100%;object-fit:cover;display:block}
.qc-editing .qc-tile{cursor:grab}
.qc-editing .qc-thumb{cursor:grab;outline:2px dashed var(--qc-line);outline-offset:2px}
.qc-drag{opacity:.4}
.qc-rmb{position:absolute;right:6px;bottom:6px;border:none;border-radius:6px;background:rgba(0,0,0,.72);color:#fff;font-size:12.5px;font-weight:650;padding:6px 10px;cursor:pointer;min-height:32px}
.qc-removed{margin-top:12px}
.qc-removed:empty{display:none}
.qc-rem{opacity:.75}
.qc-rem figcaption{font-size:12px;margin-top:4px;overflow-wrap:anywhere}
.qc-remgrid .qc-thumb{cursor:default}
.qc-file{border-top:1px solid var(--qc-line);padding:12px 0;min-width:0}
.qc-file:first-child{border-top:none}
.qc-fhead{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 12px;color:var(--qc-ink);overflow-wrap:anywhere}
.qc-fhead b{min-width:0}
.qc-flen{font-variant-numeric:tabular-nums;color:var(--qc-ink);font-weight:650}
.qc-read{font-weight:650}
.qc-fmeta{font-size:12.5px;color:var(--qc-muted);margin:3px 0 8px}
.qc-file audio{width:100%;max-width:520px;display:block}
.qc-light{position:fixed;inset:0;z-index:4000;background:rgba(5,10,12,.94);display:flex;flex-direction:column}
.qc-light[hidden]{display:none}
.qc-lbar{display:flex;align-items:center;gap:8px;padding:10px 12px;color:#fff;font-size:13px}
.qc-lbar span{flex:1;min-width:0;overflow-wrap:anywhere}
.qc-lbar button{background:rgba(255,255,255,.12);border:none;color:#fff;border-radius:8px;min-width:44px;min-height:40px;font-size:18px;cursor:pointer;padding:0 12px}
.qc-limg{flex:1;display:flex;align-items:center;justify-content:center;min-height:0;padding:8px}
.qc-limg img{max-width:100%;max-height:100%;object-fit:contain}
.qc-limg .loading{color:#ccc}

@media (max-width:600px){
  .qc-h1{font-size:19px}
  .qc-theme{margin-left:0}
  .qc-row{grid-template-columns:64px minmax(0,1fr);padding:10px 12px}
  .qc-counts{grid-column:2;justify-self:start}
  .qc-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}
  .qc-card{padding:12px}
  .qc-cact{margin-left:0;width:100%}
  .qc-cact .btn{flex:1 1 auto}
  .qc-addrow .btn{flex:1 1 auto}
  .qc-ahead .qc-aname{font-size:19px}
}

/* Session 300: the Photos card on every appointment (photos.js): the tag, the time, Share and In report under each photo;
   Select for several at once; the tag sheet (from the bottom on a phone); the zip buttons. Settings > Photo tags. */
.ph-card{min-width:0}
.ph-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.ph-h{margin:0;font-size:18px;color:var(--qc-ink)}
.ph-acts{display:flex;flex-wrap:wrap;gap:6px}
.ph-acts .btn{min-height:40px}
.ph-counts{font-size:13px;color:var(--qc-muted);margin:8px 0 2px}
.ph-counts b{color:var(--qc-ink)}
.ph-decide-t{color:var(--qc-wait);font-weight:650}
.ph-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:12px;margin-top:8px}
.ph-grid > .qc-none{grid-column:1 / -1}
.ph-tile{margin:0;position:relative;min-width:0;background:var(--qc-surface);border:1px solid var(--qc-line);border-radius:10px;overflow:hidden;display:flex;flex-direction:column}
.ph-tile.sel{outline:3px solid var(--qc-accent-2);outline-offset:-2px}
/* Session 352 (brief Part 3.4): a note the office added after the inspector started the QC, still for it */
.fn-after{display:inline-block;margin-top:4px;padding:2px 8px;border-radius:999px;background:var(--pa-amber-bg);color:var(--pa-amber-text);font-size:11.5px;font-weight:700}
/* Session 352 (brief Part 1.2): a tile that cannot show its picture says so, never an empty square that looks like a photo. The box keeps
   the thumb's own classes and size; the words and colours are the QC panel mockup's (amber dashed: still on a phone; red: could not load). */
.ph-st{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;padding:8px;box-sizing:border-box;font-size:12px;font-weight:600;line-height:1.3;cursor:default}
.ph-st.none{width:100%;height:100%;color:var(--pa-muted);background:var(--pa-page)}
.ph-st.wait{background:var(--pa-amber-icon);border:2px dashed var(--pa-amber-edge);color:var(--pa-amber-text);cursor:default}
.ph-st.bad{background:var(--pa-red-bg);color:var(--pa-red-text);cursor:default}
.ph-retry{border:0;cursor:pointer;min-height:32px;padding:6px 14px;border-radius:6px;background:#fff;color:var(--pa-red-text);font:inherit;font-size:12px;font-weight:700;box-shadow:0 1px 4px rgba(14,54,59,.14)}
.ph-retry:hover{background:var(--pa-page)}
.ph-retry:focus-visible{outline:3px solid var(--pa-teal-300);outline-offset:2px}
.ph-retry:disabled{opacity:.7;cursor:default}
.ph-wait .ph-meta{padding:8px 10px}
.ph-tile .ph-thumb{border-radius:0;aspect-ratio:4/3;cursor:zoom-in}
.ph-tile.selecting .ph-thumb{cursor:pointer}
.ph-n{position:absolute;left:6px;top:6px;background:rgba(22,24,26,.75);color:#fff;font-size:11px;font-weight:700;border-radius:6px;padding:1px 6px;pointer-events:none}
.ph-rep{position:absolute;right:6px;top:6px;background:#1D6E77;color:#fff;font-size:11px;font-weight:700;border-radius:6px;padding:1px 6px;pointer-events:none}
.ph-check{position:absolute;left:6px;top:30px;width:26px;height:26px;border-radius:50%;border:2px solid #fff;background:rgba(22,24,26,.45);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;pointer-events:none}
.ph-check.on{background:#1D6E77}
.ph-meta{display:flex;flex-direction:column;gap:6px;padding:8px;min-width:0}
.ph-tag{align-self:flex-start;border:1px solid var(--qc-line);background:var(--qc-surface-2);color:var(--qc-ink);border-radius:999px;padding:4px 10px;min-height:34px;font-size:13px;font-weight:700;cursor:pointer;max-width:100%;overflow-wrap:anywhere;text-align:left;font-family:inherit}
.ph-tag.none{color:var(--qc-muted);font-weight:600;border-style:dashed}
.ph-tag.never{background:#fdf0d8;color:#6e4a0c;border-color:#f0d49a}
.ph-time{font-size:12.5px;color:var(--qc-muted)}
.ph-up{font-size:10.5px;font-weight:700;background:var(--qc-surface-2);color:var(--qc-text);border-radius:5px;padding:0 5px}
.ph-sws{display:flex;flex-wrap:wrap;gap:6px}
.ph-sw{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:4px 10px 4px 6px;border-radius:999px;border:1px solid var(--qc-line);background:var(--qc-surface);color:var(--qc-text);font-size:12.5px;font-weight:650;cursor:pointer;font-family:inherit}
.ph-sw i{width:28px;height:16px;border-radius:999px;background:#b9c2c7;position:relative;flex:none;transition:background .15s}
.ph-sw i::after{content:'';position:absolute;left:2px;top:2px;width:12px;height:12px;border-radius:50%;background:#fff;transition:left .15s}
.ph-sw.on{border-color:#1D6E77;color:var(--qc-ink)}
.ph-sw.on i{background:#1D6E77}
.ph-sw.on i::after{left:14px}
.ph-sw:disabled{opacity:.5;cursor:default}
.ph-int{font-size:12px;font-weight:700;color:#6e4a0c;background:#fdf0d8;border-radius:6px;padding:4px 8px;align-self:flex-start}
.ph-decide{font-size:12px;font-weight:700;color:var(--qc-wait)}
.ph-selbar{position:sticky;top:calc(var(--hdrH, 56px) + 6px);display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;background:var(--qc-surface-2);border:1px solid var(--qc-line);border-radius:10px;padding:8px 10px;margin:8px 0;z-index:5}
.ph-selbar[hidden]{display:none}
.ph-selbar .qc-link{min-height:36px}
.ph-selacts{display:flex;flex-wrap:wrap;gap:6px;margin-left:auto}
.ph-selacts .btn{min-height:38px}
.ph-line{margin-top:6px}
.ph-zipmsg{margin-top:8px;font-size:13px}
.ph-zipmsg:empty{display:none}
.ph-remgrid .ph-tile{opacity:.78}
.ph-remgrid .ph-thumb{cursor:default}
.ph-sheetwrap{position:fixed;inset:0;background:rgba(10,16,18,.45);z-index:3000;display:flex;align-items:center;justify-content:center;padding:16px}
.ph-sheet{background:#fff;color:#16181a;border-radius:16px;max-width:460px;width:100%;max-height:calc(100vh - 32px);display:flex;flex-direction:column;box-shadow:0 12px 40px rgba(0,0,0,.25);font-family:Inter, system-ui, sans-serif}
.ph-sheet-h{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid #e3e7e9;font-size:16px;line-height:1.3}
.ph-sheet-h .qc-link{min-height:40px;font-size:15px;color:#144d54;background:none;border:none;font-weight:700;cursor:pointer;padding:0 4px}
.ph-sheet-b{padding:12px 16px 16px;overflow:auto;overscroll-behavior:contain}
.ph-opts{display:flex;flex-direction:column;gap:8px}
.ph-opt{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left;min-height:52px;padding:8px 12px;border-radius:12px;border:1px solid #c9d0d4;background:#fff;color:#16181a;cursor:pointer;font:inherit}
.ph-opt b{font-size:16px}
.ph-opt span{font-size:12.5px;color:#5c646b}
.ph-opt.on{border-color:#1D6E77;background:#dceff0;box-shadow:inset 0 0 0 1px #1D6E77}
.ph-go{width:100%;margin-top:12px}
.ph-sheet-s{margin-top:8px;font-size:13px;color:#5c646b}
.qc-limg{flex-direction:column;gap:8px}
.qc-lorig{color:#fff !important;font-size:13px;background:rgba(255,255,255,.14);border-radius:8px;padding:6px 12px;text-decoration:none}
.qr2-ph .qr2-cap{font-size:12.5px;font-weight:700;color:var(--qc-ink);text-align:center;padding:4px 0}
@media (max-width:760px){
  .ph-sheetwrap{align-items:flex-end;padding:0}
  .ph-sheet{border-radius:16px 16px 0 0;max-height:85vh;max-width:none}
  .ph-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .ph-selacts{margin-left:0}
  .ph-acts{width:100%}
}
/* Settings > Photo tags */
.pt-list{display:flex;flex-direction:column;margin:10px 0 18px}
.pt-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;padding:10px 0;border-bottom:1px solid #e3e7e9}
.pt-pos{width:22px;font-weight:700;color:#5c646b}
.pt-name{min-height:40px;font-size:16px;padding:6px 10px;border:1px solid #c9d0d4;border-radius:8px;width:210px;max-width:100%;box-sizing:border-box}
.pt-sel{min-height:40px;font-size:14px;border:1px solid #c9d0d4;border-radius:8px;padding:6px;max-width:100%}
.pt-n{font-size:13px;color:#5c646b;min-width:70px}
.pt-acts{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.pt-acts .qc-link, .pt-acts .btn{min-height:36px}
.pt-fixed{font-size:12.5px;color:#6e4a0c;font-weight:650}
.pt-msg{font-size:13px;flex-basis:100%}
.pt-msg:empty{display:none}
.pt-add{margin:6px 0 18px}
.pt-addrow{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:6px}
.pt-ret, .pt-hist{margin:14px 0}
.pt-retl, .pt-hl{font-size:13.5px;padding:4px 0;overflow-wrap:anywhere}
.qcx-ok-t{color:#1f7a4d;font-weight:650}
/* the page's own input and select rule is full width; on Settings > Photo tags the name and the share box sit side by side */
.s-settings .pt-row > input.pt-name, .s-settings .pt-addrow > input.pt-name{ width:220px; flex:0 1 220px; max-width:100% }
.s-settings .pt-row > select.pt-sel, .s-settings .pt-addrow > select.pt-sel{ width:auto; flex:0 1 300px; max-width:100% }
/* Session 301: a photo a cleaner uploaded from the Cleaner App; the Spanish tag name; Settings > Cleaner photo uploads. */
.ph-by{font-size:12px;font-weight:650;color:var(--qc-accent-2,#1d6e77)}
.s-settings .pt-row > input.pt-es, .s-settings .pt-addrow > input.pt-es{ width:170px; flex:0 1 170px; max-width:100% }
.cp-opts{display:flex;flex-wrap:wrap;gap:10px;margin:14px 0 10px}
.cp-opt{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:220px;flex:1 1 220px;max-width:340px;min-height:64px;padding:10px 14px;border:1.5px solid #c9d0d4;border-radius:10px;background:#fff;color:#2b3136;font:inherit;text-align:left;cursor:pointer}
.cp-opt b{font-size:16px}
.cp-opt span{font-size:13px;color:#5c646b}
.cp-opt.on{border-color:#1d6e77;background:#e5f7f7;box-shadow:inset 0 0 0 1px #1d6e77}
.cp-opt:disabled{cursor:default;opacity:.75}
.cp-opt.on:disabled{opacity:1}
.cp-now{font-size:14px;margin:4px 0 6px}
/* Session 304: Settings > Messaging's two lists (texts and emails) as one block per row on a phone, never a table wider
   than the screen. */
@media (max-width:760px){
  .msg-tbl thead{ display:none }
  .msg-tbl, .msg-tbl tbody, .msg-tbl tr, .msg-tbl td{ display:block; width:auto }
  .msg-tbl tr{ border-top:1px solid #dfe3e6; padding:8px 0 }
  .msg-tbl td{ border:none !important; padding:2px 0 !important; overflow-wrap:anywhere }
  .msg-tbl td[data-k]::before{ content:attr(data-k) ": "; font-weight:700; color:#5c646b }
  .msg-tbl td.empty::before{ content:none }
}
/* Session 304: Settings > Cleaner photo uploads, the On panel with "Also post a team update" (photos.js cpOfferOpen). */
.cp-offer{margin:12px 0;padding:14px 16px;border:2px solid #ffd13a;border-radius:12px;background:#fffdf3;display:flex;flex-direction:column;gap:8px;max-width:640px}
.cp-offer-h{font-size:16px;font-weight:800}
.cp-tick{display:flex;gap:8px;align-items:center;font-size:15px;font-weight:600;cursor:pointer;min-height:32px}
.cp-tick input{width:20px;height:20px}
.cp-lab{display:block;font-size:12px;font-weight:700;color:#5c646b;margin-top:6px}
.cp-ta{width:100%;box-sizing:border-box;border:1px solid #c9d0d4;border-radius:9px;padding:8px 10px;font:inherit;font-size:16px;line-height:1.45;resize:vertical}
.cp-offer-btns{display:flex;gap:8px;flex-wrap:wrap}

/* Session 321: the appointment page of a QC visit, the Quality Check card and Open QC. */
.qc-qcrow{display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.qc-qcgrade{font-size:30px;font-weight:800;color:var(--qc-ink, #16181A);letter-spacing:-0.03em;line-height:1;min-width:44px}
.qc-qcwhat{flex:1 1 200px;font-size:14px;color:var(--qc-text, #4A4F55)}
.qc-qcopen{text-decoration:none}
/* Session 322: where a QC stands and its client report as two lines (no middle dot); the graded clean's card names its QC visit. */
.qc-qcwhat{display:flex;flex-direction:column;gap:2px}
.qc-qcrep{font-size:13px;color:var(--qc-muted, #6B7379)}
.qc-qcvisit{font-size:12.5px;font-weight:600;color:var(--qc-muted, #6B7379);margin:8px 0 4px}

/* Session 348: saved on the phone first. Each photo still on the phone shows its state (Sending, In line, Trying again, No signal, Could not
   send), the ones sent show a tick; the Save in line; on other pages a bar says what this phone is still sending, with Open. */
.qo-thumbs{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.qo-th{position:relative;width:56px;height:56px;border-radius:8px;overflow:hidden;background:var(--qc-surface-2);border:1px solid var(--qc-line);flex:none}
.qo-th img{width:100%;height:100%;object-fit:cover;display:block}
.qo-th i{position:absolute;left:0;right:0;bottom:0;font-style:normal;font-size:10px;font-weight:700;line-height:1.25;padding:2px 3px;text-align:center;background:rgba(22,24,26,.78);color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.qo-th.qo-sent{border-color:#2e9c7c}
.qo-th.qo-sent i{background:#08513f}
.qo-th.qo-nosig i, .qo-th.qo-again i{background:#8a5a00}
.qo-th.qo-fail{border-color:var(--qc-bad)}
.qo-th.qo-fail i{background:var(--qc-bad)}
.qo-th.qo-sending{border-color:var(--qc-accent-2)}
.qcx-wait2{background:#e8f1f8;border:1px solid #9fc2dd;color:#14375a;border-radius:12px;padding:10px 12px;font-size:15px;line-height:1.45}
.qcx-wait2 .qcx-s{margin-top:2px;color:inherit}
#qcxNext{margin-top:10px}
body.qc-dark .qcx-wait2{background:#13283a;border-color:#2e5779;color:#cfe4f5}
.qo-bar{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(12px + env(safe-area-inset-bottom, 0px));z-index:900;width:min(560px, calc(100vw - 32px));box-sizing:border-box;
  display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:12px;background:#16181a;color:#fff;font-size:14px;line-height:1.4;box-shadow:0 6px 20px rgba(0,0,0,.25)}
.qo-bar span{flex:1;min-width:0}
.qo-bar .qo-open{flex:none;display:inline-flex;align-items:center;min-height:40px;padding:0 14px;border-radius:10px;background:#ffd13a;color:#16181a !important;font-weight:700;text-decoration:none}
.qo-bar .qo-open:hover{background:#f5c21c}
.qo-bar .qo-open:focus-visible{outline:3px solid #6FD5D4;outline-offset:2px}
.qcap-phone{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;background:#fff6d6;border-color:#f5c21c;color:#6e4a0c}
.qcap-phone .qc-afacts{color:#6e4a0c;margin-top:2px}
body.qc-dark .qcap-phone{background:#3a2e10;border-color:#8a6a1c;color:#F2B272}
body.qc-dark .qcap-phone .qc-afacts{color:#F2B272}