/* ============================================================================================
   LABOUR v2 — [075500]
   Every rule is scoped to body.atiq-labour-v2, so clearing the toggle in core.js removes the lot.
   Nothing here inherits from quote-print.css on purpose: the v1 labour rules run ~181 selectors
   deep with 59 !important between them, and fighting that cascade is what produced four font
   weights in one table. New class prefix, clean sheet, no !important needed.
   ============================================================================================ */

body.atiq-labour-v2{
  --l2-blue:#5aa9f0; --l2-blue-d:#06243d; --l2-red:#e05252; --l2-amber:#e8a33d;
  /* [078500] Tokenised so LIGHT MODE is one block instead of an override per rule. These are the
     STAGE CARD colours; the popup declares its own set on .l2-pop and so is unaffected by these.
     Values mirror stage-v2.css, so labour and the rest of the card sit on one scale. */
  --l2-ink:#eceded; --l2-ink2:#b4b7bb; --l2-ink3:#7e8287; --l2-ink4:#4e5257;
  --l2-line:rgba(255,255,255,.07); --l2-line2:rgba(255,255,255,.14);
  --l2-btn-bg:#1c1d20; --l2-hover:rgba(90,169,240,.07);
}
/* LIGHT. The blue drops to the app's light accent (#1a5fbf, same as --info and stage-v2's
   --v2-measured), the greys invert, and the hairlines become black at the same opacities. */
body.light.atiq-labour-v2{
  --l2-blue:#1a5fbf; --l2-blue-d:#ffffff; --l2-red:#b82020; --l2-amber:#b85c00;
  --l2-ink:#1a1a18; --l2-ink2:#4a4845; --l2-ink3:#6f6f6a; --l2-ink4:#a8a8a3;
  --l2-line:rgba(0,0,0,.07); --l2-line2:rgba(0,0,0,.14);
  --l2-btn-bg:#ffffff; --l2-hover:rgba(26,95,191,.07);
}

/* ── the rows in the stage card ──────────────────────────────────────────────────────────── */
body.atiq-labour-v2 .quote-view .l2-row{ cursor:pointer; transition:background .1s; }
body.atiq-labour-v2 .quote-view .l2-row:hover{ background:var(--l2-hover); }
body.atiq-labour-v2 .quote-view .l2-row td{ padding:7.71px 6.425px; }
body.atiq-labour-v2 .quote-view .l2-tname{ font-weight:400; color:var(--l2-ink); }
body.atiq-labour-v2 .quote-view .l2-amp{ color:var(--l2-blue); font-weight:600; margin:0 2.57px; }
/* [077500b] .l2-shape removed — the blue "2 men x 2 days" chip is no longer rendered on the row.
   The shape lives in the row's tooltip and in the popup. */
body.atiq-labour-v2 .quote-view td.l2-fig{ font-weight:400; color:var(--l2-ink); text-align:right; }
/* [077500b] was 9px/700 — bigger than the rest of the pricing, which made every parent row
   shout. One size, one weight, same as the figures it sits beside. */
body.atiq-labour-v2 .quote-view .l2-tot{ font-weight:600; color:var(--l2-ink); }
body.atiq-labour-v2 .quote-view .l2-dim{ color:var(--l2-ink3); }

/* the delete sits in the total cell but is absolutely placed, so the money never shifts */
/* [077500b] The cell used to reserve 24px for the delete, which pushed every parent total out of
   line with the rows below it. No reserved space now — the button fades in over the number on
   hover, so the column never moves. */
body.atiq-labour-v2 .quote-view .l2-row td:last-child{ position:relative; }
body.atiq-labour-v2 .quote-view .l2-del{
  position:absolute; right:1.285px; top:50%; transform:translateY(-50%);
  opacity:0; pointer-events:none; transition:opacity .12s, background .12s, border-color .12s, color .12s;
  width:24.415px; height:24.415px; border-radius:6.425px; border:1.285px solid var(--l2-line2);
  background:var(--l2-btn-bg); color:#8d959e; font-family:inherit; font-size:14.135px; font-weight:600;
  line-height:1; cursor:pointer; display:inline-flex; align-items:center; justify-content:center;
  transition:all .12s;
}
body.atiq-labour-v2 .quote-view .l2-row:hover .l2-del{ opacity:1; pointer-events:auto; }
body.atiq-labour-v2 .quote-view .l2-del:hover{ background:var(--l2-red); border-color:var(--l2-red); color:#fff; }

/* day rows: the rows are the days, so they only carry the crew */
body.atiq-labour-v2 .quote-view .l2-day td{ padding:3.855px 6.425px; color:var(--l2-ink3); border-bottom:1.285px solid var(--l2-line); }
body.atiq-labour-v2 .quote-view .l2-day td:first-child{ padding-left:41.12px; position:relative; }
body.atiq-labour-v2 .quote-view .l2-day td:first-child::before{
  content:""; position:absolute; left:25.7px; top:0; bottom:0; width:1.285px; background:var(--l2-blue); opacity:.3;
}
body.atiq-labour-v2 .quote-view .l2-day.last td:first-child::before{ bottom:50%; }
body.atiq-labour-v2 .quote-view .l2-day td:first-child::after{
  content:""; position:absolute; left:25.7px; top:50%; width:10.28px; height:1.285px; background:var(--l2-blue); opacity:.3;
}
/* [079000] 8px. It was 9 so the small multiplication sign stayed visible; a capital X is drawn to
   the cap line and needs no help, so the extra size was working against it. */
body.atiq-labour-v2 .quote-view .l2-xn{ color:var(--l2-ink2); font-weight:600; font-size:10.28px; letter-spacing:.03em; }

/* the summary rides the group heading */
/* [077500b] right-aligned, white, uppercase. In blue and tucked beside the group name it read as
   part of the heading; it is a figure about the stage, so it belongs at the far edge. */
body.atiq-labour-v2 .quote-view .l2-gdays{
  float:right; font-size:9.6375px; font-weight:600; letter-spacing:.07em;
  text-transform:uppercase; font-variant-numeric:tabular-nums;
}
body.atiq-labour-v2 .quote-view .l2-gd-days{ color:var(--l2-ink); }
body.atiq-labour-v2 .quote-view .l2-gd-md{ color:var(--l2-blue); }
body.atiq-labour-v2 .quote-view .l2-gd-sep{ color:var(--l2-ink3); }
/* + Add on the section title */
body.atiq-labour-v2 .quote-view .col-section-title .l2-add{
  margin-left:auto; background:none; border:1.285px solid rgba(90,169,240,.45); border-radius:17.99px;
  color:var(--l2-blue); font-family:inherit; font-size:10.9225px; font-weight:700; padding:3.855px 14.135px;
  cursor:pointer; letter-spacing:.02em; transition:all .12s; flex:0 0 auto;
}
body.atiq-labour-v2 .quote-view .col-section-title .l2-add:hover{
  background:rgba(90,169,240,.15); border-color:var(--l2-blue);
}
/* a v2 stage never has sub-activities on the other groups, so that control goes */
body.atiq-labour-v2 .quote-view .lab-section-wrap .lab-day-ctrl{ display:none; }

/* ── the popup ─────────────────────────────────────────────────────────────────────────────
   [137500] REBUILT ON THE MODAL FAMILY. The shell — scrim, box, eyebrow, title, footer, buttons —
   is design/popups.css (.q-scrim / .q-modal / .q-btn), the same as every other modal. What is
   left here is only what the labour editor has and no other modal does: the task picker, the
   draggable cards of ADD mode, and the name-as-title of EDIT mode.
   Its private colour set (--l2-ink…) now POINTS AT the design tokens instead of holding its own
   values, so light mode needs no second copy — tokens.css swaps them — and the 30-odd light-mode
   overrides that used to follow are gone. */
.l2-pop{
  --l2-ink:var(--q-text); --l2-ink2:var(--q-sub); --l2-ink3:var(--q-quiet);
  --l2-panel:var(--q-surface); --l2-panel2:var(--q-row-hi);
  --l2-line:var(--q-rule); --l2-line2:var(--q-pill-bd); --l2-line3:var(--q-rule-strong);
  --l2-sel:var(--q-measured); --l2-sel-tint:var(--q-measured-tint);
  display:flex; flex-direction:column; max-height:calc(100vh - 40px); overflow:hidden;
}
.l2-body{ overflow-y:auto; flex:1 1 auto; min-height:0; }
.l2-body > .q-caps{ display:block; }
.l2-body > h3{ margin:6px 0 14px; }
.l2-fld{ margin-top:12px; }
/* Men · Days · Rate on one row at the modal's width (design 06); the 12px gap left it 1px short */
.l2-pop .q-fields{ column-gap:10px; }
.l2-fld > .q-caps{ display:block; margin-bottom:8px; }

/* EDIT mode: the line's name is the modal's title, and typing renames it in place */
.l2-title{ display:block; width:100% !important; margin:6px 0 16px; padding:2px 6px; margin-left:-7px;
  font-size:19px !important; font-weight:700; letter-spacing:-.2px; color:var(--q-text);
  background:none; border:1px solid transparent; border-radius:6px; font-family:inherit; }
.l2-title:hover{ border-color:var(--q-pill-bd); }
.l2-title:focus{ outline:none; border-color:var(--q-input-bd); background:var(--q-input-bg); }
.l2-one .l2-parts, .l2-one .l2-warn{ margin-top:10px; }

/* the task picker: a quiet list; a picked task is the measured blue, like a pressed filter pill */
.l2-picks{ border:1px solid var(--l2-line2); border-radius:10px; overflow:hidden; }
.l2-gh{ padding:9px 12px 4px; font-family:var(--q-narrow); font-size:var(--q-fs-capsxs); font-weight:600; letter-spacing:1px;
  text-transform:uppercase; color:var(--q-head); }
.l2-pick{
  display:flex; align-items:center; gap:10px; width:100%; background:none; border:none;
  border-bottom:1px solid var(--l2-line); color:var(--l2-ink2); font-family:inherit; font-size:12.5px;
  font-weight:500; padding:9px 12px; cursor:pointer; text-align:left; transition:background .1s,color .1s;
}
.l2-pick:hover{ background:var(--q-hover); color:var(--l2-ink); }
.l2-box{
  width:16px; height:16px; border:1.5px solid var(--l2-line3); border-radius:5px; flex:0 0 auto;
  display:flex; align-items:center; justify-content:center; font-size:10px; font-weight:800;
  color:transparent; transition:all .11s;
}
.l2-nm{ flex:1 1 auto; }
.l2-rt{ font-size:11.5px; font-weight:600; color:var(--l2-ink3); font-variant-numeric:tabular-nums; }
.l2-pick.on{ background:var(--l2-sel-tint); color:var(--l2-ink); }
.l2-pick.on .l2-box{ background:var(--l2-sel); border-color:var(--l2-sel); color:var(--q-surface); }
.l2-pick.on .l2-rt{ color:var(--l2-sel); }
.l2-pick.locked{ cursor:default; }
.l2-custom{ cursor:text; border-bottom:none; }
.l2-custom .l2-box{ border-style:dashed; color:var(--l2-ink3); font-size:11px; font-weight:600; }
.l2-custom input{ flex:1 1 auto; background:none; border:none; color:var(--l2-ink); font-family:inherit;
  font-size:12.5px; font-weight:500; padding:0; }
.l2-custom input:focus{ outline:none; }
.l2-custom input::placeholder{ color:var(--q-faint); font-weight:400; }
.l2-cgo{ background:none; border:1px solid var(--q-add-bd); border-radius:var(--q-r-btn); color:var(--q-add);
  font-family:inherit; font-size:11px; font-weight:600; padding:4px 10px; cursor:pointer; }

/* ADD mode: one card per picked task, draggable onto another to merge */
.l2-cards{ display:flex; flex-direction:column; gap:8px; }
.l2-card{
  border:1px solid var(--l2-line2); border-radius:12px; background:var(--l2-panel2);
  padding:12px 14px 14px; cursor:grab; touch-action:pan-y; position:relative;
  transition:transform .26s cubic-bezier(.34,1.56,.64,1), box-shadow .2s ease, border-color .16s, background .16s, opacity .16s;
}
.l2-card:active{ cursor:grabbing; }
.l2-card.joined{ border-color:var(--l2-sel); background:var(--l2-sel-tint); }
.l2-card.dragging{ opacity:.62; box-shadow:var(--q-shadow); z-index:6; transition:opacity .12s,box-shadow .12s; }
.l2-card.drop{ border-color:var(--l2-sel); background:var(--l2-sel-tint); transform:scale(1.04); }
.l2-card.drop::after{
  content:"merge"; position:absolute; top:-9px; right:10px; font-size:8px; font-weight:800;
  letter-spacing:.12em; text-transform:uppercase; color:var(--q-surface); background:var(--l2-sel);
  padding:2px 7px; border-radius:9px; animation:l2TagIn .2s cubic-bezier(.34,1.56,.64,1);
}
@keyframes l2TagIn{ from{ transform:translateY(4px) scale(.7); opacity:0 } to{ transform:none; opacity:1 } }
@keyframes l2Pop{ 0%{ transform:scale(.9) } 55%{ transform:scale(1.04) } 100%{ transform:scale(1) } }
.l2-card.popped{ animation:l2Pop .44s cubic-bezier(.34,1.56,.64,1); }
.l2-card .q-figures{ gap:24px; }
.l2-card .q-figures > div{ font-size:13px; }
.l2-card .q-figures .total b{ font-size:15px; }

.l2-top{ display:flex; align-items:center; gap:7px; margin-bottom:12px; }
.l2-nmin:not(.l2-title){
  flex:0 1 auto; background:none; border:1px solid transparent; border-radius:5px; color:var(--l2-ink);
  font-family:inherit; font-size:14px; font-weight:700; letter-spacing:-.01em; padding:3px 6px; margin-left:-7px;
  min-width:0; cursor:text; transition:border-color .12s, background .12s;
}
.l2-nmin:not(.l2-title):hover{ border-color:var(--l2-line2); }
.l2-nmin:not(.l2-title):focus{ outline:none; border-color:var(--q-input-bd); background:var(--q-input-bg); }
.l2-gap{ flex:1; align-self:stretch; }
.l2-mx{
  background:none; border:1px solid var(--l2-line2); color:var(--l2-ink3); font-size:12px;
  line-height:1; cursor:pointer; font-family:inherit; width:20px; height:20px;
  border-radius:var(--q-r-btn); flex:0 0 auto; display:inline-flex; align-items:center; justify-content:center;
}
.l2-mx:hover{ color:var(--q-danger); border-color:var(--q-danger-bd); }

.l2-days{ margin-top:10px; }
.l2-day-c.part .q-caps{ color:var(--q-labour); }
.l2-parts{ font-size:11px; color:var(--l2-ink3); margin-top:10px; }
.l2-warn{ font-size:11px; color:var(--q-warn); margin-top:10px; }
.l2-split{ display:inline-block; margin-top:10px; background:none; border:none; padding:0; color:var(--q-add);
  font-family:inherit; font-size:12px; cursor:pointer; }
.l2-hint{ font-size:11px; color:var(--l2-ink3); margin-top:10px; line-height:1.45; }
.l2-go:disabled, .l2-pop #l2-go:disabled{ opacity:.4; cursor:default; }

@media print{ .l2-scrim, .l2-add, .l2-del{ display:none !important; } }

/* ── [076500b] the empty state ──
   A blank Labour group needs an unmissable way in. The small + Add on the section title is a
   convenience once you know it is there; this is the one you find without being told. */
body.atiq-labour-v2 .quote-view .l2-emptyrow td{
  padding:20.56px 6.425px 23.13px; text-align:center; border-bottom:1.285px solid var(--l2-line);
}
body.atiq-labour-v2 .quote-view .l2-bigadd{
  display:inline-flex; align-items:center; gap:8.995px;
  background:rgba(90,169,240,.12); border:1.285px solid rgba(90,169,240,.5); border-radius:25.7px;
  color:var(--l2-blue); font-family:inherit; font-size:13.4925px; font-weight:700;
  padding:8.995px 21.845px; cursor:pointer; transition:all .12s; letter-spacing:.01em;
}
body.atiq-labour-v2 .quote-view .l2-bigadd:hover{
  background:rgba(90,169,240,.22); border-color:var(--l2-blue);
}
@media print{ body.atiq-labour-v2 .quote-view .l2-emptyrow{ display:none; } }

/* ── [077500b] the per-group add ──
   v1's single add-item dropdown lived up in the section title and made you pick the group from a
   menu. One "+" per group heading is the same action with the target already chosen. Hidden until
   the heading is hovered, so eight groups don't read as eight buttons. */
body.atiq-labour-v2 .quote-view .lab-section-wrap .lab-add-btn-wrap{ display:none; }
body.atiq-labour-v2 .quote-view .l2-rowadd{
  float:right; margin-left:10.28px; width:20.56px; height:20.56px; padding:0; line-height:1;
  border:1.285px solid rgba(90,169,240,.45); border-radius:6.425px; background:none;
  color:var(--l2-blue); font-family:inherit; font-size:14.135px; font-weight:700; cursor:pointer;
  opacity:0; transition:opacity .12s, background .12s, border-color .12s;
}
body.atiq-labour-v2 .quote-view tr.lab-group-b3:hover .l2-rowadd{ opacity:1; }
body.atiq-labour-v2 .quote-view .l2-rowadd:hover{
  opacity:1; background:rgba(90,169,240,.18); border-color:var(--l2-blue);
}

/* [077500b] the rows in the OTHER groups share the task rows' scale: 8.5px, weight 400. They were
   running the pre-v2 palette at #f0f0f0/500, which is why labour read heavier than materials. */
body.atiq-labour-v2 .quote-view .lab-section-wrap .lab-display-val{ font-weight:400; color:var(--l2-ink2); }
body.atiq-labour-v2 .quote-view .lab-section-wrap .lab-display-val.has-value{
  font-weight:400; color:var(--l2-ink);
}
body.atiq-labour-v2 .quote-view .lab-section-wrap .lab-display-val.zero{ color:var(--l2-ink3); }

@media print{
  body.atiq-labour-v2 .quote-view .l2-rowadd{ display:none; }
  body.atiq-labour-v2 .quote-view .l2-del{ display:none; }
}

/* ============================================================================================
   [078500] ROW SIZE — 8.5px, at a depth that actually wins
   ============================================================================================
   The 8.5px declared on .l2-tname / td.l2-fig / .l2-tot never applied. Those selectors are
   (0,3,2); they lose to quote-print.css:494 —

     .quote-view .page-card .tbl tbody tr:not(.tbl-part-row):not(.lab-group-b3):not(.mat-manual-row) td
     { font-size:8px }

   — which is (0,6,3), the three :not() arguments each counting as a class. Everything rendered at
   8px while the stylesheet said 8.5. Matching that depth beats it honestly; !important would have
   won too, and would have been the start of the same cascade war that left v1 with four font
   weights in one table.

   Scoped per WRAPPER so the take-off keeps its own size: this is labour and materials only.
   Day rows are excluded — their size, colour and weight are deliberately unchanged. */
body.atiq-labour-v2 .quote-view .lab-section-wrap .tbl tbody tr:not(.l2-day):not(.lab-group-b3) td,
body.atiq-labour-v2 .quote-view .mat-schedule-wrap .tbl tbody tr:not(.tbl-part-row):not(.lab-group-b3) td{
  font-size:10.9225px;
}

/* ── [078500] THE POPUP IN LIGHT MODE ──
   [137500] gone: the popup's colours are design tokens now (see "the popup" above), and
   tokens.css swaps them for body.light. Twenty-eight overrides that had to be kept in step with
   the dark values by hand. */

/* ============================================================================================
   [082500]  FINESSE PASS — popup position, card type, rate field, row reorder.
   Appended rather than edited in place: every rule here overrides one above it, so the original
   values stay readable and reverting means deleting this block.
   ============================================================================================ */

/* 1 · THE POPUP OPENS NEAR THE TOP AND GROWS DOWN.
   align-items:center kept the box vertically centred, so every card added pushed the top edge up
   by half its own height — the chip you were about to click next moved out from under the cursor,
   and you chased the popup upwards for every selection. flex-start pins the header and the chip
   list; everything new appears BELOW the pointer.
   max-height drops to match, or a tall popup would run off the bottom instead. */
.l2-scrim{ align-items:flex-start !important; padding:48px 20px 20px !important; }
.l2-pop{ max-height:calc(100vh - 68px); }
@media (max-height:620px){
  /* a short window has no room for the offset; centre-ish beats clipped */
  .l2-scrim{ padding:16px 20px 16px !important; }
  .l2-pop{ max-height:calc(100vh - 32px); }
}

/* 2 · (the card's type) and 4 · (the dashed add-a-task box) went at 137500: the modal family
   and design 06 set both now. */

/* 3 · THE RATE FIELD.
   ⚠ THE "CLUNKY STEPPER" IS THE BROWSER'S OWN NUMBER SPINNER, NOT OURS. quote-print.css:319
   already kills it app-wide — but that rule is scoped to `.quote-view`, and the popup mounts on
   document.body, so it has never been in reach. Same trap as the custom properties: anything
   mounted outside .quote-view is outside the whole stylesheet.
   Scoped to the popup, not global, so nothing else changes. */
.l2-pop input[type=number]{ -moz-appearance:textfield; appearance:textfield; }
.l2-pop input[type=number]::-webkit-inner-spin-button,
.l2-pop input[type=number]::-webkit-outer-spin-button{ -webkit-appearance:none; margin:0; }


/* the one task left in an item cannot be unticked — it would leave a block with no identity */
.l2-pick.locked{ opacity:.55; cursor:default; }

/* 5 · ROW REORDER. The task row is the handle; its day rows ride along so the thing you are
   dragging looks like the thing that moves. */
body.atiq-labour-v2 .quote-view tr.l2-task{ cursor:grab; }
body.atiq-labour-v2 .quote-view tr.l2-task.l2-dragging,
body.atiq-labour-v2 .quote-view tr.l2-day.l2-dragging{
  opacity:.5; cursor:grabbing;
}
body.atiq-labour-v2 .quote-view tr.l2-task.l2-dropto td{
  box-shadow:inset 0 2px 0 0 #5aa9f0;
}
body.atiq-labour-v2 .quote-view tr.l2-task.l2-dropto-after td{
  box-shadow:inset 0 -2px 0 0 #5aa9f0;
}
body.light.atiq-labour-v2 .quote-view tr.l2-task.l2-dropto td{ box-shadow:inset 0 2px 0 0 #1a5fbf; }
body.light.atiq-labour-v2 .quote-view tr.l2-task.l2-dropto-after td{ box-shadow:inset 0 -2px 0 0 #1a5fbf; }
@media print{
  body.atiq-labour-v2 .quote-view tr.l2-task.l2-dropto td,
  body.atiq-labour-v2 .quote-view tr.l2-task.l2-dropto-after td{ box-shadow:none !important; }
}

/* ════════════════════════════════════════════════════════════════════════════════════════════
   [092500]  LITTLE GROUPS IN THE PICKER  —  option D, separate blocks
   ════════════════════════════════════════════════════════════════════════════════════════════
   ⚠ EVERY RULE HERE IS GATED ON .grouped, which labour2.js only adds when there is more than one
   bucket. A template with no grouping therefore renders the EXACT list it rendered before — same
   container, same border, same radius — so this cannot regress anyone who never groups anything.
   The shape is the stage card's: a heading outside the block it labels, which is how the take-off
   and material cards already draw a group. The picker stops being the one list that looks
   different. */
.l2-picks.grouped{ border:none; border-radius:0; overflow:visible; }
.l2-picks.grouped .l2-grp{
  border:1px solid var(--l2-line2); border-radius:10px; overflow:hidden; margin-bottom:11px;
}
.l2-picks.grouped .l2-grp:last-of-type{ margin-bottom:0; }
/* the block closes itself — the last row inside it must not draw a border onto the block's own */
.l2-picks.grouped .l2-grp .l2-pick:last-child{ border-bottom:none; }
/* a heading that follows a block needs the gap the block's own margin does not provide */
.l2-picks.grouped .l2-grp + .l2-gh{ padding-top:2px; }
/* "Something else…" sits outside every group, so in grouped mode it has to close itself.
   (0,3,0) over .l2-custom's (0,1,0), so the border-bottom:none it sets does not win. */
.l2-picks.grouped .l2-custom{
  border:1px solid var(--l2-line2); border-radius:10px; margin-top:11px;
}

/* ══════════════════════════════════════════════════════════════════════════════════════════════
   [116500]  THE PER-DAY STRIP, AND A NOTE ON ANY LINE.
   ⚠ The pencil follows the × delete button's existing behaviour exactly — invisible until the row
   is hovered, and it never prints. A control that is always on would put two icons on every line
   of a card that is mostly numbers.
   ══════════════════════════════════════════════════════════════════════════════════════════════ */
/* [137500] the per-day strip's own boxes went: crew per day is a row of .q-step steppers now
   (design 06), styled by design/popups.css like every other stepper. */

/* ── THE NOTE ──────────────────────────────────────────────────────────────────────────────────
   [116500b] James: "it doesn't need the little edit symbol. The text needs to be just next to the
   X 1 number, text size should be more appropriate and the colour needs to be rethought."
   So: no icon anywhere, the note sits on the SAME line as the day it belongs to, and it takes the
   day row's own muted colour rather than announcing itself in blue. It adds no height — the row
   is exactly as tall as it was without it, which is what "resized the rows" was about. */
.quote-view .lab-note-txt{
  font-size:10.9225px; font-style:italic; color:var(--l2-ink2,#8a8a8a); font-weight:400;
  letter-spacing:.01em; margin-left:11.565px; opacity:.85;
}
.quote-view .lab-note-txt:hover{ opacity:1; }
body.light .quote-view .lab-note-txt{ color:#6f6f6a; }
/* [117500] TWO CLICK ZONES ON A DAY ROW: the number edits that day's crew, everything to the
   right of it is the note. The hover colour is a bolded blue rather than the lime accent — James:
   "lets maybe do a bolded blue so its not too jarring". */
.quote-view tr.l2-day{ cursor:text; }
.quote-view .l2-xn{ cursor:pointer; border-radius:3.855px; padding:1.285px 3.855px; margin-left:-3.855px; }
.quote-view tr.l2-day:hover .l2-xn{ color:#5aa9f0; font-weight:800; }
.quote-view .l2-xn:hover{ background:rgba(90,169,240,.13); }
body.light .quote-view tr.l2-day:hover .l2-xn{ color:#1a5fbf; }
/* ⚠ BOTH EDITORS ARE OUT OF FLOW, AND THAT IS THE FIX. In flow they changed the width of the
   cell's content and the line wrapped, so the row jumped from 20px to 43px while you typed and
   snapped back when you finished — which is exactly what James saw ("the text box drops to
   another row, rather than to the right"). The cell is already position:relative, so absolute
   positioning costs nothing and the row CANNOT change height. The span each one replaces is
   hidden with visibility, not display, so it keeps holding its space. */
/* [137500] design 08: the crew becomes a small stepper — \u00d7 \u2212 2 + — out of flow (the rule above
   still holds: the row cannot change height). The stepper is .q-step.is-sm from design/popups.css;
   these only seat it in the 8px day row and keep the field the size of its figure. */
.quote-view .l2-xn-edit{
  position:absolute; top:50%; transform:translateY(-50%); display:inline-flex; align-items:center; gap:3.855px;
  font-size:10.28px; font-weight:600; line-height:1.4; color:var(--q-sub); white-space:nowrap; z-index:2;
}
.quote-view .l2-xn-edit .q-step.is-sm{ background:var(--q-input-bg); border-radius:var(--q-r-pill); padding:0 5.14px; gap:5.14px; }
.quote-view .l2-xn-edit .q-step button{ font-size:11.565px; line-height:1; padding:0 1.285px; }
.quote-view td .l2-xn-edit input.l2-xn-in,
.quote-view .l2-xn-in{
  position:static; transform:none; width:3ch; height:auto!important; border:0!important; border-radius:0!important;
  box-shadow:none!important; background:transparent!important; color:var(--q-text); font-family:inherit;
  font-size:10.28px!important; font-weight:800; text-align:center; padding:0!important; margin:0;
}
.quote-view .l2-xn-in:focus{ outline:none; }
.quote-view .lab-note-edit td{ padding:1px 5px 4px 18px!important; border-bottom:none!important; }
/* ⚠ INLINE-BLOCK WITH AN AUTO WIDTH. This was width:100% on a block-level input, so it wrapped
   onto a line of its own the moment it opened — the note appeared to jump down a row while you
   typed and then jump back into place when you finished. It now sits exactly where the finished
   text sits. */
/* ⚠ !important AND A LONG SELECTOR BECAUSE .quote-view's own `input` rule WINS OTHERWISE. It
   paints every input in the quote view with a 1px border, a 4px radius, a dark fill and 2px 5px
   of padding — measured, not assumed — which turned this into a chunky text box sitting over the
   row instead of a line of italic text continuing it.
   ⚠ `left` IS SET IN JS, not here: the day rows are indented by their tree connector, so the
   number's offset is a measured value rather than a constant. A hardcoded left put the box on
   top of the number. */
body.atiq-labour-v2 .quote-view td .lab-note-ta,
.quote-view .lab-note-ta{
  position:absolute; right:10.28px; top:50%; transform:translateY(-50%);
  width:auto; box-sizing:border-box; height:auto!important;
  background:transparent!important; border:0!important; border-bottom:1.285px solid #5aa9f0!important;
  border-radius:0!important; box-shadow:none!important;
  color:var(--l2-ink,#f0f0f0); font-family:inherit; font-size:10.9225px!important; font-style:italic;
  line-height:1.4; padding:0 1.285px 1.285px!important;
}
.quote-view .lab-note-ta:focus{ outline:none; }
body.light .quote-view .lab-note-ta{ color:#1a1a18; }
@media print{ .quote-view .lab-note-edit{ display:none!important; } }

/* [116500b] the blank Men box on a mixed block */
.l2-n::placeholder{ font-size:9px; font-style:italic; opacity:.5; font-weight:500; }

/* [142000] board 08 as approved: "X [2]" — the crew figure edited in place inside the faded-orange
   ring, drawn AROUND the text (negative margin = padding) so nothing moves — and the − / + steppers
   before the amount, in the day line's empty rate cell. Out of flow, like 137500's: the row cannot
   change height while you type. */
.quote-view .l2-xn-edit{ gap:4px; font-size:inherit; font-weight:400; color:var(--q-sub); }
.quote-view td .l2-xn-edit input.l2-xn-in,
.quote-view .l2-xn-in{ width:2.4ch; margin:-3px -5px -3px -3px!important; padding:3px 5px 3px 3px!important; border-radius:5px!important;
  box-shadow:inset 0 0 0 1px var(--q-input-bd)!important; background:var(--q-input-bg)!important;
  font-size:inherit!important; font-weight:600; color:var(--q-text); text-align:left; line-height:1; }
.quote-view tr.l2-day > td{ position:relative; }
.quote-view .l2-xn-step{ position:absolute; right:10px; top:50%; transform:translateY(-50%); display:inline-flex; gap:4px; z-index:2; }
.quote-view .l2-xn-step .l2-xn-b{ display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; padding:0;
  border-radius:5px; border:1px solid var(--q-pill-bd); background:transparent; color:var(--q-sub); font:400 13px/1 var(--q-font); cursor:pointer; }
.quote-view .l2-xn-step .l2-xn-b.plus{ border-color:var(--q-add-bd); background:var(--q-add-tint); color:var(--q-add); }
@media print{ .quote-view .l2-xn-step{ display:none!important; } }