/* ============================================================
   ProjectTelemetry — Timecards module styles
   assets/timecards.css
   ============================================================ */
.tc-load{ padding:60px 0; text-align:center; color:var(--ink-soft); font-size:14px; }
.tc-load .ti{ animation:spin 1s linear infinite; margin-right:6px; }

/* ── Header + week nav ─────────────────────────────────────── */
/* Title and week selector share one row.
   They already were siblings in a flex container, but .tc-head-l could not
   shrink — a flex child defaults to min-width:auto, and the subtitle is ~330px
   of unbreakable text. Add the week nav (up to ~600px once WH-347 and Leave
   setup appear) and the row overflowed, so flex-wrap dropped the nav onto a
   line of its own and left the title row almost empty. Letting the left side
   shrink is the whole fix. */
.tc-head{ display:flex; align-items:center; justify-content:space-between; gap:var(--sp-4); flex-wrap:wrap; margin-bottom:var(--stack); }
/* Title and subtitle read as one line of text, not a title with a narrow box
   under it. Stacked, the subtitle formed a short second line that looked like a
   half-collapsed container sitting beside the controls; inline, all the wording
   sits above the toolbar where it belongs and the row is shorter. */
.tc-head-l{ min-width:0; flex:1 1 260px; display:flex; align-items:baseline; gap:var(--sp-2); flex-wrap:wrap; }
.tc-title{ font-size:19px; font-weight:700; color:var(--ink); letter-spacing:-.01em; }
.tc-sub{ font-size:12.5px; color:var(--ink-soft); margin-top:0; min-width:0; overflow-wrap:anywhere; }
/* A separator only when they actually sit on the same line. */
.tc-head-l .tc-sub::before{ content:"·"; margin-right:var(--sp-2); color:var(--ink-faint); }
/* Keeps its size; wraps internally before it forces the title off the row. */
.tc-weeknav{ display:flex; align-items:center; justify-content:flex-end; gap:var(--sp-2); flex:0 1 auto; flex-wrap:wrap; }
.tc-week{ font-size:13.5px; color:var(--ink); min-width:158px; text-align:center; white-space:nowrap; }
.tc-week .ti{ color:var(--ink-faint); margin-right:4px; }
.tc-week b{ font-weight:650; }

/* ── Approval banner ───────────────────────────────────────── */
.tc-banner{ background:#FFF7ED; border:1px solid #FED7AA; color:#9A3412; border-radius:var(--radius);
  padding:11px 14px; font-size:13px; margin-bottom:14px; display:flex; align-items:center; gap:8px; }
.tc-banner b{ font-weight:700; }
.tc-banner .ti{ font-size:16px; }

/* ── Roster ────────────────────────────────────────────────── */
.tc-roster{ border:1px solid var(--bd); border-radius:var(--radius); overflow:hidden; background:var(--white); box-shadow:var(--shadow); }
.tc-row{ display:grid; grid-template-columns:38px 1fr auto 116px 104px; align-items:center; gap:14px;
  padding:11px 16px; border-bottom:1px solid var(--bd); transition:background .12s; }
.tc-row:last-child{ border-bottom:none; }
.tc-row:hover{ background:var(--bg2); }
.tc-av{ width:34px; height:34px; border-radius:50%; background:var(--accent-bg); color:var(--accent);
  font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center; letter-spacing:.02em; }
.tc-name{ font-size:14px; font-weight:600; color:var(--ink); }
.tc-hours{ font-size:13px; color:var(--ink); font-variant-numeric:tabular-nums; text-align:right; }
.tc-soft{ color:var(--ink-faint); }

/* ── Status badges ─────────────────────────────────────────── */
.tc-badge{ font-size:11px; font-weight:650; padding:3px 9px; border-radius:100px; text-align:center; white-space:nowrap; letter-spacing:.01em; }
.tc-badge.muted{ background:var(--bg2); color:var(--ink-soft); border:1px solid var(--bd); }
.tc-badge.warn{ background:#FFF7ED; color:#B45309; border:1px solid #FED7AA; }
.tc-badge.ok{ background:#ECFDF5; color:#047857; border:1px solid #A7F3D0; }
.tc-badge.neg{ background:#FEF2F2; color:#B91C1C; border:1px solid #FECACA; }
.tc-badge.done{ background:#EFF6FF; color:#1D4ED8; border:1px solid #BFDBFE; }
.tc-badge.lock{ background:#F5F3FF; color:#6D28D9; border:1px solid #DDD6FE; display:inline-flex; align-items:center; gap:4px; }
.tc-badge.lock i{ font-size:12px; }

/* ── Signature: what you're signing for (ST/OT/DT totals) ──── */
.tc-sign-totals{ background:var(--bg2); border:1px solid var(--bd); border-radius:10px; padding:10px 12px; margin-bottom:12px; }
.tc-st-lbl{ font-size:10px; text-transform:uppercase; letter-spacing:.05em; font-weight:700; color:var(--ink-faint); margin-bottom:7px; }
.tc-st-chips{ display:flex; flex-wrap:wrap; gap:7px; }

/* ── Bulk lock modal ───────────────────────────────────────── */
.td-lock-wk{ font-size:13px; color:var(--ink-soft); margin-bottom:8px; }
.td-lock-help{ font-size:12.5px; color:var(--ink-soft); line-height:1.55; margin:0 0 14px; }
.td-lock-scope{ display:flex; flex-direction:column; gap:10px; }
.td-lock-opt{ display:flex; align-items:center; gap:8px; font-size:13px; color:var(--ink); }
.td-lock-opt select{ margin-left:2px; }

/* ── Empty states ──────────────────────────────────────────── */
.tc-empty{ text-align:center; padding:56px 20px; color:var(--ink-soft); }
.tc-empty .ti{ font-size:34px; color:var(--ink-faint); }
.tc-empty h3{ margin:12px 0 4px; font-size:15px; color:var(--ink); font-weight:650; }
.tc-empty p{ font-size:13px; max-width:380px; margin:0 auto; }

/* ── Editor modal ──────────────────────────────────────────── */
/* NOTE: .cp-modal caps max-width at 520px — we MUST override it here or the
   grid never gets its full width and the 7-day week scrolls. Both width AND
   max-width are set so all of Mon–Sun fits an 11" tablet (~1194px) landscape. */
.tc-modal{ width:min(1320px, 98vw); max-width:min(1320px, 98vw); max-height:92vh; display:flex; flex-direction:column; }
.tc-modal .cp-body{ overflow:auto; }
.tc-modal-wk{ font-size:12.5px; color:var(--ink-soft); margin-left:2px; }
.tc-reject{ background:#FEF2F2; border:1px solid #FECACA; color:#B91C1C; border-radius:var(--radius);
  padding:9px 12px; font-size:12.5px; margin-bottom:14px; display:flex; align-items:center; gap:7px; }
.tc-locknote{ background:#F5F3FF; border:1px solid #DDD6FE; color:#5B21B6; border-radius:var(--radius);
  padding:9px 12px; font-size:12.5px; margin-bottom:14px; display:flex; align-items:center; gap:7px; }

/* ── Grid ──────────────────────────────────────────────────── */
.tc-gridwrap{ overflow-x:auto; border:1px solid var(--bd); border-radius:var(--radius); }
/* Sized so all 7 days fit an 11" tablet in landscape (~1194px) without scroll;
   fixed layout splits the remaining width equally across the 7 day columns. */
.tc-grid{ width:100%; border-collapse:collapse; font-size:13px; min-width:720px; table-layout:fixed; }
.tc-grid col.tc-col-code{ width:184px; }
.tc-grid col.tc-col-tot{ width:54px; }
.tc-grid col.tc-col-rm{ width:30px; }
.tc-hint{ font-size:12px; color:var(--ink-soft); background:var(--bg2); border:1px solid var(--bd);
  border-radius:var(--radius); padding:8px 11px; margin-bottom:12px; line-height:1.5; }
.tc-hint b{ color:var(--ink); font-weight:650; }
.tc-grid th{ background:var(--bg2); color:var(--ink-soft); font-weight:600; font-size:11px; text-transform:uppercase;
  letter-spacing:.03em; padding:8px 6px; text-align:center; border-bottom:1px solid var(--bd); white-space:nowrap; }
.tc-grid th.tc-th-code, .tc-grid th.tc-th-type{ text-align:left; padding-left:10px; }
.tc-th-day span{ display:block; font-size:10px; font-weight:500; color:var(--ink-faint); text-transform:none; letter-spacing:0; margin-top:1px; }
.tc-th-day.we, .tc-cell.we{ background:rgba(0,0,0,.018); }
.tc-th-day.hol{ color:var(--accent); }
.tc-th-day.hol .ti{ font-size:10px; }
.tc-th-tot{ text-align:right !important; padding-right:12px; }
.tc-grid td{ padding:5px 6px; border-bottom:1px solid var(--bd); text-align:center; vertical-align:middle; }
.tc-grid tbody tr:last-child td{ border-bottom:none; }
.tc-grid select{ width:100%; border:1px solid var(--bd); border-radius:6px; padding:6px 7px; font-size:12.5px;
  background:var(--white); color:var(--ink); }
.tc-grid select.tc-code{ min-width:104px; }
.tc-grid select.tc-type{ min-width:64px; }
.tc-in{ width:52px; border:1px solid transparent; border-radius:6px; padding:6px 4px; font-size:13px; text-align:center;
  background:var(--bg2); color:var(--ink); font-variant-numeric:tabular-nums; -moz-appearance:textfield; }
.tc-in::-webkit-outer-spin-button, .tc-in::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.tc-in:focus{ outline:none; border-color:var(--accent); background:var(--white); box-shadow:0 0 0 2px var(--accent-bg); }
.tc-in:not(:placeholder-shown){ font-weight:600; }
.tc-mono{ font-variant-numeric:tabular-nums; font-weight:600; color:var(--ink); }
.tc-cell span{ color:var(--ink); font-variant-numeric:tabular-nums; }
.tc-rowtot{ font-weight:700; font-variant-numeric:tabular-nums; text-align:right !important; padding-right:12px !important; color:var(--ink); }
.tc-grid .tc-rm{ color:var(--ink-faint); }
.tc-grid .tc-rm:hover{ color:#DC2626; }
.tc-rowcode{ text-align:left !important; padding-left:8px !important; vertical-align:middle; }
/* Cost code picker — wrapping "code · title" label with a transparent native
   select on top, so the full code number + title shows (wrapping to as many
   lines as needed) while selection stays native (good on tablets). */
.tc-codepick{ position:relative; }
.tc-codelbl{ display:block; white-space:normal; overflow-wrap:anywhere; line-height:1.3; font-size:12px;
  font-weight:600; color:var(--ink); padding:6px 24px 6px 8px; min-height:32px; box-sizing:border-box;
  border:1px solid var(--bd); border-radius:6px; background:var(--white); }
.tc-codelbl.ph{ color:var(--ink-faint); font-weight:400; }
.tc-codelbl.ro{ border:none; background:none; padding:2px 4px; min-height:0; }
.tc-grid .tc-codepick select.tc-code{ position:absolute; inset:0; width:100%; height:100%; min-width:0;
  opacity:0; margin:0; padding:0; border:0; cursor:pointer; }
.tc-codepick:focus-within .tc-codelbl{ border-color:var(--accent); box-shadow:0 0 0 2px var(--accent-bg); }
.tc-codecaret{ position:absolute; right:6px; top:50%; transform:translateY(-50%); color:var(--ink-faint);
  font-size:15px; pointer-events:none; }

/* Cost code cell — clickable field (opens the picker modal) + labor-type badge. */
.tc-codebtn{ position:relative; display:block; width:100%; text-align:left; cursor:pointer;
  border:1px solid var(--bd); border-radius:6px; background:var(--white); padding:6px 22px 6px 8px; }
.tc-codebtn:hover{ border-color:var(--accent); background:var(--accent-bg); }
.tc-codebtn .tc-codelbl, .tc-codeview .tc-codelbl{ border:none; background:none; padding:0; min-height:0; }
.tc-codeedit{ position:absolute; right:6px; top:8px; color:var(--ink-faint); font-size:13px; }
.tc-codebtn:hover .tc-codeedit{ color:var(--accent); }
.tc-codeview{ padding:2px 4px; }
.tc-labbadge{ display:inline-block; margin-top:3px; font-size:9.5px; font-weight:750; letter-spacing:.02em;
  text-transform:uppercase; padding:1px 6px; border-radius:20px; border:1px solid var(--bd); color:var(--ink-soft); background:var(--bg2); }
.tc-labbadge.lt-field{ color:#3730A3; background:#EEF2FF; border-color:#C7D2FE; }
.tc-labbadge.lt-office{ color:#155E75; background:#ECFEFF; border-color:#A5F3FC; }
.tc-labbadge.lt-shop{ color:#92400E; background:#FEF3C7; border-color:#FDE68A; }
.tc-labbadge.lt-travel{ color:#065F46; background:#ECFDF5; border-color:#A7F3D0; }
.tc-labbadge.lt-other{ color:var(--ink-soft); }

/* Empty cost-codes state */
.tc-emptyrow td{ text-align:center !important; padding:16px 8px !important; background:var(--white); }
.tc-emptymsg{ color:var(--ink-faint); font-size:13px; }

/* ── Add-cost-code modal (search + labor type) ─────────────── */
.tc-cc-job{ font-size:12px; color:var(--ink-soft); margin-top:3px; display:flex; align-items:center; gap:5px; }
.tc-cc-job .ti{ font-size:14px; color:var(--ink-faint); }
.tc-cc-controls{ display:flex; gap:10px; align-items:flex-end; flex-wrap:wrap; margin-bottom:12px; }
.tc-cc-lab{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-soft);
  display:flex; flex-direction:column; gap:4px; }
.tc-cc-sel{ height:36px; min-width:180px; border:1px solid var(--bd); border-radius:8px; padding:0 10px; font-size:13px;
  font-weight:600; color:var(--ink); background:var(--white); text-transform:none; letter-spacing:0; }
.tc-cc-sel:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 2px var(--accent-bg); }
.tc-cc-searchwrap{ position:relative; flex:1; min-width:180px; }
.tc-cc-searchwrap .ti{ position:absolute; left:11px; top:50%; transform:translateY(-50%); color:var(--ink-faint); font-size:16px; }
.tc-cc-search{ width:100%; box-sizing:border-box; height:36px; border:1px solid var(--bd); border-radius:8px; padding:0 12px 0 34px;
  font-size:13px; background:var(--white); color:var(--ink); }
.tc-cc-search:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 2px var(--accent-bg); }
.tc-cc-list{ display:flex; flex-direction:column; gap:4px; max-height:46vh; overflow-y:auto; padding:2px; }
.tc-cc-item{ display:flex; align-items:center; gap:10px; width:100%; text-align:left; cursor:pointer;
  border:1px solid var(--bd); border-radius:8px; background:var(--white); padding:9px 11px; }
.tc-cc-item:hover{ border-color:var(--accent); background:var(--accent-bg); }
.tc-cc-item.added{ background:var(--bg2); border-color:var(--bd); }
.tc-cc-item.sel{ border-color:var(--accent); background:var(--accent-bg); }
.tc-cc-code{ font-weight:750; font-size:13px; color:var(--ink); font-variant-numeric:tabular-nums; white-space:nowrap; }
.tc-cc-desc{ flex:1; font-size:12.5px; color:var(--ink-soft); overflow:hidden; text-overflow:ellipsis; }
.tc-cc-chk{ color:var(--accent); font-size:17px; flex:none; }
.tc-cc-add{ color:var(--ink-faint); font-size:16px; flex:none; }
.tc-cc-item:hover .tc-cc-add{ color:var(--accent); }
.tc-cc-empty{ padding:20px; text-align:center; color:var(--ink-faint); font-size:13px; }
.tc-cc-hint{ font-size:11.5px; color:var(--ink-faint); margin-top:10px; line-height:1.5; }

/* ── Day cell: Hours worked over ST/OT/DT ──────────────────── */
.tc-grid td.tc-cell{ padding:5px 4px; }
.tc-worked{ width:100%; box-sizing:border-box; border:1px solid var(--bd); border-radius:6px; padding:6px 4px;
  font-size:14px; font-weight:650; text-align:center; background:var(--white); color:var(--ink);
  font-variant-numeric:tabular-nums; -moz-appearance:textfield; }
.tc-worked::-webkit-outer-spin-button, .tc-worked::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.tc-worked::placeholder{ color:var(--ink-faint); font-weight:400; }
.tc-worked:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 2px var(--accent-bg); }
.tc-splits{ display:flex; gap:3px; margin-top:3px; }
.tc-sp{ width:100%; min-width:0; box-sizing:border-box; border:1px solid transparent; border-radius:5px; padding:4px 2px;
  font-size:11px; text-align:center; background:var(--bg2); color:var(--ink-soft); font-variant-numeric:tabular-nums; -moz-appearance:textfield; }
.tc-sp::-webkit-outer-spin-button, .tc-sp::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.tc-sp::placeholder{ color:var(--ink-faint); font-size:9px; letter-spacing:.04em; }
.tc-sp:not(:placeholder-shown){ font-weight:700; color:var(--ink); background:var(--accent-bg); }
.tc-sp:focus{ outline:none; border-color:var(--accent); background:var(--white); box-shadow:0 0 0 2px var(--accent-bg); }
.tc-ro-worked{ font-size:14px; font-weight:650; color:var(--ink); font-variant-numeric:tabular-nums; }
/* Computed (non-editable) day total — reflects the hours bucketed into cost codes. */
.tc-worked-ro{ width:100%; min-width:0; box-sizing:border-box; text-align:center; font-size:15px; font-weight:700;
  color:var(--ink); font-variant-numeric:tabular-nums; padding:6px 4px; border:1px solid var(--bd); border-radius:6px;
  background:var(--bg2); cursor:default; }
.tc-splits.ro{ justify-content:center; gap:6px; margin-top:2px; }
.tc-splits.ro span{ font-size:10.5px; color:var(--ink-faint); font-variant-numeric:tabular-nums; }
.tc-splits.ro span.on{ color:var(--ink-soft); font-weight:650; }

/* ── Weekly summary chips ──────────────────────────────────── */
.tc-summary{ display:flex; flex-wrap:wrap; gap:8px; margin-top:12px; }
.tc-sumchip{ font-size:12px; color:var(--ink-soft); background:var(--bg2); border:1px solid var(--bd);
  border-radius:100px; padding:5px 12px; }
.tc-sumchip b{ color:var(--ink); font-weight:700; font-variant-numeric:tabular-nums; margin-right:2px; }
.tc-sumchip.tot{ background:var(--accent); border-color:transparent; color:#fff; }
.tc-sumchip.tot b{ color:#fff; }
.tc-sumchip.ot b{ color:#B45309; }
.tc-sumchip.dt b{ color:#B91C1C; }

/* ── Editor toolbar ────────────────────────────────────────── */
.tc-toolbar{ display:flex; gap:8px; flex-wrap:wrap; margin-top:10px; }

/* ── Rules panel (day-type matrix) ─────────────────────────── */
.tc-rules-note{ font-size:12.5px; color:var(--ink-soft); line-height:1.5; margin:0 0 14px; }
.tc-rules-note b{ color:var(--ink); font-weight:650; }
.tcr-matrix{ width:100%; border-collapse:collapse; }
.tcr-matrix th{ font-size:11px; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-soft);
  font-weight:600; text-align:center; padding:6px 4px; border-bottom:1px solid var(--bd); }
.tcr-matrix th:first-child{ text-align:left; }
.tcr-matrix td{ padding:6px 4px; border-bottom:1px solid var(--bd); text-align:center; }
.tcr-matrix tr:last-child td{ border-bottom:none; }
.tcr-lbl{ text-align:left !important; font-size:13px; font-weight:600; color:var(--ink); white-space:nowrap; }
.tcr-in{ width:74px; border:1px solid var(--bd); border-radius:6px; padding:6px 8px; font-size:13px; text-align:center;
  background:var(--white); color:var(--ink); font-variant-numeric:tabular-nums; -moz-appearance:textfield; }
.tcr-in::-webkit-outer-spin-button, .tcr-in::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.tcr-in:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 2px var(--accent-bg); }
.tc-rules-eg{ margin-top:14px; font-size:12px; color:var(--ink-soft); background:var(--bg2);
  border:1px solid var(--bd); border-radius:var(--radius); padding:9px 11px; line-height:1.6; }
.tc-rules-eg b{ color:var(--ink); font-weight:700; }

/* ── Quick fill modal ──────────────────────────────────────── */
.tc-qf-sec{ padding:14px 0; border-bottom:1px solid var(--bd); }
.tc-qf-sec:first-child{ padding-top:2px; }
.tc-qf-sec:last-of-type{ border-bottom:none; }
.tc-qf-h{ font-size:11px; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-soft); font-weight:650; margin-bottom:9px; }
.tc-chips{ display:flex; flex-wrap:wrap; gap:6px; }
.tc-chip{ font-size:12.5px; padding:5px 11px; border:1px solid var(--bd); border-radius:100px; cursor:pointer;
  color:var(--ink-soft); background:var(--white); user-select:none; transition:.12s; }
.tc-chip.on{ background:var(--accent-bg); border-color:transparent; color:var(--accent); font-weight:650; }
.tc-chip input{ display:none; }
.tc-chip-quick{ display:flex; gap:6px; margin-top:9px; }
.tc-qf-row{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.tc-qf-sel, .tc-qf-name{ border:1px solid var(--bd); border-radius:6px; padding:7px 9px; font-size:13px;
  background:var(--white); color:var(--ink); }
.tc-qf-sel{ min-width:130px; }
.tc-qf-name{ flex:1; min-width:120px; }
.tc-qf-note{ font-size:11.5px; color:var(--ink-faint); margin-top:7px; line-height:1.5; }
.tc-favlist{ display:flex; flex-direction:column; gap:6px; }
.tc-favrow{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 11px;
  border:1px solid var(--bd); border-radius:var(--radius); background:var(--bg2); }
.tc-favname{ font-size:13px; font-weight:600; color:var(--ink); display:flex; align-items:center; gap:6px; }
.tc-favname .ti{ color:var(--accent); }
.tc-favmeta{ font-size:11.5px; color:var(--ink-soft); font-weight:400; margin-left:6px; }
.tc-fav-del{ color:var(--ink-faint); }
.tc-fav-del:hover{ color:#DC2626; }
.tc-favempty{ font-size:12.5px; color:var(--ink-faint); padding:6px 2px; }

/* ── Per-day meta rows (per-diem, note) ────────────────────── */
.tc-metarow td{ border-top:1px solid var(--bd); background:rgba(0,0,0,.012); }
.tc-metarow.tc-noterow td{ border-top:none; }
.tc-metalbl{ text-align:right !important; padding-right:10px !important; color:var(--ink-soft); font-size:11px;
  text-transform:uppercase; letter-spacing:.02em; font-weight:650; white-space:nowrap; }
.tc-metalbl .ti{ color:var(--ink-faint); margin-right:3px; font-size:13px; vertical-align:-1px; }
.tc-pd, .tc-subsist{ width:52px; border:1px solid transparent; border-radius:6px; padding:6px 4px; font-size:12.5px; text-align:center;
  background:var(--bg2); color:var(--ink); font-variant-numeric:tabular-nums; -moz-appearance:textfield; }
.tc-pd::-webkit-outer-spin-button, .tc-pd::-webkit-inner-spin-button,
.tc-subsist::-webkit-outer-spin-button, .tc-subsist::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.tc-pd:focus, .tc-subsist:focus{ outline:none; border-color:var(--accent); background:var(--white); box-shadow:0 0 0 2px var(--accent-bg); }
.tc-l2toggle{ display:inline-flex; align-items:center; gap:5px; font-size:11px; color:var(--ink-soft); cursor:pointer; white-space:nowrap; }
.tc-l2toggle input{ width:auto; accent-color:var(--accent); cursor:pointer; }
/* 2nd-lunch toggle sits on the LEFT of the Lunch out label cell.
   The cell stays a normal table-cell (so it stretches to the row height);
   the flex layout lives on an inner wrapper. */
.tc-metalbl-l2{ padding-left:8px !important; }
.tc-metalbl-l2 .tc-mll-wrap{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.tc-metalbl-l2 .tc-mll-txt{ white-space:nowrap; }
/* Cost-code rows grouped under a project / overhead header */
.tc-projhead td{ padding:9px 10px 4px !important; background:var(--bg2); border-top:1px solid var(--bd); }
.tc-projhead-lbl{ font-size:12px; font-weight:700; color:var(--ink); letter-spacing:.01em; text-align:left !important; }
.tc-projhead-lbl .ti{ color:var(--accent); margin-right:5px; vertical-align:-1px; }
.tc-projhead-sub{ font-weight:500; color:var(--ink-faint); font-size:11px; margin-left:5px; }
.tc-rowcode-grouped{ padding-left:20px !important; }
.tc-noteb{ width:28px; height:26px; border:1px solid var(--bd); border-radius:6px; background:var(--white);
  color:var(--ink-faint); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; transition:.12s; }
.tc-noteb:hover:not(:disabled){ border-color:var(--accent); color:var(--accent); }
.tc-noteb.has{ background:var(--accent-bg); border-color:var(--accent); color:var(--accent); }
.tc-noteb:disabled{ cursor:default; opacity:.55; }

/* ── Top row: day's Hours worked + allocation indicator ────── */
.tc-toprow td{ border-bottom:2px solid var(--bd); background:var(--accent-bg); }
.tc-toplbl{ color:var(--accent) !important; }
.tc-topcell{ padding:5px 4px !important; }
.tc-topin{ display:flex; align-items:center; gap:3px; }
.tc-target{ width:100%; min-width:0; box-sizing:border-box; border:1px solid var(--bd); border-radius:6px; padding:6px 4px;
  font-size:14px; font-weight:700; text-align:center; background:var(--white); color:var(--ink);
  font-variant-numeric:tabular-nums; -moz-appearance:textfield; }
.tc-target::-webkit-outer-spin-button, .tc-target::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.tc-target::placeholder{ color:var(--ink-faint); font-weight:400; }
.tc-target:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 2px rgba(79,70,229,.18); }
.tc-favbtn{ flex:none; width:24px; height:28px; border:1px solid var(--bd); border-radius:6px; background:var(--white);
  color:var(--ink-faint); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; }
.tc-favbtn:hover{ border-color:var(--accent); color:var(--accent); background:var(--white); }
.tc-favbtn .ti{ font-size:14px; }
/* Footer inside the Hours-worked cell: allocation badge (left) + note icon (right) */
.tc-topfoot{ display:flex; align-items:center; justify-content:space-between; gap:4px; margin-top:3px; min-height:20px; }
.tc-alloc{ display:inline-flex; align-items:center; gap:1px; font-size:10.5px; font-weight:700; line-height:1;
  font-variant-numeric:tabular-nums; }
.tc-alloc .ti{ font-size:12px; }
.tc-alloc.ok{ color:#059669; }
.tc-alloc.under{ color:#B45309; }
.tc-alloc.over{ color:#B91C1C; }
.tc-topfoot .tc-noteb{ flex:none; width:22px; height:20px; border-radius:5px; }
.tc-topfoot .tc-noteb .ti{ font-size:13px; }
.tc-clrb{ flex:none; display:inline-flex; align-items:center; justify-content:center; width:22px; height:20px;
  border:1px solid var(--bd); border-radius:5px; background:var(--white); color:var(--muted); cursor:pointer; }
.tc-clrb .ti{ font-size:13px; }
.tc-clrb:hover{ border-color:#B91C1C; color:#B91C1C; background:#FEF2F2; }
.tc-sumchip.warn{ background:#FFF7ED; border-color:#FED7AA; color:#B45309; }
.tc-sumchip.warn .ti{ font-size:12px; vertical-align:-1px; }

/* ── Cost-codes section header ─────────────────────────────── */
.tc-secthead td{ background:var(--bg2); border-top:2px solid var(--bd); border-bottom:1px solid var(--bd); padding:6px 6px; }
.tc-secthead-lbl{ text-align:left !important; padding-left:8px !important; font-size:11px; font-weight:750;
  text-transform:uppercase; letter-spacing:.04em; color:var(--ink-soft); white-space:nowrap; }
.tc-secthead-lbl .ti{ color:var(--accent); font-size:14px; vertical-align:-2px; margin-right:3px; }
.tc-secthead-fill{ text-align:left !important; }
.tc-secthead-fill span{ font-size:11px; color:var(--ink-faint); font-weight:400; text-transform:none; letter-spacing:0; }

/* ── Lunch cell (minutes + exact-window popover) ───────────── */
.tc-lunchcell{ display:flex; align-items:center; gap:3px; }
.tc-lunchbtn{ flex:none; width:24px; height:28px; border:1px solid var(--bd); border-radius:6px; background:var(--white);
  color:var(--ink-faint); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; }
.tc-lunchbtn:hover{ border-color:var(--accent); color:var(--accent); }
.tc-lunchbtn.set{ border-color:var(--accent); color:var(--accent); background:var(--accent-bg); }
.tc-lunchbtn .ti{ font-size:14px; }
.tc-lunch[readonly]{ background:var(--accent-bg); color:var(--accent); font-weight:700; }
.tc-lunchwin{ display:block; font-size:9.5px; color:var(--ink-faint); font-variant-numeric:tabular-nums; margin-top:1px; }
.tc-lunchmenu .tc-lm-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:5px 8px; }
.tc-lunchmenu .tc-lm-row label{ font-size:12.5px; font-weight:600; color:var(--ink); }
.tc-lunchmenu .tc-lm-row input{ width:120px; height:30px; border:1px solid var(--bd); border-radius:6px; padding:0 8px;
  font-size:13px; background:var(--white); color:var(--ink); }
.tc-lunchmenu .tc-lm-row input:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 2px var(--accent-bg); }
.tc-lunchmenu .tc-lm-note{ font-size:11px; color:var(--ink-faint); padding:2px 8px 6px; line-height:1.4; }
.tc-lunchmenu .tc-lm-actions{ display:flex; justify-content:flex-end; gap:8px; padding:4px 8px 6px; }

/* Floating per-day favorite menu */
.tc-favmenu{ position:absolute; z-index:5300; min-width:200px; max-width:280px; background:var(--white);
  border:1px solid var(--bd); border-radius:10px; box-shadow:var(--shadow-md); padding:6px; }
.tc-favmenu-h{ font-size:10.5px; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-faint);
  font-weight:700; padding:4px 8px 6px; }
.tc-favmenu-item{ display:flex; align-items:center; justify-content:space-between; gap:8px; width:100%;
  border:none; background:none; text-align:left; padding:8px 8px; border-radius:7px; cursor:pointer;
  font-size:13px; font-weight:600; color:var(--ink); }
.tc-favmenu-item:hover{ background:var(--accent-bg); color:var(--accent); }
.tc-favmenu-item span{ font-size:11px; font-weight:500; color:var(--ink-faint); white-space:nowrap; }
.tc-favmenu-item:hover span{ color:var(--accent); }
.tc-favmenu-empty{ font-size:12px; color:var(--ink-faint); padding:8px; }

/* ── Clock in / lunch / out rows ───────────────────────────── */
.tc-metarow.tc-clkrow td{ border-top:none; background:rgba(79,70,229,.03); }
.tc-metarow.tc-clkrow:first-child td{ border-top:1px solid var(--bd); }
.tc-time{ width:100%; box-sizing:border-box; min-width:0; border:1px solid var(--bd); border-radius:6px; padding:5px 4px;
  font-size:12px; text-align:center; background:var(--white); color:var(--ink); font-variant-numeric:tabular-nums; }
.tc-time:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 2px var(--accent-bg); }
.tc-lunch{ width:52px; max-width:100%; box-sizing:border-box; border:1px solid transparent; border-radius:6px; padding:6px 4px;
  font-size:12.5px; text-align:center; background:var(--bg2); color:var(--ink); font-variant-numeric:tabular-nums; -moz-appearance:textfield; }
.tc-lunch::-webkit-outer-spin-button, .tc-lunch::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
.tc-lunch:focus{ outline:none; border-color:var(--accent); background:var(--white); box-shadow:0 0 0 2px var(--accent-bg); }
.tc-clk{ font-size:12px; color:var(--ink); font-variant-numeric:tabular-nums; }
.tc-metarow.tc-clkhrow td{ border-top:none; background:rgba(79,70,229,.03); }
.tc-clockh{ font-size:12.5px; color:var(--ink-faint); font-weight:600; font-variant-numeric:tabular-nums; }
.tc-clockh.on{ color:var(--accent); }

.tc-grid tfoot td{ border-top:2px solid var(--bd); background:var(--bg2); font-weight:650; padding:9px 6px; }
.tc-foot-lbl{ text-align:right !important; padding-right:10px; color:var(--ink-soft); font-size:11px;
  text-transform:uppercase; letter-spacing:.03em; }
.tc-coltot{ font-variant-numeric:tabular-nums; color:var(--ink); }
.tc-grand{ text-align:right !important; padding-right:12px !important; font-size:15px; font-weight:800;
  color:var(--accent); font-variant-numeric:tabular-nums; }

/* ── Editor actions ────────────────────────────────────────── */
.tc-actions{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:18px;
  padding-top:14px; border-top:1px solid var(--bd); }
/* When .tc-actions is a modal footer (a direct child of .cp-modal) it otherwise
   sits flush against the rounded, overflow-hidden modal edge — so the bottom
   buttons get clipped by the corner radius. Give it real side/bottom padding and
   drop the top margin so it reads as a proper footer bar. */
.cp-modal > .tc-actions{ margin-top:0; padding:14px 24px 20px; }

/* ── Home local / CBA bar (traveler / portability) ─────────── */
.tc-homebar{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:12px;
  padding:9px 12px; background:var(--bg2); border:1px solid var(--bd); border-radius:8px; }
.tc-home-lbl{ display:inline-flex; align-items:center; gap:5px; font-size:11px; font-weight:700;
  text-transform:uppercase; letter-spacing:.03em; color:var(--ink-soft); white-space:nowrap; }
.tc-home-lbl i{ font-size:15px; color:var(--ink-faint); }
.tc-home-in{ min-width:220px; max-width:60vw; height:32px; padding:0 10px; border:1px solid var(--bd); border-radius:6px;
  background:var(--white); color:var(--ink); font-size:13px; font-weight:600; cursor:pointer; }
.tc-home-in:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 2px var(--accent-bg); }
.tc-home-ro{ font-size:13px; font-weight:700; color:var(--ink); }
.tc-home-empty{ font-size:12px; color:var(--ink-faint); font-style:italic; }
.tc-home-note{ display:inline-flex; align-items:center; }
.tc-home-job{ font-size:12px; color:var(--ink-soft); }
.tc-trav{ display:inline-flex; align-items:center; gap:6px; font-size:12px; font-weight:600;
  color:#B45309; background:#FEF3C7; border:1px solid #FDE68A; border-radius:20px; padding:3px 11px; }
.tc-trav i{ font-size:14px; }

/* ── Standalone Timecards dashboard (.td-*) ────────────────── */
/* .td-head-r is gone: it was a column holding the week nav above the filters
   toolbar, and a column is as wide as its widest child — so the toolbar's width
   decided whether the DATE PICKER could sit beside the title. It couldn't, so
   the whole column wrapped and the nav ended up right-aligned inside an 880px
   box in the middle of an empty row. The two rows are siblings now. */
.td-head{ align-items:center; margin-bottom:var(--gap-min); }
/* Layout only — .td-filters is a shared toolbar primitive (design-system.css)
   and keeps its own display/gap/wrap from there. */
.td-filters{ margin-bottom:var(--stack); }
.td-filter{ border:1px solid var(--bd); border-radius:7px; padding:7px 10px; font-size:13px; background:var(--white); color:var(--ink); }
.td-searchwrap{ position:relative; display:flex; align-items:center; }
.td-searchwrap i{ position:absolute; left:9px; color:var(--ink-faint); font-size:15px; pointer-events:none; }
.td-search{ border:1px solid var(--bd); border-radius:7px; padding:7px 10px 7px 30px; font-size:13px; background:var(--white); color:var(--ink); min-width:170px; }
/* 6 children (…, tc-open, remove control) but the base .tc-row grid has 5
   columns — the remove button/placeholder wrapped to a 2nd grid line, and
   since a removable row's button (32px) is taller than the empty placeholder
   span, curated-crew rows rendered taller. Give the remove control its own
   column so every row stays one line / equal height. */
.td-roster .td-row{ align-items:center; grid-template-columns:38px 1fr auto 116px 104px 32px; }
.td-roster .td-row .td-remove, .td-roster .td-row .td-remove-sp{ width:32px; }
.td-who{ display:flex; flex-direction:column; gap:2px; min-width:0; flex:1; }
.td-who .tc-name{ flex:none; }
.td-meta{ display:flex; align-items:center; gap:8px; font-size:11.5px; color:var(--ink-soft); flex-wrap:wrap; }
.td-branchtag{ display:inline-flex; align-items:center; gap:3px; color:var(--ink-faint); }
.td-branchtag i{ font-size:12px; }
.td-pd{ display:block; font-size:11px; color:var(--ink-faint); margin-top:1px; }
.td-jobtitle{ font-size:12px; color:var(--ink-soft); }
/* Scope tag on a cost-code row (project vs overhead) */
.td-scopetag{ display:inline-flex; align-items:center; gap:4px; font-size:10.5px; font-weight:700; letter-spacing:.02em;
  padding:1px 7px; border-radius:20px; border:1px solid var(--bd); margin-right:6px; vertical-align:middle; white-space:nowrap; }
.td-scopetag i{ font-size:12px; }
.td-scope-project{ color:#3730A3; background:#EEF2FF; border-color:#C7D2FE; }
.td-scope-branch{ color:#92400E; background:#FEF3C7; border-color:#FDE68A; }
.tc-rowcode .td-scopetag + .tc-codelbl{ display:block; margin-top:3px; }

body[data-theme="blueprint"] .td-scope-project{ color:#A5B4FC; background:rgba(99,102,241,.14); border-color:rgba(99,102,241,.4); }
body[data-theme="blueprint"] .td-scope-branch{ color:#FBBF24; background:rgba(251,191,36,.12); border-color:rgba(251,191,36,.35); }

/* ── Crew management: view toggle, add-employee, remove ────── */
.td-viewtoggle{ display:inline-flex; border:1px solid var(--bd); border-radius:8px; overflow:hidden; }
.td-vt{ display:inline-flex; align-items:center; gap:5px; background:var(--white); border:none; padding:7px 12px; font-size:12.5px; font-weight:600; color:var(--ink-soft); cursor:pointer; }
.td-vt+.td-vt{ border-left:1px solid var(--bd); }
.td-vt.on{ background:var(--accent); color:#fff; }
.td-vt i{ font-size:14px; }
.td-addbtn{ white-space:nowrap; }
.td-row .td-remove{ color:var(--ink-faint); opacity:1; transition:color .12s; }
.td-row .td-remove:hover{ color:#DC2626; }
.td-remove-sp{ width:28px; display:inline-block; }
.tc-empty .btn-accent{ margin-top:14px; }
/* Add-employee modal */
.td-addtabs{ display:flex; gap:4px; padding:0 18px; border-bottom:1px solid var(--bd); }
.td-addtab{ display:inline-flex; align-items:center; gap:6px; background:none; border:none; border-bottom:2px solid transparent; margin-bottom:-1px; padding:10px 12px; font-size:13px; font-weight:600; color:var(--ink-soft); cursor:pointer; }
.td-addtab.on{ color:var(--accent); border-bottom-color:var(--accent); }
.td-as-item.added{ opacity:.6; }
.td-form{ display:flex; flex-direction:column; gap:12px; padding:4px 0 8px; }
.td-form-row{ display:flex; gap:12px; flex-wrap:wrap; }
.td-form-row label{ flex:1; min-width:180px; display:flex; flex-direction:column; gap:4px; font-size:12px; font-weight:600; color:var(--ink-soft); }
.td-form-row input, .td-form-row select{ border:1px solid var(--bd); border-radius:7px; padding:8px 10px; font-size:13px; background:var(--white); color:var(--ink); font-weight:400; }
.td-form-row input:focus, .td-form-row select:focus{ outline:2px solid var(--accent); outline-offset:-1px; border-color:var(--accent); }
.td-form-note{ font-size:11.5px; color:var(--ink-faint); line-height:1.5; }

/* ── Crew sheet (.cs-*) ────────────────────────────────────── */
.cs-scopebar{ display:flex; gap:12px; align-items:flex-end; flex-wrap:wrap; margin:12px 0;
  padding:12px 14px; background:var(--bg2); border:1px solid var(--bd); border-radius:8px; }
.cs-scopebar .tc-cc-lab{ min-width:0; }
.cs-fill{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:10px; }
.cs-fill-lbl{ display:inline-flex; align-items:center; gap:5px; font-size:12.5px; font-weight:650; color:var(--ink-soft); }
.cs-fill-in{ width:70px; border:1px solid var(--bd); border-radius:6px; padding:6px 8px; font-size:13px; background:var(--white); color:var(--ink); }
.cs-fill-note{ font-size:11.5px; color:var(--ink-faint); }
.cs-grid .cs-col-name{ width:200px; }
.cs-name{ font-size:13px; font-weight:600; color:var(--ink); white-space:nowrap; padding:8px 10px; }
.cs-grid .tc-cell{ padding:4px; }
.cs-h{ width:100%; box-sizing:border-box; text-align:center; border:1px solid var(--bd); border-radius:6px; padding:7px 4px; font-size:13px; background:var(--white); color:var(--ink); font-variant-numeric:tabular-nums; }
.cs-h:focus{ outline:2px solid var(--accent); outline-offset:-1px; border-color:var(--accent); }
.cs-lockcell{ display:block; text-align:center; color:var(--ink-faint); }
.cs-rowlocked{ opacity:.55; }
.cs-lockbadge{ display:inline-block; font-size:9.5px; font-weight:700; text-transform:uppercase; letter-spacing:.03em;
  color:var(--ink-faint); background:var(--bg2); border:1px solid var(--bd); border-radius:20px; padding:0 6px; margin-left:6px; vertical-align:middle; }

/* ── Workflow: processed badge ─────────────────────────────── */
.tc-badge.done{ background:#EEF2FF; color:#4338CA; border:1px solid #C7D2FE; }

/* ── Absence (excused / unexcused) ─────────────────────────── */
.tc-absbtn{ display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:6px;
  border:1px solid transparent; background:transparent; color:var(--ink-faint); cursor:pointer; font-size:13px; }
.tc-absbtn:hover{ background:var(--bg2); color:var(--ink); }
.tc-absbtn.on{ color:#B45309; background:#FFF7ED; border-color:#FED7AA; }
.tc-cell.tc-absent{ background:repeating-linear-gradient(135deg, var(--bg2), var(--bg2) 6px, rgba(0,0,0,.02) 6px, rgba(0,0,0,.02) 12px); }
.tc-abs-dash{ color:var(--ink-faint); font-size:13px; }
.tc-abschip{ display:inline-flex; align-items:center; gap:4px; font-size:10.5px; font-weight:650; letter-spacing:.01em;
  padding:2px 7px; border-radius:100px; white-space:nowrap; }
.tc-abschip.abs-excused{ background:#FEF3C7; color:#92400E; border:1px solid #FDE68A; }
.tc-abschip.abs-unexcused{ background:#FEE2E2; color:#991B1B; border:1px solid #FECACA; }
.tc-abschip .ti{ font-size:12px; }
.tc-favmenu-item.on{ background:var(--accent-bg); color:var(--accent); }
.tc-favmenu-item.tc-absclear{ color:var(--ink-soft); }

/* ── Signatures ────────────────────────────────────────────── */
.tc-sigs{ margin-top:14px; border:1px solid var(--bd); border-radius:var(--radius); background:var(--bg2); padding:10px 12px; }
.tc-sigs-h{ font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-soft); margin-bottom:8px; display:flex; align-items:center; gap:6px; }
.tc-sigline{ display:flex; align-items:center; gap:10px; padding:5px 0; border-top:1px solid var(--bd); }
.tc-sigline:first-of-type{ border-top:none; }
.tc-sig-role{ font-size:11.5px; font-weight:650; color:var(--ink-soft); min-width:74px; }
.tc-sig-thumb{ height:34px; max-width:150px; background:var(--white); border:1px solid var(--bd); border-radius:5px; padding:1px 4px; object-fit:contain; }
.tc-sig-meta{ font-size:11.5px; color:var(--ink-faint); }
.tc-sign-hd{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.tc-sign-stmt{ font-size:12.5px; color:var(--ink-soft); background:var(--bg2); border:1px solid var(--bd); border-radius:8px; padding:9px 11px; margin-bottom:12px; }
.tc-sigwrap{ position:relative; }
.tc-sigpad{ width:100%; height:170px; background:var(--white); border:1px dashed var(--bd); border-radius:8px; touch-action:none; cursor:crosshair; display:block; }
.tc-sigclear{ position:absolute; top:8px; right:8px; font-size:11px; padding:3px 9px; border-radius:6px; border:1px solid var(--bd);
  background:var(--white); color:var(--ink-soft); cursor:pointer; display:inline-flex; align-items:center; gap:4px; }
.tc-sign-note{ font-size:11.5px; color:var(--ink-faint); margin-top:7px; text-align:center; }

/* ── Blueprint theme tweaks ────────────────────────────────── */
body[data-theme="blueprint"] .tc-th-day.we, body[data-theme="blueprint"] .tc-cell.we{ background:rgba(255,255,255,.03); }
body[data-theme="blueprint"] .tc-trav{ color:#FBBF24; background:rgba(251,191,36,.12); border-color:rgba(251,191,36,.35); }
body[data-theme="blueprint"] .tc-sigpad, body[data-theme="blueprint"] .tc-sig-thumb{ background:#0b1220; }
body[data-theme="blueprint"] .tc-cell.tc-absent{ background:repeating-linear-gradient(135deg, rgba(255,255,255,.02), rgba(255,255,255,.02) 6px, rgba(255,255,255,.05) 6px, rgba(255,255,255,.05) 12px); }

/* ── Actual-cost chip (wage-gated) ── */
.tc-sumchip.cost{ background:#ECFDF5; border-color:#A7F3D0; color:#047857; }
.tc-sumchip.cost b{ color:#065F46; }

/* Hours | Production tab toggle + production grid */
.tc-tabs { display:flex; gap:4px; margin:2px 0 12px; border-bottom:1px solid var(--bd); }
.tc-tab { display:inline-flex; align-items:center; gap:6px; padding:8px 14px; border:0; background:transparent; color:var(--ink-soft); font-size:13px; font-weight:600; cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-1px; }
.tc-tab:hover { color:var(--ink); }
.tc-tab.on { color:var(--accent); border-bottom-color:var(--accent); }
.tc-tab i { font-size:15px; }
.tc-prod-load { padding:30px 0; text-align:center; color:var(--ink-faint); }
.tc-prod-grid td input.tc-pq { width:100%; box-sizing:border-box; padding:5px 4px; border:1px solid var(--bd); border-radius:5px; font-size:13px; text-align:center; background:var(--white); color:var(--ink); }
.tc-prod-grid .tc-pq-na { color:var(--ink-faint); }
.tc-prod-codecell b { font-weight:700; }
.tc-prod-unit { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-faint); background:var(--bg2); padding:1px 6px; border-radius:9px; }
.tc-prod-notarget { font-size:10px; font-weight:600; color:var(--accent); background:transparent; border:1px dashed var(--accent); border-radius:9px; padding:1px 7px; cursor:pointer; }
.tc-prod-pf { text-align:center; font-weight:800; font-variant-numeric:tabular-nums; color:var(--ink-soft); }
.tc-prod-pf.good { color:#16A34A; }
.tc-prod-pf.bad { color:#DC2626; }
.tc-prod-status { font-size:12px; color:#16A34A; margin-left:10px; }

/* Paid-leave section on the timecard */
.tc-leave { margin-top:16px; border:1px solid var(--bd); border-radius:10px; padding:12px 14px; }
.tc-leave-hd { font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; color:var(--ink-soft); display:flex; align-items:center; gap:7px; margin-bottom:8px; }
.tc-leave-hd i { color:var(--accent); }
.tc-leave-grid td input.tc-lv { width:100%; box-sizing:border-box; padding:5px 4px; border:1px solid var(--bd); border-radius:5px; font-size:13px; text-align:center; background:var(--white); color:var(--ink); }
.tc-leave-name b { font-weight:700; }
.tc-leave-bal { font-size:11px; color:var(--ink-faint); margin-left:6px; }
.tc-leave-bal.neg { color:#DC2626; font-weight:700; }
.tc-leave-tot { text-align:center; font-weight:800; font-variant-numeric:tabular-nums; }
.tc-leave-note { font-size:11px; color:var(--ink-faint); margin-top:8px; }

/* Payroll leave-eligibility config */
.tc-elig-wrap { overflow-x:auto; }
.tc-elig-tbl { width:100%; border-collapse:collapse; font-size:13px; }
.tc-elig-tbl th, .tc-elig-tbl td { padding:7px 8px; border-bottom:1px solid var(--bd); text-align:center; }
.tc-elig-tbl th:first-child, .tc-elig-tbl td:first-child { text-align:left; }
.tc-elig-scope { font-weight:600; white-space:nowrap; }
.tc-elig { min-width:46px; padding:4px 10px; border:1px solid var(--bd); border-radius:14px; font-size:12px; font-weight:700; cursor:pointer; background:var(--white); }
.tc-elig.on { color:#16A34A; border-color:#16A34A; background:color-mix(in srgb,#16A34A 12%,transparent); }
.tc-elig.off { color:#DC2626; border-color:#DC2626; background:color-mix(in srgb,#DC2626 10%,transparent); }
.tc-elig.inherit { color:var(--ink-faint); }
.tc-elig-rm { border:0; background:transparent; color:var(--ink-faint); cursor:pointer; font-size:15px; margin-left:6px; }
.tc-elig-rm:hover { color:#DC2626; }
.tc-elig-add { display:flex; gap:8px; align-items:center; margin-top:12px; flex-wrap:wrap; }
.tc-elig-add select { padding:6px 9px; border:1px solid var(--bd); border-radius:7px; font-size:13px; background:var(--white); color:var(--ink); }

/* ── Who entered which hours ─────────────────────────────────
   Payroll correcting one bad day needs a name against THAT day, not a weekly
   total per person. A day touched by more than one person is flagged, because
   that is the case where emailing the obvious foreman reaches the wrong one. */
.tc-attr { margin-top: var(--stack); border: 1px solid var(--bd); border-radius: 12px; background: var(--bg2); padding: var(--pad-min); }
.tc-attr-h { display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; font-size: 12px; font-weight: 700; color: var(--ink-soft); margin-bottom: 10px; }
.tc-attr-warn { display: inline-flex; align-items: center; gap: 5px; font-weight: 600; color: #92400E; background: #FEF3C7; border: 1px solid #FDE68A; border-radius: 999px; padding: 2px 9px; }
.tc-attr-none { font-size: 12.5px; color: var(--ink-faint); }
.tc-attr-wrap { overflow-x: auto; }
.tc-attr-t { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.tc-attr-t th { text-align: left; font-size: 10.5px; text-transform: uppercase; letter-spacing: .05em; color: var(--ink-faint); font-weight: 700; padding: 0 8px 6px 0; white-space: nowrap; }
.tc-attr-t td { padding: 6px 8px 6px 0; border-top: 1px solid var(--bd); color: var(--ink); }
.tc-attr-who { font-weight: 600; min-width: 0; overflow-wrap: anywhere; }
.tc-attr-code { color: var(--ink-soft); white-space: nowrap; }
.tc-attr-d, th.tc-attr-d { text-align: center; font-variant-numeric: tabular-nums; min-width: 42px; }
.tc-attr-tot, th.tc-attr-tot { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
th.tc-attr-mixed { color: #92400E; }
td.tc-attr-mixed { background: color-mix(in srgb, #F59E0B 14%, transparent); border-radius: 4px; }
.tc-attr-note { font-size: 11.5px; color: var(--ink-faint); margin-top: 10px; }

/* ── Roster: who supervises, who typed it ────────────────── */
.td-who-line { display: flex; align-items: center; gap: var(--sp-2); flex-wrap: wrap; margin-top: 3px; }
.td-who-b { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; color: var(--ink-soft); min-width: 0; overflow-wrap: anywhere; }
.td-who-b i { font-size: 13px; color: var(--ink-faint); flex: none; }
.td-who-k { font-weight: 600; color: var(--ink-faint); }
.td-who-soft { color: var(--ink-faint); font-style: italic; }
.td-who-multi { color: #92400E; }
.td-who-multi i { color: #B45309; }