/* Công việc · Lệnh sửa chữa (work-repairs.mjs; PLAN-LENH-SUA-CHUA-001, the drawings the Owner approved 29/10/2026). On top of
   work-inspections.css: the same cards, tabs, buttons and sheets; here what a lệnh has more. */
/* Lệnh kiểm tra / Lệnh sửa chữa at the top of Việc (Owner 29/10/2026), each with what is still open. */
.work-kinds{display:grid;grid-template-columns:1fr 1fr;gap:0;padding:4px;border-radius:12px;background:#e4ece7}
:is(.work,.work-sheet) .work-kind{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;margin:0;padding:6px 8px;border:0;border-radius:9px;background:transparent;color:#294c3d;font-size:15px;font-weight:700;white-space:nowrap}
:is(.work,.work-sheet) .work-kind[aria-selected=true]{background:#fff;box-shadow:0 1px 3px #14302133}
.work-kind .work-count{background:#c5d6cb;color:#294c3d}.work-kind[aria-selected=true] .work-count{background:#294c3d;color:#fff}
#module-panel .work .work-kind{margin:0}
/* One kind at a time; the car of a lệnh alone hides the switch and ＋ Thêm công việc as the car of an inspection does. */
.work:not([data-kind=repair])>.work-repair-holder,.work[data-kind=repair]>:is(.work-back,.work-bar,.work-status,.work-list,.work-split){display:none}
/* Việc giao (work-direct.mjs): the third kind, once the server has it (schema/direct-work.sql). */
.work-kinds[data-count="3"]{grid-template-columns:repeat(3,minmax(0,1fr))}.work-kind[hidden]{display:none}
.work-kind .work-kind-short{display:none}
@media(max-width:600px){.work-kinds[data-count="3"] .work-kind-long{display:none}.work-kinds[data-count="3"] .work-kind-short{display:inline}}
.work:not([data-kind=direct])>.work-direct-holder,.work[data-kind=direct]>:is(.work-back,.work-bar,.work-status,.work-list,.work-split){display:none}
.work[data-page=form]>.work-direct-holder{display:none}.work-direct-holder{min-width:0}
.work-direct{display:grid;gap:10px;min-width:0}.work-direct .work-status[hidden]{display:none}
.work-direct-desktop .direct-list{grid-template-columns:repeat(auto-fill,minmax(340px,1fr));align-items:start}
.direct-kind{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0}
.direct-task{font-size:16px;font-weight:600;white-space:pre-line}
.direct-give{border-top:1px dashed #d2ddd6;padding-top:8px}
:is(.work,.work-sheet) .direct-cancel{color:#8a2a1f;border-color:#e2c3bd}
/* The kind of a job: Kiểm tra (blue), Giao việc (amber), Sửa chữa (violet). */
.work-kind-tag{display:inline-block;padding:2px 10px;border-radius:11px;background:#fbf0dc;color:#7a5414;font-size:12.5px;font-weight:700;white-space:nowrap}
.work-now-card[data-kind=inspection] .work-kind-tag{background:#e3eefc;color:#1d4f91}.work-now-card[data-kind=repair] .work-kind-tag{background:#efe7fb;color:#5b3a91}
/* ĐANG LÀM / CHỜ LÀM (Owner 30/10/2026, PLAN-GUI-LENH-001 ảnh 4 ①): this account's own jobs of every kind. */
.work-now{display:grid;gap:10px;min-width:0}.work-now[hidden]{display:none}
.work[data-page=car]>.work-now,.work[data-page=form]>.work-now,.work[data-kind=repair][data-repair-page=car]>.work-now{display:none}
.work-now-head h2{margin:0;font-size:20px;color:#1d3a2c}.work-now-head p{margin:2px 0 0}
.work-now-group{display:grid;gap:8px}.work-now-group h3{margin:4px 0 0;font-size:13px;font-weight:800;letter-spacing:.05em;color:#41584b}
.work-now-list{display:grid;gap:8px;list-style:none;margin:0;padding:0}
.work-now-card{display:grid;gap:8px;padding:12px 14px;border:1px solid #d7e2db;border-left:5px solid #9fb8a8;border-radius:12px;background:#fff}
.work-now-card[data-state=working]{border-left-color:#286548;background:#f6faf7}.work-now-card[data-state=paused]{border-left-color:#b9c4bd}
:is(.work,.work-sheet) .work-now-open{display:grid;gap:3px;width:100%;margin:0;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.work-now-top{display:flex;align-items:center;justify-content:space-between;gap:8px}.work-now-top .work-plate{font-size:20px}
.work-now-text{font-size:15.5px;color:#1d2d24}.work-now-meta{font-size:13.5px;color:#5d6f64}
.work-now-card .work-actions>button{flex:1 1 0}
/* Một việc một lúc (work-busy.mjs): the question, and Tạm dừng of Kiểm tra / Giao việc. */
.work-busy .work-sheet h2{margin:0 0 8px;font-size:19px}
.work-busy-now{display:grid;gap:2px;margin:0 0 10px;padding:10px 12px;border:1px solid #d7e2db;border-left:5px solid #286548;border-radius:10px;background:#f6faf7}
.work-busy-now p{margin:0}.work-busy-now .work-plate{font-size:18px}
.work-busy-text{margin:0 0 12px;font-size:15px;line-height:1.5}
.work-busy .work-line-actions>button{flex:1 1 0}
:is(.work,.work-sheet) .work-paused{color:#7a5414;font-weight:600}
.work[data-page=car]>.work-kinds,.work[data-page=form]>:is(.work-kinds,.work-repair-holder){display:none}
.work[data-kind=repair][data-repair-page=car]>:is(.work-jobs,.work-kinds){display:none}
.work-repair-holder{min-width:0}
.work-repairs{display:grid;grid-template-columns:minmax(0,1fr);gap:12px;min-width:0}
.work-repairs[data-page=list]>.work-back,.work-repairs[data-page=car]>.work-bar{display:none}
/* The states of a lệnh: Tạm dừng red, Đã hoàn tất green (Chờ giao, Chờ bắt đầu, Đang sửa, Báo xong as an inspection's). */
.work-card[data-state=paused]{border-left-color:#b2533e}.work-card[data-state=paused] .work-badge{background:#fde6e1;color:#9a2f1c}
.work-card[data-state=closed]{border-left-color:#387f57}.work-card[data-state=closed] .work-badge{background:#e3f2e8;color:#245b3a}
.work-people>li[data-state=paused] .work-person-state{color:#9a2f1c;font-weight:650}
:is(.work,.work-sheet) .repair-new{margin:0;padding:8px 10px;border-radius:8px;background:#fff1e0;color:#7a4510;font-size:14px;font-weight:600}
.repair-extra-tag{display:inline-block;margin-left:2px;padding:1px 7px;border-radius:9px;background:#fff1e0;color:#9a5410;font-size:11px;font-weight:700;vertical-align:1px;white-space:nowrap}
/* Công việc: a tick box each, a tap on the whole line (the person repairing); read only for the others. */
.repair-lines,.repair-parts{list-style:none;margin:4px 0 0;padding:0;display:grid;gap:6px}
.repair-lines>li{display:flex;gap:10px;align-items:flex-start;padding:8px 10px;border:1px solid var(--work-line,#dbe5df);border-radius:9px;background:#fff}
.repair-lines>li:has(.repair-tick){padding:0}
.repair-lines>li[data-done]{background:#f1f7f3}.repair-lines>li[data-done] .repair-text{color:#5d6f64}
:is(.work,.work-sheet) .repair-tick{display:flex;gap:10px;align-items:flex-start;width:100%;min-height:52px;margin:0;padding:10px;border:0;border-radius:9px;background:transparent;color:#203930;font:inherit;font-weight:400;text-align:left;cursor:pointer}
#module-panel .work .repair-tick{margin:0}
.repair-box{flex:0 0 24px;height:24px;border:2px solid #8fb09c;border-radius:6px;display:grid;place-items:center;background:#fff;color:#fff;font-weight:800;font-size:15px;line-height:1}
.repair-lines>li[data-done] .repair-box{background:#2f6b48;border-color:#2f6b48}
.repair-text{display:grid;gap:2px;min-width:0;font-size:15px;line-height:1.35}.repair-text small{font-size:13px;color:var(--work-muted,#5d6f64)}
.repair-parts>li{display:flex;justify-content:space-between;gap:10px;padding:6px 2px;border-bottom:1px dashed var(--work-line,#dbe5df);font-size:14px}
.repair-parts>li:last-child{border-bottom:0}.repair-parts>li b{white-space:nowrap;font-weight:650}
/* Phát sinh đã báo: the part, the symptom, who; the photos. */
.repair-extras{gap:6px}
.repair-extra{display:grid;gap:4px;padding:8px 10px;border-radius:8px;background:#fff8ef;border:1px solid #f1dcc2}
.repair-extra .work-small{justify-self:end}
:is(.work,.work-sheet) .work-actions.repair-two{display:grid;grid-template-columns:1fr 1.3fr;gap:8px}
:is(.work,.work-sheet) .repair-hint{color:#7a5414}
/* Tạm dừng: the reasons as chips. */
.repair-why{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;border:0}.repair-why legend{padding:0 0 6px;font-size:14px;font-weight:650}
.repair-chip{position:relative;display:inline-flex;align-items:center;min-height:42px;margin:0;padding:6px 14px;border:1px solid #c5d6cb;border-radius:21px;background:#fff;color:#294c3d;font-size:14px;font-weight:600;cursor:pointer}
.repair-chip input[type=radio]{position:absolute;width:1px;height:1px;min-height:0;margin:0;padding:0;opacity:0;pointer-events:none}
.repair-chip.on{background:#294c3d;border-color:#294c3d;color:#fff}.repair-chip:focus-within{outline:3px solid #b3d4c3;outline-offset:2px}
.repair-sheet input:not([type]),.repair-sheet textarea{display:block;width:100%;margin:0;font-size:16px;font-weight:400}
/* Giao KTV: who is repairing another car said beside the name. */
.repair-picker .work-who{max-height:min(52vh,460px);overflow:auto;padding:0 12px;border:1px solid #dbe5df;border-radius:10px}
.repair-picker .work-who legend{padding:8px 0 4px}
.repair-picker .work-check{border-bottom:1px solid #edf2ef}.repair-picker .work-check:last-child{border-bottom:0}
.repair-picker .work-check>span{margin-right:auto}
.repair-picker .work-tag.repair-busy{background:#fbf0dc;color:#7a5414}.repair-picker .work-tag.repair-free{background:#e3f2e8;color:#245b3a}
.repair-picker .work-actions{display:grid;grid-template-columns:1fr 1.3fr;gap:8px}
/* Giao từng việc (PLAN-LENH-SUA-CHUA-002): who does each line; Việc của người khác read only; Đổi người. */
.repair-who{justify-self:start;margin-top:3px;padding:2px 9px;border:1px solid #b9d3c2;border-radius:12px;background:#e9f3ec;color:#294c3d;font-size:13px;font-weight:700}
.repair-others .repair-lines>li{opacity:.62}.repair-others .repair-who{background:#f1f1f1;border-color:#ddd;color:#555}
.repair-lines>li:has(.repair-change){align-items:center}.repair-lines>li:has(.repair-tick):has(.repair-change){padding-right:8px}
:is(.work,.work-sheet) .repair-change{flex:0 0 auto;margin:0 0 0 auto}
.work-people>li[data-state=done] .work-person-state{color:#245b3a;font-weight:650}
/* Giao KTV từng việc: a box a line, its people as chips, the list of people under ＋ Chọn người (search by name). */
.repair-lines-picker{width:min(760px,calc(100vw - 24px))}
.repair-line-picks{display:grid;gap:10px;max-height:min(60vh,620px);overflow:auto}
.repair-line-pick{display:grid;gap:6px;margin:0;padding:10px 12px;border:1px solid #d5e0d8;border-radius:10px;background:#fbfdfb}
.repair-line-pick legend{float:left;width:100%;padding:0;font-size:16px;font-weight:700;line-height:1.35}
.repair-chips{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.repair-person-chip{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:2px 4px 2px 12px;border:1px solid #9fc2ad;border-radius:18px;background:#e9f3ec;color:#1d3a2c;font-size:15px;font-weight:600}
:is(.work,.work-sheet,.work-picker) .repair-chip-x{width:28px;height:28px;min-height:0;margin:0;padding:0;border:0;border-radius:50%;background:#fff;color:#5a6e62;font-size:13px;font-weight:700}
:is(.work,.work-sheet,.work-picker) .repair-add{min-height:36px;margin:0;padding:4px 12px;border:1px dashed #7d9a88;border-radius:18px;background:#fff;color:#286548;font-size:14.5px;font-weight:600}
.repair-people{display:grid;max-height:260px;overflow:auto;padding:0 10px;border:1px solid #9fb8a8;border-radius:8px;background:#fff}
.repair-people input[type=search]{position:sticky;top:0;z-index:1;margin:8px 0;font-size:16px}
.repair-people .work-check{border-bottom:1px solid #edf2ef}.repair-people .work-check:last-child{border-bottom:0}.repair-people .work-check>span{margin-right:auto}
.repair-people .work-tag.repair-busy{background:#fbf0dc;color:#7a5414}.repair-people .work-tag.repair-free{background:#e3f2e8;color:#245b3a}
.repair-all{padding:8px 10px;border-radius:8px;background:#f2f6f3}
body.privacy-hidden :is(.repair-sheet,.repair-picker){visibility:hidden}
/* LỆNH SỬA CHỮA on A4 (repair-print.mjs): as Carsoft's, quotes.css .cs-sheet. */
@media(max-width:600px){:is(.work,.work-sheet) .work-kind{font-size:14px}}
/* Đã làm qua Giao việc (Ghi sẵn, Owner 4A). */
.repair-carry{border-left:4px solid #c08a2b}.repair-carry .work-confirmed{margin:4px 0 0}
:is(.work,.work-sheet) .repair-carry-go{justify-self:start;min-height:40px;margin-top:6px}
/* The phone: the tabs on two lines rather than Báo xong cut off at the edge (PLAN-QLDV-DIEN-THOAI-001 §4). */
@media(max-width:600px){.work-repairs .work-tabs{flex-wrap:wrap;overflow-x:visible}}
/* A line this account may not tick (the office, the lines of others): no box that looks clickable, a faint ring until ✓. */
.repair-box.repair-box-idle{position:relative;border-color:transparent;background:none}
.repair-box.repair-box-idle::after{content:'';position:absolute;inset:5px;border:2px solid #c3d0c8;border-radius:50%}
/* Đổi người / Chọn người: an ordinary button, not the colour of the buttons that remove (stock.css .qd-del, .work-photo-remove). */
:is(.work,.work-sheet) .work-small.repair-change{border-color:#b9d0c0;color:#1e5138}
/* Lệnh sửa chữa of the office (Desktop, Quản lý dịch vụ › Lệnh sửa chữa; review, Owner 08/11/2026 "Sửa cả 10"): the head as
   Tiếp nhận xe and Báo giá; the search box over the list; tabs and buttons of the office's size (intake-desk.css: 34px, 13px);
   the lệnh at most 960px wide; the work area filled, the list and the lệnh scrolling on their own, the tabs staying in sight
   (a lệnh taller than the screen kept its buttons out of reach until the whole list was scrolled). */
#module-panel .repair-desk>.repair-desk-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 10px}
#module-panel .repair-desk>.repair-desk-head h1{font-size:24px;margin:2px 0 0}
#module-panel .repair-desk>.repair-desk-head .work-refresh{flex:none;width:auto;min-height:34px;padding:6px 14px;border-radius:7px;font-size:13px;font-weight:650;line-height:1.2}
#module-panel .repair-desk>.work-split{grid-template-rows:auto minmax(0,1fr)}
#module-panel .repair-desk>.work-split>.repair-search{grid-column:1;grid-row:1;display:block;box-sizing:border-box;width:100%;min-width:0;min-height:32px;margin:0;padding:5px 8px;border:1px solid #b9c8be;border-radius:5px;background:#fff;color:inherit;font:inherit;font-size:13px}
#module-panel .repair-desk>.work-split>.work-list{grid-column:1;grid-row:2;align-content:start}
#module-panel .repair-desk>.work-split>.work-detail{grid-column:2;grid-row:1/span 2}
#module-panel .repair-desk .work-detail>.repair-card{max-width:960px}
#module-panel .repair-desk .work-tab{min-height:32px;padding:4px 12px;border-radius:16px;font-size:13px}
#module-panel .repair-desk :is(.work-primary,.work-secondary){min-height:34px;padding:6px 14px;border-radius:7px;font-size:13px;font-weight:650}
#module-panel .repair-desk .work-small{min-height:30px;padding:3px 10px;font-size:12.5px}
#module-panel .repair-desk .repair-card .work-plate{font-size:20px}
#module-panel .repair-desk .work-row .work-plate{font-size:17px}
#module-panel .repair-desk .repair-card>.work-card-head+.work-actions{justify-content:flex-start;padding-bottom:10px;border-bottom:1px solid #e6ece8}
@media(min-width:1024px){
  .desktop-cloud .desktop-layout>.desktop-content:has(.repair-desk){display:flex;flex-direction:column;padding-bottom:12px}
  .desktop-cloud .desktop-content:has(.repair-desk)>#module-panel{flex:1 1 0;min-height:0;display:flex;flex-direction:column}
  #module-panel>.work-desktop:has(>.repair-desk){flex:1 1 0;min-height:0;display:flex;flex-direction:column}
  #module-panel .repair-desk{flex:1;min-height:0;display:flex;flex-direction:column}
  #module-panel .repair-desk>.work-split{flex:1;min-height:0;align-items:stretch}
  #module-panel .repair-desk>.work-split>:is(.work-list,.work-detail){min-height:0;overflow:auto;position:static;align-content:start}}
/* Báo xong on the phone, the card's row (Tạm dừng) and its form (Hủy): the other button as wide as its word, the step on one line (review of the KTV's flow, Owner 10/11/2026 "Sửa cả 6": "Xong
   phần · báo xong xe" took two lines beside a Hủy half the row). */
@media(max-width:600px){.repair-card .work-actions.repair-two{grid-template-columns:auto minmax(0,1fr)}.repair-card .work-actions.repair-two .work-primary{white-space:nowrap}}
/* Chia xưởng 3 tổ (PLAN-CHIA-TO-001): the small coloured name of a tổ (lệnh lines, Danh mục › Nhân viên), the ticks of a hồ sơ,
   the people of other tổ under Mượn tổ khác (Giao KTV) and GỬI TỚI TỔ (Lệnh kiểm tra). */
.team-tag{display:inline-block;padding:1px 8px;border-radius:9px;font-size:11.5px;font-weight:700;line-height:1.5;white-space:nowrap;background:#eef3f0;color:#4b5f55}
.team-tag.t1{background:#e9f3ec;color:#286548}.team-tag.t2{background:#e7f0fb;color:#264f7d}.team-tag.t3{background:#fbf0e4;color:#7a4a16}
.team-tags{display:inline-flex;flex-wrap:wrap;gap:4px}.team-none{color:#8a978f}
.team-checks{display:flex;flex-wrap:wrap;gap:8px 18px;margin:4px 0}.team-check{display:inline-flex;align-items:center;gap:6px;font-weight:600;cursor:pointer}
.team-check input{width:18px;height:18px}
.repair-team{margin-left:6px;vertical-align:1px}
.team-borrow{margin-top:8px;border:1px dashed #b9cdbf;border-radius:10px;padding:4px 8px}
.team-borrow>summary{cursor:pointer;font-weight:700;color:#4b5f55;padding:6px 2px;list-style-position:inside}
.team-pick{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 8px}
.team-pick button{border:1px solid #9fb8a8;border-radius:18px;background:#fff;color:#286548;padding:6px 14px;min-height:38px;font:inherit;font-weight:700;cursor:pointer}
.team-pick button[aria-pressed="true"]{background:#286548;border-color:#286548;color:#fff}
.team-pick-caption{margin:8px 0 0;font-size:12px;font-weight:800;letter-spacing:.5px;color:#286548}
