/* Khu quản trị (/admin) và CRM (/crm) */
:root{
  --chinh:#12395F; --chinh-dam:#0C2740; --nhan:#C8922F;
  --nen:#F4F5F7; --trang:#FFFFFF; --nen-2:#F7F9FC;
  --chu:#1B1D21; --chu-mo:#646B78; --vien:#DFE3E9; --vien-dam:#C9CDD4;
  --r:9px; --bong:0 1px 2px rgba(16,32,52,.05), 0 6px 18px rgba(16,32,52,.05);
  --cao-tren:52px; --rong-ben:246px; --rong-ben-thu:62px;
}

/* ---- GIAO DIEN TOI ----
   Chi doi BIEN MAU, khong dung toi mot dong bo cuc nao. Nguoi dung chon o cuoi
   cot trai; lua chon nho theo TAI KHOAN nen may nao dang nhap cung giu nguyen. */
:root[data-giao-dien="toi"]{
  --chinh:#7FB2E8; --chinh-dam:#CFE2F7; --nhan:#E3B45C;
  --nen:#12161C; --trang:#1A2029; --nen-2:#222A35;
  --chu:#E6E9EE; --chu-mo:#9AA4B2; --vien:#2E3743; --vien-dam:#3C4855;
  --bong:0 1px 2px rgba(0,0,0,.4), 0 6px 18px rgba(0,0,0,.3);
  color-scheme: dark;
}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;background:var(--nen);color:var(--chu);
  font:15px/1.6 "Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif}
/* v296 (ông chủ 13/10 "ok sửa nút toàn hệ luôn em"): nút / ô nhập / ô chọn theo họ chữ của trang — mặc định trình duyệt KHÔNG kế thừa (nút ra Arial, khác a.nut) */
button,input,select,textarea{font-family:inherit}
a{color:var(--chinh);text-decoration:none}
a:hover{text-decoration:underline}
h1{font-size:1.5rem;margin:0 0 4px;color:var(--chinh-dam)}
h2{font-size:1.12rem;margin:0 0 14px;color:var(--chinh-dam)}
h3{font-size:1rem;margin:0 0 10px;color:var(--chinh-dam)}
img{max-width:100%}

.vo{display:grid;grid-template-columns:var(--rong-ben) 1fr;min-height:100vh;padding-top:var(--cao-tren)}

/* ---- thanh trên cùng ---- */
.tren-cung{position:fixed;top:0;left:0;right:0;height:var(--cao-tren);z-index:40;background:var(--trang);
  border-bottom:1px solid var(--vien);display:flex;align-items:center;gap:12px;padding:0 14px}
.tren-cung .hieu{display:flex;align-items:center;gap:9px;min-width:0}
.tren-cung .hieu img{height:26px;width:auto;flex-shrink:0}
.tren-cung .hieu b{color:var(--chinh-dam);font-size:.98rem;letter-spacing:.02em;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tren-cung .vien-nho{background:var(--chinh-dam);color:var(--trang);border-radius:99px;padding:4px 13px;
  font-size:.8rem;font-weight:600;white-space:nowrap;flex-shrink:0}
.tren-cung .phai{margin-left:auto;display:flex;align-items:center;gap:14px;font-size:.88rem;flex-shrink:0}
.tren-cung .phai b{color:var(--chinh-dam)}
.tren-cung .phai small{color:var(--chu-mo);display:block;line-height:1.2}

/* ---- nut chuyen ngon ngu VI | EN, goc tren ben phai ---- */
/* Mot cap nut lien nhau, ben dang dung to dam - nhin la biet minh o ngon ngu nao. */
.doi-nn{display:inline-flex;align-items:center;border:1px solid var(--vien);border-radius:8px;
  overflow:hidden;background:var(--trang);flex-shrink:0}
.doi-nn button{background:none;border:0;cursor:pointer;font:inherit;font-size:.78rem;font-weight:600;
  letter-spacing:.03em;color:var(--chu-mo);padding:6px 10px;line-height:1.1;transition:background .12s}
.doi-nn button:hover{background:var(--nen-2);color:var(--chinh-dam)}
.doi-nn button.dang{background:var(--chinh-dam);color:var(--trang);cursor:default}
.doi-nn button.dang:hover{background:var(--chinh-dam)}
.doi-nn .ngan-nn{width:1px;align-self:stretch;background:var(--vien)}
/* o chon hop thu tren thanh dau (thay cho danh sach da bo khoi menu trai) */
/* o chon hop thu — dung DAU cot trai. Le va be ngang khop y het nut "Soan thu"
   ngay duoi no (margin 2px 6px, width calc(100% - 12px)) cho thang hang. */
.ben .chon-hop{width:calc(100% - 12px);height:36px;margin:2px 6px 10px;padding:0 9px;
  font-size:.86rem;border:1px solid var(--vien);border-radius:9px;background:var(--trang);
  color:var(--chinh-dam);cursor:pointer;flex-shrink:0}
/* thu menu lai thi giau di — luc do cot chi con be bang bieu tuong */
.vo.thu .chon-hop{display:none}
/* tren nhung trang khong co thanh dau (cua dang nhap, cong khach): dat thang vao goc man hinh */
.doi-nn-goc{position:fixed;top:14px;right:16px;z-index:60;box-shadow:0 1px 3px rgba(12,39,64,.08)}

.nut-thu{background:none;border:1px solid var(--vien);border-radius:7px;cursor:pointer;
  width:34px;height:34px;flex-shrink:0;color:var(--chinh-dam);font-size:1.05rem;line-height:1;
  display:flex;align-items:center;justify-content:center;padding:0}
.nut-thu:hover{background:var(--nen-2)}

/* ---- cột trái ---- */
.ben{background:var(--trang);border-right:1px solid var(--vien);padding:14px 10px 24px;
  display:flex;flex-direction:column;gap:1px;overflow-y:auto;overflow-x:hidden;
  position:sticky;top:var(--cao-tren);height:calc(100vh - var(--cao-tren));z-index:30}
.ben .nhom{font-size:.69rem;letter-spacing:.11em;text-transform:uppercase;color:var(--chu-mo);
  margin:18px 12px 5px;font-weight:700;white-space:nowrap}
.ben a{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:7px;
  color:var(--chu);font-size:.9rem;white-space:nowrap}
.ben a:hover{background:var(--nen-2);text-decoration:none;color:var(--chinh-dam)}
.ben a.dang{background:var(--nen-2);color:var(--chinh);font-weight:600}
.ben .bieu{width:18px;text-align:center;opacity:.75;flex-shrink:0}
.ben .duoi{margin-top:auto;border-top:1px solid var(--vien);padding-top:10px;font-size:.84rem}
.ben .duoi a{padding:5px 12px;font-size:.84rem}

/* ---- cột trái khi THU lại: chỉ còn biểu tượng ---- */
.vo.thu{grid-template-columns:var(--rong-ben-thu) 1fr}
.vo.thu .ben{padding-left:6px;padding-right:6px}
.vo.thu .ben .chu{display:none}
.vo.thu .ben .nhom{height:1px;margin:12px 8px;padding:0;overflow:hidden;
  background:var(--vien);color:transparent}
.vo.thu .ben a{justify-content:center;padding:9px 0;gap:0}
.vo.thu .ben .bieu{width:auto}

/* màn che khi ngăn kéo menu mở đè lên nội dung (màn hình hẹp) */
.man-che{display:none;position:fixed;inset:var(--cao-tren) 0 0 0;background:rgba(12,39,64,.42);z-index:25}

/* ---- phần chính ---- */
.chinh{padding:24px 28px 60px;min-width:0;background:var(--nen)}
.tren{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.tren .mo{color:var(--chu-mo);font-size:.93rem}

.o{background:var(--trang);border:1px solid var(--vien);border-radius:var(--r);padding:22px;box-shadow:var(--bong);margin-bottom:20px}
.o.mong{padding:0;overflow:hidden}

.the-so{display:grid;grid-template-columns:repeat(auto-fit,minmax(168px,1fr));gap:16px;margin-bottom:22px}
.the-so .o{margin:0;padding:18px 20px}
.the-so b{display:block;font-size:1.8rem;color:var(--chinh);line-height:1.2}
.the-so span{color:var(--chu-mo);font-size:.87rem}

table{width:100%;border-collapse:collapse;font-size:.93rem}
th,td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--vien);vertical-align:middle}
th{background:var(--nen-2);font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--chu-mo);font-weight:600}
tr:last-child td{border-bottom:none}
tbody tr:hover{background:var(--nen-2)}
td.phai,th.phai{text-align:right}

label{display:block;font-weight:600;font-size:.86rem;margin:0 0 5px;color:var(--chinh-dam)}
input[type=text],input[type=email],input[type=tel],input[type=password],input[type=number],input:not([type]),select,textarea{
  width:100%;padding:9px 11px;border:1px solid var(--vien);border-radius:7px;font:inherit;background:var(--trang);color:var(--chu)}
input:focus,select:focus,textarea:focus{outline:2px solid rgba(18,57,95,.3);outline-offset:1px;border-color:var(--chinh)}
textarea{min-height:90px;resize:vertical}
.truong{margin-bottom:15px}
.hang{display:grid;grid-template-columns:1fr 1fr;gap:15px}
.hang-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:15px}
/* Một cột: cho những nhóm ô phải khai theo đúng thứ tự. Chặn bề ngang lại vì ô
   nhập kéo dài hết màn 27 inch thì vừa xấu vừa khó nhắm chuột. */
.hang.mot-cot{grid-template-columns:1fr;max-width:620px}
input[type=checkbox]{width:auto;transform:scale(1.15);margin-right:6px}
.cung-dong{display:flex;align-items:center;gap:8px;flex-wrap:wrap}

.nut{display:inline-block;padding:9px 17px;border-radius:7px;font-weight:600;font-size:.9rem;
  background:var(--chinh);color:var(--trang);border:1px solid var(--chinh);cursor:pointer}
.nut:hover{background:var(--chinh-dam);text-decoration:none;color:var(--trang)}
.nut.vien{background:var(--trang);color:var(--chinh)}
.nut.vien:hover{background:var(--nen-2);color:var(--chinh)}
.nut.do{background:#A33636;border-color:#A33636}
.nut.do:hover{background:#8A2B2B}
.nut.nho{padding:6px 12px;font-size:.83rem}

.bao{padding:12px 15px;border-radius:8px;margin-bottom:18px;font-size:.93rem}
.bao.ok{background:#E8F3EC;border:1px solid #BBD9C6;color:#1E5233}
.bao.loi{background:#FCECEC;border:1px solid #F0C4C4;color:#8A2B2B}
.bao.nhac{background:#FDF5E4;border:1px solid #EBD9AE;color:#6D5417}

.nhan{display:inline-block;padding:3px 10px;border-radius:99px;font-size:.78rem;font-weight:600;border:1px solid}
.nhan.xam{background:var(--nen-2);border-color:var(--vien);color:var(--chu-mo)}
.nhan.xanh{background:#E8F3EC;border-color:#BBD9C6;color:#1E5233}
.nhan.vang{background:#FDF5E4;border-color:#EBD9AE;color:#6D5417}
.nhan.do{background:#FCECEC;border-color:#F0C4C4;color:#8A2B2B}
.nhan.duong{background:var(--nen-2);border-color:var(--vien-dam);color:#1B4C7D}
/* CRM-27 — dải màu tình trạng dịch vụ. Cố ý KHÔNG dùng đỏ cho "đã ngừng": đỏ trong
   bảng này đang mang nghĩa "khách từ chối", mà khách ngừng dịch vụ thì vẫn là khách
   cũ — thường là người đáng gọi lại nhất. Cam = cần chú ý, không phải hỏng. */
.nhan.lam{background:#E9F0F8;border-color:#C2D4E8;color:#1B4C7D}
.nhan.cam{background:#FBEFE6;border-color:#EDCDB2;color:#8A4B16}
.o-dv{white-space:nowrap}
.o-dv .nhan{margin-right:4px}
/* v280 (ông chủ 11/10: "các dịch vụ chồng lên nhau chứ không list ngang") — mỗi dấu một dòng ở bảng Danh sách khách */
.bang-khach .o-dv .nhan{display:table;margin:0 0 4px}
.bang-khach .o-dv .nhan:last-child{margin-bottom:0}
:root[data-giao-dien="toi"] .nhan.lam{background:#16263A;border-color:#2F4D6E;color:#9EC6EE}
:root[data-giao-dien="toi"] .nhan.cam{background:#32241A;border-color:#6A4A2E;color:#EBB98C}

.mo{color:var(--chu-mo)}
.nho{font-size:.85rem}
.trong{padding:40px 20px;text-align:center;color:var(--chu-mo)}

/* dòng thời gian trong hồ sơ khách */
.dong-tg{list-style:none;padding:0;margin:0}
.dong-tg li{padding:13px 0 13px 20px;border-left:2px solid var(--vien);position:relative}
.dong-tg li::before{content:"";position:absolute;left:-6px;top:19px;width:10px;height:10px;border-radius:50%;background:var(--chinh);border:2px solid var(--trang)}
.dong-tg .khi{font-size:.8rem;color:var(--chu-mo)}

/* trình soạn richtext */
#soan,#soan-en{background:var(--trang);min-height:420px}
.ql-toolbar.ql-snow,.ql-container.ql-snow{border-color:var(--vien)}
.ql-toolbar.ql-snow{border-radius:7px 7px 0 0;background:var(--nen-2)}
.ql-container.ql-snow{border-radius:0 0 7px 7px;font-size:15px;font-family:inherit}

/* trang đăng nhập */
.vo-dn{min-height:100vh;display:grid;place-items:center;padding:24px;
  background:linear-gradient(160deg,#0C2740,#12395F 60%,#1B4C7D)}
.the-dn{background:var(--trang);border-radius:14px;padding:34px 32px;width:100%;max-width:400px;box-shadow:0 18px 50px rgba(6,20,36,.32)}
.the-dn .hieu{text-align:center;margin-bottom:22px}
.the-dn .hieu img{height:44px;width:auto}
.the-dn .hieu p{color:var(--chu-mo);font-size:.86rem;margin:10px 0 0}

/* thẻ tab */
/* overflow-y PHAI la hidden: the co margin-bottom:-1px nen noi dung cao hon khung
   dung 1px, du de trinh duyet ve mot THANH CUON DOC — nhin ra hai cai mui ten
   len/xuong o goc phai hang the (ong chu bao 23/09/2026). */
.tab{display:flex;gap:2px;border-bottom:1px solid var(--vien);margin-bottom:20px;
  overflow-x:auto;overflow-y:hidden}
.tab a{padding:10px 18px;color:var(--chu-mo);font-size:.92rem;font-weight:600;
  border-bottom:2px solid transparent;margin-bottom:-1px;white-space:nowrap}
.tab a:hover{color:var(--chinh);text-decoration:none}
.tab a.dang{color:var(--chinh);border-bottom-color:var(--chinh)}
/* v274 CÀI ĐẶT CRM HAI CỘT (ông chủ 09/10): thanh thẻ thành CỘT DỌC bên trái (~1/5 bề ngang), chi tiết bên phải. Thẻ nổi trái + mọi khối đứng sau
   thẻ lùi vào đúng bề rộng cột thẻ (khỏi sửa 13 trang cài đặt). Màn hẹp (≤ 860px) giữ thanh thẻ ngang như cũ. */
@media (min-width:861px){
  .chinh:has(> .tab-crm-cd){display:flow-root}
  .tab.tab-crm-cd{--cot-the:clamp(170px,20%,260px);float:left;width:var(--cot-the);flex-direction:column;gap:0;margin:0 0 20px;padding:4px 0;
    border-bottom:0;border-right:1px solid var(--vien);overflow:visible;position:sticky;top:12px}
  .tab.tab-crm-cd a{white-space:normal;line-height:1.35;padding:9px 14px;margin:0;border-bottom:0;border-left:3px solid transparent}
  .tab.tab-crm-cd a.dang{border-left-color:var(--chinh);background:rgba(18,57,95,.06)}
  .tab-crm-cd ~ *{margin-left:calc(clamp(170px,20%,260px) + 24px) !important}
}
/* v256.2: 2 tab Cập nhật phần mềm — điện thoại: chia đều bề ngang, chữ xuống dòng (tab "Kho tính năng chờ bạn cập nhật" dài) — khỏi bị khuất */
@media (max-width:600px){.tab-cnpm a{flex:1 1 0;min-width:0;white-space:normal;text-align:center;padding:8px 8px;line-height:1.35}}

/* trang tài khoản: trái thông tin · phải phân quyền */
.hai-cot{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);gap:20px;align-items:start}
/* v247: cột con (cả div bọc không lớp) được co — bảng trong .cuon-ngang không đẩy trang tràn ngang trên điện thoại */
.hai-cot > *{min-width:0}
/* v248 (#56): CRM › Tổng quan — mỗi người tự sắp xếp khối (public/js/xep-khoi.js) */
.tq-xep-thanh{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.tq-xep-thanh[hidden],[data-xep-bat][hidden]{display:none}
.tq-xep.dang-xep .cot-xep{outline:2px dashed var(--vien-dam);outline-offset:6px;border-radius:var(--r);min-height:140px}
.tq-xep.dang-xep .o[data-khoi]{position:relative;padding-top:54px}
.tq-xep-nut{position:absolute;top:10px;right:10px;display:flex;gap:4px;z-index:2}
.tq-xep-nut button{border:1px solid var(--vien);background:var(--trang);color:var(--chu);border-radius:8px;min-width:36px;height:34px;
  cursor:pointer;font:inherit;font-weight:700;line-height:1}
.tq-xep-nut button:hover,.tq-xep-nut button:focus-visible{border-color:var(--chinh);color:var(--chinh)}
.tq-xep-nut [data-xep-keo]{cursor:grab;touch-action:none;letter-spacing:-3px;padding-right:6px}
.tq-dang-keo{position:fixed !important;z-index:80;pointer-events:none;margin:0;box-shadow:0 14px 34px rgba(12,39,64,.28);opacity:.96}
.tq-dang-keo [data-xep-keo]{cursor:grabbing}
.tq-cho{border:2px dashed var(--chinh);border-radius:var(--r);margin-bottom:20px;background:var(--nen-2)}
.o-quyen{border:1px solid var(--vien);border-radius:8px;padding:13px 15px;margin-bottom:10px;background:var(--nen-2)}
.o-quyen.bat{background:var(--nen-2);border-color:var(--vien-dam)}
.o-quyen .ten{display:flex;align-items:center;gap:9px;font-weight:600;color:var(--chinh-dam);flex-wrap:wrap}
.o-quyen .mo-ta{color:var(--chu-mo);font-size:.84rem;margin:5px 0 0 26px}
.o-quyen .pham-vi{margin:10px 0 0 26px;display:flex;gap:16px;flex-wrap:wrap;font-size:.87rem}
.o-quyen .pham-vi label{font-weight:500;display:flex;align-items:center;gap:6px;margin:0;color:var(--chu)}
.o-quyen.tat .pham-vi{display:none}

/* ================= MÀN HÌNH HẸP ================= */
@media (max-width:1100px){
  .hai-cot{grid-template-columns:minmax(0,1fr)}
}

@media (max-width:860px){
  /* Cột trái thành ngăn kéo trượt ra, không chiếm chỗ của nội dung */
  .vo,.vo.thu{grid-template-columns:1fr}
  .ben{position:fixed;top:var(--cao-tren);left:0;bottom:0;width:var(--rong-ben);height:auto;
    transform:translateX(-100%);transition:transform .18s ease;box-shadow:0 12px 40px rgba(12,39,64,.18)}
  .vo.mo .ben{transform:translateX(0)}
  .vo.mo .man-che{display:block}
  /* màn hẹp thì nút này là nút mở ngăn kéo — bỏ kiểu "chỉ còn biểu tượng" */
  .vo.thu .ben .chu{display:inline}
  .vo.thu .ben a{justify-content:flex-start;padding:8px 12px;gap:10px}
  .vo.thu .ben .nhom{height:auto;margin:18px 12px 5px;background:none;color:var(--chu-mo)}

  .tren-cung{gap:9px;padding:0 10px}
  .tren-cung .hieu b{font-size:.86rem;max-width:34vw}
  .tren-cung .vien-nho{display:none}
  .tren-cung .phai{gap:10px;font-size:.82rem}
  .tren-cung .phai .ai{display:none}
  .doi-nn button{padding:5px 8px;font-size:.74rem}

  .chinh{padding:16px 13px 50px}
  .hang,.hang-3{grid-template-columns:1fr}
  .o{padding:15px}
  .o.mong{overflow-x:auto}
  .o.mong table{min-width:620px}
  h1{font-size:1.24rem}
  table{font-size:.87rem}
  th,td{padding:9px 10px}
  .the-so{grid-template-columns:repeat(auto-fit,minmax(132px,1fr));gap:11px}
  .the-so b{font-size:1.45rem}
  .tren{margin-bottom:16px}
}

@media (max-width:480px){
  .tren-cung .hieu b{max-width:26vw}
  .the-so{grid-template-columns:1fr 1fr}
  .nut{padding:8px 14px}
  .chinh{padding:14px 10px 46px}
}

/* hàng việc "Xem · Sửa" nằm ngay dưới tiêu đề trong danh sách */
.viec-dong{margin-top:5px;font-size:.84rem;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.viec-dong a{color:var(--chinh);font-weight:600}
.viec-dong a:hover{text-decoration:underline}

/* ---- ô lọc gọn: nhãn chữ thường, nhỏ, nút cùng hàng ---- */
.o-loc{padding:14px 16px}
.hang-loc{display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin:0}
.hang-loc .o-nho{flex:1 1 180px;min-width:150px}
.hang-loc label{font-size:.76rem;font-weight:500;text-transform:lowercase;letter-spacing:.02em;
  color:var(--chu-mo);margin:0 0 3px}
.hang-loc input,.hang-loc select{padding:7px 10px;font-size:.9rem}
.hang-loc .nut-loc{display:flex;gap:8px;flex:0 0 auto}
.hang-loc .nut-loc .nut{padding:7px 16px;font-size:.88rem;line-height:1.4}

/* ---- chân bảng: phân trang ---- */
.chan-bang{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:11px 15px;border-top:1px solid var(--vien);background:var(--nen-2)}
.chan-bang select{padding:5px 8px;font-size:.86rem}
.trang-so{display:inline-flex;gap:3px;align-items:center}
.trang-so a{min-width:30px;text-align:center;padding:5px 8px;border-radius:6px;font-size:.86rem;
  border:1px solid var(--vien);background:var(--trang);color:var(--chu)}
.trang-so a:hover{background:var(--nen-2);text-decoration:none}
.trang-so a.dang{background:var(--chinh);border-color:var(--chinh);color:var(--trang);font-weight:600}

/* ---- hàng khách bấm được để gán màu ---- */
.bang-khach tbody tr{cursor:pointer}
.bang-khach tbody tr:hover{filter:brightness(.975)}
.bang-khach tbody tr a{cursor:pointer}
.bang-mau-chon{position:absolute;z-index:60;background:var(--trang);border:1px solid var(--vien);
  border-radius:10px;box-shadow:0 14px 40px rgba(12,39,64,.22);padding:8px;min-width:190px}
.bang-mau-chon .dong{display:flex;align-items:center;gap:9px;padding:7px 9px;border-radius:7px;
  cursor:pointer;font-size:.88rem}
.bang-mau-chon .dong:hover{background:var(--nen-2)}
.bang-mau-chon .o-mau{width:18px;height:18px;border-radius:5px;border:1px solid var(--vien-dam);flex-shrink:0}
.bang-mau-chon .dau-dang{margin-left:auto;color:var(--chinh);font-weight:700}

/* ---- popup ---- */
.lop-phu{position:fixed;inset:0;z-index:70;background:rgba(12,39,64,.45);
  display:flex;align-items:flex-start;justify-content:center;padding:6vh 16px 20px;overflow-y:auto}
.lop-phu[hidden]{display:none}
.lop-phu .hop{background:var(--trang);border-radius:12px;width:100%;max-width:760px;
  box-shadow:0 22px 60px rgba(6,20,36,.32);overflow:hidden}
.hop-dau{display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:16px 20px;border-bottom:1px solid var(--vien)}
.hop-than{padding:20px}
.hop-chan{display:flex;justify-content:flex-end;gap:9px;padding:14px 20px;
  border-top:1px solid var(--vien);background:var(--nen-2)}
.nut-dong{background:none;border:none;font-size:1.15rem;cursor:pointer;color:var(--chu-mo);
  width:32px;height:32px;border-radius:7px;line-height:1}
.nut-dong:hover{background:var(--nen-2);color:var(--chinh-dam)}
@media (max-width:640px){
  .lop-phu{padding:0}
  .lop-phu .hop{border-radius:0;min-height:100vh;max-width:none}
}

/* nút trông như chữ (dùng trong hàng việc Xem · Sửa · Xoá) */
.nhu-chu{background:none;border:none;padding:0;font:inherit;font-weight:600;font-size:.84rem;
  color:#A33636;cursor:pointer}
.nhu-chu:hover{text-decoration:underline}
.viec-dong form{display:inline}
/* dịch vụ sắp hết hạn */
.gap-han{color:#A33636;font-weight:600}

/* ---- khu thư ---- */
.bang-thu tbody tr.chua-doc td{font-weight:600;background:var(--nen-2)}
.bang-thu tbody tr.chua-doc td a{color:var(--chinh-dam)}
.khung-thu{width:100%;min-height:420px;border:1px solid var(--vien);border-radius:8px;background:var(--trang)}
.chu-thu{white-space:pre-wrap;word-break:break-word;font:inherit;margin:0;
  background:var(--nen-2);border:1px solid var(--vien);border-radius:8px;padding:16px}
.ds-kem{display:flex;flex-direction:column;gap:6px;margin-top:10px}
.ds-kem .tep{display:flex;align-items:center;gap:9px;padding:8px 11px;border:1px solid var(--vien);
  border-radius:7px;background:var(--nen-2);font-size:.88rem}
.ds-kem .tep .bo{margin-left:auto;background:none;border:none;color:#A33636;cursor:pointer;font-weight:700}

/* ---- hộp soạn thư: nhỏ gọn, nổi lên như Gmail ---- */
/* Popup it o thi dung khung hep, khong de o keo dai het 760px cho trong */
.lop-phu .hop.hop-hep{max-width:520px}
.lop-phu .hop.hop-soan{max-width:620px;margin-top:2vh}
.hop-soan .hop-than{padding:0}
.hop-soan .dong-soan{display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--vien);
  padding:0 16px}
.hop-soan .dong-soan label{width:60px;flex-shrink:0;margin:0;font-size:.82rem;font-weight:500;
  color:var(--chu-mo);text-transform:lowercase}
.hop-soan .dong-soan input,.hop-soan .dong-soan select{border:none;border-radius:0;padding:10px 0;
  font-size:.92rem;background:transparent}
.hop-soan .dong-soan input:focus,.hop-soan .dong-soan select:focus{outline:none;box-shadow:none}
.hop-soan .o-soan{width:100%;border:none;border-radius:0;padding:14px 16px;min-height:220px;
  font-size:.94rem;resize:vertical}
.hop-soan .o-soan:focus{outline:none}
.hop-soan .ds-kem{padding:0 16px 10px}
.hop-chan-soan{align-items:center;gap:10px;justify-content:flex-start}
/* v266: theo dõi khách mở thư — ô tick ở hộp soạn + nhãn ở Đã gửi / trang đọc thư */
.chon-theo-doi{display:inline-flex;align-items:center;gap:5px;margin:0 0 0 4px;font-size:.84rem;font-weight:500;cursor:pointer;white-space:nowrap;color:var(--chu)}
.chon-theo-doi input{margin:0}
.the-mo-thu{display:inline-block;margin-left:6px;padding:1px 8px;border-radius:999px;font-size:.72rem;font-weight:600;background:var(--nen-2);color:var(--chu-mo);border:1px solid var(--vien);white-space:nowrap;vertical-align:middle}
.the-mo-thu.da-mo{background:#E3F1E8;border-color:#9FCFB2;color:#1E6B43}
:root[data-giao-dien="toi"] .the-mo-thu.da-mo{background:#173A28;border-color:#2E6B4A;color:#9FD8B7}

/* nút Soạn thư ở cột trái: cho ra dáng nút, đừng lẫn vào các mục menu */
.ben .nut-soan{display:flex;align-items:center;justify-content:center;gap:8px;
  margin:2px 6px 12px;padding:11px 14px;border-radius:9px;background:var(--chinh);color:var(--trang);
  font-weight:600;font-size:.92rem;border:none;cursor:pointer;width:calc(100% - 12px)}
.ben .nut-soan:hover{background:var(--chinh-dam);color:var(--trang);text-decoration:none}
.vo.thu .ben .nut-soan{padding:11px 0;margin:2px 2px 12px;width:calc(100% - 4px)}
.vo.thu .ben .nut-soan .chu{display:none}

/* ---- danh sách thư kiểu hòm thư: một dòng, có ô tích và dấu sao ---- */
.bang-thu td{padding:9px 10px}
.bang-thu .o-tich{width:34px;text-align:center}
.bang-thu .o-sao{width:30px;text-align:center;cursor:pointer;font-size:1rem;color:var(--vien-dam);
  background:none;border:none;padding:0;line-height:1}
.bang-thu .o-sao.sang{color:#E0A33E}
.bang-thu .trich{color:var(--chu-mo);font-weight:400}
.thanh-viec{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:9px 12px;
  border-bottom:1px solid var(--vien);background:var(--nen-2)}
.thanh-viec .dem{margin-left:auto;font-size:.85rem;color:var(--chu-mo)}
.thanh-viec[hidden]{display:none}

/* ---- thanh công cụ của hòm thư: một hàng, giống hòm thư quen thuộc ---- */
.thanh-hom{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 12px;
  border-bottom:1px solid var(--vien);background:var(--trang)}
.thanh-hom .o-tim-hom{max-width:260px;padding:6px 10px;font-size:.88rem}
.thanh-hom .viec-chon{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap;
  padding-left:8px;margin-left:2px;border-left:1px solid var(--vien)}
.thanh-hom .viec-chon[hidden]{display:none}
.thanh-hom .phan-trang-hom{margin-left:auto;display:flex;align-items:center;gap:6px}
.nut-tron{width:30px;height:30px;border-radius:50%;border:none;background:none;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;color:var(--chu-mo);
  font-size:1.05rem;line-height:1;text-decoration:none;flex-shrink:0}
.nut-tron:hover{background:var(--nen-2);color:var(--chinh-dam);text-decoration:none}
.nut-tron.tat{color:var(--vien-dam);cursor:default}
.nut-tron.tat:hover{background:none;color:var(--vien-dam)}
@media (max-width:760px){
  .thanh-hom .phan-trang-hom{margin-left:0;width:100%;justify-content:flex-end}
  .thanh-hom .o-tim-hom{max-width:none;flex:1 1 140px}
}

/* cột người gửi trong danh sách thư: một dòng, tràn thì cắt bằng ba chấm */
.bang-thu .cot-nguoi a{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* ---- nút chọn có menu thả xuống (kiểu hòm thư quen thuộc) ---- */
.chon-nhom{position:relative;display:inline-flex;align-items:center;gap:2px}
.nut-xo{background:none;border:none;cursor:pointer;color:var(--chu-mo);font-size:.7rem;
  padding:4px 3px;line-height:1;border-radius:5px}
.nut-xo:hover{background:var(--nen-2);color:var(--chinh-dam)}
.menu-xo{position:absolute;top:calc(100% + 6px);left:0;z-index:50;min-width:170px;
  background:var(--trang);border:1px solid var(--vien);border-radius:9px;padding:5px;
  box-shadow:0 12px 34px rgba(12,39,64,.18)}
.menu-xo[hidden]{display:none}
.menu-xo button{display:block;width:100%;text-align:left;background:none;border:none;
  padding:8px 12px;border-radius:6px;font:inherit;font-size:.89rem;color:var(--chu);cursor:pointer}
.menu-xo button:hover{background:var(--nen-2);color:var(--chinh-dam)}
.menu-xo .ngan{height:1px;background:var(--vien);margin:4px 6px}

/* ---- biểu tượng nét: canh cho thẳng hàng với chữ ---- */
.bt{display:inline-block;vertical-align:-3px;flex-shrink:0}
.ben .bieu{display:inline-flex;align-items:center;justify-content:center;width:22px}
.nut-tron .bt{vertical-align:0}
.menu-xo button .bt{margin-right:8px;vertical-align:-4px;opacity:.7}

/* ---- thanh công cụ đứng riêng, ngoài khung danh sách ---- */
.thanh-hom{border:none;background:none;padding:0 2px 10px;border-radius:0}
.o.mong .bang-thu thead th{background:var(--nen-2);font-size:.74rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--chu-mo);font-weight:600;padding:8px 10px}
.bang-thu thead th.o-tich{width:34px}

/* ---- nhãn gắn trên thư ---- */
.the-nhan{display:inline-block;background:var(--nen-2);border:1px solid var(--vien);color:var(--chu-mo);
  border-radius:5px;padding:1px 7px;font-size:.75rem;font-weight:600;margin-right:6px;
  vertical-align:1px}
.o-nhan-moi{display:flex;gap:6px;align-items:center;padding:6px 8px}
.o-nhan-moi input{padding:6px 9px;font-size:.87rem}

/* ---- soạn thư có định dạng ---- */
.khung-soan{border-top:1px solid var(--vien)}
.khung-soan .ql-toolbar.ql-snow{border:none;border-bottom:1px solid var(--vien);padding:6px 10px;background:var(--nen-2)}
.khung-soan .ql-container.ql-snow{border:none;font-size:.94rem;font-family:inherit}
.khung-soan .ql-editor{min-height:210px;padding:14px 16px}
.khung-soan .ql-editor.ql-blank::before{left:16px;right:16px;font-style:normal;color:var(--chu-mo)}
.hop-soan .o-soan[hidden]{display:none}

/* ================= MÀN HÌNH ĐỌC THƯ — một khung duy nhất ================= */
.o-doc-thu{padding:0;overflow:hidden}

.dau-thu{padding:22px 26px 14px;display:flex;align-items:center;gap:9px;flex-wrap:wrap}
.tieu-de-thu{font-size:1.45rem;font-weight:400;color:var(--chu);margin:0;line-height:1.35;
  flex:1 1 320px;min-width:0;word-break:break-word}

.hang-nguoi-gui{display:flex;align-items:flex-start;gap:13px;padding:0 26px 16px}
.anh-dai-dien{width:38px;height:38px;border-radius:50%;background:var(--nen-2);color:var(--chinh);
  display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1.02rem;flex-shrink:0}
.ai-gui{flex:1 1 auto;min-width:0;line-height:1.45}
.ai-gui strong{font-size:.97rem;color:var(--chu)}
.ben-phai-thu{display:flex;align-items:center;gap:6px;flex-shrink:0;padding-top:3px}

/* thân thư đặt thẳng trên nền trắng, không bọc hộp xám */
.than-thu{padding:4px 26px 20px}
.than-thu .chu-thu{white-space:pre-wrap;word-break:break-word;background:none;border:none;
  padding:0;margin:0;font:inherit;line-height:1.75;color:var(--chu)}
.than-thu .khung-thu{border:none;min-height:340px}

.khoi-kem{padding:0 26px 18px;border-top:1px solid var(--vien);padding-top:16px;margin-top:4px}
.khoi-kem .ds-kem{flex-direction:row;flex-wrap:wrap;gap:8px}
.khoi-kem .tep{min-width:230px;max-width:340px;color:var(--chu);text-decoration:none}
.khoi-kem .tep:hover{background:var(--nen-2);text-decoration:none}
.khoi-kem .tep span:first-of-type{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.chan-doc-thu{display:flex;gap:10px;flex-wrap:wrap;padding:4px 26px 24px}
.nut-tron-vien{display:inline-flex;align-items:center;gap:8px;background:var(--trang);
  border:1px solid var(--vien);border-radius:99px;padding:8px 20px;font:inherit;font-size:.92rem;
  color:var(--chu);cursor:pointer}
.nut-tron-vien:hover{background:var(--nen-2);border-color:var(--vien-dam)}

@media (max-width:760px){
  .dau-thu{padding:16px 15px 10px}
  .tieu-de-thu{font-size:1.2rem}
  .hang-nguoi-gui,.than-thu,.khoi-kem,.chan-doc-thu{padding-left:15px;padding-right:15px}
  .ben-phai-thu{flex-wrap:wrap;justify-content:flex-end}
}

/* ---- dau hieu khach hang trong khu thu (bat/tat o Cai dat -> Noi voi CRM) ---- */
.cham-khach{display:inline-block;width:9px;height:9px;border-radius:50%;flex-shrink:0;
  box-shadow:0 0 0 1px rgba(12,39,64,.18)}
.dau-khach{display:inline-flex;align-items:center;gap:6px;text-decoration:none}
.dau-khach:hover{text-decoration:underline}
.dai-khach{display:flex;align-items:center;gap:9px;margin-top:8px;padding:7px 11px;
  border:1px solid var(--vien);border-left:3px solid var(--chinh);border-radius:8px;
  background:var(--nen-2);text-decoration:none;color:var(--chu);font-size:.88rem;flex-wrap:wrap}
.dai-khach:hover{background:var(--nen-2)}

/* o chon kieu dau hieu (Cai dat -> Noi voi CRM) */
.o-kieu{display:block;border:1px solid var(--vien);border-radius:9px;padding:12px 13px;cursor:pointer;
  background:var(--trang);transition:border-color .12s,background .12s}
.o-kieu:hover{border-color:var(--vien-dam)}
.o-kieu.dang{border-color:var(--chinh);background:var(--nen-2)}
.o-kieu .ten-kieu{font-weight:600;margin-left:6px}
.o-kieu .vi-du{display:flex;align-items:center;gap:6px;margin-top:9px;padding-top:9px;
  border-top:1px dashed var(--vien);color:var(--chinh-dam);font-size:.88rem;min-height:26px}

/* nut mui ten quay ra khoi trang cai dat, ve dung hop thu dang mo */
.nut-ra{flex-shrink:0;margin-top:3px;text-decoration:none}

/* ---- Giao dien toi: nhung mau bao/nhan phai dịu lai, khong thi choi mat ---- */
:root[data-giao-dien="toi"] .bao.ok  {background:#14301F;border-color:#2C5A3C;color:#9ADCB4}
:root[data-giao-dien="toi"] .bao.loi {background:#32191A;border-color:#6A3236;color:#F0A8A8}
:root[data-giao-dien="toi"] .bao.nhac{background:#2E2718;border-color:#5C4E2C;color:#E5CE8E}
:root[data-giao-dien="toi"] .nhan.xanh{background:#14301F;border-color:#2C5A3C;color:#9ADCB4}
:root[data-giao-dien="toi"] .nhan.vang{background:#2E2718;border-color:#5C4E2C;color:#E5CE8E}
:root[data-giao-dien="toi"] .nhan.do  {background:#32191A;border-color:#6A3236;color:#F0A8A8}
:root[data-giao-dien="toi"] .nhan.duong{background:#16273A;border-color:#2E4A6B;color:#A8C9EC}
:root[data-giao-dien="toi"] .nut.do{background:#8C3030;border-color:#8C3030}
:root[data-giao-dien="toi"] .gap-han{color:#F0A8A8}
/* Thu cua nguoi la nam trong khung cach ly, nen giu khung sang de doc dung nhu nguoi gui soan */
:root[data-giao-dien="toi"] .khung-thu{background:#fff;border-radius:6px}

/* ---- cụm ngôn ngữ + sáng/tối trên THANH ĐẦU, bên phải (ông chủ chốt 30/09/2026) ----
   Trước để ở đáy cột trái (23/09). Dùng thật thì đáy là chỗ mắt không nhìn tới, mà đổi
   ngôn ngữ lại là việc bấm thường xuyên vì nhân sự Việt và Mỹ dùng chung màn hình. */
.tren-cung .cum-chon-tren{display:flex;align-items:center;gap:8px;margin-right:4px}
.tren-cung .cum-chon-tren svg{display:block}
.tren-cung .cum-chon-tren .doi-nn button{padding:5px 9px}
/* Màn hẹp: giấu cụm này đi cho thanh đầu khỏi chật — tên người dùng quan trọng hơn.
   Người dùng điện thoại đổi ngôn ngữ ở trang đăng nhập hoặc xoay ngang máy. */
/* 03/10/2026: KHONG giau ca cum nua — o ngon ngu nay chi con mot chu (VI/EN) nen
   man hep van du cho. Chi giau DAY PHAN HE (xem duoi), dien thoai dung ngan keo. */

/* ---- cum cuoi cot trai: mot ben ngon ngu, mot ben giao dien ---- */
.khoi-duoi{margin-top:auto;display:flex;flex-direction:column;gap:1px}
.duoi-chon{margin-top:12px;padding:12px 2px 2px;display:flex;gap:8px;align-items:center;
  border-top:1px solid var(--vien)}
.duoi-chon .doi-nn{flex:1;justify-content:center}
.duoi-chon .doi-nn button{flex:1;display:flex;align-items:center;justify-content:center;padding:7px 0}
.duoi-chon svg{width:16px;height:16px;display:block}
/* thu menu lai thi cum nut xep doc cho vua be ngang */
.vo.thu .duoi-chon{flex-direction:column;padding:10px 6px;gap:6px}
.vo.thu .duoi-chon .doi-nn{width:100%}

/* ---- menu nho khi bam vao ten minh tren thanh dau ---- */
.ai-nut{display:flex;align-items:center;gap:7px;background:none;border:1px solid transparent;
  border-radius:8px;padding:4px 8px;cursor:pointer;font:inherit;color:inherit;text-align:left}
.ai-nut:hover{border-color:var(--vien);background:var(--nen-2)}
.ai-nut .mui-xuong{color:var(--chu-mo);font-size:.7rem}
.menu-toi{right:0;left:auto;min-width:190px}
.menu-toi a{display:block;padding:9px 13px;color:var(--chu);text-decoration:none;font-size:.9rem}
.menu-toi a:hover{background:var(--nen-2);text-decoration:none}

/* Hai nut ngang hang trong khoi tai khoan cua ho so nhan vien */
.hang-nut-nv { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; margin-top: 4px; }
/* `hidden` chi la display:none o muc trinh duyet, nen display cua `.nut` thang no.
   Khong co dong nay thi dat hidden ma nut van hien — da dinh that 23/09/2026. */
.nut[hidden] { display: none; }

/* Muc menu de DO cho biet co chuc nang ay, nhung chua bam duoc. */
.muc-tat{opacity:.4;cursor:default}
.muc-tat:hover{background:none}
/* v114b (ông chủ: "format cho thẳng thắn đẹp vào"): mục cột trái CHƯA BẤM ĐƯỢC (khu Thư khi chưa có hộp thư) là <span>, không phải <a>
   — trước đây không ăn kiểu của .ben a nên lệch lề, biểu tượng nhỏ. Nay cùng khuôn, cùng lề, cùng cỡ với mục thường. */
.ben .muc{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:7px;color:var(--chu);font-size:.9rem;white-space:nowrap}
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]) .muc{color:var(--mm-chu);border-radius:999px;font-weight:500}
.vo.thu .ben .muc{justify-content:center;padding:9px 0;gap:0}
@media (max-width:860px){ .vo.thu .ben .muc{justify-content:flex-start;padding:8px 12px;gap:10px} }
/* Nut dang TAT phai TRONG NHU dang tat. Khong co dong nay thi nut disabled nhin y het
   nut bam duoc — nguoi dung bam mai khong thay gi, tuong phan mem hong.
   Ong chu dinh dung loi nay 23/09/2026. */
.nut:disabled{opacity:.45;cursor:not-allowed;box-shadow:none}
.nut:disabled:hover{filter:none}

/* Nhan vua de DOC vua BAM duoc — dung cho cong tac bat/tat ngay trong dong du lieu.
   Trong giong `.nhan` nhung co con tro tay va sang len khi ro chuot. */
.nhan-nut{display:inline-block;margin-top:6px;padding:2px 9px;border-radius:999px;
  font-size:.74rem;font-weight:500;border:1px solid transparent;cursor:pointer;
  font-family:inherit;line-height:1.5}
.nhan-nut.xanh{background:var(--xanh-nhat,#e8f5ec);color:var(--xanh-dam,#1b6b3a)}
.nhan-nut.xam{background:var(--nen-2);color:var(--chu-mo)}
.nhan-nut:hover{filter:brightness(.95)}
.hang-nut-nv form { margin: 0; }

/* ---- Cum "Phan he khac" gap lai ----
   Ong chu 23/09/2026: sat lai cho do ton dien tich, mac dinh an, bam moi mo. */
.nhom-gap{margin-top:2px}
.nhom-gap>summary{list-style:none;cursor:pointer;display:flex;align-items:center;
  justify-content:space-between;gap:8px;padding:7px 12px;border-radius:8px;
  font-size:.7rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  color:var(--chu-mo);user-select:none}
.nhom-gap>summary::-webkit-details-marker{display:none}
.nhom-gap>summary:hover{background:var(--nen-2);color:var(--chu)}
.nhom-gap .mui-gap{font-size:.75rem;transition:transform .15s}
.nhom-gap[open] .mui-gap{transform:rotate(90deg)}
/* Cac muc ben trong sat nhau hon muc thuong */
.nhom-gap .trong-gap{display:flex;flex-direction:column;gap:1px;padding-bottom:2px}
.nhom-gap .trong-gap .muc{padding-top:6px;padding-bottom:6px}

/* Man hinh "Cai dat phan he": trai chon phan he, phai la cai dat cua no. */
.hai-cot-lech{display:grid;grid-template-columns:230px 1fr;gap:16px;align-items:start}
/* v175: hồ sơ khách — Tổng quan hai cột bằng nhau; cột trái hai thẻ hồ sơ xếp chồng; cột phải người liên hệ + dịch vụ sử dụng (màu theo trạng thái) */
.ho-so-tq{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.cot-xep{display:grid;gap:0}
.dv-nhom-tt{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 10px}
.dv-nhom-tt a.nhan{text-decoration:none}
.ds-dv-tq{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.ds-dv-tq li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;border:1px solid var(--vien);border-left:4px solid #94A3B8;border-radius:8px;min-width:0}
.ds-dv-tq li .giua{min-width:0;flex:1}
.ds-dv-tq li.tt-xanh{border-left-color:#1E8E3E}
.ds-dv-tq li.tt-lam{border-left-color:#1A73E8}
.ds-dv-tq li.tt-vang{border-left-color:#E8A317}
.ds-dv-tq li.tt-cam{border-left-color:#E8710A}
.ds-dv-tq li.tt-do{border-left-color:#D93025}
.cam-chu{color:#C2410C}
/* v177: LOẠI KHÁCH — ô theo loại (form-khach[data-loai]); chưa chọn thì như cá nhân */
.form-khach[data-loai="cong_ty"] [data-chi-loai="ca_nhan"],
.form-khach:not([data-loai="cong_ty"]) [data-chi-loai="cong_ty"]{display:none}
.chon-loai-kh{display:flex;gap:8px;flex-wrap:wrap}
.kd-goi-y{margin-top:4px;color:#B45309}   /* v184: gợi ý "có vẻ là MST" */
.kd-goi-y[hidden]{display:none}
/* v179: phần module trong ô "Bán gì" (tên miền QC) + nhãn nhỏ 2/3, không đậm */
.o-khe-ban{margin-top:3px}
.o-khe-ban .qctm-tm::before{content:'🌐 ';font-size:.8em}
.nhan.nhan-nho23{font-size:.52rem;font-weight:400;padding:1px 7px}
/* v185: nhãn "＋ Khai báo tên miền" là NÚT — bấm nhảy tới ô khai ở chi tiết dịch vụ */
a.nhan.qctm-khai{text-decoration:none;cursor:pointer}
a.nhan.qctm-khai:hover{filter:brightness(.94);text-decoration:underline}
/* v185 (ông chủ): sổ Bán hàng & dịch vụ — tên khách nhỏ 1 cỡ, không đậm; tên dịch vụ (Bán gì) đậm */
.dv-ten-khach{font-size:.92em;font-weight:400}
.dv-ten-ban{font-weight:700}
/* v186: tài khoản ngân hàng (CRM › Cài đặt) + trang Gửi QR */
.tknh-dong{display:flex;gap:16px;align-items:flex-start;flex-wrap:wrap}
.tknh-dong .giua{flex:1 1 260px;min-width:0}
.tknh-dong .anh-qr{width:120px;height:auto;flex:0 0 120px;border:1px solid var(--vien);border-radius:8px;background:#fff}
.tknh-an{opacity:.62}
@media (max-width:640px){.tknh-dong .cum-thao-tac{width:100%}}
/* v185: ô NHẬP NHANH TẠI CHỖ (admin.js [data-nhap-nhanh]) — mở ngay dưới nhãn */
form.nhap-nhanh{display:grid;gap:6px;margin-top:6px;padding:10px;min-width:220px;max-width:340px;background:var(--nen-the,#fff);
  border:1px solid var(--vien);border-radius:10px;box-shadow:0 6px 18px rgba(15,35,60,.12);text-align:left;white-space:normal}
form.nhap-nhanh textarea{width:100%;font-size:.88rem;min-height:52px}
form.nhap-nhanh .cung-dong{gap:6px}
/* v178 (ông chủ: "box thiếu người liên hệ nhỏ lại = 1/2 hiện tại, không cần bold") */
.nhan.nhan-thieu-lh{font-size:.62rem;font-weight:400;padding:0 6px;line-height:1.5;text-decoration:none}
.khoi-lh-moi{margin-top:14px;padding:14px;border:1px dashed var(--vien);border-radius:10px;background:var(--nen-2)}
.khoi-lh-moi h3{margin:0 0 8px;font-size:.95rem}
@media (max-width:1100px){ .ho-so-tq{grid-template-columns:1fr} }
.ds-ben{display:flex;flex-direction:column}
.ds-ben a{display:block;padding:11px 14px;color:var(--chu);text-decoration:none;
  border-left:3px solid transparent}
.ds-ben a+a{border-top:1px solid var(--vien)}
.ds-ben a:hover{background:var(--nen-2);text-decoration:none}
.ds-ben a.dang{background:var(--nen-2);border-left-color:var(--chinh);font-weight:600}
.ds-ben .chu{display:block;font-size:.92rem}
.ds-ben code{font-size:.72rem}
@media (max-width:820px){ .hai-cot-lech{grid-template-columns:1fr} }

/* ============================ KHU LỊCH /calendar ============================
   Dùng lại toàn bộ biến màu đã có nên giao diện tối tự chạy theo, không phải
   khai thêm bộ màu nào. Màu riêng của từng lịch đi qua biến --mau-sk đặt ngay
   trên thẻ, vì đó là DỮ LIỆU (chủ lịch tự chọn), không phải màu giao diện. */
.lich-tren{display:flex;align-items:center;justify-content:space-between;gap:12px;
  flex-wrap:wrap;margin-bottom:12px}
.lich-tren .cum{display:flex;align-items:center;gap:8px}
.lich-tren .lich-thang{font-size:1.25rem;margin:0 0 0 6px;white-space:nowrap}
@media (max-width:480px){ .lich-tren .cum{flex-wrap:wrap;row-gap:6px} .lich-tren .lich-thang{font-size:1.05rem;white-space:normal;flex-basis:100%;margin:2px 0 0} }   /* v259.3: tiêu đề khoảng ngày (lịch ngày / Lịch làm việc khách) xuống dòng thay vì tràn ngang 375px */
.lich-tren .nut-tron.xoay svg{transform:rotate(180deg)}
.doi-kieu{display:inline-flex;border:1px solid var(--vien);border-radius:var(--r);overflow:hidden}
.doi-kieu a{padding:7px 14px;color:var(--chu);font-size:.9rem}
.doi-kieu a+a{border-left:1px solid var(--vien)}
.doi-kieu a:hover{background:var(--nen-2);text-decoration:none}
.doi-kieu a.dang{background:var(--chinh);color:var(--trang);font-weight:600}

/* ---- lưới tháng ---- */
.lich-luoi{display:grid;grid-template-columns:repeat(7,1fr);gap:1px;background:var(--vien);
  border:1px solid var(--vien);border-radius:var(--r);overflow:hidden}
.lich-luoi .o-thu{background:var(--nen-2);padding:8px 10px;font-size:.8rem;font-weight:600;
  color:var(--chu-mo);text-align:center}
.lich-luoi .o-ngay{background:var(--trang);min-height:104px;padding:5px 6px 7px;cursor:pointer}
.lich-luoi .o-ngay:hover{background:var(--nen-2)}
.lich-luoi .o-ngay.ngoai{background:var(--nen);color:var(--chu-mo)}
.lich-luoi .o-ngay.ngoai .so-ngay a{color:var(--chu-mo)}
.lich-luoi .so-ngay{text-align:right;font-size:.85rem;margin-bottom:3px}
.lich-luoi .so-ngay a{color:var(--chu);padding:2px 5px;border-radius:99px}
.lich-luoi .o-ngay.nay .so-ngay a{background:var(--chinh);color:var(--trang);font-weight:700}
.buoi{display:flex;align-items:center;gap:5px;width:100%;border:0;background:transparent;
  padding:2px 4px;border-radius:5px;cursor:pointer;text-align:left;font:inherit;font-size:.82rem;
  color:var(--chu);overflow:hidden;white-space:nowrap}
.buoi:hover{background:var(--vien)}
.buoi .cham{width:7px;height:7px;border-radius:99px;background:var(--mau-sk,var(--chinh));flex-shrink:0}
.buoi .gio{color:var(--chu-mo);font-size:.76rem;flex-shrink:0}
.buoi .ten{overflow:hidden;text-overflow:ellipsis}
.buoi.che .ten{font-style:italic;color:var(--chu-mo)}
.them-nua{display:block;font-size:.76rem;color:var(--chu-mo);padding:1px 4px}

/* ---- lưới giờ (tuần / ngày) ---- */
.lich-gio{border:1px solid var(--vien);border-radius:var(--r);background:var(--trang);overflow:hidden}
.lich-gio .dau-cot{display:grid;grid-template-columns:58px repeat(auto-fit,minmax(0,1fr));
  border-bottom:1px solid var(--vien);background:var(--nen-2)}
.lich-gio .dau-ngay{padding:7px 4px;text-align:center;border-left:1px solid var(--vien)}
.lich-gio .dau-ngay .thu{display:block;font-size:.74rem;color:var(--chu-mo)}
.lich-gio .dau-ngay .so{font-size:1rem;font-weight:600;color:var(--chu)}
.lich-gio .than-gio{display:grid;grid-template-columns:58px repeat(auto-fit,minmax(0,1fr));
  max-height:calc(100vh - 230px);overflow-y:auto}
.lich-gio .cot-gio .vach{height:var(--cao-gio);position:relative}
.lich-gio .cot-gio span{position:absolute;top:-8px;right:7px;font-size:.72rem;color:var(--chu-mo)}
.lich-gio .cot-ngay{position:relative;border-left:1px solid var(--vien)}
.lich-gio .o-gio{height:var(--cao-gio);border-top:1px solid var(--vien);cursor:pointer}
.lich-gio .o-gio:hover{background:var(--nen-2)}
.buoi-gio{position:absolute;left:3px;right:3px;border:0;border-radius:6px;cursor:pointer;
  padding:3px 6px;overflow:hidden;text-align:left;font:inherit;font-size:.8rem;line-height:1.25;
  background:var(--mau-sk,var(--chinh));color:#fff;box-shadow:0 1px 2px rgba(16,32,52,.18)}
.buoi-gio .ten{display:block;font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.buoi-gio .gio{display:block;font-size:.72rem;opacity:.92}
.buoi-gio.che{background:var(--vien-dam);color:var(--chu)}

/* ---- danh sách lịch ở cột trái ---- */
.ds-lich{padding:2px 10px 6px}
.ds-lich .mot-lich{display:flex;align-items:center;gap:8px;padding:5px 4px;cursor:pointer;
  font-size:.88rem;margin:0}
.ds-lich .mot-lich:hover{background:var(--nen-2);border-radius:6px}
.ds-lich .cham-lich{width:11px;height:11px;border-radius:3px;flex-shrink:0}
.ds-lich .chu{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---- hộp thêm / sửa sự kiện ---- */
.lop-phu .hop.hop-sk{max-width:640px}
.hop-sk .hang{margin-bottom:12px}
.hop-sk .hang.doi{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hop-sk .hang.tich{display:flex;gap:18px}
.hop-sk .hang.tich label{display:flex;align-items:center;gap:7px;margin:0;font-weight:400}
.hop-sk label{display:block;font-size:.82rem;color:var(--chu-mo);margin-bottom:4px}
.hop-sk input[type=text],.hop-sk input[type=date],.hop-sk input[type=time],
.hop-sk select,.hop-sk textarea{width:100%}
.hop-sk .ngay-gio{display:flex;gap:8px;align-items:center}
.hop-sk .khoi-lap{background:var(--nen-2);border:1px solid var(--vien);border-radius:var(--r);
  padding:11px 12px;display:flex;flex-direction:column;gap:9px}
.hop-sk .thu-tuan{display:flex;flex-wrap:wrap;gap:8px}
.hop-sk .o-thu-chon{display:flex;align-items:center;gap:5px;margin:0;font-size:.82rem;color:var(--chu)}

@media (max-width:820px){
  .lich-luoi .o-ngay{min-height:76px}
  .hop-sk .hang.doi{grid-template-columns:1fr}
  .lich-tren{gap:8px}
}


/* ==========================================================================
   03/10/2026 — ÔNG CHỦ CHỐT LẠI THANH ĐẦU
   [ phân hệ khác ] [ ngôn ngữ một chữ ] [ tên người dùng ]  ·  sáng/tối xuống đáy cột trái
   ========================================================================== */

/* ---- nút ô vuông mở danh sách phân hệ (ông chủ chốt 03/10, lần hai) ---- */
.nut-phan-he{display:inline-flex;align-items:center;justify-content:center;width:36px;height:34px;
  background:none;border:1px solid transparent;border-radius:8px;cursor:pointer;color:var(--chu-mo)}
.nut-phan-he:hover,.nut-phan-he[aria-expanded="true"]{background:var(--nen-2);border-color:var(--vien);color:var(--chinh-dam)}
.nut-phan-he svg{display:block}
.menu-phan-he{right:0;left:auto;width:300px;padding:10px}
.menu-phan-he .tieu-de-menu{font-size:.69rem;letter-spacing:.11em;text-transform:uppercase;
  color:var(--chu-mo);font-weight:600;padding:2px 6px 8px}
.luoi-phan-he{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.luoi-phan-he a{display:flex;flex-direction:column;align-items:center;gap:7px;padding:12px 4px 10px;
  border-radius:10px;color:var(--chu);text-decoration:none;font-size:.78rem;text-align:center;line-height:1.25}
.luoi-phan-he a:hover{background:var(--nen-2);color:var(--chinh-dam);text-decoration:none}
.luoi-phan-he .o-bieu{display:flex;align-items:center;justify-content:center;width:42px;height:42px;
  border-radius:12px;background:var(--nen-2);color:var(--chinh-dam)}
.luoi-phan-he a:hover .o-bieu{background:var(--trang);box-shadow:0 1px 3px rgba(12,39,64,.12)}
/* v169 (ông chủ: "không thấy crm" trên điện thoại): menu bám mép phải nút ô vuông nên ở màn hẹp tràn ra ngoài mép TRÁI, che mất cột đầu
   (CRM, Tài chính). Màn ≤ 640px: menu neo theo màn hình (cách hai mép 12px), lưới tự xuống dòng. */
@media (max-width:640px){ .menu-phan-he{position:fixed;left:12px;right:12px;top:62px;width:auto;max-height:calc(100vh - 80px);overflow-y:auto}
  .luoi-phan-he{grid-template-columns:repeat(auto-fill,minmax(88px,1fr))} }

/* ---- ngôn ngữ: hiện MỘT chữ, bấm ra lựa chọn ---- */
.nut-nn{display:inline-flex;align-items:center;gap:5px;background:var(--trang);cursor:pointer;
  border:1px solid var(--vien);border-radius:8px;padding:5px 10px;font:inherit;font-size:.8rem;
  font-weight:700;color:var(--chinh-dam);letter-spacing:.03em}
.nut-nn:hover{background:var(--nen-2)}
.nut-nn .mui-xuong{color:var(--chu-mo);font-size:.68rem;font-weight:400}
.menu-nn{right:0;left:auto;min-width:170px}
.menu-nn form{margin:0}
.menu-nn button{display:flex;align-items:center;gap:9px}
.menu-nn button b{display:inline-block;min-width:24px;font-size:.76rem;color:var(--chu-mo)}
.menu-nn button.dang{color:var(--chinh-dam);font-weight:600}
.menu-nn .dau-dang{margin-left:auto;color:var(--chinh)}

/* ---- sáng/tối ở đáy cột trái ---- */
.ben .duoi-chon{margin-top:auto}
.ben .khoi-duoi + .duoi-chon{margin-top:12px}


/* ==========================================================================
   03/10/2026 — VÒNG NÂNG GIAO DIỆN TOÀN BỘ (ông chủ giao). Mỗi luật dưới đây có
   một màn hình thật làm lý do — đã soi tận mắt trên bản chạy thử localhost.
   ========================================================================== */

/* ---- Ô chọn hộp thư: gọn, có biểu tượng, mũi tên riêng ----
   Trước là ô chọn mặc định của trình duyệt, cao, chữ đậm, còn in địa chỉ hai lần nên
   bị cắt cụt "anh@ttpjsc.com — anh@tt". */
.ben .chon-hop{width:calc(100% - 12px);height:34px;margin:2px 6px 12px;padding:0 28px 0 33px;
  font:inherit;font-size:.83rem;font-weight:600;color:var(--chinh-dam);cursor:pointer;
  border:1px solid var(--vien);border-radius:10px;background-color:var(--nen-2);
  -webkit-appearance:none;appearance:none;text-overflow:ellipsis;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237A8899' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 13h4l1.5 2.5h5L16 13h4'/%3E%3Cpath d='M4 13 6.2 5.6A2 2 0 0 1 8.1 4h7.8a2 2 0 0 1 1.9 1.6L20 13v4a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2z'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237A8899' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat,no-repeat;background-position:10px center,right 9px center;background-size:16px,13px}
.ben .chon-hop:hover{border-color:var(--vien-dam)}
.ben .chon-hop:focus{outline:none;border-color:var(--chinh);box-shadow:0 0 0 3px rgba(18,57,95,.12)}

/* ---- Thư CHƯA ĐỌC phải nổi bật hẳn ----
   Trước chỉ khác thư đã đọc một chút độ đậm, nhìn lướt không phân biệt được. */
.bang-thu tbody tr.chua-doc td:first-child{box-shadow:inset 3px 0 0 var(--chinh)}
.bang-thu tbody tr.chua-doc .cot-nguoi a,
.bang-thu tbody tr.chua-doc .cot-noi-dung > a{font-weight:700;color:var(--chu)}
.bang-thu tbody tr:not(.chua-doc) td{font-weight:400}
.bang-thu tbody tr:not(.chua-doc) .cot-nguoi a{color:var(--chu-mo)}

/* ---- MỌI bảng: tiêu đề cột, nhãn, số tiền, ngày không gãy dòng ----
   Đã thấy: "Đang trao đổi" gãy hai dòng, "150.000.000" một dòng còn "đ" rơi xuống
   dòng dưới, "CẬP NHẬT" và "HẠN MỨC / GIỜ" bẻ đôi ở tiêu đề cột. */
th{white-space:nowrap}
td .nhan,.nhan{white-space:nowrap}
td.phai,th.phai{white-space:nowrap}
td.so,td .so{white-space:nowrap;font-variant-numeric:tabular-nums}

/* Ô nhập/ô chọn đặt trong bảng (cổng API, nhóm màu…) từng bị bóp còn vài chữ */
td > input[type=text],td > input:not([type]){min-width:105px;width:100%}
td > select{min-width:115px;max-width:100%}
td > input[type=number]{min-width:70px}


/* ---- Danh sách khách: tên khách và người phụ trách không bị bẻ đôi ----
   Sau khi nhãn và số tiền thôi gãy dòng, chỗ chật dồn sang cột tên: "Hoàng Minh / Châu". */
/* v104: tên khách là cột quan trọng nhất — rộng tối thiểu 210px (tên ngắn không bị bẻ đôi); liên lạc không xuống dòng giữa số;
   "Quan tâm" hẹp lại (tối đa 170px, xuống dòng được) — trước cột này giành chỗ khiến tên khách bị ép thành 2–3 dòng */
.bang-khach .o-ten-kh{min-width:210px}
.bang-khach .o-lien-lac{white-space:nowrap}
.bang-khach .o-quan-tam{max-width:170px;min-width:110px;white-space:normal}

/* ---- Giao diện TỐI: hàng khách mang nhóm màu ----
   Màu nhóm là màu pastel người dùng tự chọn, gắn thẳng vào hàng. Sang giao diện tối, chữ
   đổi sang màu sáng mà nền vẫn pastel sáng ⇒ chữ gần như biến mất (thấy tận mắt 03/10).
   Phủ lên mỗi ô một lớp nền tối gần đục: màu nhóm vẫn ánh lên đủ để nhận ra, chữ đọc được.
   Không sửa màu người dùng đã chọn — giao diện sáng vẫn y nguyên. */
:root[data-giao-dien="toi"] .bang-khach tbody tr[style*="background"] > td{background:rgba(18,22,28,.80)}

/* ---- Nút tài khoản trên điện thoại: hiện biểu tượng người thay cho tên đã giấu ---- */
.ai-nut .ai-bieu{display:none;color:var(--chinh-dam)}
.ai-nut .ai-bieu svg{display:block}
@media (max-width:860px){ .ai-nut .ai-bieu{display:inline-flex} }


/* ==========================================================================
   03/10/2026 — BÁN HÀNG & DỊCH VỤ · KHÁCH HÀNG 360° · NHIỀU NGƯỜI PHỤ TRÁCH
   ========================================================================== */

/* ---- dải ô số liệu đầu trang (dùng chung: bán hàng, hồ sơ khách, bảng điều khiển) ---- */
.the-so{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-bottom:16px}
.o-so{display:flex;flex-direction:column;gap:2px;padding:14px 16px;background:var(--trang);
  border:1px solid var(--vien);border-radius:10px;color:inherit;text-decoration:none;min-width:0;
  transition:border-color .15s ease,box-shadow .15s ease}
a.o-so:hover{border-color:var(--chinh);box-shadow:0 4px 14px rgba(12,39,64,.08);text-decoration:none}
.o-so .nhan-so{font-size:.72rem;letter-spacing:.06em;text-transform:uppercase;color:var(--chu-mo);font-weight:600}
.o-so b{font-size:1.32rem;color:var(--chinh-dam);font-variant-numeric:tabular-nums;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis}
.o-so .phu{font-size:.8rem;color:var(--chu-mo)}
.o-so.canh-bao{border-left:3px solid #C8922F}
/* v261.5 (ông chủ 09/10: trang Bán hàng & dịch vụ 7 ô): 7 ô một hàng trên máy tính, chữ số gọn hơn; ô hết hạn cần gia hạn viền đỏ; ô đang lọc đậm viền */
.o-so.canh-bao-do{border-left:3px solid #C0392B}
.o-so.dang{border-color:var(--chinh);box-shadow:0 0 0 2px color-mix(in srgb,var(--chinh) 18%,transparent)}
/* v261.5: 8 ô = 2 hàng × 4 (thoáng, số tiền không bị cắt); điện thoại 2 ô một hàng */
.the-so.the-8{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:14px}
.the-8 .o-so b{white-space:normal;overflow:visible;overflow-wrap:anywhere}
.the-8 .o-so .phu{line-height:1.35}
@media (max-width:760px){ .the-so.the-8{grid-template-columns:repeat(2,minmax(0,1fr))} }
/* chế độ SẮP XẾP Ô CHỈ SỐ (public/js/xep-o.js) */
.the-8 .o-so{position:relative}
.the-8.dang-xep .o-so{cursor:grab;border-style:dashed;user-select:none;touch-action:none}
.the-8.dang-xep .o-so:hover{box-shadow:none}
.the-8.dang-xep .o-so .nhan-so{padding-right:62px}
.the-8 .o-so.dang-keo{opacity:.55;cursor:grabbing;border-color:var(--chinh)}
.xep-o-nut{position:absolute;top:6px;right:6px;display:flex;gap:4px}
.xep-o-nut[hidden]{display:none}
.xep-o-mui{width:26px;height:26px;border:1px solid var(--vien);border-radius:6px;background:var(--trang);color:var(--chinh);cursor:pointer;font-size:.72rem;line-height:1}
.xep-o-mui:hover{border-color:var(--chinh)}
.xep-o-thanh{justify-content:flex-end;gap:8px;margin:-4px 0 14px}
.xep-o-thanh[hidden]{display:none}
.xanh-chu{color:#1E6B3E !important}
.do-chu{color:#A33636 !important}
:root[data-giao-dien="toi"] .xanh-chu{color:#9ADCB4 !important}
:root[data-giao-dien="toi"] .do-chu{color:#F0A8A8 !important}

/* ---- nhãn ba nhóm bán ---- */
.loai-ban{display:inline-block;font-size:.66rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;
  padding:1px 7px;border-radius:5px;margin-bottom:3px}
.loai-san_pham{background:#E9F0F8;color:#1B4C7D}
.loai-dich_vu{background:#FBEFE6;color:#8A4B16}
.loai-co_han{background:#E8F3EC;color:#1E5233}
:root[data-giao-dien="toi"] .loai-san_pham{background:#16263A;color:#9EC6EE}
:root[data-giao-dien="toi"] .loai-dich_vu{background:#32241A;color:#EBB98C}
:root[data-giao-dien="toi"] .loai-co_han{background:#14301F;color:#9ADCB4}

/* ---- bảng bán hàng ---- */
.cum-thao-tac{display:flex;gap:6px;justify-content:flex-end;align-items:center;flex-wrap:nowrap}
.cum-thao-tac form{margin:0}
tr.dong-huy td{opacity:.55}
tr.dong-huy td:first-child{text-decoration:line-through}
.bang-ban tfoot td,.o.mong tfoot td{background:var(--nen-2);border-top:1px solid var(--vien)}
.bang-gon td{padding:10px 8px;vertical-align:top}
.bang-gon tr:first-child td{border-top:none}

/* ---- popup bán hàng ---- */
.lop-phu .hop.hop-rong{max-width:820px}
/* v261.4 (ông chủ 09/10: "form nhập các trường thưa quá" + "form ko scroll như này thì không thể lưu"): hộp Bán hàng — thân CUỘN trong hộp,
   đầu + chân (nút Lưu) luôn hiện; ô sát nhau hơn; 4 ô một hàng; ô ngày cùng cỡ ô khác; 7 ô ngày nghỉ dạng nút bấm */
.lop-phu .hop.hop-ban{display:flex;flex-direction:column;max-height:calc(100vh - 6vh - 20px);max-height:calc(100dvh - 6vh - 20px)}
.hop-ban > form{display:flex;flex-direction:column;min-height:0;flex:1}
.hop-ban .hop-than{overflow-y:auto;min-height:0;flex:1;padding:14px 20px}
.hop-ban .hop-dau,.hop-ban .hop-chan{flex-shrink:0}
.hop-ban .truong{margin-bottom:10px}
.hop-ban .hang,.hop-ban .hang-3{gap:10px 12px}
.hang-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px 12px}
.hop-ban input[type=text],.hop-ban input[type=number],.hop-ban input[type=date],.hop-ban select,.hop-ban input:not([type]){padding:7px 10px}
.hop-ban input[type=date]{width:100%;border:1px solid var(--vien);border-radius:7px;font:inherit;background:var(--trang);color:var(--chu)}
.hop-ban label{margin-bottom:4px}
.ngay-nghi-ds{display:flex;flex-wrap:wrap;gap:6px}
.ngay-nghi-o{display:inline-flex;align-items:center;margin:0;cursor:pointer;font-weight:600}
.ngay-nghi-o input{position:absolute;opacity:0;width:1px;height:1px;margin:0}
.ngay-nghi-o span{display:inline-block;min-width:44px;text-align:center;padding:6px 10px;border:1px solid var(--vien-dam,var(--vien));border-radius:8px;background:var(--trang);color:var(--chu)}
.ngay-nghi-o input:checked + span{background:#FDECEA;border-color:#C0392B;color:#C0392B;text-decoration:line-through}
.ngay-nghi-o input:focus-visible + span{outline:2px solid rgba(18,57,95,.35);outline-offset:1px}
@media (max-width:700px){ .hang-4{grid-template-columns:repeat(2,minmax(0,1fr))} }
.lop-phu .hop.hop-rat-rong{max-width:1040px}
.o-tinh{padding:10px 12px;border:1px dashed var(--vien-dam);border-radius:8px;background:var(--nen-2);
  font-weight:700;color:var(--chinh-dam);font-variant-numeric:tabular-nums}
.nut-chu{background:none;border:none;padding:4px 0 0;color:var(--chinh);font:inherit;font-size:.8rem;
  font-weight:600;cursor:pointer}
.nut-chu:hover{text-decoration:underline}
[data-chi][hidden]{display:none !important}

/* ---- KHUNG HỒ SƠ KHÁCH DÙNG CHUNG: dạng XEM và dạng SỬA trên cùng một bố cục ---- */
.dau-the{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:6px}
.dau-the h2{margin:0}
.form-khach .gia-tri{padding:7px 0 2px;min-height:34px;color:var(--chu);word-break:break-word}
.form-khach .giu-dong{white-space:pre-wrap}
.form-khach.dang-xem .o-sua{display:none !important}
.form-khach.dang-sua .gia-tri{display:none !important}
.form-khach.dang-xem .thanh-luu{display:none}
.form-khach.dang-xem .truong{margin-bottom:10px}
.form-khach.dang-xem .truong > label{font-size:.72rem;letter-spacing:.05em;text-transform:uppercase;
  color:var(--chu-mo);font-weight:600;margin-bottom:0}
.thanh-luu{display:flex;justify-content:flex-end;gap:9px;padding:12px 0 4px;position:sticky;bottom:0;
  background:linear-gradient(transparent,var(--nen) 30%)}
.hop .thanh-luu{background:none;padding-top:4px}

/* ---- người phụ trách: chip ở dạng xem, danh sách tích ở dạng sửa ---- */
.chip-nguoi{display:inline-flex;align-items:center;gap:5px;padding:3px 10px;margin:0 6px 6px 0;border-radius:99px;
  background:var(--nen-2);border:1px solid var(--vien);font-size:.86rem}
.chip-nguoi small{font-size:.68rem;text-transform:uppercase;letter-spacing:.05em;color:var(--chu-mo);font-weight:700}
.chip-nguoi.chinh{background:#E9F0F8;border-color:#C2D4E8;color:#1B4C7D;font-weight:600}
.chip-nguoi.chinh small{color:#1B4C7D}
:root[data-giao-dien="toi"] .chip-nguoi.chinh{background:#16263A;border-color:#2F4D6E;color:#9EC6EE}
.ds-phu-trach{border:1px solid var(--vien);border-radius:9px;padding:6px 10px;max-height:240px;overflow:auto;
  background:var(--trang)}
.dong-phu-trach{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:5px 0;
  border-bottom:1px dashed var(--vien)}
.dong-phu-trach:last-of-type{border-bottom:none}
.dong-phu-trach label{display:flex;align-items:center;gap:7px;margin:0;font-weight:500;cursor:pointer}
.chon-chinh{font-size:.78rem;color:var(--chu-mo);font-weight:600 !important;white-space:nowrap}
.chon-chinh.khoa{opacity:.55;cursor:not-allowed}

/* bảng bán hàng 8 cột: giữ tên khách một dòng, gom bớt khoảng trống */
.bang-ban td,.bang-ban th{padding-left:10px;padding-right:10px}
.bang-ban td:first-child{min-width:150px}
.bang-ban td:first-child strong{white-space:nowrap}
.bang-ban td:nth-child(2){min-width:170px}

/* đang sửa thì nút "Sửa" không còn nghĩa — giấu đi */
.form-khach.dang-sua [data-bat-sua]{display:none}

/* ===== CRM vòng 2-4 (03/10/2026): việc tiếp theo · phễu · danh sách việc ===== */
.nhan-han{display:inline-block;padding:1px 8px;border-radius:10px;font-size:.74rem;font-weight:600;white-space:nowrap;
  background:var(--nen-2);color:var(--chu-mo)}
.nhan-han.qua{background:#FBE3E3;color:#A33636}
.nhan-han.nay{background:#FFF1D6;color:#8A5A00}
.nhan-han.sap{background:#E3F0FB;color:#1F5C8F}
:root[data-giao-dien="toi"] .nhan-han.qua{background:#4A2323;color:#F0A8A8}
:root[data-giao-dien="toi"] .nhan-han.nay{background:#45381B;color:#F2D08A}
:root[data-giao-dien="toi"] .nhan-han.sap{background:#1E3448;color:#A8CDEB}
.o-viec-tiep{max-width:220px}
.cat-dong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}
.the-viec-tiep{scroll-margin-top:84px}
.the-viec-tiep.den-han{border-left:3px solid #C8922F}
.viec-hien{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center}
.viec-hien > div{flex-basis:100%;font-size:.95rem}
.hang-hen{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:8px}
.hang-hen input[type=date]{width:auto;flex:0 0 auto}
.hang-hen input[type=text]{flex:1 1 180px;min-width:0}
.the-viec-tiep details summary{cursor:pointer;color:var(--chinh);margin-top:6px}
.pheu{display:flex;flex-direction:column;gap:10px;margin-top:6px}
.tang-pheu{display:grid;grid-template-columns:120px 1fr 110px;gap:10px;align-items:center;color:inherit;text-decoration:none}
.tang-pheu:hover{text-decoration:none}
.tang-pheu:hover .ten-tang{color:var(--chinh)}
.tang-pheu .ten-tang{font-size:.88rem}
.tang-pheu .thanh{height:22px;background:var(--nen-2);border-radius:6px;overflow:hidden}
.tang-pheu .thanh i{display:block;height:100%;border-radius:6px;background:var(--chinh)}
.tang-pheu .thanh i.buoc-0{opacity:.4}
.tang-pheu .thanh i.buoc-1{opacity:.6}
.tang-pheu .thanh i.buoc-2{opacity:.8}
.tang-pheu .thanh i.buoc-3{background:#2E8B57}
.tang-pheu .so-tang{text-align:right;font-variant-numeric:tabular-nums;line-height:1.15}
.tang-pheu .so-tang small{display:block;color:var(--chu-mo);font-size:.74rem}
.chan-pheu{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px;margin-top:14px;padding-top:10px;
  border-top:1px solid var(--vien);font-size:.88rem;font-weight:600}
.chip-phu{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.chip-phu a{font-size:.8rem;padding:3px 10px;border-radius:12px;background:var(--nen-2);color:var(--chu-mo)}
.ds-viec{list-style:none;margin:0;padding:0}
.ds-viec li{padding:9px 0;border-bottom:1px solid var(--vien)}
.ds-viec li:last-child{border-bottom:none}
.ds-viec li .nhan-han{margin-right:6px}
@media (max-width:640px){ .tang-pheu{grid-template-columns:92px 1fr 84px} }

/* ===== CRM vòng 5 (03/10/2026): báo cáo bán hàng ===== */
.bieu-do-cot{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:8px;align-items:end;height:220px;padding-top:6px}
.cot-thang{display:flex;flex-direction:column;align-items:center;height:100%;min-width:0}
.cot-thang .gia-tri-cot{font-size:.7rem;color:var(--chu-mo);height:16px;white-space:nowrap;font-variant-numeric:tabular-nums}
.cot-thang .ong{flex:1;width:100%;max-width:46px;display:flex;align-items:flex-end;border-bottom:1px solid var(--vien)}
.cot-thang .phan-ban{width:100%;background:rgba(18,57,95,.22);border-radius:5px 5px 0 0;display:flex;align-items:flex-end;overflow:hidden}
.cot-thang .phan-thu{width:100%;background:var(--chinh)}
.cot-thang .nhan-thang{font-size:.74rem;color:var(--chu-mo);margin-top:5px}
.cot-thang:hover .phan-ban{background:rgba(18,57,95,.32)}
:root[data-giao-dien="toi"] .cot-thang .phan-ban{background:rgba(160,195,230,.22)}
.chu-giai{display:inline-flex;align-items:center;gap:6px;font-weight:400}
.o-mau{display:inline-block;width:11px;height:11px;border-radius:3px;margin-left:8px}
.o-mau.ban{background:rgba(18,57,95,.22)}
.o-mau.thu{background:var(--chinh)}
.thanh-ty-le{height:4px;background:var(--nen-2);border-radius:3px;margin-top:4px;overflow:hidden}
.thanh-ty-le i{display:block;height:100%;background:var(--chinh);margin-left:auto}
.cham-mau{display:inline-block;width:10px;height:10px;border-radius:50%;vertical-align:middle}
.ds-top{margin:0;padding-left:22px}
.ds-top li{padding:7px 0;border-bottom:1px solid var(--vien);display:flex;flex-wrap:wrap;align-items:baseline;gap:4px}
.ds-top li:last-child{border-bottom:none}
.ds-top .so-top{margin-left:auto;font-weight:600;font-variant-numeric:tabular-nums}
@media (max-width:640px){ .bieu-do-cot{gap:3px;height:180px} .cot-thang .gia-tri-cot{font-size:.6rem} }

/* ===== CRM đợt 1 (03/10/2026): chi tiết lần bán, mốc việc, báo cáo khách, cổng khách ===== */
.bang-thong-tin th{width:34%;font-weight:500;color:var(--chu-mo);text-align:left;vertical-align:top;padding-right:12px}
.bang-thong-tin td,.bang-thong-tin th{padding:7px 0;border-bottom:1px solid var(--vien)}
/* v247: điện thoại — nhãn TRÊN giá trị (hàng nút yêu cầu gia hạn, ô chọn người phụ trách… không đẩy bảng tràn khỏi hộp) */
@media (max-width:640px){.bang-thong-tin th,.bang-thong-tin td{display:block;width:auto}.bang-thong-tin th{border-bottom:0;padding-bottom:0}}
.ds-moc{list-style:none;margin:0 0 10px;padding:0}
.ds-moc li{display:flex;align-items:flex-start;gap:10px;padding:9px 0;border-bottom:1px solid var(--vien)}
.ds-moc li:last-child{border-bottom:none}
.ds-moc .noi-moc{flex:1;min-width:0}
.ds-moc li.xong strong{text-decoration:line-through;color:var(--chu-mo)}
.o-tick{width:22px;height:22px;border-radius:6px;border:1.5px solid var(--chu-mo);background:var(--trang);
  color:#fff;font-size:.8rem;line-height:1;cursor:pointer;padding:0;flex-shrink:0;margin-top:1px}
.ds-moc li.xong .o-tick{background:#2E8B57;border-color:#2E8B57}
.the-bao-cao{border:1px solid var(--vien);border-radius:8px;padding:9px 12px;margin-bottom:8px;background:var(--trang)}
.the-bao-cao summary{cursor:pointer}
.the-thanh-toan{border-left:3px solid #C8922F}
.hang-thanh-toan{display:flex;gap:20px;align-items:flex-start;flex-wrap:wrap;padding:10px 0;border-bottom:1px solid var(--vien)}
.hang-thanh-toan:last-of-type{border-bottom:none}
.hang-thanh-toan > div{flex:1 1 280px;min-width:0}
.anh-qr{width:220px;height:auto;border-radius:10px;border:1px solid var(--vien);background:#fff}
@media (max-width:640px){ .anh-qr{width:180px} }
/* v281.1 (ông chủ 11/10: "chỗ QR đang có vấn đề — bị lệch khung"): thẻ thanh toán dạng .o (trang báo giá / phiếu thanh toán khách mở) —
   .hang-thanh-toan (vốn cho dòng trong tờ in: padding 10px 0 + gạch dưới) khai báo sau nên đè mất lề trong + viền của thẻ ⇒ chữ dính mép trái.
   Thẻ giữ lề như mọi .o, chữ canh giữa theo chiều cao ảnh QR. [hidden]: tài khoản khác khi khách tự chọn — display:flex từng làm hiện cả loạt. */
.o.hang-thanh-toan{padding:18px 20px;border:1px solid var(--vien);align-items:center}
.hang-thanh-toan[hidden]{display:none}
@media (max-width:640px){ .o.hang-thanh-toan{padding:14px} }

/* ===== Tài chính (đợt 2, 03/10/2026): giấy in phiếu / hoá đơn / đối chiếu, biểu đồ thu–chi ===== */
.giay-in{background:var(--trang);border:1px solid var(--vien);border-radius:10px;padding:26px 30px;max-width:860px}
.dau-giay{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-bottom:1px solid var(--vien);padding-bottom:12px}
.ten-giay{text-align:center;letter-spacing:.06em;text-transform:uppercase;margin:18px 0 14px;font-size:1.25rem}
.bang-giay{width:100%;border-collapse:collapse}
.bang-giay th,.bang-giay td{padding:7px 8px;border-bottom:1px solid var(--vien);vertical-align:top}
.bang-giay tbody th{width:28%;text-align:left;font-weight:500;color:var(--chu-mo)}
.bang-giay tfoot td{border-bottom:none}
.ky-ten{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:16px;margin-top:34px;text-align:center}
.ky-ten > div{display:flex;flex-direction:column;gap:56px}
.bieu-do-cot.doi .ong.doi{gap:3px;justify-content:center;border-bottom:1px solid var(--vien)}
.ong.doi .cot-thu,.ong.doi .cot-chi{width:42%;border-radius:4px 4px 0 0;align-self:flex-end}
.ong.doi .cot-thu{background:#2E8B57}
.ong.doi .cot-chi{background:#C0504D}
.o-mau.chi{background:#C0504D}
.chu-giai .o-mau.thu{background:#2E8B57}
@media print {
  header.tren-cung, nav.ben, .man-che, .khong-in, .bao, .chinh > .tren { display:none !important }
  .vo, .chinh { display:block !important; margin:0 !important; padding:0 !important; max-width:none !important }
  body { background:#fff !important; color:#000 !important }
  .giay-in { border:none; border-radius:0; padding:0; max-width:none }
  a.khong-in-lien-ket { color:inherit; text-decoration:none }
}

/* ===== CRM đợt 3 (03/10/2026): báo giá nhiều dòng, hợp đồng, trang khách mở từ link ===== */
.bang-dong-bg td{padding:6px 6px;vertical-align:middle}
.bang-dong-bg input,.bang-dong-bg select{width:100%;min-width:0}
.the-buoc{border-left:3px solid var(--chinh)}
.the-buoc .cung-dong{flex-wrap:wrap}
.noi-dung-hd{white-space:pre-line;line-height:1.65;font-size:.98rem}
body.trang-khach-xem{background:var(--nen);padding:28px 16px 60px}
.khung-xem{max-width:880px;margin:0 auto}
.khung-xem .giay-in{max-width:none}
@media (max-width:640px){ body.trang-khach-xem{padding:12px 8px 40px} .khung-xem .giay-in{padding:16px} }
@media print { body.trang-khach-xem{padding:0;background:#fff} }

/* ===== CRM đợt 4 (03/10/2026): lịch thuê tài sản ===== */
.lich-thue{border-collapse:collapse;font-size:.76rem;width:auto}
.lich-thue th,.lich-thue td{padding:0;border:1px solid var(--vien);text-align:center;min-width:24px;height:32px}
.lich-thue thead th{font-weight:500;color:var(--chu-mo);padding:4px 0}
.lich-thue .cot-ts{position:sticky;left:0;background:var(--trang);text-align:left;padding:4px 10px;min-width:160px;z-index:1}
.lich-thue .hom-nay{box-shadow:inset 0 0 0 2px rgba(200,146,47,.6)}
.o-thue{display:block;width:100%;height:100%;min-height:30px}
.o-thue.dat_truoc{background:rgba(31,92,143,.38)}
.o-thue.dang_thue{background:#2E8B57}
.o-thue.da_tra{background:#9AA5B1;opacity:.45}
.o-thue.qua-han{background:#C0504D}
.o-thue.khoa{background:repeating-linear-gradient(45deg,var(--nen-2),var(--nen-2) 4px,transparent 4px,transparent 8px)}
.o-thue.o-trong:hover{background:rgba(31,92,143,.12)}
.o-mau.dat{background:rgba(31,92,143,.38)}
.o-mau.thue{background:#2E8B57}
.o-mau.qua{background:#C0504D}
.o-mau.tra{background:#9AA5B1}

/* ===== Khách QUAN TÂM nhiều danh mục dịch vụ (03/10/2026): ô tích dạng viên thuốc ===== */
.ds-quan-tam{border:1px solid var(--vien);border-radius:9px;padding:8px 10px;background:var(--trang);max-height:260px;overflow:auto}
.nhom-quan-tam{font-size:.7rem;letter-spacing:.05em;text-transform:uppercase;color:var(--chu-mo);font-weight:700;margin:6px 0 4px}
.nhom-quan-tam:first-of-type{margin-top:0}
.cac-quan-tam{display:flex;flex-wrap:wrap;gap:6px}
.chon-quan-tam{display:inline-flex;align-items:center;gap:6px;margin:0;padding:4px 11px;border:1px solid var(--vien);
  border-radius:99px;font-weight:500;font-size:.86rem;cursor:pointer;background:var(--nen-2);user-select:none}
.chon-quan-tam input{margin:0;accent-color:#1B4C7D}
.chon-quan-tam:has(input:checked){background:#E9F0F8;border-color:#C2D4E8;color:#1B4C7D;font-weight:600}
:root[data-giao-dien="toi"] .chon-quan-tam:has(input:checked){background:#16263A;border-color:#2F4D6E;color:#9EC6EE}

/* ===== Khung cuộn ngang (03/10/2026, ông chủ: "cho scroll trong phạm vi giao diện") =====
   Bảng rộng hơn màn hình (lịch thuê 31 ngày, bảng báo cáo, công nợ…) cuộn NGANG ngay trong
   khung của nó — trước đây lớp này chưa có luật nên bảng tràn ra, kéo giãn cả trang trên điện thoại. */
.cuon-ngang{overflow-x:auto;max-width:100%;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.o{min-width:0}
.lich-thue .cot-ts{box-shadow:1px 0 0 var(--vien)}
@media (max-width:640px){ .lich-thue .cot-ts{min-width:118px;max-width:150px;white-space:normal} }
/* chuỗi dài không có chỗ ngắt (vân tay hợp đồng, mã) tự xuống dòng thay vì đẩy tràn trang */
.chinh code,.khung-xem code{overflow-wrap:anywhere;word-break:break-all}
.noi-dung-hd{overflow-x:auto;max-width:100%}

/* ===== HỢP ĐỒNG KIỂU WORD + KÝ BẰNG CÁCH VẼ (03/10/2026) ===== */
.noi-dung-hd.dang-html{white-space:normal;font-family:"Times New Roman",Times,serif;font-size:13pt;line-height:1.5}
.noi-dung-hd.dang-html p{margin:0 0 6pt}
.noi-dung-hd.dang-html h1{font-size:16pt;margin:6pt 0}
.noi-dung-hd.dang-html h2{font-size:15pt;margin:6pt 0}
.noi-dung-hd.dang-html h3{font-size:13.5pt;margin:6pt 0}
.noi-dung-hd.dang-html h1,.noi-dung-hd.dang-html h2,.noi-dung-hd.dang-html h3,.noi-dung-hd.dang-html h4{color:inherit}
.noi-dung-hd.dang-html ul,.noi-dung-hd.dang-html ol{margin:0 0 6pt 24px;padding:0}
.noi-dung-hd.dang-html table{border-collapse:collapse;width:100%;margin:4pt 0 8pt}
.noi-dung-hd.dang-html td,.noi-dung-hd.dang-html th{border:1px solid #8A8F96;padding:4px 7px;vertical-align:top}
.noi-dung-hd.dang-html th{background:rgba(0,0,0,.04)}
.noi-dung-hd.dang-html table.bang-ky td,.noi-dung-hd.dang-html table.khong-vien td,
.noi-dung-hd.dang-html table.bang-ky th,.noi-dung-hd.dang-html table.khong-vien th{border:none}
.trang-a4 table.bang-ky td,.trang-a4 table.khong-vien td{outline:1px dashed #D5DAE0}
.ma-truong{background:#FFF3D6;border:1px solid #E7C873;border-radius:4px;padding:0 3px;font-family:ui-monospace,Consolas,monospace;
  font-size:.8em;color:#7A5300;white-space:nowrap}
.o-chu-ky{display:inline-flex;flex-direction:column;align-items:center;min-width:180px;gap:1px;margin-top:2px;vertical-align:top}
.o-chu-ky img{width:200px;max-width:100%;height:auto}
.o-chu-ky .cho-ky{display:block;width:180px;height:84px}
.o-chu-ky.trong .cho-ky{border-bottom:1px dotted #9AA0A6}
.o-chu-ky .cho-ky.da-ky{height:auto;font-size:22pt;color:#2E8B57}
.o-chu-ky .ten-ky{font-size:12pt}
.o-chu-ky .chuc-ky{font-size:11pt}
.o-chu-ky .luc-ky{font:8.5pt Arial,sans-serif;color:#6B7280}
/* trình soạn */
.thanh-soan{position:sticky;top:var(--cao-tren);z-index:6;display:flex;flex-wrap:wrap;gap:6px;align-items:center;background:var(--trang);
  border:1px solid var(--vien);border-radius:10px;padding:6px 8px;margin-bottom:10px}
.thanh-soan .nhom-nut{display:inline-flex;border:1px solid var(--vien);border-radius:7px;overflow:hidden}
.thanh-soan .nhom-nut button{border:none;background:var(--trang);color:var(--chu);min-width:32px;height:30px;cursor:pointer;font-size:.92rem;padding:0 6px}
.thanh-soan .nhom-nut button+button{border-left:1px solid var(--vien)}
.thanh-soan .nhom-nut button:hover{background:var(--nen-2)}
.thanh-soan select{height:32px;width:auto;max-width:200px;padding:0 8px}
.thanh-soan .chi-hep{display:none}
.ban-soan{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:14px;align-items:start}
.nen-giay{background:#DDE2E7;border-radius:10px;padding:22px 12px;overflow-x:auto}
.trang-a4{background:#fff;color:#111;width:210mm;max-width:100%;min-height:297mm;margin:0 auto;padding:20mm 18mm 20mm 25mm;
  box-shadow:0 2px 14px rgba(0,0,0,.16);outline:none;box-sizing:border-box}
.trang-a4[contenteditable=true]:focus{box-shadow:0 0 0 2px rgba(31,92,143,.35),0 2px 14px rgba(0,0,0,.16)}
.ds-ma{position:sticky;top:calc(var(--cao-tren) + 58px);background:var(--trang);border:1px solid var(--vien);border-radius:10px;padding:12px;
  max-height:calc(100vh - 150px);overflow:auto}
.ds-ma h3{margin-bottom:4px}
.ds-ma ul{list-style:none;padding:0;margin:10px 0 0}
.ds-ma .ma-nut{display:flex;flex-direction:column;align-items:flex-start;gap:1px;width:100%;text-align:left;border:1px solid var(--vien);
  border-radius:7px;background:var(--trang);color:var(--chu);padding:5px 8px;margin-bottom:5px;cursor:pointer}
.ds-ma .ma-nut:hover{border-color:#C2D4E8;background:var(--nen-2)}
.ds-ma .ma-nut code{font-size:.76rem;color:#9A6A00;background:none;padding:0}
.ds-ma .ma-nut span{font-size:.8rem;color:var(--chu-mo)}
.ds-ma .ma-nut.ma-ky{border-color:#E7C873}
@media (max-width:1060px){ .ban-soan{grid-template-columns:minmax(0,1fr)} .ds-ma{display:none} .thanh-soan .chi-hep{display:inline-block} }
@media (max-width:640px){ .trang-a4{padding:14px 12px;min-height:0;font-size:12pt} .nen-giay{padding:8px 4px} .thanh-soan{position:static} }
/* ô vẽ chữ ký */
.o-ve-ky{margin-top:6px;max-width:520px}
.o-ve-ky .nhan-ve{font-weight:600;font-size:.86rem;margin-bottom:4px}
.o-ve-ky canvas{display:block;width:100%;height:180px;background:#fff;border:1.5px dashed #9FB3C8;border-radius:10px;touch-action:none;cursor:crosshair}
.o-ve-ky.da-ve canvas{border-style:solid;border-color:#1F5C8F}
.o-ve-ky.thieu canvas{border-color:#C0504D}
.o-ve-ky .ve-ky-duoi{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:4px}
.nhap-word label.nut{cursor:pointer}
@media print{
  .noi-dung-hd.dang-html{font-size:12.5pt;color:#000}
  .thanh-soan,.ds-ma{display:none}
  .nen-giay{background:none;padding:0}
  .trang-a4{box-shadow:none;width:auto;min-height:0;padding:0}
}
@media (max-width:640px){ .noi-dung-hd.dang-html{font-size:11.5pt} .o-chu-ky{min-width:130px} .o-chu-ky img{width:150px} }

/* ===== TOÀ NHÀ NHIỀU PHÒNG (03/10/2026): lọc tình trạng, sơ đồ phòng, nhóm toà · tầng ===== */
.loc-tt{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.chip-tt{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border:1px solid var(--vien);border-radius:99px;
  font-size:.84rem;color:var(--chu);background:var(--trang);text-decoration:none}
.chip-tt b{font-weight:700}
.chip-tt i{width:10px;height:10px;border-radius:3px;display:inline-block;border:1px solid var(--vien)}
.chip-tt.dang{border-color:var(--chinh);box-shadow:inset 0 0 0 1px var(--chinh);font-weight:600}
.chip-tt.tt-trong i{background:#fff}
.chip-tt.tt-dat_truoc i{background:rgba(31,92,143,.38)}
.chip-tt.tt-dang_thue i{background:#2E8B57}
.chip-tt.tt-qua_han i{background:#C0504D}
.chip-tt.tt-bao_tri i{background:repeating-linear-gradient(45deg,#C9CED4,#C9CED4 3px,#fff 3px,#fff 6px)}
.nhom-phong{padding:12px 14px}
.dau-nhom-phong{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.luoi-phong{display:grid;grid-template-columns:repeat(auto-fill,minmax(84px,1fr));gap:6px}
.o-phong{display:flex;flex-direction:column;justify-content:center;gap:1px;min-height:52px;padding:5px 7px;border-radius:8px;
  border:1px solid var(--vien);background:var(--trang);color:var(--chu);text-decoration:none;overflow:hidden}
.o-phong b{font-size:.86rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.o-phong span{font-size:.72rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.85}
.o-phong:hover{box-shadow:0 0 0 2px rgba(31,92,143,.35)}
.o-phong.tt-trong{border-style:dashed}
.o-phong.tt-dang_thue{background:#2E8B57;border-color:#2E8B57;color:#fff}
.o-phong.tt-qua_han{background:#C0504D;border-color:#C0504D;color:#fff}
.o-phong.tt-dat_truoc{background:rgba(31,92,143,.18);border-color:rgba(31,92,143,.45)}
.o-phong.tt-bao_tri{background:repeating-linear-gradient(45deg,var(--nen-2),var(--nen-2) 5px,transparent 5px,transparent 10px)}
.lich-thue .hang-nhom td{background:var(--nen-2);height:auto;padding:6px 10px;font-weight:600;font-size:.8rem;text-align:left}
.lich-thue .hang-nhom .cot-ts{background:var(--nen-2)}
.cac-khu{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.the-khu{display:flex;flex-direction:column;gap:3px;border:1px solid var(--vien);border-radius:10px;padding:10px 12px;background:var(--trang)}
@media (max-width:640px){ .luoi-phong{grid-template-columns:repeat(auto-fill,minmax(72px,1fr))} .o-phong{min-height:46px;padding:4px 6px} }

/* Lịch thuê: mỗi lần thuê một THANH liền có tên khách (03/10/2026) */
.lich-thue td.o-gop{padding:2px 1px}
.thanh-thue{display:block;height:28px;line-height:28px;padding:0 7px;border-radius:7px;color:#fff;font-size:.74rem;font-weight:600;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-decoration:none;text-align:left}
.thanh-thue.dang_thue{background:#2E8B57}
.thanh-thue.dat_truoc{background:#5B86B0}
.thanh-thue.da_tra{background:#9AA5B1}
.thanh-thue.qua-han{background:#C0504D}
.thanh-thue.noi-truoc{border-top-left-radius:0;border-bottom-left-radius:0}
.thanh-thue.noi-sau{border-top-right-radius:0;border-bottom-right-radius:0}
.thanh-thue:hover{filter:brightness(1.08);box-shadow:0 0 0 2px rgba(31,92,143,.35)}
/* cột cố định: mọi ngày rộng bằng nhau dù có thanh gộp nhiều ngày; mỗi tài sản một dòng gọn */
.lich-thue{table-layout:fixed;width:calc(170px + var(--so-ngay, 31) * 32px)}
.lich-thue .o-thue{height:30px;min-height:0}
.lich-thue thead th{width:32px}
.lich-thue thead th.cot-ts{width:170px}
.lich-thue tbody td.cot-ts{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:170px;padding:4px 10px}
.lich-thue tbody td.cot-ts .ten-ts{font-weight:400}
.lich-thue td,.lich-thue th{height:32px}
@media (max-width:640px){ .lich-thue{width:calc(118px + var(--so-ngay, 31) * 28px)} .lich-thue thead th.cot-ts{width:118px} .lich-thue tbody td.cot-ts{max-width:118px} .lich-thue thead th{width:28px} }
.the-khu.tom-tat{text-decoration:none;color:var(--chu)}
.the-khu.tom-tat:hover{border-color:#C2D4E8}
.thanh-lap{display:block;height:6px;border-radius:99px;background:var(--nen-2);overflow:hidden}
.thanh-lap i{display:block;height:100%;background:#2E8B57}

/* Gập / mở theo cấp con */
.lich-thue tr.hang-khu,.lich-thue tr.hang-cap{cursor:pointer;user-select:none}
.lich-thue tr.hang-khu td.cot-ts{background:#E3EAF2}
.lich-thue tr.hang-cap td.cot-ts{background:var(--nen-2);padding-left:20px}
.lich-thue tr.hang-khu:hover td.cot-ts,.lich-thue tr.hang-cap:hover td.cot-ts{background:#D9E6F3}
.lich-thue td.o-dem{padding:0;text-align:center;font-size:.7rem;font-weight:700;color:#1E5A3A;
  background:rgba(46,139,87,calc(var(--day, 0) * .75))}
.lich-thue tr.hang-khu td.o-dem{border-top:1px solid #C9D5E2}
.lich-thue td.o-dem.dam{color:#fff}
.mui-gap{display:inline-block;transition:transform .15s;color:var(--chu-mo)}
.lich-thue tr.hang-khu:not(.gap) .mui-gap,.lich-thue tr.hang-cap:not(.gap) .mui-gap,details.nhom-phong[open] .mui-gap{transform:rotate(90deg)}
details.nhom-phong > summary{list-style:none;cursor:pointer}
details.nhom-phong > summary::-webkit-details-marker{display:none}
details.nhom-phong:not([open]) .dau-nhom-phong{margin-bottom:0}

/* Bảng tài sản cho thuê: tên không bị bóp, cột số / loại / tình trạng một dòng (03/10/2026) */
.bang-tai-san td.cot-ten-ts{min-width:190px}
.bang-tai-san td.cot-ten-ts strong{white-space:nowrap}
.bang-tai-san td:nth-child(2){min-width:150px}
.bang-tai-san td:nth-child(n+3),.bang-tai-san th{white-space:nowrap}
.o.mong:has(.bang-tai-san){overflow-x:auto}

/* ===== ĐẶT THUÊ (đợt B): các bước bên trái, xem trước dính bên phải ===== */
.dat-thue [hidden]{display:none !important}
.dat-thue{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:14px;align-items:start}
.dat-thue-phai{position:sticky;top:calc(var(--cao-tren) + 12px);display:flex;flex-direction:column;gap:10px}
.so-buoc{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:var(--chinh);color:#fff;
  font-size:.8rem;margin-right:4px}
.chon-kieu{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.the-kieu{display:flex;flex-direction:column;gap:3px;border:1.5px solid var(--vien);border-radius:10px;padding:10px 12px 10px 34px;position:relative;cursor:pointer;margin:0}
.the-kieu input{position:absolute;left:11px;top:13px}
.the-kieu:has(input:checked){border-color:var(--chinh);background:#F4F8FC}
:root[data-giao-dien="toi"] .the-kieu:has(input:checked){background:#16263A}
.nut-chon{display:flex;flex-wrap:wrap;gap:6px}
.nut-chon label{display:inline-flex;align-items:center;gap:6px;margin:0;border:1px solid var(--vien);border-radius:99px;padding:5px 12px;font-weight:500;cursor:pointer}
.nut-chon label:has(input:checked){border-color:var(--chinh);background:#E9F0F8;color:#1B4C7D;font-weight:600}
.ds-don-vi{max-height:460px;overflow:auto;border:1px solid var(--vien);border-radius:10px;padding:4px 8px;background:var(--trang)}
.nhom-don-vi > summary{list-style:none;cursor:pointer;padding:7px 2px;border-bottom:1px dashed var(--vien)}
.nhom-don-vi > summary::-webkit-details-marker{display:none}
.nhom-don-vi[open] .mui-gap{transform:rotate(90deg)}
.dong-don-vi{display:flex;align-items:center;gap:8px;padding:5px 2px 5px 18px;margin:0;font-weight:400;cursor:pointer;border-bottom:1px solid var(--nen-2)}
.dong-don-vi .ten-don-vi{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dong-don-vi .gia-don-vi{width:130px;flex:none;padding:4px 8px;font-size:.84rem}
.dong-don-vi:has(input[type=checkbox]:checked){background:#F4F8FC}
:root[data-giao-dien="toi"] .dong-don-vi:has(input[type=checkbox]:checked){background:#16263A}
.xem-truoc-thue h2{margin-bottom:8px}
.tong-xem-truoc{margin-top:8px;padding-top:8px;border-top:1px solid var(--vien);font-size:1rem}
.nut.nut-lon{width:100%;padding:12px;font-size:1rem}
.ds-viec-thue{list-style:none;padding:0;margin:0}
.ds-viec-thue li{padding:6px 0;border-bottom:1px dashed var(--vien)}
.ds-viec-thue li:last-child{border-bottom:none}
.ds-gon{padding-left:18px;margin:0}
.ds-gon li{margin:3px 0}
tr.dong-sap-toi td{background:var(--nen-2)}
@media (max-width:900px){ .dat-thue{grid-template-columns:minmax(0,1fr)} .dat-thue-phai{position:static} .chon-kieu{grid-template-columns:1fr} }

/* Menu của tôi */
.ds-xep-menu{list-style:none;padding:0;margin:0;counter-reset:mn}
.ds-xep-menu li{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid var(--vien);border-radius:10px;
  padding:9px 12px;margin-bottom:8px;background:var(--trang);counter-increment:mn}
.ds-xep-menu li .ten-nhom-menu::before{content:counter(mn) ". ";color:var(--chu-mo)}
.ds-xep-menu li .ten-nhom-menu{font-weight:600}

/* ===== KHÁCH SẠN (v81, 03/10/2026): lễ tân · lịch theo giờ · buồng phòng · bảng giá ===== */
.chon-ks{margin:0 0 14px}
.trong-ks{text-align:center;padding:26px 12px}
.trong-ks h2{margin:0 0 6px}
.the-so-ks{grid-template-columns:repeat(auto-fit,minmax(130px,1fr))}
.cham-ks{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;border:1px solid var(--vien-dam);vertical-align:-1px}
.cham-ks.tt-trong{background:var(--trang);border-style:dashed}
.cham-ks.tt-sap_den{background:rgba(31,92,143,.38)}
.cham-ks.tt-co_khach{background:#2E8B57;border-color:#2E8B57}
.cham-ks.tt-qua_gio{background:#C0504D;border-color:#C0504D}
.cham-ks.tt-cho_don{background:#E0A43A;border-color:#E0A43A}
.cham-ks.tt-dang_don{background:repeating-linear-gradient(45deg,#E0A43A,#E0A43A 3px,transparent 3px,transparent 6px)}
.cham-ks.tt-bao_tri{background:repeating-linear-gradient(45deg,#C9CED4,#C9CED4 3px,transparent 3px,transparent 6px)}
.ds-ks li{display:flex;align-items:center;justify-content:space-between;gap:10px}
.ds-ks li form{flex-shrink:0;margin:0}
.nhom-phong-ks{padding:12px 14px}
button.o-phong{font:inherit;text-align:left;cursor:pointer;width:100%}
.luoi-ks{grid-template-columns:repeat(auto-fill,minmax(104px,1fr))}
.luoi-ks .o-phong{min-height:62px}
.o-phong .gio-ks{font-weight:600;opacity:1}
.o-phong.tt-sap_den{background:rgba(31,92,143,.16);border-color:rgba(31,92,143,.5)}
.o-phong.tt-co_khach{background:#2E8B57;border-color:#2E8B57;color:#fff}
.o-phong.tt-qua_gio{background:#C0504D;border-color:#C0504D;color:#fff}
.o-phong.tt-cho_don{background:rgba(224,164,58,.18);border-color:#E0A43A}
.ks-tt{display:grid;grid-template-columns:auto 1fr;gap:6px 14px;margin:0}
.ks-tt dt{color:var(--chu-mo);font-size:.86rem}
.ks-tt dd{margin:0;font-weight:600}
.nhan.tt-ks-trong{background:var(--nen-2)}
.nhan.tt-ks-sap_den{background:rgba(31,92,143,.16);border-color:rgba(31,92,143,.4)}
.nhan.tt-ks-co_khach{background:#2E8B57;border-color:#2E8B57;color:#fff}
.nhan.tt-ks-qua_gio{background:#C0504D;border-color:#C0504D;color:#fff}
.nhan.tt-ks-cho_don{background:rgba(224,164,58,.2);border-color:#E0A43A}
.nut-chon label{display:inline-flex;align-items:center;gap:6px;margin-right:12px;font-weight:500}
/* Lịch theo giờ: hàng = phòng, 24 cột giờ vẽ bằng nền; thanh lượt khách định vị theo % ngày */
.dieu-huong-ngay{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dieu-huong-ngay form{margin:0}
.lich-gio{min-width:calc(120px + 24 * 38px)}
.hang-gio{display:flex;border-bottom:1px solid var(--vien)}
.ten-gio{flex:0 0 120px;padding:5px 8px;display:flex;flex-direction:column;justify-content:center;border-right:1px solid var(--vien);
  position:sticky;left:0;background:var(--trang);z-index:2;min-height:36px}
.ten-gio b{font-size:.86rem}
.ten-gio small{font-size:.7rem;color:var(--chu-mo);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.dai-gio{position:relative;flex:1;min-height:36px;cursor:copy;
  background-image:repeating-linear-gradient(to right,var(--vien) 0 1px,transparent 1px calc(100% / 24))}
.dai-gio.bao-tri{cursor:not-allowed;background-color:var(--nen-2)}
.dau-gio .ten-gio{font-weight:600;font-size:.78rem;color:var(--chu-mo)}
.dau-gio .dai-gio{cursor:default;background-image:none}
.dau-gio .dai-gio span{position:absolute;top:50%;transform:translate(3px,-50%);font-size:.72rem;color:var(--chu-mo)}
.nhom-gio{padding:6px 10px;background:var(--nen-2);font-weight:600;font-size:.8rem;border-bottom:1px solid var(--vien);position:sticky;left:0}
.vach-nay{position:absolute;top:0;bottom:0;width:2px;background:#C0504D;z-index:1;pointer-events:none}
.thanh-gio{position:absolute;top:4px;bottom:4px;border-radius:6px;padding:0 6px;display:flex;align-items:center;overflow:hidden;
  font-size:.72rem;text-decoration:none;color:var(--chu);border:1px solid transparent;z-index:1;min-width:6px}
.thanh-gio span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.thanh-gio.cat-trai{border-top-left-radius:0;border-bottom-left-radius:0}
.thanh-gio.cat-phai{border-top-right-radius:0;border-bottom-right-radius:0}
.thanh-gio.tt-dat_truoc,.thanh-mau.tt-dat_truoc{background:rgba(31,92,143,.2);border-color:rgba(31,92,143,.5)}
.thanh-gio.tt-dang_thue,.thanh-mau.tt-dang_thue{background:#2E8B57;color:#fff}
.thanh-gio.tt-qua_gio,.thanh-mau.tt-qua_gio{background:#C0504D;color:#fff}
.thanh-gio.tt-da_tra,.thanh-mau.tt-da_tra{background:var(--nen-2);border-color:var(--vien-dam);color:var(--chu-mo)}
.chip-tt i.thanh-mau{width:18px;border-radius:4px}
/* Buồng phòng */
.ba-cot-ks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;align-items:start}
.the-buong{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:9px 0;border-top:1px solid var(--vien)}
.the-buong form{margin:0}
@media (max-width:900px){ .ba-cot-ks{grid-template-columns:1fr} }
/* Bảng giá phòng */
.hang-4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
@media (max-width:640px){ .hang-4{grid-template-columns:1fr 1fr} }
.bang-hang-phong td,.bang-hang-phong th{vertical-align:top}
.bang-hang-phong{min-width:880px}
.bang-hang-phong td:first-child{min-width:150px}
.bang-hang-phong td:nth-child(2){min-width:220px}
.bang-hang-phong .cung-dong{flex-wrap:nowrap}
.bang-hang-phong form{margin:0}
.tang-gan{border-top:1px solid var(--vien);padding:10px 0}
.dau-tang-gan{justify-content:space-between;margin-bottom:8px}
.dau-tang-gan label{display:inline-flex;align-items:center;gap:6px;font-weight:500}
.luoi-gan{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:6px}
.o-gan{display:flex;align-items:center;gap:6px;border:1px solid var(--vien);border-radius:8px;padding:4px 6px;font-weight:500}
.o-gan b{flex:0 0 auto;font-size:.84rem}
.o-gan select{flex:1;min-width:0;padding:4px 6px}
/* Menu CRM: ẩn / hiện nhóm, mục trong nhóm */
.ds-xep-menu li.nhom-an{opacity:.55}
.ds-xep-menu li.nhom-an .ten-nhom-menu{text-decoration:line-through}
.hien-nhom{display:inline-flex;align-items:center;gap:4px;font-weight:500;margin-right:4px}
.ds-xep-cty > li{display:block}
.ds-xep-cty .dau-xep{display:flex;align-items:center;justify-content:space-between;gap:10px}
.ds-xep-muc{list-style:none;margin:8px 0 0;padding:0 0 0 14px;border-left:2px solid var(--vien)}
.ds-xep-muc li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:4px 0;border:0;border-top:1px dashed var(--vien);
  border-radius:0;margin:0;background:transparent;counter-increment:none}
.ds-xep-muc li:first-child{border-top:0}
.ds-xep-muc li.nhom-an > span:first-child{text-decoration:line-through;opacity:.6}
.bieu-muc{display:inline-flex;vertical-align:-2px;color:var(--chu-mo)}
.ds-co-dinh{padding:6px 12px;border:1px dashed var(--vien);border-radius:10px;margin:8px 0}

/* ===== CƠ HỘI BÁN HÀNG · NGƯỜI LIÊN HỆ · MÃ SỐ THUẾ (v82, 03/10/2026) ===== */
.bang-ch{display:grid;grid-template-columns:repeat(5,minmax(220px,1fr)) repeat(2,minmax(130px,.55fr));gap:10px;align-items:start;min-width:1420px}   /* v323.24: 5 giai đoạn mở (v281 thêm Chờ thanh toán) + Thắng / Thua — trước khai 4 nên "Chờ thanh toán" bị ép hẹp */
.cot-ch{background:var(--nen-2);border:1px solid var(--vien);border-radius:12px;padding:8px;min-height:180px;transition:box-shadow .12s}
.cot-ch.tha-vao{box-shadow:0 0 0 2px var(--chinh) inset;background:rgba(31,92,143,.07)}
.dau-cot-ch{padding:2px 4px 8px}
.dau-cot-ch b{margin-left:4px}
.ds-the-ch{display:flex;flex-direction:column;gap:7px}
.trong-cot{padding:8px 4px;margin:0}
.the-ch{background:var(--trang);border:1px solid var(--vien);border-radius:10px;padding:8px 10px;cursor:grab;display:flex;flex-direction:column;gap:3px}
.the-ch:hover{box-shadow:0 1px 6px rgba(12,39,64,.12)}
.the-ch.dang-keo{opacity:.45}
.the-ch.tre{border-left:3px solid #C0504D}
.the-ch .ten-ch{font-weight:600;color:var(--chu);text-decoration:none;line-height:1.3}
.the-ch .khach-ch{text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.the-ch .so-ch{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.the-ch .chan-ch{display:flex;align-items:center;gap:6px;justify-content:space-between}
.nut-tien-ch{margin:0}
.nut-tien-ch .nut{padding:1px 8px;line-height:1.4}
.the-ch .nut-the-ch{display:flex;justify-content:flex-end;gap:4px;flex-wrap:wrap;margin-top:2px}   /* v323.23 */
.the-ch .nut-thang-ch{color:#1E6B3E}
.the-ch .nut-thang-ch:hover{border-color:#2E8B57;color:#1E6B3E;background:rgba(46,139,87,.08)}
.the-ch .nut-thua-ch{color:#A33636}
.the-ch .nut-thua-ch:hover{border-color:#C0504D;color:#A33636;background:rgba(192,80,77,.08)}
/* v323.24: hộp xác nhận / ô lý do NẰM TRONG dòng chảy (không nổi) — thẻ ở trong khung cuộn ngang, hộp nổi dễ bị cắt / tràn màn điện thoại */
.hop-tai-cho > summary{list-style:none;cursor:pointer}
.hop-tai-cho[open]{order:9;flex-basis:100%;min-width:0}
.hop-tai-cho .xoa-nham-o{position:static;width:auto;box-shadow:none;margin-top:6px;padding:8px;display:grid;gap:6px;text-align:left;cursor:auto}
.hop-tai-cho .xoa-nham-o input[name="ly_do"]{width:100%;margin:0;box-sizing:border-box}
.hop-tai-cho .xoa-nham-o .nut{justify-self:end;white-space:normal;max-width:100%;text-align:center;height:auto}
.the-ch .hop-tai-cho[open] > summary{width:100%;box-sizing:border-box;text-align:center}
.the-ch .hop-tai-cho[open] > .nut-thua-ch{border-color:#C0504D}
.the-ch .hop-tai-cho[open] > .nut-thang-ch{border-color:#2E8B57}
.nut-xn-thang{background:#2E8B57;border-color:#2E8B57}
.nut-xn-thua{background:#C0504D;border-color:#C0504D}
.tn-the-nut .tn-ly-do{flex:1 1 100%;width:100%;margin:0 0 6px;box-sizing:border-box}
.cot-chot{min-height:140px;border-style:dashed}
.chot-thang.tha-vao{box-shadow:0 0 0 2px #2E8B57 inset;background:rgba(46,139,87,.08)}
.chot-thua.tha-vao{box-shadow:0 0 0 2px #C0504D inset;background:rgba(192,80,77,.08)}
.thanh-gd-ch{display:flex;flex-wrap:wrap;gap:6px;padding:10px}
.buoc-gd-ch{margin:0;flex:1 1 120px}
.buoc-gd-ch > button,.buoc-gd-ch > summary{display:block;box-sizing:border-box;text-align:center;width:100%;font:inherit;font-size:.86rem;padding:8px 6px;border-radius:8px;border:1px solid var(--vien);background:var(--trang);color:var(--chu);cursor:pointer}
.buoc-gd-ch > button:hover:not(:disabled),.buoc-gd-ch > summary:hover{border-color:var(--chinh)}
.buoc-gd-ch.qua > button{background:rgba(31,92,143,.10)}
.buoc-gd-ch.dang > button{background:var(--chinh);color:#fff;border-color:var(--chinh);font-weight:600;cursor:default}
.buoc-gd-ch.gd-thang.dang > button{background:#2E8B57;border-color:#2E8B57}
.buoc-gd-ch.gd-thua.dang > button{background:#C0504D;border-color:#C0504D}
.buoc-gd-ch > button:disabled{cursor:default}
.buoc-gd-ch.gd-thua[open] > summary{border-color:#C0504D;color:#A33636}
.the-co-hoi-bdk{display:flex;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:10px 0 6px;padding:8px 10px;border:1px dashed var(--vien-dam);
  border-radius:10px;text-decoration:none;color:var(--chu);font-size:.88rem}
.the-co-hoi-bdk:hover{border-color:var(--chinh)}
.ds-lien-he{list-style:none;margin:0;padding:0}
.ds-lien-he li{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding:9px 0;border-top:1px solid var(--vien)}
.ds-lien-he li:first-child{border-top:0}
.ds-lien-he form{margin:0}
.o-mst{display:flex;gap:6px;align-items:center}
.o-mst input{flex:1;min-width:0}
.form-khach.dang-sua .o-mst{display:flex !important}
.kq-mst{margin-top:4px;min-height:1em}

/* ===== GỘP KHÁCH TRÙNG · BÁO CÁO THEO NGUỒN (v83, 03/10/2026) ===== */
.nhom-trung{padding:12px 14px}
.bang-trung{min-width:760px}
.bang-trung td{vertical-align:top}
.thanh-trung{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.thanh-trung form{margin:0}
.bang-gop{min-width:620px}
.bang-gop th,.bang-gop td{vertical-align:top;padding:8px 10px;border-bottom:1px solid var(--vien)}
.bang-gop thead th{text-align:left;min-width:200px}
.bang-gop tbody th{text-align:left;white-space:nowrap;color:var(--chu-mo);font-weight:500}
.bang-gop .cot-giu{background:rgba(46,139,87,.09)}
.bang-gop tr.dong-khac td{background:rgba(224,164,58,.12)}
.bang-gop tr.dong-khac td.cot-giu{background:rgba(46,139,87,.16)}
.chon-giu,.chon-bo{display:flex;align-items:center;gap:6px;font-weight:600;margin-bottom:4px}
.chon-bo{font-weight:500}
.luat-gop{margin:12px 0;padding-left:18px}
.luat-gop li{margin-bottom:4px}
.bang-nguon{min-width:760px}

/* ===== PHIẾU TRẢ HÀNG · HẠN MỨC CÔNG NỢ (v84, 03/10/2026) ===== */
.phieu-tra .chon-kieu{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px}
.xem-tra{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:12px 0;padding:10px 12px;border:1px dashed var(--vien-dam);border-radius:10px}
.xem-tra b{font-size:1.1rem}
.o-hoan{border:1px solid var(--vien);border-radius:10px;padding:10px 12px;background:var(--nen-2)}
.bang-tra{min-width:860px}
.bang-tra td{vertical-align:top}
.the-han-muc.vuot{border-color:#C0504D;box-shadow:0 0 0 1px rgba(192,80,77,.25) inset}
@media (max-width:640px){ .xem-tra{grid-template-columns:1fr} }

/* ==========================================================================
   MÀU MENU TRÁI CỦA TỪNG NGƯỜI (v85, 03/10/2026 — ông chủ: "màu sắc tươi sinh động theo style của chúng ta").
   Mỗi bộ màu chỉ khai biến --mm-*; luật dùng chung bên dưới. Cùng biến tô ô xem trước ở "Menu của tôi".
   ĐẬM: nền chuyển màu, chữ trắng · SÁNG: nền nhạt tươi, nhấn màu · CẦU VỒNG: mỗi nhóm menu một màu.
   ========================================================================== */
[data-mau-menu]{--mm-nen1:var(--trang);--mm-nen2:var(--trang);--mm-chu:var(--chu);--mm-nhom:var(--chu-mo);--mm-bieu:var(--chu-mo);
  --mm-hover:var(--nen-2);--mm-dang-nen:var(--nen-2);--mm-dang-chu:var(--chinh);--mm-vien:var(--vien);--mm-dang-vach:transparent}
/* ---- đậm: chữ trắng ---- */
[data-mau-menu="thuong_hieu"],[data-mau-menu="bien"],[data-mau-menu="ngoc"],[data-mau-menu="hoang_hon"],[data-mau-menu="tim"],[data-mau-menu="dem"]{
  --mm-chu:rgba(255,255,255,.92);--mm-bieu:rgba(255,255,255,.85);--mm-nhom:rgba(255,255,255,.62);--mm-hover:rgba(255,255,255,.12);
  --mm-dang-nen:rgba(255,255,255,.22);--mm-dang-chu:#fff;--mm-vien:rgba(255,255,255,.16)}
:root{--th-chinh:#12395F;--th-nhan:#C8922F}   /* v137: màu thương hiệu công ty — vo-dau.ejs đặt lại theo Cài đặt › Thương hiệu */
[data-mau-menu="thuong_hieu"]{--mm-dang-vach:var(--th-nhan)}
[data-mau-menu="bien"]{--mm-nen1:#0B57C4;--mm-nen2:#1E90E8;--mm-nhom:#BFE3FF}
[data-mau-menu="ngoc"]{--mm-nen1:#0B6E5F;--mm-nen2:#14A88C;--mm-nhom:#C7F5E8}
[data-mau-menu="hoang_hon"]{--mm-nen1:#E2553A;--mm-nen2:#D63F7A;--mm-nhom:#FFE0C7}
[data-mau-menu="tim"]{--mm-nen1:#4E33B8;--mm-nen2:#8B5CF6;--mm-nhom:#E3D7FF}
[data-mau-menu="dem"]{--mm-nen1:#0E131C;--mm-nen2:#243048;--mm-nhom:#8FB4E8;--mm-bieu:#8FB4E8;--mm-dang-vach:#8FB4E8}
/* ---- sáng tươi: nền nhạt, mục đang mở tô đặc màu nhấn ---- */
[data-mau-menu="nang"]{--mm-nen1:#FFF3D1;--mm-nen2:#FFFCF4;--mm-nhom:#B7791F;--mm-bieu:#C8922F;--mm-hover:rgba(200,146,47,.14);
  --mm-dang-nen:#F2B53C;--mm-dang-chu:#3D2A00;--mm-vien:#F1DFB0}
[data-mau-menu="troi"]{--mm-nen1:#E3F0FF;--mm-nen2:#F8FBFF;--mm-nhom:#1E6FD9;--mm-bieu:#1E6FD9;--mm-hover:rgba(30,111,217,.10);
  --mm-dang-nen:#1E6FD9;--mm-dang-chu:#fff;--mm-vien:#CFE3FB}
[data-mau-menu="la"]{--mm-nen1:#E1F5E8;--mm-nen2:#F7FCF8;--mm-nhom:#23854D;--mm-bieu:#2E8B57;--mm-hover:rgba(46,139,87,.12);
  --mm-dang-nen:#2E8B57;--mm-dang-chu:#fff;--mm-vien:#C9EAD5}
[data-mau-menu="dao"]{--mm-nen1:#FFE6EE;--mm-nen2:#FFF8FA;--mm-nhom:#C93767;--mm-bieu:#E0497A;--mm-hover:rgba(224,73,122,.11);
  --mm-dang-nen:#E0497A;--mm-dang-chu:#fff;--mm-vien:#F8D3DF}
/* ---- cầu vồng: nền trắng, mỗi nhóm một màu nhấn ---- */
[data-mau-menu="cau_vong"]{--mm-ac:#12395F;--mm-nen1:#FFFFFF;--mm-nen2:#F6F8FC;--mm-nhom:var(--mm-ac);--mm-bieu:var(--mm-ac);
  --mm-hover:rgba(18,57,95,.07);--mm-dang-nen:var(--mm-ac);--mm-dang-chu:#fff}
[data-mau-menu="cau_vong"] .nhom-menu,[data-mau-menu="cau_vong"] .xm-2,[data-mau-menu="cau_vong"] .xm-3{--mm-nhom:var(--mm-ac);--mm-bieu:var(--mm-ac);
  --mm-dang-nen:var(--mm-ac);--mm-hover:color-mix(in srgb, var(--mm-ac) 12%, transparent)}
[data-mau-menu="cau_vong"] .nm-0{--mm-ac:#1E6FD9}
[data-mau-menu="cau_vong"] .nm-1,[data-mau-menu="cau_vong"] .xm-2{--mm-ac:#2E8B57}
[data-mau-menu="cau_vong"] .nm-2,[data-mau-menu="cau_vong"] .xm-3{--mm-ac:#E2553A}
[data-mau-menu="cau_vong"] .nm-3{--mm-ac:#8B5CF6}
[data-mau-menu="cau_vong"] .nm-4{--mm-ac:#D63F7A}
[data-mau-menu="cau_vong"] .nm-5{--mm-ac:#C8922F}
/* ---- chế độ TỐI: bộ sáng đổi sang nền tối pha màu, giữ màu nhấn ---- */
:root[data-giao-dien="toi"] [data-mau-menu="nang"]{--mm-nen1:#2A2214;--mm-nen2:#1A2029;--mm-nhom:#E3B45C;--mm-bieu:#E3B45C;--mm-vien:#3A3122;--mm-dang-nen:#E3B45C;--mm-dang-chu:#2A1C00}
:root[data-giao-dien="toi"] [data-mau-menu="troi"]{--mm-nen1:#132338;--mm-nen2:#1A2029;--mm-nhom:#7FB2E8;--mm-bieu:#7FB2E8;--mm-vien:#22344B;--mm-dang-nen:#3C82D8}
:root[data-giao-dien="toi"] [data-mau-menu="la"]{--mm-nen1:#13291D;--mm-nen2:#1A2029;--mm-nhom:#7FD3A2;--mm-bieu:#7FD3A2;--mm-vien:#21402F;--mm-dang-nen:#2E8B57}
:root[data-giao-dien="toi"] [data-mau-menu="dao"]{--mm-nen1:#2E1720;--mm-nen2:#1A2029;--mm-nhom:#F29BB8;--mm-bieu:#F29BB8;--mm-vien:#47242F;--mm-dang-nen:#D63F7A}
:root[data-giao-dien="toi"] [data-mau-menu="cau_vong"]{--mm-nen1:#1A2029;--mm-nen2:#161B23;--mm-chu:var(--chu);--mm-hover:rgba(255,255,255,.06)}
/* ---- luật dùng chung cho cột trái ---- */
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]){background:linear-gradient(180deg,var(--mm-nen1),var(--mm-nen2));border-right-color:var(--mm-vien)}
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]) .nhom{color:var(--mm-nhom)}
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]) a{color:var(--mm-chu)}
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]) .bieu{color:var(--mm-bieu);opacity:1}
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]) a:hover{background:var(--mm-hover);color:var(--mm-chu)}
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]) a.dang{background:var(--mm-dang-nen);color:var(--mm-dang-chu);
  box-shadow:inset 3px 0 0 var(--mm-dang-vach)}
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]) a.dang .bieu{color:var(--mm-dang-chu)}
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]) .duoi{border-top-color:var(--mm-vien)}
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]) .doi-nn{border-color:var(--mm-vien);background:transparent}
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]) .doi-nn button{color:var(--mm-chu)}
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]) .doi-nn button.dang{background:var(--mm-dang-nen);color:var(--mm-dang-chu)}
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]) .ngan-nn{background:var(--mm-vien)}
.vo.thu .ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]) .nhom{background:var(--mm-vien);color:transparent}
.ben .nhom-menu{display:flex;flex-direction:column;gap:1px}
/* ---- ô xem trước trong "Menu của tôi" ---- */
.luoi-mau-menu{display:grid;grid-template-columns:repeat(auto-fill,minmax(122px,1fr));gap:10px}
.o-mau-menu{display:flex;flex-direction:column;gap:6px;cursor:pointer;font-weight:500}
.o-mau-menu input{position:absolute;opacity:0;pointer-events:none}
.xem-mau-menu{display:flex;flex-direction:column;gap:5px;height:96px;padding:10px 9px;border-radius:12px;border:1px solid var(--vien);
  background:linear-gradient(180deg,var(--mm-nen1),var(--mm-nen2));transition:transform .1s, box-shadow .1s}
.xem-mau-menu i{display:block;border-radius:4px}
.xem-mau-menu .xm-nhom{height:5px;width:45%;background:var(--mm-nhom);opacity:.9;margin-top:2px}
.xem-mau-menu .xm-dong{height:9px;width:88%;background:var(--mm-hover);box-shadow:inset 10px 0 0 var(--mm-bieu)}
.xem-mau-menu .xm-dong.dang{background:var(--mm-dang-nen);box-shadow:inset 3px 0 0 var(--mm-dang-vach)}
.o-mau-menu:hover .xem-mau-menu{transform:translateY(-1px);box-shadow:0 2px 8px rgba(12,39,64,.12)}
.o-mau-menu input:checked + .xem-mau-menu{box-shadow:0 0 0 3px var(--chinh);border-color:var(--chinh)}
.o-mau-menu input:focus-visible + .xem-mau-menu{outline:2px solid var(--chinh);outline-offset:2px}
.ten-mau-menu{font-size:.84rem;text-align:center}
.o-mau-menu input:checked ~ .ten-mau-menu{font-weight:700;color:var(--chinh)}

/* ==========================================================================
   MÀU RIÊNG TỪNG NHÓM MENU (v86, 03/10/2026). Nhóm có màu: biểu tượng các mục thành Ô VUÔNG TÔ MÀU (nét trắng) — đọc rõ trên
   mọi bộ màu nền (trắng, đậm, tối); tên nhóm có chấm màu; mục đang mở có vạch + nền pha màu nhóm.
   ========================================================================== */
.ben .nhom-menu.co-mau .bieu{background:var(--mn-mau);color:#fff !important;border-radius:7px;width:24px;height:24px;opacity:1;flex-shrink:0}
.ben .nhom-menu.co-mau .nhom{display:flex;align-items:center;gap:6px}
.ben .nhom-menu.co-mau .nhom::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--mn-mau);flex-shrink:0}
.ben .nhom-menu.co-mau a,.ben .nhom-menu.co-mau .muc{padding-top:6px;padding-bottom:6px}
.ben .nhom-menu.co-mau a:hover{background:color-mix(in srgb, var(--mn-mau) 12%, transparent)}
.ben .nhom-menu.co-mau a.dang{background:color-mix(in srgb, var(--mn-mau) 16%, transparent);box-shadow:inset 3px 0 0 var(--mn-mau);font-weight:700}
.ben[data-mau-menu="mac_dinh"] .nhom-menu.co-mau a.dang,.ben[data-mau-menu="nang"] .nhom-menu.co-mau a.dang,
.ben[data-mau-menu="troi"] .nhom-menu.co-mau a.dang,.ben[data-mau-menu="la"] .nhom-menu.co-mau a.dang,
.ben[data-mau-menu="dao"] .nhom-menu.co-mau a.dang,.ben[data-mau-menu="cau_vong"] .nhom-menu.co-mau a.dang{color:var(--mn-mau)}
.ben[data-mau-menu="mac_dinh"] .nhom-menu.co-mau .nhom,.ben[data-mau-menu="nang"] .nhom-menu.co-mau .nhom,
.ben[data-mau-menu="troi"] .nhom-menu.co-mau .nhom,.ben[data-mau-menu="la"] .nhom-menu.co-mau .nhom,
.ben[data-mau-menu="dao"] .nhom-menu.co-mau .nhom,.ben[data-mau-menu="cau_vong"] .nhom-menu.co-mau .nhom{color:var(--mn-mau)}
:root[data-giao-dien="toi"] .ben .nhom-menu.co-mau a.dang{color:#fff}
.vo.thu .ben .nhom-menu.co-mau .nhom::before{display:none}
.vo.thu .ben .nhom-menu.co-mau a{justify-content:center}
/* ô chọn màu trên dòng nhóm ở "Menu của tôi" */
.chon-mau-nhom{position:relative}
.chon-mau-nhom summary{list-style:none;display:inline-flex;align-items:center;gap:5px;cursor:pointer;padding:3px 8px;border:1px solid var(--vien);
  border-radius:8px;background:var(--trang);user-select:none}
.chon-mau-nhom summary::-webkit-details-marker{display:none}
.chon-mau-nhom[open] summary{border-color:var(--chinh)}
.cham-mau-nhom{display:inline-block;width:16px;height:16px;border-radius:5px;border:1px solid rgba(0,0,0,.08);vertical-align:middle}
.cham-mau-nhom.khong-mau{background:linear-gradient(to top right,transparent calc(50% - 1.5px),#C0504D calc(50% - 1.5px),#C0504D calc(50% + 1.5px),transparent calc(50% + 1.5px)),var(--trang);border-color:var(--vien-dam)}
.bang-mau-nhom{position:absolute;right:0;top:calc(100% + 6px);z-index:40;display:grid;grid-template-columns:repeat(7,26px);gap:6px;padding:10px;
  background:var(--trang);border:1px solid var(--vien);border-radius:12px;box-shadow:0 8px 24px rgba(12,39,64,.16)}
.bang-mau-nhom label{display:flex;cursor:pointer}
.bang-mau-nhom input{position:absolute;opacity:0;pointer-events:none}
.bang-mau-nhom .cham-mau-nhom{width:26px;height:26px;border-radius:8px}
.bang-mau-nhom input:checked + .cham-mau-nhom{box-shadow:0 0 0 2px var(--trang),0 0 0 4px var(--chinh)}
.bang-mau-nhom label:hover .cham-mau-nhom{transform:scale(1.08)}
@media (max-width:640px){ .ds-xep-menu li{flex-wrap:wrap} .bang-mau-nhom{right:auto;left:0} }
/* v88: ô "Theo công ty" trong bảng màu riêng — chữ CT trên màu công ty */
.bang-mau-nhom .o-theo-cty .cham-mau-nhom{display:flex;align-items:center;justify-content:center;font-size:.62rem;font-weight:800;font-style:normal;
  color:#fff;letter-spacing:.02em}
.bang-mau-nhom .o-theo-cty .cham-mau-nhom.khong-mau{color:var(--chu-mo)}

/* ==========================================================================
   DẢI MÀU TRẠNG THÁI (v89, 04/10/2026 — ông chủ: "những trạng thái → sử dụng dải màu cho đẹp").
   Thanh lọc trạng thái = viên thuốc, MỖI trạng thái MỘT tông (cùng tông với nhãn .nhan trong bảng):
   đang chọn = tô đặc; số 0 = mờ đi (vẫn bấm được). Tông: xam lam troi ngoc xanh vang cam do hong tim nau navy.
   Một biến --c cho mỗi tông; nền / viền pha từ --c nên chế độ tối tự đúng.
   ========================================================================== */
.day-tt{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}
.day-tt .nhan-day{font-size:.84rem;color:var(--chu-mo);margin-right:2px}
.chip-tt{--c:#5B6878;display:inline-flex;align-items:center;gap:6px;padding:5px 13px;border-radius:999px;font-size:.84rem;font-weight:600;
  line-height:1.3;white-space:nowrap;text-decoration:none;color:var(--c);border:1px solid color-mix(in srgb,var(--c) 40%,#fff);
  background:color-mix(in srgb,var(--c) 8%,#fff);transition:background .12s,border-color .12s,box-shadow .12s,transform .1s}
.chip-tt b{font-weight:700;font-variant-numeric:tabular-nums}
.chip-tt:hover{background:color-mix(in srgb,var(--c) 16%,#fff);border-color:var(--c);color:var(--c);text-decoration:none;transform:translateY(-1px)}
.chip-tt.dang,.chip-tt.dang:hover{background:var(--c);border-color:var(--c);color:#fff;box-shadow:0 2px 8px color-mix(in srgb,var(--c) 38%,transparent)}
.chip-tt.rong:not(.dang){opacity:.45}
.chip-tt.rong:not(.dang):hover{opacity:.8}
.chip-tt:focus-visible{outline:2px solid var(--c);outline-offset:2px}
.chip-tt.xam{--c:#5B6878}.chip-tt.lam{--c:#1E6FD9}.chip-tt.troi{--c:#0E8AC4}.chip-tt.ngoc{--c:#0F9F87}.chip-tt.xanh{--c:#2E8B57}
.chip-tt.vang{--c:#B7791F}.chip-tt.cam{--c:#E2553A}.chip-tt.do{--c:#C0392B}.chip-tt.hong{--c:#D63F7A}.chip-tt.tim{--c:#7C4DEB}
.chip-tt.nau{--c:#8B5E3C}.chip-tt.navy{--c:#12395F}
:root[data-giao-dien="toi"] .chip-tt{background:color-mix(in srgb,var(--c) 16%,transparent);border-color:color-mix(in srgb,var(--c) 55%,transparent);
  color:color-mix(in srgb,var(--c) 45%,#fff)}
:root[data-giao-dien="toi"] .chip-tt:hover{background:color-mix(in srgb,var(--c) 26%,transparent);color:color-mix(in srgb,var(--c) 35%,#fff)}
:root[data-giao-dien="toi"] .chip-tt.dang{background:var(--c);color:#fff}
:root[data-giao-dien="toi"] .chip-tt.navy{--c:#4C7DB8}
:root[data-giao-dien="toi"] .chip-tt.xam{--c:#7D8A9B}
/* nhãn trạng thái trong bảng — thêm tông cho đủ dải */
.nhan.troi{background:#E3F4FC;border-color:#B3DDF2;color:#0B5F87}
.nhan.ngoc{background:#E2F6F1;border-color:#B2E2D7;color:#0B6E5F}
.nhan.tim{background:#F1ECFE;border-color:#D8CBFA;color:#5631B8}
.nhan.hong{background:#FDEBF2;border-color:#F4C5D7;color:#A3285A}
:root[data-giao-dien="toi"] .nhan.troi{background:#12303F;border-color:#245A73;color:#9CD6F2}
:root[data-giao-dien="toi"] .nhan.ngoc{background:#11302A;border-color:#22594D;color:#8FDCCB}
:root[data-giao-dien="toi"] .nhan.tim{background:#251C3E;border-color:#46377A;color:#C9B8FA}
:root[data-giao-dien="toi"] .nhan.hong{background:#35192A;border-color:#6A2F4C;color:#F2A9C6}

/* ==========================================================================
   VÒNG 1 NÂNG GIAO DIỆN (v92, 04/10/2026 — ông chủ: "dễ sử dụng · thông minh khoa học · đẹp mặt").
   Nền chung cho MỌI trang mọi phân hệ: bảng không bị cắt cột, thông báo nổi tự tắt, nút gửi chống bấm hai lần,
   avatar chữ cái, ô bắt buộc có dấu *, trang trống có hình, thanh cuộn mảnh, viền focus rõ cho người dùng bàn phím.
   ========================================================================== */
/* ---- bảng: rộng hơn khung thì cuộn ngang (trước bị cắt mất cột bên phải), dòng sáng khi rê chuột ---- */
.o.mong{overflow-x:auto;overflow-y:hidden}
.o.mong > table{min-width:100%}
tbody tr{transition:background-color .12s}
tbody tr:hover > td{background:color-mix(in srgb,var(--chinh) 4%,transparent)}
tbody tr:last-child > td{border-bottom:0}
:root[data-giao-dien="toi"] tbody tr:hover > td{background:rgba(255,255,255,.035)}

/* ---- thông báo nổi (sau khi lưu / lỗi): góc trên phải, có nút đóng; báo thành công tự tắt ---- */
.bao-noi{position:fixed;top:calc(var(--cao-tren) + 12px);right:16px;z-index:60;display:flex;flex-direction:column;gap:8px;
  max-width:min(460px,calc(100vw - 32px));pointer-events:none}
.bao-noi .bao{pointer-events:auto;display:flex;align-items:flex-start;gap:10px;margin:0;padding:12px 12px 12px 16px;
  box-shadow:0 12px 32px rgba(12,39,64,.18);border-radius:12px;animation:bao-vao .25s ease-out;line-height:1.45}
.bao-noi .bao::before{content:'';flex:none;width:20px;height:20px;margin-top:1px;border-radius:50%;background:currentColor;
  -webkit-mask:var(--bao-hinh) center/14px no-repeat;mask:var(--bao-hinh) center/14px no-repeat}
.bao-noi .bao.ok{--bao-hinh:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3'%3E%3Cpath d='m5 12 5 5 9-10'/%3E%3C/svg%3E")}
.bao-noi .bao.loi{--bao-hinh:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3'%3E%3Cpath d='M12 6v8M12 18v.5'/%3E%3C/svg%3E")}
.bao-noi .bao.nhac{--bao-hinh:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='3'%3E%3Cpath d='M12 11v7M12 6v.5'/%3E%3C/svg%3E")}
.bao-noi .bao .bao-chu{flex:1;min-width:0}
.bao-noi .dong-bao{flex:none;border:0;background:transparent;color:inherit;opacity:.55;font-size:1.2rem;line-height:1;cursor:pointer;padding:0 4px}
.bao-noi .dong-bao:hover{opacity:1}
.bao-noi .bao.tat{animation:bao-ra .3s ease-in forwards}
@keyframes bao-vao{from{opacity:0;transform:translateY(-8px) scale(.98)}to{opacity:1;transform:none}}
@keyframes bao-ra{to{opacity:0;transform:translateX(24px)}}

/* ---- nút gửi đang chạy: vòng xoay + không bấm lần hai (đơn / phiếu không bị lập đôi) ---- */
.dang-gui{position:relative;pointer-events:none;opacity:.8}
.dang-gui::after{content:'';display:inline-block;width:.9em;height:.9em;margin-left:8px;vertical-align:-.12em;border-radius:50%;
  border:2px solid currentColor;border-right-color:transparent;animation:xoay .7s linear infinite}
@keyframes xoay{to{transform:rotate(360deg)}}

/* ---- avatar chữ cái (khách hàng, nhân viên, tài khoản) — màu cố định theo tên ---- */
.co-anh{display:flex;align-items:center;gap:10px;min-width:0}
.co-anh > div{min-width:0}
td:has(> .co-anh){min-width:220px}
.anh-chu{--ac:#12395F;flex:none;width:34px;height:34px;border-radius:50%;display:inline-grid;place-items:center;
  font-size:.8rem;font-weight:800;letter-spacing:.02em;color:#fff;background:linear-gradient(135deg,var(--ac),color-mix(in srgb,var(--ac) 55%,#fff));
  box-shadow:0 1px 3px rgba(12,39,64,.18)}
.anh-chu.lon{width:52px;height:52px;font-size:1.1rem}

/* ---- ô bắt buộc: dấu * đỏ cạnh nhãn (biết ngay phải điền gì trước khi bấm Lưu) ---- */
.truong > label:has(+ input[required]:not([type=hidden])),.truong > label:has(+ select[required]),.truong > label:has(+ textarea[required]){}
.truong > label:has(+ input[required]:not([type=hidden]))::after,.truong > label:has(+ select[required])::after,
.truong > label:has(+ textarea[required])::after{content:' *';color:#C0392B;font-weight:700}

/* ---- trang / bảng trống: có hình, không còn một dòng chữ xám trơ trọi ---- */
.trong::before{content:'';display:block;width:52px;height:52px;margin:0 auto 12px;border-radius:16px;
  background:color-mix(in srgb,var(--chinh) 10%,transparent);
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 13h5l1.5 3h5L16 13h5'/%3E%3Cpath d='M5.5 5h13L21 13v6H3v-6z'/%3E%3C/svg%3E") center/30px no-repeat,linear-gradient(#000,#000);
  -webkit-mask-composite:xor;mask-composite:exclude}
.trong{color:var(--chu-mo);line-height:1.5}

/* ---- thanh cuộn mảnh, hợp tông; viền focus rõ khi dùng bàn phím (Tab) ---- */
*{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--chu-mo) 35%,transparent) transparent}
*::-webkit-scrollbar{width:9px;height:9px}
*::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--chu-mo) 30%,transparent);border-radius:9px;border:2px solid transparent;background-clip:padding-box}
*::-webkit-scrollbar-thumb:hover{background-color:color-mix(in srgb,var(--chu-mo) 55%,transparent)}
a:focus-visible,button:focus-visible,.nut:focus-visible,summary:focus-visible{outline:2px solid var(--chinh);outline-offset:2px;border-radius:6px}

/* ---- thẻ số liệu: nhấc nhẹ khi rê chuột (thẻ bấm được) ---- */
a.o-so{transition:transform .12s,box-shadow .12s,border-color .12s}
a.o-so:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(12,39,64,.1);text-decoration:none}

/* ---- trang hiện ra mượt (tắt khi người dùng chọn giảm chuyển động) ---- */
/* v285.1 (ông chủ chụp menu "+ Lập báo giá ▾" bị ô Tỷ lệ chốt đè): `backwards`, KHÔNG `both` — `both` giữ transform của hiệu ứng sau khi chạy xong
   ⇒ mỗi khối con thành LỚP XẾP CHỒNG vĩnh viễn, khối sau vẽ đè menu thả xuống của khối trước (z-index trong khối không thoát ra được) */
.chinh > *{animation:trang-vao .22s ease-out backwards}
@keyframes trang-vao{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.chinh > *,.bao-noi .bao,tbody tr{animation:none !important;transition:none !important}}

/* ---- NÚT GỌN (ông chủ 04/10/2026: "mấy cái nút đừng để to đùng 1 cục, nhìn ghê lắm") ----
   Một cỡ chuẩn 36px (nhỏ 30px), chữ gọn, bo nhẹ; nút chính nổi bằng MÀU chứ không bằng kích thước.
   Bỏ kiểu nút kéo kín cả khung (đăng nhập, đổi mật khẩu, PIN, lập phiếu thuê…). */
.nut{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;padding:0 14px;border-radius:8px;
  font-size:.87rem;line-height:1.2;white-space:nowrap;vertical-align:middle;transition:background-color .12s,border-color .12s,box-shadow .12s}
.nut:not(.vien):not(:disabled){box-shadow:0 1px 2px rgba(12,39,64,.14)}
.nut.vien{border-color:var(--vien-dam)}
.nut.vien:hover{border-color:var(--chinh)}
.nut.nho{min-height:30px;padding:0 10px;font-size:.8rem;border-radius:7px}
.nut svg{flex:none}
.nut.nut-lon{width:auto;min-height:40px;padding:0 22px;font-size:.92rem}
.the-dn form > .nut[type=submit],.the-dn > .nut,.the-dn p > .nut{display:flex;width:auto !important;min-width:150px;margin:6px 0 0 auto}
.ben .nut-soan{width:auto;margin:4px 8px 14px;padding:8px 18px 8px 14px;border-radius:999px;font-size:.88rem;
  box-shadow:0 2px 8px rgba(12,39,64,.16);justify-content:flex-start}
@media (max-width:760px){.nut{min-height:38px}}

/* ==========================================================================
   TÌM NHANH TOÀN HỆ THỐNG — Ctrl+K (v93, vòng 2 nâng giao diện). Nút trên thanh đầu + hộp tìm giữa màn.
   ========================================================================== */
.nut-tim-nhanh{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 8px 0 12px;min-width:220px;border-radius:9px;
  border:1px solid var(--vien);background:var(--nen-2);color:var(--chu-mo);font:inherit;font-size:.86rem;cursor:pointer;margin-right:4px}
.nut-tim-nhanh:hover{border-color:var(--chinh);color:var(--chinh)}
.nut-tim-nhanh .chu{flex:1;text-align:left}
kbd{display:inline-block;min-width:18px;padding:1px 5px;border-radius:5px;border:1px solid var(--vien);border-bottom-width:2px;background:var(--trang);
  color:var(--chu-mo);font:600 .7rem/1.4 ui-monospace,Consolas,monospace;text-align:center}
@media (max-width:1100px){.nut-tim-nhanh{min-width:0}.nut-tim-nhanh .chu,.nut-tim-nhanh kbd{display:none}}
.tim-nhanh{border:0;padding:0;border-radius:16px;width:min(640px,calc(100vw - 24px));max-height:min(620px,calc(100vh - 80px));margin-top:9vh;
  background:var(--trang);color:var(--chu);box-shadow:0 30px 90px rgba(6,20,36,.45);overflow:hidden}
.tim-nhanh[open]{display:flex;flex-direction:column}
.tim-nhanh::backdrop{background:rgba(6,20,36,.5);backdrop-filter:blur(2px)}
.tn-o{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--vien);color:var(--chu-mo)}
.tn-o input{flex:1;border:0 !important;outline:0 !important;box-shadow:none !important;background:transparent;font-size:1.05rem;padding:4px 0;color:var(--chu)}
.tn-kq{overflow-y:auto;padding:6px 8px 10px;flex:1}
.tn-nhom{padding:10px 10px 4px;font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--chu-mo)}
.tn-muc{display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:10px;color:var(--chu);cursor:pointer;text-decoration:none}
.tn-muc:hover{text-decoration:none;color:var(--chu)}
.tn-muc.dang{background:color-mix(in srgb,var(--chinh) 10%,transparent)}
.tn-muc .tn-bieu{flex:none;width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:var(--nen-2);color:var(--chinh)}
.tn-muc.dang .tn-bieu{background:var(--chinh);color:#fff}
.tn-muc .tn-chu{flex:1;min-width:0}
.tn-muc .tn-ten{display:block;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tn-muc .tn-phu{display:block;font-size:.8rem;color:var(--chu-mo);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tn-muc mark{background:color-mix(in srgb,#C8922F 30%,transparent);color:inherit;border-radius:3px;padding:0 1px}
.tn-trong{padding:28px 10px;text-align:center;color:var(--chu-mo)}
.tn-chan{display:flex;gap:16px;padding:9px 16px;border-top:1px solid var(--vien);background:var(--nen-2);font-size:.76rem;color:var(--chu-mo)}
.hop-phim-tat{width:min(440px,calc(100vw - 24px))}
.tn-phim{padding:20px 22px}
.tn-phim dl{display:grid;grid-template-columns:auto 1fr;gap:10px 16px;margin:0;align-items:center}
.tn-phim dt{white-space:nowrap}
.tn-phim dd{margin:0;color:var(--chu-mo);font-size:.9rem}

/* ---- CỘT TRÁI THU GỌN (v96, 04/10/2026 — ông chủ chụp: "cái gì thế này") ----
   v92 đổi nút Soạn thư thành viên thuốc nhưng quên chế độ thu gọn → thành khối tròn to; tên nhóm có màu lòi nửa chữ;
   biểu tượng nhóm tô màu thành một cột ô đặc nặng nề. Thu gọn: nút soạn = ô vuông 40px gọn, tên nhóm = một vạch mảnh,
   biểu tượng màu nhóm nhạt (nền pha màu), mục đang mở mới tô đặc. */
.vo.thu .ben .nut-soan{width:40px;height:40px;min-height:0;padding:0;margin:4px auto 12px;border-radius:12px;justify-content:center;gap:0}
.vo.thu .ben .nut-soan .bieu{margin:0}
.vo.thu .ben .nhom-menu .nhom,.vo.thu .ben[data-mau-menu] .nhom-menu.co-mau .nhom{display:block;height:1px;min-height:0;margin:10px 10px;padding:0;
  overflow:hidden;font-size:0;line-height:0;color:transparent !important;background:var(--vien)}
.vo.thu .ben .nhom-menu.co-mau .nhom{background:color-mix(in srgb,var(--mn-mau) 45%,transparent)}
.vo.thu .ben .nhom-menu.co-mau a,.vo.thu .ben .nhom-menu.co-mau .muc{padding:5px 0}
.vo.thu .ben .nhom-menu.co-mau .bieu{width:32px;height:32px;border-radius:9px;background:color-mix(in srgb,var(--mn-mau) 14%,transparent);color:var(--mn-mau) !important}
.vo.thu .ben .nhom-menu.co-mau a:hover .bieu{background:color-mix(in srgb,var(--mn-mau) 24%,transparent)}
.vo.thu .ben .nhom-menu.co-mau a.dang{background:transparent;box-shadow:none}
.vo.thu .ben .nhom-menu.co-mau a.dang .bieu{background:var(--mn-mau);color:#fff !important;box-shadow:0 2px 8px color-mix(in srgb,var(--mn-mau) 40%,transparent)}
:root[data-giao-dien="toi"] .vo.thu .ben .nhom-menu.co-mau .bieu{background:color-mix(in srgb,var(--mn-mau) 28%,transparent);color:#fff !important}

/* ==========================================================================
   BỘ MÀU MENU KIỂU GOOGLE (v98, 04/10/2026 — ông chủ: "style này xấu quá → học kiểu Google cho màu sắc tinh tế").
   Material 3 như Gmail / Drive: nền PHẲNG tông rất nhạt, chữ + biểu tượng xám đậm dịu, mục đang mở là VIÊN THUỐC nền
   tông nhạt + chữ đậm cùng tông. Bỏ nền chuyển màu, bỏ chữ trắng trên nền gắt. Mã bộ màu giữ nguyên (đã lưu theo
   người / công ty) — các luật dưới đè dáng cũ của v85 (đứng sau, cùng độ ưu tiên).
   ========================================================================== */
[data-mau-menu]:not([data-mau-menu="mac_dinh"]){--mm-chu:#1F1F1F;--mm-hover:rgba(68,71,70,.08);--mm-vien:rgba(0,0,0,.06);--mm-dang-vach:transparent}
[data-mau-menu="bien"]{--mm-nen1:#F8FAFD;--mm-nen2:#F8FAFD;--mm-nhom:#1A73E8;--mm-dang-nen:#D3E3FD;--mm-dang-chu:#041E49;--mm-bieu:#444746;--mm-chu:#1F1F1F;--mm-hover:rgba(68,71,70,.08);--mm-vien:rgba(0,0,0,.06)}
[data-mau-menu="troi"]{--mm-nen1:#F3F9FD;--mm-nen2:#F3F9FD;--mm-nhom:#00639B;--mm-dang-nen:#C2E7FF;--mm-dang-chu:#001D35;--mm-bieu:#41474D;--mm-chu:#1F1F1F;--mm-hover:rgba(68,71,70,.08);--mm-vien:rgba(0,0,0,.06)}
[data-mau-menu="ngoc"]{--mm-nen1:#F4FBF9;--mm-nen2:#F4FBF9;--mm-nhom:#00796B;--mm-dang-nen:#BDEFE1;--mm-dang-chu:#00382D;--mm-bieu:#3F4946;--mm-chu:#1F1F1F;--mm-hover:rgba(68,71,70,.08);--mm-vien:rgba(0,0,0,.06)}
[data-mau-menu="la"]{--mm-nen1:#F5FAF3;--mm-nen2:#F5FAF3;--mm-nhom:#2E7D32;--mm-dang-nen:#C8EDBD;--mm-dang-chu:#0D3A0B;--mm-bieu:#424940;--mm-chu:#1F1F1F;--mm-hover:rgba(68,71,70,.08);--mm-vien:rgba(0,0,0,.06)}
[data-mau-menu="nang"]{--mm-nen1:#FFFBF0;--mm-nen2:#FFFBF0;--mm-nhom:#8A6D00;--mm-dang-nen:#FFE18A;--mm-dang-chu:#3B2F00;--mm-bieu:#4A4639;--mm-chu:#1F1F1F;--mm-hover:rgba(68,71,70,.08);--mm-vien:rgba(0,0,0,.06)}
[data-mau-menu="hoang_hon"]{--mm-nen1:#FFF8F5;--mm-nen2:#FFF8F5;--mm-nhom:#B3541E;--mm-dang-nen:#FFDBCB;--mm-dang-chu:#3A1300;--mm-bieu:#52443D;--mm-chu:#1F1F1F;--mm-hover:rgba(68,71,70,.08);--mm-vien:rgba(0,0,0,.06)}
[data-mau-menu="dao"]{--mm-nen1:#FFF7F8;--mm-nen2:#FFF7F8;--mm-nhom:#B0275A;--mm-dang-nen:#FFD9E1;--mm-dang-chu:#3F0019;--mm-bieu:#524345;--mm-chu:#1F1F1F;--mm-hover:rgba(68,71,70,.08);--mm-vien:rgba(0,0,0,.06)}
[data-mau-menu="tim"]{--mm-nen1:#FAF7FF;--mm-nen2:#FAF7FF;--mm-nhom:#6750A4;--mm-dang-nen:#E8DEF8;--mm-dang-chu:#21005D;--mm-bieu:#49454F;--mm-chu:#1F1F1F;--mm-hover:rgba(68,71,70,.08);--mm-vien:rgba(0,0,0,.06)}
/* v137 "Thương hiệu công ty": pha từ màu chính / màu nhấn của CHÍNH công ty đang dùng (mặc định navy + vàng đồng như trước) */
[data-mau-menu="thuong_hieu"]{--mm-nen1:color-mix(in srgb,var(--th-chinh) 4%,#fff);--mm-nen2:color-mix(in srgb,var(--th-chinh) 4%,#fff);
  --mm-nhom:color-mix(in srgb,var(--th-nhan) 76%,#000);--mm-dang-nen:color-mix(in srgb,var(--th-chinh) 15%,#fff);
  --mm-dang-chu:color-mix(in srgb,var(--th-chinh) 70%,#000);--mm-bieu:color-mix(in srgb,var(--th-chinh) 45%,#4A4A4A);--mm-chu:#1F1F1F;
  --mm-hover:rgba(68,71,70,.08);--mm-vien:rgba(0,0,0,.06)}
[data-mau-menu="cau_vong"]{--mm-nen1:#FAFAFB;--mm-nen2:#FAFAFB;--mm-nhom:#5F6368;--mm-dang-nen:#E8EAED;--mm-dang-chu:#1F1F1F;--mm-bieu:#444746;--mm-chu:#1F1F1F;--mm-hover:rgba(68,71,70,.08);--mm-vien:rgba(0,0,0,.06)}
[data-mau-menu="dem"]{--mm-nen1:#1F2023;--mm-nen2:#1F2023;--mm-chu:#E3E3E3;--mm-nhom:#9AA0A6;--mm-bieu:#C4C7C5;--mm-hover:rgba(255,255,255,.08);--mm-dang-nen:#004A77;--mm-dang-chu:#C2E7FF;--mm-vien:rgba(255,255,255,.08)}
:root[data-giao-dien="toi"] [data-mau-menu="bien"]{--mm-nen1:#1B1C1F;--mm-nen2:#1B1C1F;--mm-nhom:#A8C7FA;--mm-dang-nen:#004A77;--mm-dang-chu:#D3E3FD;--mm-chu:#E3E3E3;--mm-bieu:#C4C7C5;--mm-hover:rgba(255,255,255,.07);--mm-vien:rgba(255,255,255,.07)}
:root[data-giao-dien="toi"] [data-mau-menu="troi"]{--mm-nen1:#191C1E;--mm-nen2:#191C1E;--mm-nhom:#8ECDFF;--mm-dang-nen:#004B73;--mm-dang-chu:#C2E7FF;--mm-chu:#E3E3E3;--mm-bieu:#C4C7C5;--mm-hover:rgba(255,255,255,.07);--mm-vien:rgba(255,255,255,.07)}
:root[data-giao-dien="toi"] [data-mau-menu="ngoc"]{--mm-nen1:#191C1B;--mm-nen2:#191C1B;--mm-nhom:#80D5C4;--mm-dang-nen:#005142;--mm-dang-chu:#BDEFE1;--mm-chu:#E3E3E3;--mm-bieu:#C4C7C5;--mm-hover:rgba(255,255,255,.07);--mm-vien:rgba(255,255,255,.07)}
:root[data-giao-dien="toi"] [data-mau-menu="la"]{--mm-nen1:#1A1C19;--mm-nen2:#1A1C19;--mm-nhom:#9AD58A;--mm-dang-nen:#22501E;--mm-dang-chu:#C8EDBD;--mm-chu:#E3E3E3;--mm-bieu:#C4C7C5;--mm-hover:rgba(255,255,255,.07);--mm-vien:rgba(255,255,255,.07)}
:root[data-giao-dien="toi"] [data-mau-menu="nang"]{--mm-nen1:#1E1B16;--mm-nen2:#1E1B16;--mm-nhom:#E9C349;--mm-dang-nen:#574500;--mm-dang-chu:#FFE18A;--mm-chu:#E3E3E3;--mm-bieu:#C4C7C5;--mm-hover:rgba(255,255,255,.07);--mm-vien:rgba(255,255,255,.07)}
:root[data-giao-dien="toi"] [data-mau-menu="hoang_hon"]{--mm-nen1:#201A17;--mm-nen2:#201A17;--mm-nhom:#FFB68F;--mm-dang-nen:#6E2E0B;--mm-dang-chu:#FFDBCB;--mm-chu:#E3E3E3;--mm-bieu:#C4C7C5;--mm-hover:rgba(255,255,255,.07);--mm-vien:rgba(255,255,255,.07)}
:root[data-giao-dien="toi"] [data-mau-menu="dao"]{--mm-nen1:#201A1B;--mm-nen2:#201A1B;--mm-nhom:#FFB1C5;--mm-dang-nen:#6F1F3B;--mm-dang-chu:#FFD9E1;--mm-chu:#E3E3E3;--mm-bieu:#C4C7C5;--mm-hover:rgba(255,255,255,.07);--mm-vien:rgba(255,255,255,.07)}
:root[data-giao-dien="toi"] [data-mau-menu="tim"]{--mm-nen1:#1D1B20;--mm-nen2:#1D1B20;--mm-nhom:#D0BCFF;--mm-dang-nen:#4F378B;--mm-dang-chu:#E8DEF8;--mm-chu:#E3E3E3;--mm-bieu:#C4C7C5;--mm-hover:rgba(255,255,255,.07);--mm-vien:rgba(255,255,255,.07)}
:root[data-giao-dien="toi"] [data-mau-menu="thuong_hieu"]{--mm-nen1:#1A1D22;--mm-nen2:#1A1D22;--mm-nhom:color-mix(in srgb,var(--th-nhan) 80%,#fff);
  --mm-dang-nen:color-mix(in srgb,var(--th-chinh) 60%,#1A1D22);--mm-dang-chu:color-mix(in srgb,var(--th-chinh) 12%,#fff);--mm-chu:#E3E3E3;--mm-bieu:#C4C7C5;
  --mm-hover:rgba(255,255,255,.07);--mm-vien:rgba(255,255,255,.07)}
:root[data-giao-dien="toi"] [data-mau-menu="cau_vong"]{--mm-nen1:#1B1C1F;--mm-nen2:#1B1C1F;--mm-nhom:#9AA0A6;--mm-dang-nen:#3C4043;--mm-dang-chu:#E8EAED;--mm-chu:#E3E3E3;--mm-bieu:#C4C7C5;--mm-hover:rgba(255,255,255,.07);--mm-vien:rgba(255,255,255,.07)}
:root[data-giao-dien="toi"] [data-mau-menu="dem"]{--mm-nen1:#131314;--mm-nen2:#131314}
/* dáng chung: nền phẳng, mục là viên thuốc, mục mở chữ đậm (không vạch trái, không bóng) */
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]){background:var(--mm-nen1)}
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]) a{border-radius:999px;font-weight:500}
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]) a.dang{font-weight:700;box-shadow:none}
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]) .nhom{font-weight:600}
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]) .nut-soan{background:var(--mm-dang-nen);color:var(--mm-dang-chu);box-shadow:0 1px 3px rgba(60,64,67,.15),0 4px 8px rgba(60,64,67,.1)}
.ben[data-mau-menu]:not([data-mau-menu="mac_dinh"]) .nut-soan:hover{filter:brightness(.97);box-shadow:0 2px 4px rgba(60,64,67,.2),0 6px 12px rgba(60,64,67,.12)}
/* Đa sắc: mỗi nhóm một tông nhạt riêng (xanh · lá · cam · tím · hồng · ngọc) */
[data-mau-menu="cau_vong"] .nhom-menu{--mm-nhom:var(--mm-ac);--mm-bieu:var(--mm-ac);--mm-dang-nen:color-mix(in srgb,var(--mm-ac) 17%,#fff);
  --mm-dang-chu:color-mix(in srgb,var(--mm-ac) 75%,#000);--mm-hover:color-mix(in srgb,var(--mm-ac) 8%,transparent)}
[data-mau-menu="cau_vong"] .nm-0{--mm-ac:#1A73E8}[data-mau-menu="cau_vong"] .nm-1,[data-mau-menu="cau_vong"] .xm-2{--mm-ac:#188038}
[data-mau-menu="cau_vong"] .nm-2,[data-mau-menu="cau_vong"] .xm-3{--mm-ac:#E37400}[data-mau-menu="cau_vong"] .nm-3{--mm-ac:#9334E6}
[data-mau-menu="cau_vong"] .nm-4{--mm-ac:#D01884}[data-mau-menu="cau_vong"] .nm-5{--mm-ac:#129EAF}
:root[data-giao-dien="toi"] [data-mau-menu="cau_vong"] .nhom-menu{--mm-dang-nen:color-mix(in srgb,var(--mm-ac) 32%,#1B1C1F);--mm-dang-chu:#fff}
/* ô xem trước trong "Menu của tôi": giống một cột Gmail thu nhỏ */
.xem-mau-menu{background:var(--mm-nen1);border:1px solid var(--vien);border-radius:14px;gap:6px;padding:12px 10px}
.xem-mau-menu .xm-nhom{height:4px;width:38%;border-radius:4px;background:var(--mm-nhom);opacity:.8;margin:2px 0 0 4px}
.xem-mau-menu .xm-dong{height:12px;width:92%;border-radius:999px;background:transparent;
  box-shadow:inset 22px 0 0 transparent,inset 30px 0 0 color-mix(in srgb,var(--mm-bieu) 22%,transparent)}
.xem-mau-menu .xm-dong.dang{background:var(--mm-dang-nen);box-shadow:inset 30px 0 0 color-mix(in srgb,var(--mm-dang-chu) 35%,transparent)}


/* v101: chọn hàng loạt trong bảng (cột ô tick) + thanh thao tác nổi phía trên bảng */
.cot-tick{width:34px;text-align:center;padding-left:10px!important;padding-right:4px!important}
.bang-khach .o-bp{white-space:nowrap;max-width:190px;overflow:hidden;text-overflow:ellipsis}
/* v280: cột gộp Phụ trách (trên) · Bộ phận (dưới, mờ) */
.bang-khach .o-pt-bp{min-width:150px;max-width:210px}
.bang-khach .o-pt-bp .o-pt{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bang-khach .o-pt-bp .o-bp{display:block;margin-top:3px;font-size:12px}
.cot-tick input{margin:0;width:16px;height:16px;accent-color:#1B4C7D;cursor:pointer}
.thanh-hang-loat{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:6px 4px;margin:-4px 0 6px;min-height:40px}
.thanh-hang-loat [data-dem-chon]{font-size:13px;color:var(--chu-mo);margin-right:4px}
.thanh-hang-loat.co-chon [data-dem-chon]{color:var(--chu);font-weight:600}
.thanh-hang-loat select{width:auto;min-width:180px;height:30px;padding-top:0;padding-bottom:0;font-size:13px}

/* v102: tab hồ sơ khách — dùng chung kiểu .tab; số đếm nhỏ + chấm đỏ "có việc đến hạn" */
.tab-ho-so{margin:2px 0 18px}
.tab-ho-so a{display:inline-flex;align-items:center;gap:6px}
.tab-ho-so .dem-tab{font-size:11.5px;font-weight:600;line-height:1;padding:3px 7px;border-radius:10px;background:var(--vien);color:var(--chu-mo)}
.tab-ho-so a.dang .dem-tab{background:#E8F0FE;color:var(--chinh)}
.tab-ho-so .cham-tab{width:7px;height:7px;border-radius:50%;background:#D93025;flex-shrink:0}
[data-tab-noi][hidden]{display:none!important}

/* ===== v106: KHU LỌC GỌN trên danh sách (ông chủ: "nhỏ lại và gọn lại cho đẹp") — kiểu Google: ô tìm bo tròn, ô chọn dạng
   viên thuốc không nhãn (đang lọc thì tô màu), chip nhỏ 26px, Hiển thị + Việc tiếp theo chung một hàng ===== */
.loc-gon-khung{margin:2px 0 12px}
.loc-gon{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 10px}
.loc-gon .o-tim-gon{flex:1 1 260px;max-width:400px;display:flex;align-items:center;gap:7px;height:36px;margin:0;padding:0 14px;
  border:1px solid var(--vien);border-radius:18px;background:var(--trang);color:var(--chu-mo);cursor:text;font-weight:400}
.loc-gon .o-tim-gon:focus-within{border-color:var(--chinh);box-shadow:0 0 0 3px rgba(26,115,232,.12)}
.loc-gon .o-tim-gon input{flex:1;min-width:0;width:auto;height:34px;margin:0;padding:0;border:0!important;outline:0;
  background:transparent!important;box-shadow:none!important;font-size:13.5px;color:var(--chu)}
.loc-gon select{width:auto;max-width:230px;height:36px;margin:0;padding:0 30px 0 14px;border-radius:18px;font-size:13px;
  background-color:var(--trang);color:var(--chu)}
.loc-gon select.dang{border-color:var(--chinh);background-color:#E8F0FE;color:var(--chinh);font-weight:600}
:root[data-giao-dien="toi"] .loc-gon select.dang{background-color:rgba(138,180,248,.16)}
.loc-gon .bo-loc-gon{font-size:13px;color:var(--chu-mo);padding:0 6px;white-space:nowrap}
.loc-gon .bo-loc-gon:hover{color:var(--chinh);text-decoration:none}
.loc-gon-khung .day-tt{margin:0 0 7px;gap:6px}
.loc-gon-khung .nhan-day{font-size:12px;color:var(--chu-mo);min-width:84px;margin-right:0;font-weight:500}
.loc-gon-khung .chip-tt{padding:2px 10px;font-size:12.5px;line-height:20px;gap:5px}
.loc-gon-khung .hai-day{display:flex;flex-wrap:wrap;column-gap:28px}
.loc-gon-khung .hai-day .day-tt{margin-bottom:7px}
.loc-gon-khung + .thanh-hang-loat{margin-top:0}
@media (max-width:640px){
  .loc-gon .o-tim-gon{max-width:none;flex-basis:100%}
  .loc-gon select{flex:1 1 140px;max-width:none}
  .loc-gon-khung .nhan-day{min-width:0;width:100%}
}

/* ===== v107: khu lọc gọn cho MỌI màn danh sách — ô ngày / ô tick dạng viên; chip trạng thái của mọi màn quản trị nhỏ lại
   (chỉ trong .chinh — máy bán hàng POS giữ chip to cho ngón tay) ===== */
.loc-gon .o-ngay-gon,.loc-gon .chon-gon{display:inline-flex;align-items:center;gap:6px;height:36px;margin:0;padding:0 8px 0 14px;
  border:1px solid var(--vien);border-radius:18px;background:var(--trang);font-size:12.5px;color:var(--chu-mo);font-weight:500;cursor:pointer}
.loc-gon .chon-gon{padding-right:14px}
.loc-gon .o-ngay-gon input{width:auto;height:32px;margin:0;padding:0 4px;border:0!important;outline:0;background:transparent!important;
  box-shadow:none!important;font-size:13px;color:var(--chu)}
.loc-gon .chon-gon input{margin:0;accent-color:var(--chinh)}
.loc-gon .o-ngay-gon.dang,.loc-gon .chon-gon.dang{border-color:var(--chinh)}
.loc-gon .chon-gon.dang{background:#E8F0FE;color:var(--chinh)}
:root[data-giao-dien="toi"] .loc-gon .chon-gon.dang{background:rgba(138,180,248,.16)}
.chinh .day-tt{gap:6px;margin-bottom:8px}
.chinh .day-tt .chip-tt{padding:2px 10px;font-size:12.5px;line-height:20px;gap:5px}
.chinh .day-tt .nhan-day{font-size:12px;font-weight:500}
@media (max-width:640px){ .loc-gon .o-ngay-gon{flex:1 1 150px} }

/* ===== v107: ĐẦU TRANG GỌN (ông chủ: "giữa tiêu đề và bộ lọc vẫn còn khoảng cách, cho xích lại, và sử dụng bộ nút cỡ nhỏ") —
   nút hành động trên đầu mọi màn quản trị dùng cỡ nhỏ 32px; tiêu đề → bộ lọc chỉ cách 12px ===== */
.chinh .tren{margin-bottom:12px;align-items:center}
.chinh .tren h1{margin-bottom:2px}
.chinh .tren .cung-dong{gap:6px}
.chinh .tren .nut{min-height:32px;padding:0 12px;font-size:.82rem;border-radius:7px}
.chinh .tren .nut.nho{min-height:28px;padding:0 10px}
.chinh .tren + .loc-gon-khung,.chinh .tren + .tab + .loc-gon-khung{margin-top:0}
.loc-gon .o-tim-gon{flex:1 1 220px;max-width:340px}
.loc-gon .o-ngay-gon input{max-width:132px}

/* ---- v109 LỊCH LÀM VIỆC KHÁCH HÀNG (/crm/agenda) — danh sách theo ngày + dòng thời gian giao tiếp ---- */
.lkh-tren{margin:0 0 10px}
.lkh-tren .lich-thang{font-size:1.05rem}
.lkh-tren .nut.nho{min-width:32px;justify-content:center}
.lkh-ds{padding:0}
.lkh-ngay{display:flex;align-items:center;gap:8px;padding:9px 16px;background:var(--nen-2);border-top:1px solid var(--vien);font-size:.9rem}
.lkh-ngay:first-child{border-top:0;border-radius:var(--r) var(--r) 0 0}
.lkh-ngay.nay b{color:var(--chinh)}
.lkh-ngay.qua-han{background:#FCE8E6;color:#B3261E}
:root[data-giao-dien="toi"] .lkh-ngay.qua-han{background:rgba(242,139,130,.14);color:#F28B82}
.lkh-ngay .nut-chu{margin-left:auto;padding:0 6px;font-size:1rem;line-height:1}
.lkh-dong{display:grid;grid-template-columns:104px 12px minmax(0,1fr) auto;align-items:start;gap:10px;padding:9px 16px;
  border-top:1px solid var(--vien);color:var(--chu)}
.lkh-dong.gt{grid-template-columns:52px 88px minmax(0,1fr) auto}
.lkh-dong:hover{background:var(--nen-2);text-decoration:none}
.lkh-dong.trong-ngay{display:block;padding:8px 16px 8px 142px}
.lkh-gio{font-size:.86rem;font-weight:600;white-space:nowrap;padding-top:1px}
.lkh-cham{display:inline-block;width:9px;height:9px;border-radius:99px;margin-top:6px;background:var(--mau-sk,var(--chinh))}
.lkh-dong.viec .lkh-cham,.lkh-cham.viec{background:#E37400}
.lkh-than{display:flex;flex-direction:column;gap:2px;min-width:0}
.lkh-td{font-weight:600;overflow-wrap:anywhere}
.lkh-kh{color:var(--chu-mo);overflow-wrap:anywhere}
.lkh-dong.gt .lkh-kh{color:var(--chu)}
.lkh-nd{white-space:pre-line;overflow-wrap:anywhere;color:var(--chu);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.lkh-nguoi{white-space:nowrap;padding-top:2px}
.lkh-dong.che .lkh-td{font-weight:400}
.lkh-chu-giai{margin:8px 2px 0;display:flex;align-items:center;gap:6px}
.lkh-chu-giai .lkh-cham{margin:0}
/* lưới tháng: mỗi ô là tên khách; việc tiếp theo chấm cam, quá hạn chữ đỏ; số ngày bấm = thêm lịch hẹn ngày đó */
.lkh-luoi{grid-template-columns:repeat(7,minmax(0,1fr))}
.lkh-luoi .o-ngay{cursor:default;min-height:96px;min-width:0}
.lkh-luoi .o-ngay:hover{background:var(--trang)}
.lkh-luoi .o-ngay.ngoai:hover{background:var(--nen)}
.lkh-luoi a.buoi{text-decoration:none}
.lkh-luoi .buoi.viec .cham{background:#E37400}
.lkh-luoi .buoi.qua-han .ten{color:#B3261E}
.lkh-luoi .nut-ngay{border:0;background:none;padding:0;font:inherit;cursor:pointer;color:inherit}
.lkh-luoi .nut-ngay span{display:inline-block;padding:2px 6px;border-radius:99px;color:var(--chu)}
.lkh-luoi .o-ngay.ngoai .nut-ngay span{color:var(--chu-mo)}
.lkh-luoi .nut-ngay:hover span{background:var(--vien)}
.lkh-luoi .o-ngay.nay .nut-ngay span{background:var(--chinh);color:var(--trang);font-weight:700}
@media (max-width:720px){
  .lkh-dong{grid-template-columns:62px 10px minmax(0,1fr);padding:9px 12px;gap:8px}
  .lkh-dong .lkh-gio .mo{display:none}
  .lkh-dong.gt{grid-template-columns:44px minmax(0,1fr)}
  .lkh-dong.gt .lkh-loai{display:none}
  .lkh-nguoi{display:none}
  .lkh-dong.trong-ngay{padding-left:92px}
  .lkh-luoi .o-ngay{min-height:64px;padding:3px}
  .lkh-luoi .buoi .gio{display:none}
}

/* ---- v110 BÁO CÁO TÀI CHÍNH (/finance/reports) — bảng 12 tháng cuộn ngang trong khung, cột tên dính trái ---- */
.bctc-cuon{overflow-x:auto;-webkit-overflow-scrolling:touch}
table.bctc{width:100%;min-width:980px;border-collapse:separate;border-spacing:0;font-size:12.5px}
table.bctc th,table.bctc td{padding:7px 9px;white-space:nowrap;border-bottom:1px solid var(--vien)}
table.bctc th{font-size:11.5px;color:var(--chu-mo);font-weight:600;background:var(--nen-2)}
table.bctc .ten-khoan{position:sticky;left:0;z-index:1;background:var(--trang);min-width:200px;max-width:260px;white-space:normal}
table.bctc th.ten-khoan{background:var(--nen-2)}
table.bctc td.so{font-variant-numeric:tabular-nums}
table.bctc th:not(.ten-khoan),table.bctc td.so{min-width:96px}
table.bctc .cot-nam{font-weight:600;background:rgba(26,115,232,.05)}
table.bctc .cot-truoc{color:var(--chu-mo)}
table.bctc .cot-truoc .nho{display:block;font-size:10.5px}
table.bctc th.tuong-lai{opacity:.55}
table.bctc tr.cap-0 td{font-weight:600}
table.bctc tr.cap-1 td.ten-khoan{padding-left:24px;color:var(--chu-mo);font-weight:400}
table.bctc tr.cap-1 td{color:var(--chu-mo)}
table.bctc tr.kieu-gop td,table.bctc tr.kieu-gop td.ten-khoan{background:#F1F6FE}
table.bctc tr.kieu-rong td,table.bctc tr.kieu-rong td.ten-khoan{background:#E8F0FE;font-weight:700;border-top:2px solid var(--chinh)}
table.bctc tr.dong-ton td,table.bctc tr.dong-ton td.ten-khoan{background:var(--nen-2);font-weight:600}
table.bctc tr.dong-ton.cuoi td{border-top:2px solid var(--vien-dam)}
:root[data-giao-dien="toi"] table.bctc tr.kieu-gop td,:root[data-giao-dien="toi"] table.bctc tr.kieu-gop td.ten-khoan{background:rgba(138,180,248,.08)}
:root[data-giao-dien="toi"] table.bctc tr.kieu-rong td,:root[data-giao-dien="toi"] table.bctc tr.kieu-rong td.ten-khoan{background:rgba(138,180,248,.16)}
.bctc-ghi ul{margin:6px 0 0;padding-left:18px}
.bctc-ghi li{margin:2px 0}
.bctc-tuoi{display:flex;flex-direction:column;gap:9px;margin-top:6px}
.bctc-tuoi .dong-tuoi{display:grid;grid-template-columns:110px minmax(0,1fr) 120px;align-items:center;gap:10px}
.bctc-tuoi b{text-align:right;font-variant-numeric:tabular-nums}
.bctc-tuoi .ong-tuoi{height:10px;border-radius:99px;background:var(--nen-2);overflow:hidden}
.bctc-tuoi .ong-tuoi i{display:block;height:100%;border-radius:99px}
.bctc-tuoi i.xanh{background:#1E8E3E}.bctc-tuoi i.vang{background:#F9AB00}.bctc-tuoi i.cam{background:#E37400}.bctc-tuoi i.do{background:#D93025}
@media (max-width:720px){ .bctc-tuoi .dong-tuoi{grid-template-columns:92px minmax(0,1fr) 96px} table.bctc .ten-khoan{min-width:128px;max-width:150px} }

/* ---- v111 Ô CHỌN KHÁCH (crm/_chon-khach.ejs) — link "Chọn khách" ở nhãn, ô hiện mã + tên, popup tìm ---- */
.truong-chon-khach > label{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.truong-chon-khach .sao-buoc{color:#C0392B;font-weight:700;margin-left:-6px}
.link-chon-khach{display:inline-flex;align-items:center;gap:4px;border:0;background:none;padding:0;font:inherit;font-size:12.5px;
  font-weight:600;color:var(--chinh);cursor:pointer}
.link-chon-khach:hover{text-decoration:underline}
.o-chon-khach{position:relative}
.o-chon-khach .hien-khach{cursor:pointer;caret-color:transparent;padding-right:32px;background:var(--trang)}
.o-chon-khach .hien-khach:placeholder-shown{color:var(--chu-mo)}
.o-chon-khach .xoa-khach{position:absolute;right:6px;top:50%;transform:translateY(-50%);border:0;background:none;color:var(--chu-mo);
  cursor:pointer;font-size:13px;padding:4px 6px;border-radius:6px}
.o-chon-khach .xoa-khach:hover{background:var(--nen-2);color:var(--chu)}
.lop-phu.lop-chon-khach{z-index:85}
.lop-chon-khach .hop{max-width:560px}
.ck-tim{display:flex;align-items:center;gap:8px;height:40px;padding:0 14px;border:1px solid var(--vien);border-radius:20px;color:var(--chu-mo);
  background:var(--trang)}
.ck-tim:focus-within{border-color:var(--chinh);box-shadow:0 0 0 3px rgba(26,115,232,.12)}
.ck-tim input{flex:1;min-width:0;height:38px;border:0!important;outline:0;padding:0;margin:0;background:transparent;box-shadow:none!important}
.ck-ds{margin-top:10px;max-height:min(52vh,420px);overflow-y:auto;border:1px solid var(--vien);border-radius:10px}
.ck-dong{display:flex;flex-direction:column;gap:2px;width:100%;text-align:left;border:0;border-bottom:1px solid var(--vien);background:var(--trang);
  padding:9px 12px;font:inherit;cursor:pointer;color:var(--chu)}
.ck-dong:last-child{border-bottom:0}
.ck-dong:hover,.ck-dong.sang{background:#E8F0FE}
:root[data-giao-dien="toi"] .ck-dong:hover,:root[data-giao-dien="toi"] .ck-dong.sang{background:rgba(138,180,248,.14)}
.ck-dong.dang .ck-ten::after{content:' ✓';color:var(--chinh);font-weight:700}
.ck-ten{overflow-wrap:anywhere}
.ck-ma{display:inline-block;min-width:66px;margin-right:6px;font-size:12px;color:var(--chinh);font-variant-numeric:tabular-nums}
.ck-phu{padding-left:72px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ck-trong{padding:18px 12px;text-align:center;color:var(--chu-mo);font-size:13px}
.ck-chan{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px}
.ck-chan .nut[hidden]+a{margin-left:auto}
.ma-kh{font-size:11.5px;color:var(--chu-mo);font-variant-numeric:tabular-nums;letter-spacing:.02em}
.ma-kh-lon{font-size:.9rem;font-weight:500;vertical-align:middle}
@media (max-width:720px){ .ck-phu{padding-left:0} .ck-ma{min-width:0} }

/* ---- v112 CHUÔNG THÔNG BÁO (thanh đầu) + trang Tất cả thông báo ---- */
.chuong-tb{position:relative}
.nut-chuong{position:relative;display:inline-flex;align-items:center;justify-content:center;width:38px;height:38px;border:0;border-radius:50%;
  background:transparent;color:var(--chu);cursor:pointer}
.nut-chuong:hover{background:var(--nen-2)}
.nut-chuong .so-tb{position:absolute;top:3px;right:2px;min-width:17px;height:17px;padding:0 4px;border-radius:9px;background:#D93025;color:#fff;
  font-size:10.5px;font-weight:700;line-height:17px;text-align:center;box-shadow:0 0 0 2px var(--trang)}
.nut-chuong.rung svg{animation:rung-chuong .9s ease}
@keyframes rung-chuong{0%,100%{transform:rotate(0)}20%{transform:rotate(14deg)}40%{transform:rotate(-12deg)}60%{transform:rotate(8deg)}80%{transform:rotate(-4deg)}}
.menu-xo.menu-tb{width:min(380px,calc(100vw - 24px));padding:0;right:0;left:auto;overflow:hidden}
.menu-tb .dau-tb{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-bottom:1px solid var(--vien)}
.menu-tb .dau-tb b{white-space:nowrap;font-size:14px}
.menu-tb .dau-tb .nut-chu{padding:0;font-size:12.5px;white-space:nowrap}
.menu-tb .ds-tb{max-height:min(60vh,440px);overflow-y:auto}
.menu-tb .chan-tb{display:block;padding:10px 14px;text-align:center;font-size:13px;font-weight:600;border-top:1px solid var(--vien)}
.tb-muc{display:grid;grid-template-columns:30px minmax(0,1fr);gap:10px;padding:10px 14px;border-bottom:1px solid var(--vien);color:var(--chu)}
.tb-muc:hover{background:var(--nen-2);text-decoration:none}
.tb-muc .tb-td{font-weight:600;font-size:13px;overflow-wrap:anywhere}
.tb-muc .tb-nd{font-size:12px;color:var(--chu-mo);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.tb-muc .tb-khi{font-size:11px;color:var(--chinh);margin-top:2px}
.tb-trong{padding:26px 14px;text-align:center;color:var(--chu-mo);font-size:13px}
.tb-bieu{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:#E8F0FE;color:var(--chinh)}
/* thông báo nổi góc dưới phải — có thông báo mới khi đang ở bất kỳ màn nào */
.tb-noi-khung{position:fixed;right:18px;bottom:18px;z-index:95;display:flex;flex-direction:column;gap:10px;width:min(360px,calc(100vw - 24px))}
.tb-noi{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:10px;align-items:start;padding:12px 14px;border-radius:12px;background:var(--trang);
  border:1px solid var(--vien);box-shadow:0 8px 28px rgba(12,39,64,.18);color:var(--chu);animation:tb-vao .25s ease}
.tb-noi:hover{text-decoration:none;border-color:var(--chinh)}
.tb-noi .tb-td{font-weight:600;font-size:13px}.tb-noi .tb-nd{font-size:12px;color:var(--chu-mo)}
.tb-noi .tb-dong-x{border:0;background:none;color:var(--chu-mo);cursor:pointer;font-size:13px;padding:0 2px}
@keyframes tb-vao{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media (max-width:600px){ .tb-noi-khung{right:8px;bottom:8px} .tb-noi:not(:last-child){display:none} }   /* điện thoại: chỉ cái mới nhất */
/* cột trái khu Thư: mục Tất cả thông báo + số chưa đọc */
.muc-tb{position:relative}
.dem-muc{margin-left:auto;min-width:20px;padding:1px 7px;border-radius:10px;background:#D93025;color:#fff;font-size:11px;font-weight:700;text-align:center}
/* trang Tất cả thông báo */
.tb-trang{padding:0}
.tb-dong{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:12px;align-items:start;padding:11px 16px;border-top:1px solid var(--vien);color:var(--chu)}
.tb-dong:hover{background:var(--nen-2);text-decoration:none}
.tb-dong .tb-td{display:block;overflow-wrap:anywhere}
.tb-dong.chua .tb-td{font-weight:700}
.tb-dong .tb-nd{display:block;margin-top:2px;overflow-wrap:anywhere}
.tb-dong .tb-gio{display:flex;align-items:center;gap:6px;white-space:nowrap}
.tb-cham{display:inline-block;width:8px;height:8px;border-radius:50%;background:#1A73E8}
.tb-cai-dat summary{cursor:pointer}
.tb-chon{display:flex;flex-wrap:wrap;gap:8px 18px}

/* ---- v113 TRANG CHỦ + BẢNG TIN CÔNG TY (/home) ---- */
.home-luoi{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px;align-items:start}
.home-trai{display:flex;flex-direction:column;gap:0;min-width:0}
.home-viet input,.home-viet textarea{margin-bottom:8px}
.home-viet textarea{min-height:70px}
.bai{position:relative}
.bai.chua-doc{border-left:3px solid var(--chinh)}
.bai.ghim{background:linear-gradient(0deg,var(--trang),var(--trang)),#FFF8E1}
.bai.chuc-mung{background:#FFFBEA}
:root[data-giao-dien="toi"] .bai.chuc-mung{background:rgba(249,171,0,.08)}
.bai-dau{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.bai-anh{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:#E8F0FE;color:var(--chinh);
  font-weight:700;flex-shrink:0;font-size:15px}
.chuc-mung .bai-anh{background:#FEF7E0;font-size:18px}
.bai-ai{display:flex;flex-direction:column;min-width:0;flex:1}
.bai-td{margin:0 0 6px;font-size:1.02rem}
.bai-nd{margin:0 0 8px;white-space:pre-line;overflow-wrap:anywhere}
.bai-chan{display:flex;align-items:center;gap:14px}
.nut-vo-tay{border:1px solid var(--vien);background:var(--trang);border-radius:16px;padding:3px 10px;font:inherit;font-size:13px;cursor:pointer}
.nut-vo-tay.da{border-color:#F9AB00;background:#FEF7E0}
.bai-menu{margin-left:auto;position:relative}
.bai-menu summary{list-style:none;cursor:pointer;padding:2px 8px;border-radius:8px;color:var(--chu-mo);font-size:18px;line-height:1}
.bai-menu summary::-webkit-details-marker{display:none}
.bai-menu-ds{position:absolute;right:0;top:28px;z-index:5;background:var(--trang);border:1px solid var(--vien);border-radius:10px;
  box-shadow:0 6px 20px rgba(12,39,64,.12);min-width:150px;padding:4px}
.bai-menu-ds form{margin:0}
.bai-menu-ds button{display:block;width:100%;text-align:left;border:0;background:none;padding:8px 10px;border-radius:6px;font:inherit;cursor:pointer}
.bai-menu-ds button:hover{background:var(--nen-2)}
.home-phai .o{margin-bottom:16px}
.home-h3{margin:14px 0 4px;font-size:.78rem;text-transform:uppercase;letter-spacing:.05em}
.home-viec{display:flex;align-items:center;gap:8px;padding:7px 0;border-bottom:1px solid var(--vien);color:var(--chu);font-size:13.5px}
.home-viec:last-child{border-bottom:0}
.home-viec.khoi{display:block;line-height:1.45}
.home-viec:hover{color:var(--chinh);text-decoration:none}
.home-viec.canh{background:#FCE8E6;border-radius:8px;padding:9px 10px;border:0;margin-bottom:6px;color:#B3261E}
/* v290 HM-01 BÀN LÀM VIỆC HÔM NAY — khối CẦN BẠN QUYẾT ĐỊNH + cột phụ gọn (views/home.ejs) */
.ban-lv > .o{margin-bottom:16px}
.qd-khoi{border:1.5px solid #C8922F;box-shadow:0 4px 14px rgba(200,146,47,.12)}
.qd-dau{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px 12px}
.qd-dau h2{margin:0}
.qd-mo{margin:4px 0 6px}
.qd-dong{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;padding:10px 0;border-top:1px dashed var(--vien)}
.qd-nd{flex:1 1 240px;min-width:0;display:flex;flex-direction:column;color:var(--chu);line-height:1.4}
.qd-nd:hover{color:var(--chinh);text-decoration:none}
.qd-tien{font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.qd-nut{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.qd-nut form{margin:0}
.nut.duyet{background:#1E6B45;border-color:#1E6B45;color:#fff}
.cm-dong{display:flex;align-items:center;gap:10px;background:#FFFBF0;border:1px solid #EED7A1;color:var(--chu)}
.cm-dong:hover{text-decoration:none;border-color:#C8922F}
.cm-dong > span:last-child{display:flex;flex-direction:column;min-width:0}
.cm-dong-anh{font-size:22px}
.home-phai .khoi-nut{display:flex;justify-content:center;margin-bottom:16px}
@media (max-width:900px){ .home-luoi .cc-the{order:1;margin-bottom:16px} }
@media (max-width:900px){ .home-luoi{grid-template-columns:minmax(0,1fr)} }
/* v252.3 (phiếu YC-0013 — ông chủ 23:40: "Đề nghị duyệt và việc của tôi trên mobile cần ở trên đầu, trên cả tin nhé chỉ dưới chúc mừng"):
   màn hình hẹp trải phẳng 2 cột (display:contents) rồi xếp lại: Chúc mừng → Đề nghị & duyệt → Việc của tôi → ô đăng bài + bảng tin → phần còn lại.
   Máy tính không đổi. Khung nạp lại bằng data-home-song giữ thuộc tính nên giữ chỗ. */
@media (max-width:900px){
  .home-luoi{display:flex;flex-direction:column;gap:0}
  .home-trai,.home-phai{display:contents}
  .home-trai > *,.home-phai > *{order:10}
  .home-luoi #cm-gop{order:1}
  .home-luoi [data-home-song="de-nghi"]{order:2}
  .home-luoi [data-home-song="viec"]{order:3}
  .home-luoi [data-home-song="de-nghi"],.home-luoi [data-home-song="viec"]{margin-bottom:16px}
}

/* ---- v114 ĐỀ NGHỊ & DUYỆT (/requests) ---- */
.dn-chuoi{list-style:none;margin:0;padding:0;counter-reset:cap}
.dn-chuoi li{position:relative;padding:8px 0 8px 30px;border-left:2px solid var(--vien);margin-left:9px}
.dn-chuoi li::before{content:'';position:absolute;left:-8px;top:10px;width:14px;height:14px;border-radius:50%;background:var(--trang);border:2px solid var(--vien-dam)}
.dn-chuoi li.xong::before{background:#1E8E3E;border-color:#1E8E3E}
.dn-chuoi li.dang::before{background:#F9AB00;border-color:#F9AB00}
.dn-chuoi li.hong::before{background:#D93025;border-color:#D93025}
.dn-chuoi li:last-child{border-left-color:transparent}
.dn-bl{padding:8px 0;border-bottom:1px solid var(--vien)}
.dn-bl:last-of-type{border-bottom:0}
.dn-duyet{border:1px solid #F9AB00;background:#FFFBEA}
:root[data-giao-dien="toi"] .dn-duyet{background:rgba(249,171,0,.08)}
.dn-them td{background:var(--nen-2)}

/* ---- v116 TIN NHẮN NỘI BỘ (/messages) — hai cột: hội thoại | khung chat ---- */
.tn-luoi{display:grid;grid-template-columns:320px minmax(0,1fr);gap:16px;height:calc(100vh - var(--cao-tren, 60px) - 48px);min-height:460px}
.tn-luoi > .o{margin:0;padding:0;display:flex;flex-direction:column;min-height:0;overflow:hidden}
.tn-dau{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:14px 14px 8px}
.tn-dau h1{margin:0;font-size:1.25rem}
.tn-tim{margin:0 14px 8px;height:36px}
.tn-ds{overflow-y:auto;flex:1;min-height:0;padding:0 6px 8px}
/* v254 (YC-0012): 3 tab Nội bộ · Web & Messenger · Cuộc gọi — dính đầu danh sách khi cuộn; số tin mới cạnh tên tab */
.tn-tab{display:flex;gap:4px;padding:2px 2px 8px;position:sticky;top:0;z-index:1;background:var(--trang)}
.tn-tab button{flex:1 1 0;min-width:0;display:inline-flex;align-items:center;justify-content:center;gap:4px;min-height:34px;padding:4px 5px;border:1px solid var(--vien);
  border-radius:9px;background:var(--trang);color:var(--chu-mo);font:inherit;font-size:.8rem;font-weight:600;cursor:pointer;line-height:1.15;text-align:center}   /* chật thì chữ xuống dòng, 3 tab chia đều */
.tn-tab button.dang{background:var(--chinh);border-color:var(--chinh);color:#fff}
.tn-tab .dem-muc{margin-left:0;flex:none}
.tn-ht{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:10px;align-items:center;padding:9px 8px;border-radius:10px;color:var(--chu)}
.tn-ht[hidden]{display:none}   /* v255: display:grid ở trên đè thuộc tính hidden ⇒ tab Nội bộ / Web / Cuộc gọi (YC-0012) và ô tìm không ẩn được dòng */
.tn-ht:hover{background:var(--nen-2);text-decoration:none}
.tn-ht.dang{background:#E8F0FE}
:root[data-giao-dien="toi"] .tn-ht.dang{background:rgba(138,180,248,.14)}
.tn-ht.chua b,.tn-ht.chua .tn-cuoi{font-weight:700;color:var(--chu)}
.tn-anh{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;background:#E8F0FE;color:var(--chinh);font-weight:700;flex-shrink:0}
.tn-anh.nhom{background:#FEF7E0;color:#B06000}
.tn-giua{display:flex;flex-direction:column;min-width:0}
.tn-giua b,.tn-cuoi{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tn-phai{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.tn-trong{margin:auto;text-align:center;color:var(--chu-mo);padding:30px}
.tn-trong-bieu{display:inline-flex;color:var(--vien-dam);margin-bottom:6px}
.tn-dau-ht{display:flex;align-items:center;gap:10px;padding:10px 14px;border-bottom:1px solid var(--vien)}
.tn-dau-ht .tn-giua{flex:1}
/* v268.1 (ông chủ 09/10 — ảnh nhóm 6 người: tên nhóm còn "T..", danh sách thành viên mỗi chữ một dòng vì cụm nút chiếm hết chỗ):
   tên + thành viên giữ tối thiểu 220px; cụm nút là MỘT khối, thiếu chỗ thì cả cụm xuống hàng dưới (dồn phải); dòng phụ tối đa 2 dòng */
.tn-dau-ht{flex-wrap:wrap;row-gap:8px}
.tn-dau-ht .tn-giua{flex:1 1 220px}
.tn-dau-nut{display:flex;flex-wrap:wrap;gap:6px;align-items:center;justify-content:flex-end;margin-left:auto}
.tn-dau-nut form{margin:0}
.tn-giua .tn-phu{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}
.tn-ve{display:none}
.tn-tin{flex:1;min-height:0;overflow-y:auto;padding:14px 16px;display:flex;flex-direction:column;gap:2px;background:var(--nen)}
.tn-ngay{align-self:center;margin:12px 0 6px;padding:2px 10px;border-radius:10px;background:var(--nen-2);color:var(--chu-mo);font-size:11.5px}
.tn-he-thong{align-self:center;margin:6px 0;color:var(--chu-mo);font-size:12px;font-style:italic}
.tn-dong{display:flex;flex-direction:column;max-width:72%;margin-top:8px;position:relative}
.tn-dong.lien{margin-top:2px}
.tn-dong.toi{align-self:flex-end;align-items:flex-end}
.tn-dong.ban{align-self:flex-start;align-items:flex-start}
.tn-ten{font-size:11.5px;color:var(--chu-mo);margin:0 0 2px 10px}
.tn-bong{padding:8px 12px 6px;border-radius:16px;background:var(--trang);border:1px solid var(--vien);color:var(--chu);overflow-wrap:anywhere}
.tn-dong.toi .tn-bong{background:#12395F;border-color:#12395F;color:#FFFFFF}
.tn-dong.toi .tn-bong a{color:#FFE7B0}
.tn-dong.dong-nghiep .tn-bong{background:#DCE8F5;border-color:#C5D7EA;color:var(--chu)}
.tn-dong.dong-nghiep .tn-bong a{color:var(--chinh)}
.tn-dong.toi .tn-ten{margin:0 10px 2px 0}
:root[data-giao-dien="toi"] .tn-dong.dong-nghiep .tn-bong{background:#23384F;border-color:#2E4A68;color:var(--chu)}
.tn-bong.thu-hoi{background:transparent!important;color:var(--chu-mo)!important;border-style:dashed!important;font-style:italic}
.tn-chu{white-space:pre-wrap}
.tn-gio{display:block;font-size:10.5px;opacity:.65;text-align:right;margin-top:2px}
.tn-anh-gui{display:block;max-width:260px;max-height:260px;border-radius:10px;margin-bottom:4px}
.tn-tep{display:inline-block;margin-bottom:4px;font-weight:600}
.tn-thu-hoi{display:none;border:0;background:none;color:var(--chu-mo);font-size:11px;cursor:pointer;padding:2px 4px}
/* v182: CHUYỂN TIẾP — nút (rê chuột / chạm bong bóng) + nhãn người gửi gốc + hộp chọn người */
.tn-dong.toi.hien-nut .tn-thu-hoi{display:inline-block}
.tn-ct-nhan{font-size:.72rem;font-style:italic;opacity:.8;margin-bottom:3px}
/* v183: "Đã xem" — nhóm: chấm chữ cái dưới tin cuối mỗi người đọc tới; khung nhỏ: dòng nhỏ; bảng tin: danh sách */
.tn-xem-nhom{flex-basis:100%;display:flex;flex-direction:column;align-items:flex-end;margin-top:2px}
.tn-dong.ban .tn-xem-nhom{align-items:flex-start}
.tn-xem-nut{display:inline-flex;gap:2px;align-items:center;border:0;background:none;padding:0;cursor:pointer}
.tn-xem-anh{width:16px;height:16px;border-radius:50%;background:var(--nen-2);border:1px solid var(--vien);font-size:9px;font-weight:700;color:var(--chu-mo);display:inline-flex;align-items:center;justify-content:center}
.tn-xem-them{font-size:10px;color:var(--chu-mo);margin-left:2px}
.tn-xem-ds{display:none;font-size:.72rem;color:var(--chu-mo);background:var(--trang);border:1px solid var(--vien);border-radius:8px;padding:6px 8px;margin-top:3px}
.tn-xem-nhom.mo .tn-xem-ds{display:block}
.cn-da-xem{font-size:.66rem;color:var(--chu-mo);margin:1px 4px 0;text-align:right}
.cn-tin.cua-ho .cn-da-xem{text-align:left}
.bai-xem{color:var(--chu-mo)}
.bai-xem-ds{display:flex;gap:24px;flex-wrap:wrap;font-size:.82rem;padding:8px 2px 2px;border-top:1px dashed var(--vien);margin-top:6px}
.bai-xem-ds[hidden]{display:none}
.bai-xem-cot{min-width:180px;display:grid;gap:2px}
.bai-xem-td{font-weight:600;margin-bottom:2px}
.cn-ct-nhan{font-size:.7rem;font-style:italic;opacity:.8;margin-bottom:2px;white-space:normal}
.ct-nen{position:fixed;inset:0;background:rgba(15,23,42,.45);z-index:200;display:flex;align-items:center;justify-content:center;padding:16px}
.ct-hop{background:var(--trang);border-radius:14px;box-shadow:0 18px 50px rgba(0,0,0,.25);width:min(440px,100%);max-height:min(620px,calc(100vh - 32px));display:flex;flex-direction:column;gap:10px;padding:16px}
.ct-dau{display:flex;justify-content:space-between;align-items:center}
.ct-dong{border:0;background:none;font-size:1rem;cursor:pointer;color:var(--chu-mo)}
.ct-tim,.ct-nhan{width:100%;margin:0}
.ct-ds{overflow-y:auto;flex:1;min-height:120px;border:1px solid var(--vien);border-radius:10px;padding:6px}
.ct-nhom{font-size:.72rem;font-weight:700;text-transform:uppercase;color:var(--chu-mo);margin:6px 4px 2px}
.ct-muc{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:8px;cursor:pointer;font-weight:400;margin:0}
.ct-muc:hover{background:var(--nen-2)}
.ct-trong{padding:14px;text-align:center;color:var(--chu-mo)}
.ct-bao{font-size:.85rem;color:var(--chinh);min-height:1em}
.ct-chan{display:flex;justify-content:flex-end;gap:8px}
.tn-dong.toi:hover .tn-thu-hoi{display:inline-block}
/* v152: nút Xoá của quản trị — hiện khi rê chuột vào tin (điện thoại: luôn hiện mờ) */
.tn-xoa{display:none;border:0;background:none;color:#B3261E;font-size:11px;cursor:pointer;padding:2px 4px}
.tn-dong:hover .tn-xoa{display:inline-block}
@media (hover:none){ .tn-xoa{display:inline-block;opacity:.7} }
.nut.do-chu{color:#B3261E;border-color:#E8B4B0}
.tn-da-xem{font-size:11px;color:var(--chu-mo);margin-top:2px}
.tn-viet{display:flex;align-items:flex-end;gap:8px;padding:10px 12px;border-top:1px solid var(--vien);background:var(--trang)}
.tn-o-viet{flex:1;display:flex;flex-direction:column;gap:4px}
.tn-o-viet [data-ten-tep][hidden]{display:none}
.tn-o-viet [data-ten-tep]{align-self:flex-start}
.tn-o-viet textarea{margin:0;resize:none;min-height:40px;max-height:160px;border-radius:20px;padding:9px 14px}
.tn-kem{display:inline-flex;align-items:center;justify-content:center;width:38px;height:40px;cursor:pointer;color:var(--chu-mo);border-radius:50%}
.tn-kem:hover{background:var(--nen-2);color:var(--chinh)}
.tn-viet .nut{height:40px;border-radius:20px;padding:0 14px}
.tn-chon-nguoi .ck-dong{cursor:pointer}
.nut-tin{text-decoration:none;color:var(--chu)}
@media (max-width:860px){
  .tn-luoi{grid-template-columns:minmax(0,1fr);height:calc(100vh - var(--cao-tren, 60px) - 24px)}
  .tn-luoi.co-ht .tn-trai{display:none}
  .tn-luoi:not(.co-ht) .tn-phai-khung{display:none}
  .tn-ve{display:inline-flex}
  .tn-dong{max-width:86%}
}
/* v116: tiêu đề nhóm trên trang Cài đặt Trang chủ */
.khoi-cd{font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--chu-mo);margin:18px 2px 8px}
/* v116: chữ cam — sắp đến hạn */
.cam-chu{color:#C26401}
:root[data-giao-dien="toi"] .cam-chu{color:#F9A65A}
/* ---- v116 SINH NHẬT TRONG TUẦN (Trang chủ) ---- */
.sinh-nhat{background:linear-gradient(180deg,#FFF8E6,var(--trang) 60%)}
:root[data-giao-dien="toi"] .sinh-nhat{background:var(--trang)}
.sn-dong{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--vien)}
.sn-dong:last-of-type{border-bottom:0}
.sn-dong.da-qua{opacity:.6}
.sn-dong.hom-nay{background:#FEF7E0;border-radius:10px;padding:8px;border-bottom:0;margin:4px 0}
:root[data-giao-dien="toi"] .sn-dong.hom-nay{background:rgba(249,171,0,.12)}
.sn-ngay{display:flex;flex-direction:column;align-items:center;line-height:1.2;color:var(--chinh)}
.sn-ten{display:flex;flex-direction:column;min-width:0}
.sn-ten b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sn-dong.hom-nay .sn-ten .nho{color:#B06000;font-weight:600}
.sn-khai{margin-top:10px;padding-top:10px;border-top:1px dashed var(--vien)}

/* ===================== v117 — LỊCH ↔ CRM + sửa lỗi lịch (B1–B6) ===================== */
/* B1: cột lưới tháng ĐỀU nhau — 1fr cũ = minmax(auto,1fr) nên tên dài kéo giãn cột (thứ Sáu 269px); chữ dài cắt "…" + rê chuột xem đủ */
.lich-luoi{grid-template-columns:repeat(7,minmax(0,1fr))}
.lich-luoi .o-ngay{min-width:0}
.buoi .ten{min-width:0;flex:1 1 auto;white-space:nowrap}
.buoi.ca-ngay{background:var(--mau-sk,var(--chinh));color:#fff;margin-bottom:2px}
.buoi.ca-ngay:hover{background:var(--mau-sk,var(--chinh));filter:brightness(.93)}
/* được mời, chưa trả lời: viền (kiểu Google) */
.buoi.cho-tra-loi{background:var(--trang);box-shadow:inset 0 0 0 1px var(--mau-sk)}
.buoi.ca-ngay.cho-tra-loi{color:var(--mau-sk)}
/* tuần / ngày: cột theo số ngày thật (auto-fit cũ chỉ tạo 1 cột, các cột sau tự co giãn lệch nhau) + hàng "Cả ngày" */
.lich-gio.lich-tuan{min-width:0}
.lich-gio.lich-tuan .dau-cot,.lich-gio.lich-tuan .than-gio,.lich-tuan .hang-ca-ngay{grid-template-columns:58px repeat(var(--so-cot,7),minmax(0,1fr))}
.lich-tuan .hang-ca-ngay{display:grid;border-bottom:1px solid var(--vien);background:var(--trang)}
/* thân lưới có thanh cuộn dọc → đầu cột + hàng cả ngày chừa đúng chỗ đó (khỏi lệch ~2px mỗi cột) */
.lich-tuan .dau-cot,.lich-tuan .hang-ca-ngay{overflow-y:hidden;scrollbar-gutter:stable}
.lich-tuan .nhan-ca-ngay{font-size:.72rem;color:var(--chu-mo);text-align:right;padding:7px 7px 0 0}
.lich-tuan .o-ca-ngay{border-left:1px solid var(--vien);padding:3px;min-width:0;max-height:104px;overflow-y:auto}
.buoi-gio{min-width:0}
.buoi-gio.cho-tra-loi{background:var(--trang);color:var(--mau-sk);box-shadow:inset 0 0 0 1.5px var(--mau-sk)}
/* B3: chấm màu ở cột trái là ô chọn màu */
.ds-lich input[type=color].cham-lich{-webkit-appearance:none;appearance:none;width:13px;height:13px;padding:0;margin:0;border:0;border-radius:3px;background:none;cursor:pointer;flex-shrink:0}
.ds-lich input[type=color].cham-lich::-webkit-color-swatch-wrapper{padding:0}
.ds-lich input[type=color].cham-lich::-webkit-color-swatch{border:0;border-radius:3px}
.ds-lich input[type=color].cham-lich::-moz-color-swatch{border:0;border-radius:3px}
/* B4: hộp xem nhanh */
.lop-phu .hop.hop-xem-sk{max-width:460px}
.hop-xem-sk .hop-dau{align-items:flex-start}
.hop-xem-sk .cham-xem{width:14px;height:14px;border-radius:4px;flex-shrink:0;margin-top:5px}
.hop-xem-sk h2{margin:0;font-size:1.08rem;flex:1;min-width:0;overflow-wrap:anywhere}
.dong-xem{display:grid;grid-template-columns:24px minmax(0,1fr);gap:10px;align-items:start;padding:6px 0;font-size:.9rem}
.dong-xem[hidden]{display:none}
.dong-xem .bieu{color:var(--chu-mo);display:flex;padding-top:1px}
.xem-mo-ta{white-space:pre-wrap;overflow-wrap:anywhere}
.ds-du{list-style:none;margin:4px 0 0;padding:0}
.ds-du li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:4px 0;border-bottom:1px dashed var(--vien)}
.tt-du{font-size:.74rem;padding:1px 8px;border-radius:99px;background:var(--nen-2);color:var(--chu-mo);white-space:nowrap}
.tt-du.tt-nhan{background:#E6F4EA;color:#188038}.tt-du.tt-tu_choi{background:#FCE8E6;color:#C5221F}.tt-du.tt-co_the{background:#FEF7E0;color:#B06000}
.hop-xem-sk .hop-chan{flex-wrap:wrap;gap:8px}
.tra-loi-moi{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:0}
.tra-loi-moi[hidden]{display:none}
.nut-xoa-sk{color:#C5221F}
/* B5: [hidden] thắng mọi luật display trong hộp sửa (trước đây .hang{display:grid} đè `hidden` → khối lặp luôn hiện) */
.hop-sk [hidden]{display:none!important}
/* B5: mọi dòng một ô của hộp sửa: nhãn NẰM TRÊN ô (luật chung .hang là lưới 2 cột → nhãn trái, ô phải, lệch với các dòng đôi) */
.hop-sk .hang:not(.doi):not(.tich):not(.khoi-lap){display:block}
.hop-sk .khoi-lap{gap:10px}
.dong-lap{display:grid;grid-template-columns:92px minmax(0,1fr);align-items:center;gap:10px}
.nhan-lap{font-size:.82rem;color:var(--chu-mo)}
.hop-sk input.o-so-nho{width:76px}
.hop-sk input.o-ngay-lap{width:auto;flex:1 1 140px}
.hop-sk .ngay-gio{flex-wrap:wrap}
/* B6: mời người dự */
.chon-nguoi-du{position:relative}
.chip-moi-du{display:flex;flex-wrap:wrap;gap:6px}
.chip-moi-du:not(:empty){margin-bottom:6px}
.chip-moi-du .chip{display:inline-flex;align-items:center;gap:2px;padding:3px 4px 3px 10px;border-radius:99px;background:var(--nen-2);border:1px solid var(--vien);font-size:.82rem}
.chip-moi-du .chip button{border:0;background:none;cursor:pointer;color:var(--chu-mo);font-size:.72rem;padding:0 5px}
.ds-nguoi-du{position:absolute;left:0;right:0;top:100%;z-index:5;margin-top:4px;max-height:210px;overflow-y:auto;background:var(--trang);
  border:1px solid var(--vien);border-radius:var(--r);box-shadow:0 6px 18px rgba(16,32,52,.14);padding:4px}
.hop-sk .ds-nguoi-du .mot-nguoi{display:flex;align-items:center;gap:8px;margin:0;padding:6px 8px;border-radius:6px;cursor:pointer;color:var(--chu);font-size:.88rem}
.hop-sk .ds-nguoi-du .mot-nguoi:hover{background:var(--nen-2)}
.trong-nguoi{padding:8px}
/* dải lời mời chờ trả lời */
.loi-moi{border:1px solid #F3D58A;background:#FEF7E0;border-radius:var(--r);padding:10px 14px;margin:0 0 12px}
.loi-moi-dau{display:flex;align-items:center;gap:6px;margin-bottom:4px;color:#8A5A00}
.mot-moi{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:6px 0 2px;border-top:1px dashed #F3D58A}
.mot-moi .tra-loi-nhanh{margin:0 0 0 auto;display:flex;gap:6px}
:root[data-giao-dien="toi"] .loi-moi{background:rgba(253,214,99,.08);border-color:rgba(253,214,99,.3)}
:root[data-giao-dien="toi"] .loi-moi-dau{color:#FDD663}
@media (max-width:640px){ .dong-lap{grid-template-columns:1fr;gap:4px} .lich-luoi .buoi .gio{display:none} .lich-luoi .o-ngay{padding:4px 3px} }

/* v118: tên khách trên sự kiện (kết nối lịch ↔ CRM) · việc tiếp theo của khách (cả ngày, viền đứt) */
.buoi .khach-sk{opacity:.78;font-weight:400}
.buoi.viec-crm{background:var(--trang);color:var(--chu);box-shadow:inset 0 0 0 1px var(--mau-sk);border-left:3px solid var(--mau-sk)}
.buoi.viec-crm:hover{background:var(--nen-2);filter:none}
/* v118: bình luận bảng tin */
.bai-bl{border-top:1px solid var(--vien);margin-top:10px;padding-top:8px;display:flex;flex-direction:column;gap:8px}
.bai-bl.thu-gon .mot-bl.cu{display:none}
.bl-xem-cu{align-self:flex-start}
.mot-bl{display:grid;grid-template-columns:28px minmax(0,1fr);gap:8px;align-items:start}
.bl-anh{width:28px;height:28px;border-radius:50%;background:var(--nen-2);border:1px solid var(--vien);display:flex;align-items:center;justify-content:center;font-size:.78rem;font-weight:700;color:var(--chu-mo)}
.bl-than{background:var(--nen-2);border-radius:10px;padding:6px 10px;min-width:0}
.bl-dau{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:.86rem}
.bl-xoa{margin:0 0 0 auto}
.bl-xoa .nut-chu{font-size:.74rem;color:var(--chu-mo)}
.bl-nd{white-space:pre-wrap;overflow-wrap:anywhere;font-size:.9rem;margin-top:2px}
.bl-viet{display:flex;gap:8px;align-items:flex-end;margin:0}
.bl-viet textarea{flex:1;min-height:36px;resize:none;margin:0;border-radius:18px;padding:8px 14px}
/* v118: hướng dẫn nội bộ + chọn người nhận tiền của đề nghị */
.hd-nd{overflow-wrap:anywhere;line-height:1.7;font-size:.95rem;color:var(--chu)}
.hd-bai{min-width:0}
.hd-soan .hd-o-nd{min-height:360px;font-family:inherit;line-height:1.6}
.chon-nhan{display:flex;flex-wrap:wrap;gap:6px 16px;margin:2px 0 8px}
.chon-nhan label{display:inline-flex;align-items:center;gap:6px;margin:0;font-weight:400}
[data-dnk-them-o][hidden],[data-nhan-o][hidden],[data-o-nhan][hidden],[data-o-dm][hidden],[data-o-ngay][hidden]{display:none}   /* .hang{display:grid} đè hidden — ô Từ/Đến ngày hiện cả với đề nghị thanh toán */
/* v119: trả lại lớp CRM ở lịch (ông chủ chốt giữ như v117) */
/* mốc CRM (ảo, chỉ xem — bấm mở chứng từ): nền nhạt cùng màu lớp + vạch trái */
.buoi.ao{text-decoration:none;background:color-mix(in srgb,var(--mau-sk) 13%,transparent);box-shadow:inset 3px 0 0 var(--mau-sk);margin-bottom:2px;padding-left:7px}
.buoi.ao:hover{background:color-mix(in srgb,var(--mau-sk) 24%,transparent);text-decoration:none}
.buoi.ao .gio{color:inherit;opacity:.75}
.buoi-gio.ao{text-decoration:none;color:var(--chu);background:color-mix(in srgb,var(--mau-sk) 16%,var(--trang));box-shadow:inset 3px 0 0 var(--mau-sk)}
.buoi-gio.ao:hover{text-decoration:none;background:color-mix(in srgb,var(--mau-sk) 26%,var(--trang))}
.ds-lich .cham-lich.lop-crm{border-radius:50%}
.ds-lich .nhom-lop-crm{margin:16px 4px 4px}
/* thẻ Lịch vào CRM */
.ds-lop-crm{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:8px 18px;margin:4px 0 16px}
.mot-lop-crm{display:grid;grid-template-columns:18px 12px minmax(0,1fr);gap:8px;align-items:start;margin:0;padding:8px 10px;border:1px solid var(--vien);border-radius:var(--r);cursor:pointer;font-weight:400}
.mot-lop-crm input{margin:2px 0 0}
.mot-lop-crm .cham-lop{width:12px;height:12px;border-radius:50%;margin-top:3px}
/* v119: Cài đặt Trang chủ hai cột — trái danh sách mục, phải chi tiết */
.cd-2cot{display:grid;grid-template-columns:250px minmax(0,1fr);gap:18px;align-items:start}
.cd-menu{display:flex;flex-direction:column;gap:4px;background:var(--trang);border:1px solid var(--vien);border-radius:var(--r);padding:6px;position:sticky;top:12px}
.cd-menu a{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;border-radius:8px;color:var(--chu);text-decoration:none}
.cd-menu a:hover{background:var(--nen-2);text-decoration:none}
.cd-menu a.dang{background:color-mix(in srgb,var(--chinh) 12%,transparent);color:var(--chinh)}
.cd-menu .bieu{display:flex;padding-top:2px;color:var(--chu-mo)}
.cd-menu a.dang .bieu{color:var(--chinh)}
.cd-menu b{display:block;font-size:.92rem}
.cd-menu small{display:block;font-size:.76rem;color:var(--chu-mo);margin-top:1px}
.cd-chi-tiet{min-width:0}
.cd-chi-tiet .cuon-ngang{overflow-x:auto}
@media (max-width:820px){ .cd-2cot{grid-template-columns:1fr} .cd-menu{position:static;flex-direction:row;overflow-x:auto} .cd-menu a{flex:0 0 auto} .cd-menu small{display:none} }
/* v120: khung chat nhỏ nội bộ (views/partials/chat-noi-bo.ejs) — góc dưới phải; thông báo nổi đẩy lên trên nút */
.cn{position:fixed;right:18px;bottom:18px;z-index:90}
/* v261.4: đang mở hộp (Bán hàng…) thì nút chat nhỏ không đè nút Lưu ở đáy hộp */
body:has(.lop-phu:not([hidden])) .cn{display:none}
.cn-nut{width:52px;height:52px;border-radius:50%;border:0;background:var(--chinh);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;
  box-shadow:0 6px 18px rgba(16,32,52,.26);position:relative;margin-left:auto}
.cn-nut:hover{filter:brightness(1.08)}
.cn.dang-mo .cn-nut{display:none}
.cn-so{position:absolute;top:-3px;right:-3px;min-width:20px;height:20px;padding:0 5px;border-radius:99px;background:#D93025;color:#fff;font-size:11px;font-weight:700;
  display:flex;align-items:center;justify-content:center;border:2px solid var(--trang)}
.cn-so[hidden]{display:none}
body:has(.cn) .tb-noi-khung{bottom:82px}
body.cn-dang-mo .tb-noi-khung{right:400px}
.cn-hop{width:min(370px,calc(100vw - 24px));height:min(520px,calc(100vh - 90px));background:var(--trang);border:1px solid var(--vien);border-radius:14px;
  box-shadow:0 14px 40px rgba(16,32,52,.22);display:flex;flex-direction:column;overflow:hidden}
.cn-hop[hidden]{display:none}
.cn-dau{display:flex;align-items:center;gap:4px;padding:10px 10px 10px 14px;border-bottom:1px solid var(--vien)}
.cn-tieu{flex:1;min-width:0}
.cn-tieu b{display:block;font-size:.95rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cn-tieu small{display:block;font-size:.72rem;color:var(--chu-mo);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cn-tieu small:empty{display:none}
.cn-nut-nho{width:32px;height:32px;border:0;border-radius:8px;background:transparent;color:var(--chu-mo);cursor:pointer;display:flex;align-items:center;justify-content:center}
.cn-nut-nho:hover{background:var(--nen-2);color:var(--chu)}
.cn-nut-nho[hidden]{display:none}
.cn-tim{padding:8px 10px;border-bottom:1px solid var(--vien)}
.cn-tim[hidden]{display:none}
.cn-tim input{width:100%;margin:0;height:34px}
/* v254 (YC-0012): 3 tab trong khung chat nhỏ */
.cn-tab{display:flex;gap:4px;padding:6px 8px;border-bottom:1px solid var(--vien)}
.cn-tab[hidden]{display:none}
.cn-tab button{flex:1 1 0;min-width:0;display:inline-flex;align-items:center;justify-content:center;gap:4px;padding:5px 4px;border:1px solid var(--vien);border-radius:8px;
  background:var(--trang);color:var(--chu-mo);font:inherit;font-size:.76rem;font-weight:600;cursor:pointer;line-height:1.15;text-align:center}
.cn-tab button.dang{background:var(--chinh);border-color:var(--chinh);color:#fff}
.cn-tab .cn-dem{position:static;margin:0;flex:none;min-width:18px;height:18px;padding:0 5px;background:#C62828}
.cn-tab .cn-dem[hidden]{display:none}
.cn-than{flex:1;overflow-y:auto;padding:6px;display:flex;flex-direction:column;gap:2px}
.cn-trong{padding:28px 10px;text-align:center;color:var(--chu-mo);font-size:.88rem}
.cn-ht{display:flex;align-items:center;gap:10px;width:100%;border:0;background:transparent;text-align:left;padding:8px;border-radius:10px;cursor:pointer;font:inherit;color:var(--chu)}
.cn-ht:hover{background:var(--nen-2)}
.cn-ht.chua b{font-weight:700}
.cn-anh{width:36px;height:36px;border-radius:50%;flex-shrink:0;background:var(--nen-2);border:1px solid var(--vien);display:flex;align-items:center;justify-content:center;font-weight:700;color:var(--chu-mo)}
.cn-anh.nhom{background:#E8F0FE;color:#1A73E8}
.cn-anh.web{background:#E6F4EA}
.cn-giua{flex:1;min-width:0}
.cn-giua b{display:block;font-weight:500;font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cn-giua small{display:block;font-size:.78rem;color:var(--chu-mo);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cn-dem{min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:var(--chinh);color:#fff;font-size:.72rem;font-weight:700;display:flex;align-items:center;justify-content:center}
.cn-tin{display:flex;flex-direction:column;max-width:82%;margin:3px 4px}
.cn-tin.cua-toi{align-self:flex-end;align-items:flex-end}
.cn-tin.cua-ho{align-self:flex-start}
.cn-ai{font-size:.72rem;color:var(--chu-mo);margin:0 0 2px 4px}
.cn-bong{padding:7px 11px;border-radius:14px;white-space:pre-wrap;overflow-wrap:anywhere;font-size:.9rem;line-height:1.42}
.cua-toi .cn-bong{background:var(--chinh);color:#fff;border-bottom-right-radius:4px}
.cua-toi .cn-bong .cn-tep{color:#fff}
.dong-nghiep .cn-bong{background:#DCE8F5;color:var(--chu)}
.dong-nghiep .cn-bong .cn-tep{color:var(--chinh)}
:root[data-giao-dien="toi"] .dong-nghiep .cn-bong{background:#23384F}
.cua-ho .cn-bong{background:var(--nen-2);border-bottom-left-radius:4px}
.cn-bong.thu-hoi{font-style:italic;opacity:.7}
.cn-gio{font-size:.68rem;color:var(--chu-mo);margin:1px 4px 0}
.cn-he{align-self:center;font-size:.74rem;color:var(--chu-mo);padding:4px 8px}
.cn-he.loi{color:#C5221F}
.cn-hop{position:relative}
.cn-moi{position:absolute;left:50%;transform:translateX(-50%);bottom:64px;border:0;border-radius:99px;background:var(--chinh);color:#fff;font:inherit;font-size:.78rem;font-weight:600;padding:5px 12px;box-shadow:0 4px 12px rgba(16,32,52,.25);cursor:pointer;z-index:2}
.cn-moi[hidden]{display:none}
.cn-viet{display:flex;gap:6px;align-items:flex-end;padding:8px;border-top:1px solid var(--vien);margin:0}
.cn-viet[hidden]{display:none}
.cn-viet textarea{flex:1;margin:0;resize:none;min-height:38px;max-height:110px;border-radius:18px;padding:8px 12px;line-height:1.4}
.cn-gui{width:38px;height:38px;border-radius:50%;border:0;background:var(--chinh);color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.tn-anh.web{background:#E6F4EA}
/* v150: hội thoại kênh (Messenger) — ảnh đại diện khách + dải trạng thái 24 giờ */
.tn-anh{overflow:hidden}
.tn-anh img,.cn-anh img{width:100%;height:100%;object-fit:cover;display:block}
.cn-anh{overflow:hidden}
.tn-anh.kenh-facebook,.cn-anh.kenh-facebook{background:#E7F0FF;color:#0866FF;font-family:Arial,sans-serif}
.tn-kenh{padding:6px 16px;font-size:13px;background:#E7F0FF;color:#0B3D91;border-bottom:1px solid var(--vien)}
.tn-kenh.het{background:#FEF7E0;color:#7A4B00}
:root[data-giao-dien="toi"] .tn-kenh{background:#1B2A44;color:#C6DAFF}
:root[data-giao-dien="toi"] .tn-kenh.het{background:#3A2E12;color:#FFE1A3}
.hd-kenh ol{margin:0;padding-left:22px}
.hd-kenh li{margin:0 0 14px}
.hd-kenh li p{margin:2px 0 6px}
.hd-kenh .truong{max-width:640px}
.ds-truc{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:4px 16px}
@media (max-width:640px){ .cn{right:12px;bottom:12px} .cn-hop{height:calc(100vh - 80px)} body.cn-dang-mo .tb-noi-khung{display:none} }
@media print{ .cn{display:none} }
/* v122: người quản lý chat website — ô 🔔 nhận chuông cạnh tên */
.mot-quan-ly{display:flex;align-items:center;justify-content:space-between;gap:8px}
.mot-quan-ly .chuong-ql{display:inline-flex;align-items:center;gap:4px;margin:0;cursor:pointer}
/* ===================== v124 — THÔNG BÁO CÓ SỨC SỐNG (ông chủ: "phân loại màu sắc đẹp chút, cho nó sinh động… tất cả mọi chỗ đều phải
   có sức sống") — MỖI LOẠI MỘT MÀU, dùng thống nhất ở: biểu tượng tròn · nhãn loại · chip lọc · dòng trang Thông báo · chuông thả
   xuống · thông báo nổi · khung "Thông báo" Trang chủ. Nhóm màu theo ý nghĩa: tiền vào / bán = xanh lá · thư, tin nhắn, liên hệ =
   xanh dương – lam – ngọc · chờ duyệt / đề nghị / hết hạn = cam – hồng – đỏ · lịch = tím · bảng tin = vàng đồng TTP. Chế độ Tối
   pha sáng màu chữ, nền là màu loại pha trong suốt. ===================== */
.tb-bieu{--c:#5B6878}
.loai-thu_moi{--c:#1A73E8}       /* Thư mới — xanh Google */
.loai-nhan_tin{--c:#0891B2}      /* Tin nhắn nội bộ — xanh lơ */
.loai-tin_nhan{--c:#0F9F87}      /* Tin nhắn khách (Zalo / Messenger) — ngọc */
.loai-lien_he{--c:#4F46E5}       /* Liên hệ mới — chàm */
.loai-don_moi{--c:#4D8B12}       /* Đơn hàng mới — xanh lá non */
.loai-khach_tra{--c:#188038}     /* Khách trả tiền — xanh lá tiền vào */
.loai-cho_duyet{--c:#E8710A}     /* Chờ duyệt — cam */
.loai-de_nghi{--c:#D63F7A}       /* Đề nghị — hồng */
.loai-het_han{--c:#C5221F}       /* Sắp hết hạn — đỏ */
.loai-nhac_lich{--c:#8430CE}     /* Nhắc lịch — tím */
.loai-moi_hop{--c:#B0279B}       /* Lời mời lịch — tím hồng */
.loai-bang_tin{--c:#B07F24}      /* Bảng tin — vàng đồng TTP */
.loai-chi_dinh_ky{--c:#D9480F}   /* v135 Khoản chi định kỳ — cam đất (tiền ra, có hạn) */
.loai-khac{--c:#5B6878}          /* Khác — xám */
/* biểu tượng tròn */
.tb-bieu[class*="loai-"]{background:color-mix(in srgb,var(--c) 14%,#fff);color:var(--c);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--c) 22%,transparent)}
/* nhãn loại trong dòng thông báo */
.nhan-loai{display:inline-block;padding:1px 8px;border-radius:99px;font-size:.72rem;font-weight:600;line-height:1.6;
  color:var(--c);background:color-mix(in srgb,var(--c) 11%,#fff);border:1px solid color-mix(in srgb,var(--c) 26%,transparent)}
/* trang Thông báo: CHƯA ĐỌC nổi hẳn — nền nhạt màu loại + vạch màu bên trái + chấm màu; đã đọc lùi lại */
.tb-dong{position:relative}
.tb-dong.chua{background:color-mix(in srgb,var(--c,#1A73E8) 7%,var(--trang));box-shadow:inset 3px 0 0 var(--c,#1A73E8)}
.tb-dong.chua:hover{background:color-mix(in srgb,var(--c,#1A73E8) 12%,var(--trang))}
.tb-dong:not(.chua) .tb-bieu{filter:saturate(.55);opacity:.8}
.tb-dong:not(.chua) .tb-td{color:var(--chu-mo)}
.tb-dong .tb-cham{background:var(--c,#1A73E8);box-shadow:0 0 0 3px color-mix(in srgb,var(--c,#1A73E8) 20%,transparent)}
/* chuông thả xuống + thông báo nổi + khung Trang chủ: vạch màu loại */
.tb-muc[class*="loai-"]{box-shadow:inset 3px 0 0 var(--c)}
.tb-muc[class*="loai-"]:hover{background:color-mix(in srgb,var(--c) 8%,var(--trang))}
.tb-muc .tb-khi{color:var(--c,var(--chinh))}
.tb-noi[class*="loai-"]{border-left:4px solid var(--c)}
.home-viec.tb-home{box-shadow:inset 3px 0 0 var(--c);padding-left:9px;border-radius:6px}
.home-viec.tb-home:hover{background:color-mix(in srgb,var(--c) 8%,var(--trang))}
/* chip lọc đầu trang theo loại (chip-tt dùng sẵn biến --c) */
.chip-tt.chip-loai:not(.dang){background:color-mix(in srgb,var(--c) 8%,#fff);border-color:color-mix(in srgb,var(--c) 35%,transparent);color:var(--c)}
.chip-tt.chip-loai .cham-loai{width:8px;height:8px;border-radius:50%;background:var(--c);display:inline-block}
.chip-tt.chip-loai.dang .cham-loai{background:#fff}
/* ---- chế độ Tối ---- */
:root[data-giao-dien="toi"] .tb-bieu[class*="loai-"]{background:color-mix(in srgb,var(--c) 24%,transparent);color:color-mix(in srgb,var(--c) 55%,#fff);box-shadow:none}
:root[data-giao-dien="toi"] .nhan-loai{background:color-mix(in srgb,var(--c) 20%,transparent);color:color-mix(in srgb,var(--c) 55%,#fff);border-color:color-mix(in srgb,var(--c) 45%,transparent)}
:root[data-giao-dien="toi"] .tb-dong.chua{background:color-mix(in srgb,var(--c,#1A73E8) 13%,transparent)}
:root[data-giao-dien="toi"] .tb-dong.chua:hover{background:color-mix(in srgb,var(--c,#1A73E8) 19%,transparent)}
:root[data-giao-dien="toi"] .tb-muc[class*="loai-"]:hover,:root[data-giao-dien="toi"] .home-viec.tb-home:hover{background:color-mix(in srgb,var(--c) 15%,transparent)}
:root[data-giao-dien="toi"] .tb-muc .tb-khi{color:color-mix(in srgb,var(--c,#7FB2E8) 55%,#fff)}
:root[data-giao-dien="toi"] .chip-tt.chip-loai:not(.dang){background:color-mix(in srgb,var(--c) 16%,transparent);color:color-mix(in srgb,var(--c) 55%,#fff)}
/* v125: ô thứ tự + nút ▲▼ sắp xếp nhanh */
.o-thu-tu{display:flex;align-items:center;gap:6px}
.o-thu-tu input{width:62px;min-width:0}
.nut-len-xuong{display:inline-flex;flex-direction:column;gap:2px}
.nut-len-xuong button{width:28px;height:18px;padding:0;border:1px solid var(--vien);border-radius:5px;background:var(--trang);color:var(--chinh);
  font-size:10px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center}
.nut-len-xuong button:hover:not(:disabled){background:var(--chinh);color:#fff;border-color:var(--chinh)}
.nut-len-xuong button:disabled{opacity:.3;cursor:default}
tr.vua-doi td{animation:vua-doi 1s ease}
@keyframes vua-doi{from{background:color-mix(in srgb,var(--nhan) 22%,transparent)}to{background:transparent}}
/* ===================== v128 — HƯỚNG DẪN NỘI BỘ "TƯƠI và NĂNG LƯỢNG" — màu theo nhóm (--m / --c), nhãn loại bài ===================== */
.chip-tt.chip-nhom:not(.dang){background:color-mix(in srgb,var(--c) 8%,#fff);border-color:color-mix(in srgb,var(--c) 35%,transparent);color:var(--c)}
.chip-tt.chip-nhom .cham-loai{width:8px;height:8px;border-radius:50%;background:var(--c);display:inline-block}
.chip-tt.chip-nhom.dang .cham-loai{background:#fff}
.hd-ds{display:flex;flex-direction:column;gap:22px}
.hd-nhom-khoi{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px}
.hd-nhom{grid-column:1/-1;display:flex;align-items:center;gap:10px;margin:0;font-size:1.02rem;color:var(--m)}
.hd-vach{width:6px;height:22px;border-radius:4px;background:var(--m)}
.hd-the{display:flex;flex-direction:column;gap:6px;background:var(--trang);border:1px solid var(--vien);border-radius:12px;padding:14px 16px 12px 18px;
  color:var(--chu);box-shadow:inset 4px 0 0 var(--m);transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease}
.hd-the:hover{text-decoration:none;transform:translateY(-2px);border-color:color-mix(in srgb,var(--m) 45%,transparent);
  box-shadow:inset 4px 0 0 var(--m),0 10px 22px color-mix(in srgb,var(--m) 16%,transparent);background:color-mix(in srgb,var(--m) 4%,var(--trang))}
.hd-the-dau{display:flex;align-items:baseline;gap:7px;flex-wrap:wrap}
.hd-the-dau b{font-size:.98rem;line-height:1.35}
.hd-tom{font-size:.86rem;color:var(--chu-mo);line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hd-ghim{font-size:.85rem}
.hd-loai{--l:#5B6878;display:inline-block;padding:1px 8px;border-radius:99px;font-size:.7rem;font-weight:700;letter-spacing:.02em;white-space:nowrap;
  color:var(--l);background:color-mix(in srgb,var(--l) 12%,#fff);border:1px solid color-mix(in srgb,var(--l) 30%,transparent)}
.loai-bai-cach_dung{--l:#1C7ED6}.loai-bai-quy_trinh{--l:#E8590C}.loai-bai-quy_tac{--l:#C92A2A}
.hd-xem-phu{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:6px}
.hd-bai{box-shadow:inset 4px 0 0 var(--m);padding:22px 26px}
.hd-nd p{margin:0 0 .9em}
.hd-nd .hd-muc{font-size:.86rem;letter-spacing:.06em;color:var(--m);margin:1.4em 0 .5em;padding-left:10px;border-left:3px solid var(--m)}
.hd-nd .hd-muc:first-child{margin-top:0}
.hd-nd .hd-ke{border:0;border-top:1px solid color-mix(in srgb,var(--m) 30%,var(--vien));margin:1.2em 0}
.hd-cung-nhom h2{color:var(--m)}
:root[data-giao-dien="toi"] .chip-tt.chip-nhom:not(.dang){background:color-mix(in srgb,var(--c) 16%,transparent);color:color-mix(in srgb,var(--c) 55%,#fff)}
:root[data-giao-dien="toi"] .hd-nhom,:root[data-giao-dien="toi"] .hd-nd .hd-muc,:root[data-giao-dien="toi"] .hd-cung-nhom h2{color:color-mix(in srgb,var(--m) 60%,#fff)}
:root[data-giao-dien="toi"] .hd-the:hover{background:color-mix(in srgb,var(--m) 10%,var(--trang))}
:root[data-giao-dien="toi"] .hd-loai{background:color-mix(in srgb,var(--l) 20%,transparent);color:color-mix(in srgb,var(--l) 55%,#fff)}
@media (max-width:640px){ .hd-nhom-khoi{grid-template-columns:1fr} .hd-bai{padding:16px 16px} }

/* ---- v131 CPLATFORM-APP: dải nhắc trong app (mời bật thông báo · có bản APK mới) + khối Thông báo đẩy ---- */
.app-dai{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px;padding:10px 12px 10px 14px;border-radius:var(--r);
  --c:#0E7C66;background:color-mix(in srgb,var(--c) 9%,var(--trang));border:1px solid color-mix(in srgb,var(--c) 30%,var(--vien));
  color:var(--chu);font-size:.9rem;box-shadow:var(--bong)}
.app-dai[hidden]{display:none}
.app-dai > span{flex:1 1 auto;min-width:0}
@media (max-width:640px){ .app-dai{flex-wrap:nowrap;gap:8px;font-size:.86rem;padding:8px 6px 8px 12px} .app-dai .nut{white-space:nowrap} }
.app-dai::before{content:"";width:10px;height:10px;border-radius:50%;background:var(--c);flex:none;
  box-shadow:0 0 0 4px color-mix(in srgb,var(--c) 22%,transparent)}
.app-dai-moi{--c:var(--nhan)}
.app-dai .nut{min-height:32px}
.app-dai .nut-x{border:0;background:transparent;color:var(--chu-mo);font-size:20px;line-height:1;cursor:pointer;padding:2px 6px;border-radius:6px}
.app-dai .nut-x:hover{background:color-mix(in srgb,var(--c) 15%,transparent);color:var(--chu)}
.tb-day{margin-top:14px;--c:#0E7C66}
.tb-day-dau{display:flex;gap:12px;align-items:flex-start}
.tb-day-bieu{flex:none;width:34px;height:34px;border-radius:10px;display:grid;place-items:center;color:var(--c);
  background:color-mix(in srgb,var(--c) 13%,var(--trang))}
.tb-day-tt{margin:12px 0 10px;font-size:.88rem;font-weight:600;color:var(--c)}
.tb-day-tt:empty{display:none}
.tb-day-tt[data-tt="chua"]{color:var(--chu-mo)}
.tb-day-tt[data-tt="chan"],.tb-day-tt[data-tt="loi"],.tb-day-tt[data-tt="khong"]{color:#C2410C}
.tb-day-nut{gap:8px;flex-wrap:wrap;align-items:center}
.tb-day-nut [hidden]{display:none}
.tb-day-tai{margin-left:auto;font-weight:600}
.tb-day-ds{margin-top:14px;border-top:1px dashed var(--vien);padding-top:10px;display:grid;gap:6px}
.tb-day-may{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0;padding:6px 8px;border-radius:8px;background:var(--nen-2)}
.tb-day-ten{flex:1 1 140px;min-width:0;font-weight:500}
.nhan-nen{--m:#5B6B7F;font-size:11.5px;font-weight:700;padding:2px 8px;border-radius:99px;color:var(--m);
  background:color-mix(in srgb,var(--m) 14%,var(--trang))}
.nhan-nen.nen-android{--m:#2E8B3E}
.nhan-nen.nen-pwa{--m:#7A4BD0}
:root[data-giao-dien="toi"] .app-dai,:root[data-giao-dien="toi"] .tb-day{--c:#4CC9A6}
/* Trong app điện thoại: bỏ khoảng thừa cho màn hẹp */
html[data-app] .chinh{padding-top:16px}

/* ==== v133 HỘP THƯ CÓ SỨC SỐNG (QT-1: "đẹp nhất — hiện xám, thiếu sức sống") ====
   Mỗi thư mục một màu (--hm) dùng chung cho cột trái, đầu trang, hộp rỗng, nhãn thư mục khi đọc thư.
   Người gửi có ảnh chữ cái màu (anhChu), nhãn thư màu theo tên (mauTheoChu), khách hàng thành chip màu nhóm CRM. */
.hop-inbox{--hm:#1A73E8}.hop-starred{--hm:#E0A33E}.hop-sent{--hm:#0E7C66}.hop-drafts{--hm:#8B5CF6}.hop-spam{--hm:#E8590C}.hop-trash{--hm:#C92A2A}
:root[data-giao-dien="toi"] .hop-inbox{--hm:#6EA8FE}
:root[data-giao-dien="toi"] .hop-sent{--hm:#4CC9A6}
:root[data-giao-dien="toi"] .hop-drafts{--hm:#B197FC}
:root[data-giao-dien="toi"] .hop-trash{--hm:#FF8787}
/* cột trái */
.ben a.hop-muc .bieu,.ben .nhom-menu a.hop-muc .bieu,.ben .nhom-menu.co-mau a.hop-muc .bieu{width:26px;height:26px;border-radius:8px;opacity:1;
  color:#fff !important;background:var(--hm);box-shadow:0 2px 6px color-mix(in srgb,var(--hm) 35%,transparent);transition:transform .15s}
.ben .nhom-menu a.hop-muc:hover .bieu{transform:scale(1.06)}
.ben a.hop-muc.dang,.ben .nhom-menu.co-mau a.hop-muc.dang{background:color-mix(in srgb,var(--hm) 12%,var(--trang));box-shadow:inset 3px 0 0 var(--hm);color:var(--chu);font-weight:700}
.ben .nhom-menu.co-mau a.hop-muc:hover{background:color-mix(in srgb,var(--hm) 9%,transparent)}
.ben .nhom-menu a.hop-muc.dang .bieu{box-shadow:0 0 0 3px color-mix(in srgb,var(--hm) 25%,transparent)}
.so-hop{margin-left:auto;min-width:22px;padding:1px 7px;border-radius:99px;background:var(--hm);color:#fff;
  font-size:.72rem;font-weight:800;line-height:18px;text-align:center}
.vo.thu .ben a.hop-muc{position:relative}
.vo.thu .ben .so-hop{position:absolute;top:2px;right:6px;min-width:16px;padding:0 4px;font-size:.62rem;line-height:15px}
/* nút Soạn thư */
.ben .nut-soan{background:linear-gradient(135deg,#1A73E8,#12395F);box-shadow:0 6px 16px rgba(26,115,232,.28)}
.ben .nut-soan:hover{background:linear-gradient(135deg,#1866CF,#0C2740)}
/* đầu trang hộp thư */
.dau-hom{display:flex;align-items:center;gap:12px;margin:0 0 12px}
.dau-hom h1{margin:0;font-size:1.25rem}
.dau-hom-bieu{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;color:#fff;
  background:linear-gradient(135deg,var(--hm),color-mix(in srgb,var(--hm) 60%,#fff));box-shadow:0 6px 14px color-mix(in srgb,var(--hm) 30%,transparent)}
/* thanh công cụ */
.thanh-hom .o-tim-hom{border-radius:99px;padding:7px 14px 7px 34px;background:var(--trang) no-repeat 12px 50%/15px
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23808a99' stroke-width='2.2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E")}
.thanh-hom .viec-chon{background:color-mix(in srgb,#1A73E8 8%,var(--trang));border:1px solid color-mix(in srgb,#1A73E8 25%,transparent);
  border-radius:99px;padding:2px 10px 2px 6px}
.thanh-hom .viec-chon .nut-tron[data-action="trash"]:hover{color:#C92A2A;background:color-mix(in srgb,#C92A2A 12%,transparent)}
.thanh-hom .viec-chon .nut-tron[data-action="spam"]:hover{color:#E8590C;background:color-mix(in srgb,#E8590C 12%,transparent)}
/* danh sách thư */
.o.mong:has(.bang-thu){border-radius:14px;overflow:hidden}
.bang-thu tbody tr{transition:background .12s}
.bang-thu tbody tr:hover td{background:color-mix(in srgb,#1A73E8 5%,var(--trang))}
.bang-thu tbody tr.chua-doc td{background:color-mix(in srgb,#1A73E8 6%,var(--trang))}
.bang-thu tbody tr.chua-doc:hover td{background:color-mix(in srgb,#1A73E8 10%,var(--trang))}
.bang-thu tbody tr.chua-doc td:first-child{box-shadow:inset 4px 0 0 #1A73E8}
.nguoi-thu{display:flex;align-items:center;gap:10px;min-width:0}
.nguoi-thu .anh-chu{width:32px;height:32px;font-size:.74rem}
.nguoi-thu-chu{min-width:0;display:flex;flex-direction:column}
.nguoi-thu-chu a{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.nguoi-thu-chu .nho{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:.74rem}
.bang-thu tbody tr:not(.chua-doc) .nguoi-thu .anh-chu{opacity:.82}
.cot-gio{white-space:nowrap}
.cham-moi{display:inline-block;width:8px;height:8px;border-radius:50%;background:#1A73E8;margin-right:6px;vertical-align:1px;
  box-shadow:0 0 0 3px color-mix(in srgb,#1A73E8 20%,transparent)}
.bang-thu tbody tr.chua-doc .cot-gio{color:#1A73E8;font-weight:700}
.bang-thu .o-sao{font-size:1.1rem;transition:transform .12s}
.bang-thu .o-sao:hover{transform:scale(1.2);color:#E0A33E}
.bang-thu .o-sao.sang{color:#F2B200;text-shadow:0 1px 4px rgba(242,178,0,.35)}
.bang-thu td:nth-last-child(2) .bt{color:#8B5CF6}
/* nhãn thư có màu */
.the-nhan.co-mau{--nm:#5F6B7A;background:color-mix(in srgb,var(--nm) 13%,var(--trang));border-color:color-mix(in srgb,var(--nm) 30%,transparent);color:var(--nm)}
:root[data-giao-dien="toi"] .the-nhan.co-mau{color:color-mix(in srgb,var(--nm) 55%,#fff)}
/* chip khách hàng (màu nhóm khách trong CRM) */
.chip-khach{--kh:#12395F;display:inline-flex;align-items:center;gap:6px;max-width:100%;padding:3px 10px 3px 6px;border-radius:99px;
  background:color-mix(in srgb,var(--kh) 10%,var(--trang));border:1px solid color-mix(in srgb,var(--kh) 28%,transparent);
  color:var(--chu);font-weight:600;font-size:.8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chip-khach:hover{text-decoration:none;background:color-mix(in srgb,var(--kh) 18%,var(--trang))}
.chip-khach .cham-khach{box-shadow:0 0 0 2px color-mix(in srgb,var(--kh) 25%,transparent)}
/* hộp rỗng có minh hoạ */
.trong-thu{display:flex;flex-direction:column;align-items:center;gap:8px;padding:46px 16px 50px;text-align:center;color:var(--hm,#1A73E8)}
.trong-thu b{color:var(--chu);font-size:1.02rem}
/* ---- đọc thư ---- */
.o-doc-thu{border-radius:16px}
.o-doc-thu .dau-thu{background:linear-gradient(180deg,color-mix(in srgb,var(--hm,#1A73E8) 8%,var(--trang)),var(--trang));border-top:4px solid var(--hm,#1A73E8)}
.the-nhan.the-hop{background:color-mix(in srgb,var(--hm) 14%,var(--trang));border-color:color-mix(in srgb,var(--hm) 30%,transparent);color:var(--hm)}
.the-nhan.the-hop .bt{vertical-align:-2px}
.hang-nguoi-gui .anh-chu.lon{width:46px;height:46px;font-size:1rem}
.dai-khach{border-radius:99px;background:color-mix(in srgb,#0E7C66 8%,var(--trang));border-color:color-mix(in srgb,#0E7C66 25%,transparent)}
.chu-thu{background:var(--trang);border-color:var(--vien);border-radius:12px;line-height:1.65}
.khoi-kem .tep{--tp:#5F6B7A;border-radius:12px;background:var(--trang);border:1px solid color-mix(in srgb,var(--tp) 25%,var(--vien));padding:8px 12px 8px 8px}
.khoi-kem .tep:hover{background:color-mix(in srgb,var(--tp) 7%,var(--trang));border-color:var(--tp)}
.tep-loai{flex:none;display:grid;place-items:center;min-width:40px;height:34px;padding:0 5px;border-radius:8px;background:var(--tp);color:#fff;
  font-size:.66rem;font-weight:800;letter-spacing:.03em}
.nut-tron-vien.nut-tra-loi{background:#1A73E8;border-color:#1A73E8;color:#fff;box-shadow:0 6px 14px rgba(26,115,232,.25)}
.nut-tron-vien.nut-tra-loi:hover{background:#1866CF;border-color:#1866CF;color:#fff}
.nut-tron-vien.nut-chuyen-tiep{color:#0E7C66;border-color:color-mix(in srgb,#0E7C66 40%,transparent)}
.nut-tron-vien.nut-chuyen-tiep:hover{background:color-mix(in srgb,#0E7C66 9%,var(--trang));border-color:#0E7C66}
/* ---- soạn thư ---- */
.hop-soan .dau-soan{background:linear-gradient(135deg,#12395F,#1A73E8);color:#fff;border-bottom:none}
.hop-soan .dau-soan h2{color:#fff;display:flex;align-items:center;gap:9px}
.dau-soan-bieu{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:rgba(255,255,255,.18)}
.hop-soan .dau-soan .nut-dong{color:rgba(255,255,255,.85)}
.hop-soan .dau-soan .nut-dong:hover{background:rgba(255,255,255,.15);color:#fff}
.hop-soan .dong-soan label{color:#1A73E8;font-weight:700}
.nut-gui-thu{display:inline-flex;align-items:center;gap:7px;background:linear-gradient(135deg,#1A73E8,#12395F);border:none;
  box-shadow:0 6px 14px rgba(26,115,232,.28)}
.hop-soan .ds-kem .tep{border-radius:99px;background:color-mix(in srgb,#8B5CF6 9%,var(--trang));border-color:color-mix(in srgb,#8B5CF6 28%,transparent)}
/* ---- điện thoại: mỗi thư một thẻ (ảnh chữ · tên · giờ / tiêu đề / trích đoạn) ---- */
@media (max-width:760px){
  .bang-thu thead{display:none}
  .bang-thu,.bang-thu tbody{display:block}
  .bang-thu tbody tr{display:grid;grid-template-columns:30px minmax(0,1fr) auto 26px;grid-template-areas:"tich nguoi gio sao" "tich noi noi noi" "tich khach khach kem";
    align-items:center;column-gap:8px;padding:10px 12px 10px 8px;border-bottom:1px solid var(--vien)}
  .bang-thu tbody tr td{display:block;padding:0;border:0;background:none !important;box-shadow:none !important}
  .bang-thu tbody tr.chua-doc{background:color-mix(in srgb,#1A73E8 6%,var(--trang));box-shadow:inset 4px 0 0 #1A73E8}
  .bang-thu tbody tr td:nth-child(1){grid-area:tich;align-self:start;padding-top:8px}
  .bang-thu tbody tr td:nth-child(2){grid-area:sao;text-align:right}
  .bang-thu tbody tr td:nth-child(3){grid-area:nguoi}
  .bang-thu tbody tr td:nth-child(4){grid-area:noi;padding:4px 0 0 42px;font-size:.9rem}
  .bang-thu tbody tr td:nth-child(5){grid-area:khach;padding:4px 0 0 42px}
  .bang-thu tbody tr td:nth-child(5) > .mo{display:none}
  .bang-thu tbody tr td:nth-child(6){grid-area:kem;text-align:right}
  .bang-thu tbody tr td:nth-child(7){grid-area:gio;text-align:right}
  .bang-thu tbody tr td[colspan]{grid-column:1/-1}
  .bang-thu .cot-noi-dung .trich{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
  .nguoi-thu-chu .nho{display:none}
  .dau-hom{margin-bottom:8px}
  .thanh-hom .viec-chon{border-radius:12px}
}

/* ==== v135 KHOẢN CHI ĐỊNH KỲ (/finance/recurring) — màu theo danh mục (--m, mauTheoChu), trạng thái theo nhãn màu chung ==== */
.cdk-so .o-so{border-top:3px solid var(--m,var(--chinh))}
.o-so-chi{border-top:3px solid #D9480F}
.o-so-thu{border-top:3px solid #188038}
.cdk-h2{display:flex;align-items:center;gap:8px;padding:14px 16px 4px;margin:0}
.cdk-h2 .bt{color:#D9480F}
/* thẻ khoản */
.cdk-luoi{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:14px;margin:4px 0 20px}
.cdk-the{display:flex;flex-direction:column;gap:10px;padding:14px 16px;border-radius:14px;background:var(--trang);color:var(--chu);
  border:1px solid color-mix(in srgb,var(--m) 22%,var(--vien));border-left:4px solid var(--m);box-shadow:var(--bong);transition:transform .14s,box-shadow .14s}
.cdk-the:hover{text-decoration:none;transform:translateY(-2px);box-shadow:0 12px 26px color-mix(in srgb,var(--m) 16%,transparent)}
.cdk-the.tt-ket_thuc,.cdk-the.tt-tu_choi{opacity:.72}
.cdk-luoi > *{min-width:0}
.cdk-the-chan > span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cdk-the-dau .nhan{flex:none}
.cdk-the-dau{display:flex;align-items:center;gap:10px;min-width:0}
.cdk-the-ten{flex:1;min-width:0;display:flex;flex-direction:column}
.cdk-the-ten b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--chinh-dam)}
.cdk-the-ten .nho{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cdk-the-so{display:flex;align-items:baseline;gap:6px;flex-wrap:wrap}
.cdk-the-so b{font-size:1.3rem;color:var(--chu);font-variant-numeric:tabular-nums}
.cdk-the-chan{display:flex;justify-content:space-between;gap:8px;font-size:.82rem;border-top:1px dashed var(--vien);padding-top:8px}
.cdk-ky-toi{display:inline-flex;align-items:center;gap:5px;color:var(--chu-mo)}
.cdk-ky-toi.gan{color:#D9480F;font-weight:700}
/* trống */
.cdk-trong{text-align:center;padding:40px 18px}
.cdk-trong-bieu{display:inline-grid;place-items:center;width:62px;height:62px;border-radius:18px;margin-bottom:10px;color:#fff;
  background:linear-gradient(135deg,#D9480F,#F59F00);box-shadow:0 10px 24px rgba(217,72,15,.28)}
.cdk-trong b{display:block;font-size:1.05rem;margin-bottom:4px}
.cdk-trong p{max-width:56ch;margin:0 auto 14px}
/* lịch chi 30 ngày */
.cdk-lich td{vertical-align:middle}
.cdk-ngay{width:64px}
.cdk-lich-ngay{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;width:46px;height:48px;border-radius:12px;
  background:color-mix(in srgb,#D9480F 9%,var(--trang));border:1px solid color-mix(in srgb,#D9480F 25%,transparent);color:#D9480F;line-height:1.05}
.cdk-lich-ngay b{font-size:1.15rem}
.cdk-lich-ngay small{font-size:.7rem;font-weight:700;opacity:.85}
.cdk-lich tr.gan .cdk-lich-ngay{background:#D9480F;color:#fff}
.cdk-lich tr.qua-han .cdk-lich-ngay{background:#C5221F;border-color:#C5221F;color:#fff}
.cdk-lich tr.qua-han td{background:color-mix(in srgb,#C5221F 5%,var(--trang))}
/* form 3 khối */
.cdk-form{max-width:980px}
.cdk-khoi{border-top:4px solid var(--m)}
.cdk-khoi h2{display:flex;align-items:center;gap:10px;font-size:1.02rem}
.cdk-so-khoi{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:var(--m);color:#fff;font-size:.85rem;font-weight:800}
.cdk-chon-chu-ky{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0 14px}
.cdk-chon-chu-ky label{margin:0;cursor:pointer}
.cdk-chon-chu-ky input{position:absolute;opacity:0;pointer-events:none}
.cdk-chon-chu-ky span{display:inline-block;padding:8px 16px;border-radius:99px;border:1.5px solid var(--vien);font-weight:600;font-size:.9rem;background:var(--trang)}
.cdk-chon-chu-ky input:checked + span{background:#D9480F;border-color:#D9480F;color:#fff;box-shadow:0 4px 12px rgba(217,72,15,.25)}
.cdk-chon-chu-ky input:focus-visible + span{outline:2px solid #D9480F;outline-offset:2px}
.cdk-tich{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:12px;cursor:pointer;margin:0;
  background:color-mix(in srgb,#D9480F 6%,var(--trang));border:1px dashed color-mix(in srgb,#D9480F 35%,transparent)}
.cdk-tich input{margin-top:3px}
.cdk-tich span{display:flex;flex-direction:column;gap:2px;font-weight:400}
.cdk-luu{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:4px 0 30px}
/* xem khoản */
.cdk-dau{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin:0 0 16px;padding:18px 20px;border-radius:16px;
  background:linear-gradient(120deg,color-mix(in srgb,var(--m) 12%,var(--trang)),var(--trang) 70%);border:1px solid color-mix(in srgb,var(--m) 25%,var(--vien))}
.cdk-dau h1{margin:0}
.cdk-dau-chu{flex:1 1 300px;min-width:0}
.cdk-dau-so{margin-top:4px;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.cdk-dau-so b{font-size:1.5rem;color:var(--chinh-dam);font-variant-numeric:tabular-nums}
.cdk-dau-viec{gap:8px;flex-wrap:wrap}
.cdk-duyet{display:flex;align-items:center;gap:14px;flex-wrap:wrap;border:1.5px solid color-mix(in srgb,#E8710A 45%,var(--vien));
  background:color-mix(in srgb,#E8710A 7%,var(--trang))}
.cdk-duyet-bieu{display:grid;place-items:center;width:44px;height:44px;border-radius:13px;background:#E8710A;color:#fff;flex:none}
.cdk-duyet-chu{flex:1 1 280px}
.cdk-duyet-chu p{margin:3px 0 0}
.cdk-duyet-nut{display:flex;gap:8px;align-items:flex-start;flex-wrap:wrap}
.cdk-tu-choi summary,.cdk-chi-tiet summary{list-style:none;cursor:pointer}
.cdk-tu-choi summary::-webkit-details-marker,.cdk-chi-tiet summary::-webkit-details-marker{display:none}
.cdk-o-ly-do,.cdk-o-so{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:8px}
.cdk-o-ly-do input,.cdk-o-so input{flex:1 1 140px;min-width:120px;padding:7px 10px;font-size:.88rem}
.cdk-o-so input[name="so_tien"]{flex:0 1 130px;font-variant-numeric:tabular-nums}
.cdk-hai-cot{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:16px}
.cdk-dl{display:grid;grid-template-columns:max-content 1fr;gap:9px 16px;margin:0;font-size:.92rem}
.cdk-dl dt{color:var(--chu-mo)}
.cdk-dl dd{margin:0;font-weight:500}
.cdk-cham{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px;vertical-align:1px}
.cdk-buoc{margin:0;padding:0;list-style:none;counter-reset:b;display:grid;gap:12px}
.cdk-buoc li{counter-increment:b;display:grid;grid-template-columns:30px 1fr;column-gap:10px;font-size:.9rem}
.cdk-buoc li::before{content:counter(b);grid-row:span 2;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;
  background:#D9480F;color:#fff;font-weight:800;font-size:.82rem}
.cdk-buoc li:nth-child(2)::before{background:#188038}
.cdk-buoc li:nth-child(3)::before{background:#8430CE}
.cdk-buoc li span{color:var(--chu-mo)}
.cdk-ky td{vertical-align:top}
.cdk-ky tr.cdk-sap-toi td{background:var(--nen-2);color:var(--chu-mo)}
.cdk-ky tr.tt-can_nhap td:first-child{box-shadow:inset 3px 0 0 #E8710A}
.cdk-ky tr.tt-vuot_cho_duyet td:first-child,.cdk-ky tr.tt-phieu_huy td:first-child{box-shadow:inset 3px 0 0 #C5221F}
.cdk-ky tr.tt-da_chi td:first-child{box-shadow:inset 3px 0 0 #188038}
.cdk-ky tr:target td{background:color-mix(in srgb,#E8710A 9%,var(--trang))}
.cdk-viec{min-width:230px}
.cdk-viec .cdk-chi-tiet{margin-top:4px}
.cdk-link{text-decoration:underline dotted}
@media (max-width:860px){ .cdk-hai-cot{grid-template-columns:1fr} }
@media (max-width:640px){
  .cdk-luoi{grid-template-columns:1fr}
  .cdk-the-chan{flex-direction:column;gap:3px}
  .cdk-the-dau .nhan{font-size:.7rem;padding:1px 7px}
  .cdk-dau{padding:14px}
  .cdk-ky thead{display:none}
  .cdk-ky,.cdk-ky tbody,.cdk-ky tr,.cdk-ky td{display:block}
  .cdk-ky tr{padding:10px 12px;border-bottom:1px solid var(--vien)}
  .cdk-ky td{border:0;padding:2px 0;text-align:left !important}
  .cdk-viec{min-width:0}
}

/* v137: ô chọn màu thương hiệu (Cài đặt hệ thống › Thương hiệu) */
.o-chon-mau-th{display:inline-flex;align-items:center;gap:10px}
.o-chon-mau-th input[type=color]{width:56px;height:38px;padding:3px;border-radius:10px;border:1px solid var(--vien);background:var(--trang);cursor:pointer}
.o-chon-mau-th code{font-size:.9rem}

/* v140: trình sửa KHỐI của mẫu trang (Quản trị › Trang — public/js/khoi-trang.js) */
.kt-chung{margin-top:14px;padding:14px 16px;border:1px dashed var(--vien);border-radius:12px}
.kt-chung-td{margin:0 0 10px;font-size:1rem}
.kt-dau-en{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.kt-dau-en h2{margin:0}
.kt-khoi-ds{display:flex;flex-direction:column;gap:10px;margin-top:12px}
.kt-khoi{border:1px solid var(--vien);border-radius:12px;background:var(--trang)}
.kt-khoi>summary{cursor:pointer;padding:12px 16px;display:flex;align-items:center;gap:10px;list-style:none}
.kt-khoi>summary::-webkit-details-marker{display:none}
.kt-khoi>summary::before{content:'▸';color:var(--mo, #6b7280);transition:transform .15s}
.kt-khoi[open]>summary::before{transform:rotate(90deg)}
.kt-khoi.trong>summary b{color:var(--mo, #6b7280);font-weight:500}
.kt-trang-thai{font-size:.82rem;color:var(--mo, #6b7280)}
.kt-khoi>.kt-nhom{padding:4px 16px 16px}
.kt-nhom{display:flex;flex-direction:column;gap:12px}
.kt-nhom-ngang{flex-direction:row;flex-wrap:wrap}
.kt-nhom-ngang>.kt-truong{flex:1 1 220px}
.kt-truong{display:flex;flex-direction:column;gap:5px;min-width:0}
.kt-nhan{font-weight:500;font-size:.9rem}
.kt-truong-bat .kt-nhan{display:flex;align-items:center;gap:8px;font-weight:400;cursor:pointer}
.kt-truong input[type=text],.kt-truong textarea,.kt-truong select{width:100%;box-sizing:border-box}
.kt-goi{margin:0}
.kt-ds{display:flex;flex-direction:column;gap:8px;counter-reset:kt-muc}
.kt-muc{display:flex;gap:8px;align-items:flex-start;counter-increment:kt-muc}
.kt-muc-than{flex:1;min-width:0}
.kt-ds-the>.kt-muc>.kt-muc-than,.kt-ds-nut>.kt-muc>.kt-muc-than{border:1px solid var(--vien);border-radius:10px;padding:10px 12px;position:relative}
.kt-ds-the>.kt-muc>.kt-muc-than::before{content:'#' counter(kt-muc);position:absolute;top:-9px;left:10px;padding:0 6px;font-size:.75rem;background:var(--trang);color:var(--mo, #6b7280)}
.kt-ds-nut>.kt-muc>.kt-muc-than>.kt-nhom{flex-direction:row;flex-wrap:wrap}
.kt-ds-nut>.kt-muc>.kt-muc-than>.kt-nhom>.kt-truong{flex:1 1 200px}
.kt-muc-nut{display:flex;gap:4px;flex:none;padding-top:2px}
.kt-nut-nho{width:30px;height:30px;border:1px solid var(--vien);border-radius:8px;background:var(--trang);cursor:pointer;line-height:1;color:inherit}
.kt-nut-nho:hover{background:rgba(0,0,0,.05)}
.kt-them{align-self:flex-start}
.kt-hang{display:flex;gap:8px;flex-wrap:wrap}
.kt-o{display:flex;flex-direction:column;gap:3px;flex:1 1 160px;min-width:0}
.kt-o-d{flex:3 1 280px}
.kt-o-bieu,.kt-o-m{flex:0 1 auto}
.kt-o-nhan{font-size:.75rem;color:var(--mo, #6b7280)}
.kt-o textarea{width:100%;box-sizing:border-box}
.kt-bieu{display:inline-flex;align-items:center;gap:6px}
.kt-bieu-xem{display:inline-flex;width:22px;height:22px;align-items:center;justify-content:center}
.kt-mau{display:inline-flex;align-items:center;gap:6px}
.kt-mau input[type=color]{width:40px;height:34px;padding:2px;border-radius:8px;border:1px solid var(--vien);background:var(--trang);cursor:pointer}
.kt-mau .kt-mau-ma{width:96px !important}
.kt-anh{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.kt-anh img{width:84px;height:52px;object-fit:cover;border-radius:6px;border:1px solid var(--vien);background:#f3f4f6}
.kt-anh input[type=text]{flex:1 1 180px;width:auto}
@media (max-width:640px){.kt-muc{flex-direction:column}.kt-muc-nut{align-self:flex-end}}

/* v142: bản demo — dải trên đầu khu nội bộ + hộp tài khoản ở trang đăng nhập */
.dai-demo{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 14px;padding:10px 14px;border-radius:12px;
  background:linear-gradient(90deg,#FFF4E5,#FFFBF2);border:1px solid #F5C77E;color:#7A4A00;font-size:.9rem}
.dai-demo b{color:#B35C00;letter-spacing:.04em}
:root[data-giao-dien="toi"] .dai-demo{background:#3A2A12;border-color:#7A5420;color:#F5D9A8}
.dn-demo{margin:0 0 16px;padding:12px 14px;border-radius:12px;background:#FFF4E5;border:1px solid #F5C77E;color:#7A4A00;font-size:.88rem;line-height:1.5}
.dn-demo b{color:#B35C00}
.dn-demo-tk{margin-top:6px}
/* v252 "bấm là vào": nút vào thẳng ở trang đăng nhập + nút nổi Đăng ký dùng thử trên mọi trang demo */
.dn-demo-vao{display:inline-flex;margin-top:10px;background:#B35C00;border-color:#B35C00}
.dn-demo-vao:hover{background:#8F4900;border-color:#8F4900}
.demo-noi{position:fixed;left:18px;bottom:18px;z-index:60;display:inline-flex;align-items:center;gap:6px;padding:11px 18px;border-radius:999px;
  background:#B35C00;color:#fff;font-weight:700;font-size:.92rem;text-decoration:none;box-shadow:0 8px 24px rgba(179,92,0,.35)}
.demo-noi:hover{background:#8F4900;color:#fff}
@media (max-width:640px){.demo-noi{left:12px;bottom:12px;padding:9px 14px;font-size:.85rem}}
@media print{.demo-noi{display:none}}
.dn-demo code{background:#fff;padding:1px 6px;border-radius:6px;border:1px solid #F0D3A2;color:#1F1F1F}

/* v142: Quản trị › Hệ thống › Bộ nhớ Agent */
.am-luoi{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:16px;align-items:start}
.am-luoi>.o{margin:0}
.am-khoa-moi{border:2px solid #0E7C66;background:color-mix(in srgb,#0E7C66 6%,var(--trang,#fff))}
.am-khoa-moi h2{margin-top:0}
.am-khoa-chu{display:block;padding:12px 14px;border-radius:10px;background:var(--trang,#fff);border:1px dashed #0E7C66;font-size:1rem;word-break:break-all;user-select:all}
.am-bang{width:100%}
.am-tat{opacity:.55}
.am-tao{display:grid;grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:10px;align-items:end;margin:6px 0 16px;padding:12px;border-radius:12px;background:color-mix(in srgb,var(--th-chinh,#12395F) 4%,transparent);border:1px solid var(--vien)}
/* v146: cảnh báo trang menu CẢ CÔNG TY (quản trị viên dễ tưởng là cài đặt riêng) */
.bao-cty-ca{margin:0 0 14px;padding:12px 14px;border-radius:12px;background:#FFF4E5;border:1px solid #F5C77E;color:#7A4A00;font-size:.92rem;line-height:1.55}
.bao-cty-ca b{color:#B35C00}
.bao-cty-ca a{font-weight:600;white-space:nowrap}
:root[data-giao-dien="toi"] .bao-cty-ca{background:#3A2A12;border-color:#7A5420;color:#F5D9A8}
/* v143: dung lượng bộ nhớ — giới hạn cứng theo giấy phép */
.am-dung-luong{margin-bottom:16px}
.am-dl-dau{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.am-dl-dau h2{margin:0 auto 0 0}
.am-thanh{height:10px;border-radius:999px;background:color-mix(in srgb,var(--th-chinh,#12395F) 10%,transparent);overflow:hidden;margin:10px 0 8px}
.am-thanh span{display:block;height:100%;border-radius:999px;background:#0E7C66;min-width:2px}
.am-thanh.vang span{background:#E8A317}
.am-thanh.do span{background:#D64545}
.am-tao .truong{margin:0}
.am-dl{display:grid;grid-template-columns:auto 1fr;gap:6px 12px;margin:0 0 12px}
.am-dl dt{font-weight:600}
.am-dl dd{margin:0;word-break:break-all}
.am-api td{vertical-align:top}
.am-api code{word-break:break-all}
.am-pre{background:#0F172A;color:#E2E8F0;padding:12px 14px;border-radius:10px;overflow:auto;font-size:.82rem;line-height:1.5;white-space:pre}
.am-noi-dung{white-space:pre-wrap;word-break:break-word;max-height:none;font-size:.88rem}
.am-vung{display:flex;flex-wrap:wrap;gap:10px}
.am-vung-the{display:flex;flex-direction:column;gap:2px;padding:10px 14px;border:1px solid var(--vien);border-radius:12px;text-decoration:none;color:inherit;min-width:180px}
.am-vung-the.dang{border-color:var(--th-chinh,#12395F);box-shadow:0 0 0 2px color-mix(in srgb,var(--th-chinh,#12395F) 25%,transparent)}
.am-vung-the span{font-size:.82rem}
.am-loc{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.am-loc input[type=search]{flex:1 1 240px}
.am-the{margin:2px 4px 0 0;font-size:.72rem}
.am-mo-ta{max-width:420px}
.am-trang{justify-content:flex-end;gap:8px;margin-top:10px}
@media (max-width:1000px){.am-luoi{grid-template-columns:1fr}}

/* v155: Quản trị › Dọn dẹp */
.dd-dl-dau{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.dd-dl-dau h2{margin:0}
.dd-bang{display:grid;gap:6px;margin-top:12px}
.dd-dong{display:grid;grid-template-columns:minmax(120px,200px) 1fr 80px 90px;gap:10px;align-items:center}
.dd-thanh{height:8px;border-radius:99px;background:var(--nen-2);overflow:hidden}
.dd-thanh span{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--chinh),#5B8FD0)}
.dd-luoi{display:grid;grid-template-columns:repeat(auto-fill,minmax(360px,1fr));gap:16px;align-items:start}
.dd-muc{margin:0}
.dd-muc-dau{display:flex;gap:12px;align-items:flex-start}
.dd-muc-dau h2{margin:0 0 2px;font-size:1.05rem}
.dd-muc-dau p{margin:0}
.dd-chu{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:var(--nen-2);font-weight:800;text-transform:uppercase;color:var(--chinh)}
.dd-ngay{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:12px 0 0}
.dd-ngay label{display:flex;align-items:center;gap:6px;margin:0}
.dd-ngay input{width:90px;margin:0}
.dd-ket{margin:12px 0 8px}
.dd-mau{list-style:none;padding:0;margin:0 0 12px;display:grid;gap:6px;font-size:.88rem;max-height:220px;overflow:auto}
.dd-mau li{padding:6px 8px;border:1px solid var(--vien);border-radius:8px}
.dd-h{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 10px}
.dd-anh{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px;margin:0 0 12px;max-height:520px;overflow:auto}
.dd-anh-o{display:flex;flex-direction:column;gap:3px;padding:6px;border:1px solid var(--vien);border-radius:10px;cursor:pointer;margin:0;position:relative}
.dd-anh-o input{position:absolute;top:10px;left:10px;width:auto;margin:0}
.dd-anh-o img{width:100%;height:90px;object-fit:cover;border-radius:6px;background:var(--nen-2)}
.dd-anh-o:has(input:checked){border-color:#B3261E;box-shadow:0 0 0 2px rgba(179,38,30,.2)}
.dd-anh-o span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
@media (max-width:640px){ .dd-dong{grid-template-columns:1fr 70px} .dd-dong .dd-thanh,.dd-dong .mo{display:none} }

/* v156: Quản trị › Xuất toàn bộ dữ liệu */
.xd-luoi{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:16px;align-items:start}
.xd-ds{margin:0 0 12px;padding-left:1.2em;display:grid;gap:6px}
.xd-form{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;margin:14px 0 6px}
.xd-form .truong{margin:0;min-width:240px}
.xd-dl{display:grid;grid-template-columns:1fr;gap:2px;margin:0}
.xd-dl dt{color:var(--chu-mo);font-size:.85rem;margin-top:8px}
.xd-dl dd{margin:0;overflow-wrap:anywhere}
@media (max-width:900px){ .xd-luoi{grid-template-columns:1fr} }

/* v158: hành trình khách trên web */
.hj{margin-top:6px;font-size:.85rem;color:var(--chu)}
.hj summary{cursor:pointer;color:var(--chinh);font-weight:600;list-style:none}
.hj summary::-webkit-details-marker{display:none}
.hj-ds{margin:6px 0 4px;padding-left:1.4em;display:grid;gap:3px}
.hj-ds code{background:none;padding:0}

/* v159: Trợ lý AI */
.ai-luat{margin:0 0 12px;padding-left:1.2em;display:grid;gap:3px}
.ai-ngay{display:flex;flex-wrap:wrap;gap:4px 12px;margin:4px 0 10px}
.ai-gio .truong{max-width:160px}
.ai-tra{margin-top:12px;padding:12px 14px;border-radius:12px;background:var(--nen-2);border:1px solid var(--vien)}
.ai-tra.loi{background:#FDECEA;border-color:#F3B8B2;color:#8C1D18}
/* v161 — KHÁCH NÓNG (crm/lien-he.ejs, src/khach-nong.js): ô "Gọi trước", nhãn điểm + vì sao, đã gọi, cài đặt */
.kn-goi{border-left:4px solid #C0392B}
.kn-goi h2{display:flex;align-items:center;gap:8px;margin:0 0 4px}
.kn-ds{list-style:none;margin:10px 0 0;padding:0}
.kn-dong{display:flex;align-items:center;gap:12px;padding:9px 0;border-top:1px solid var(--vien)}
.kn-dong:first-child{border-top:0}
.kn-dong>.nhan{flex:0 0 auto;min-width:92px;text-align:center}
.kn-ai{flex:1 1 auto;min-width:0}
.kn-lien{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.kn-lien form{margin:0}
.kn-tre{color:#B03A2E;font-weight:600}
:root[data-giao-dien="toi"] .kn-tre{color:#F0A8A8}
.kn-vi-sao{margin-top:4px}
.kn-vi-sao summary{cursor:pointer;list-style:none;display:inline-block}
.kn-vi-sao summary::-webkit-details-marker{display:none}
.kn-vi-sao ul{list-style:none;margin:6px 0 0;padding:6px 8px;background:var(--nen-2);border-radius:6px;font-size:.82rem;min-width:220px}
.kn-vi-sao li{display:flex;justify-content:space-between;gap:10px}
.kn-da-goi{margin-top:4px;color:var(--chu-mo)}
.kn-da-goi form{display:inline;margin:0}
.kn-bo{background:none;border:0;padding:0 0 0 4px;color:var(--chu-mo);text-decoration:underline;cursor:pointer;font:inherit}
.kn-cai-dat>summary{cursor:pointer}
.kn-luat{max-width:520px;margin-bottom:14px}
.kn-luat td{padding:3px 8px}
@media (max-width:640px){.kn-dong{flex-wrap:wrap}.kn-lien{width:100%;justify-content:flex-start}}
/* v162 — AI ĐÃ CÀI CPLATFORM-APP (views/cai-app.ejs) */
.ca-dem{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:14px}
.ca-o{display:flex;flex-direction:column;gap:2px;padding:12px 14px;margin:0}
.ca-o b{font-size:1.5rem;line-height:1.2}
.ca-o span{font-size:.85rem;color:var(--chu-mo)}
.ca-o.do b{color:#B03A2E}
:root[data-giao-dien="toi"] .ca-o.do b{color:#F0A8A8}
.ca-bang td{vertical-align:top}
@media (max-width:760px){.ca-dem{grid-template-columns:1fr 1fr}}
/* v164 — HỖ TRỢ TTP (tin-nhan.ejs, admin.js veThe): thẻ phương án / đã cập nhật */
.tn-anh.ho-tro{background:#FDF5E4;color:#6D5417}
.tn-the{margin-top:6px;padding:10px 12px;border-radius:12px;background:var(--nen-2);border:1px solid var(--vien);color:var(--chu);min-width:min(240px,100%)}
.tn-the.the-cap-nhat{background:#E8F3EC;border-color:#BBD9C6;color:#1E5233}
.tn-the-dau{font-weight:700;margin-bottom:4px}
.tn-the-mo{white-space:pre-line;font-size:.92rem}
.tn-the-meta{font-size:.82rem;color:var(--chu-mo);margin-top:6px}
.tn-the-nut{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
.tn-the-kq{margin-top:8px;font-weight:600;font-size:.88rem}
.tn-the-kq.xanh{color:#1E5233}
.tn-the-kq.do{color:#8A2B2B}
:root[data-giao-dien="toi"] .tn-the.the-cap-nhat{background:#14301F;border-color:#2C5A3C;color:#9ADCB4}
:root[data-giao-dien="toi"] .tn-the-kq.xanh{color:#9ADCB4}
:root[data-giao-dien="toi"] .tn-the-kq.do{color:#F0A8A8}

/* v167 — KHUNG CHÚC MỪNG GỘP trên Trang chủ (views/home.ejs) */
.cm-ds{list-style:none;margin:8px 0 0;padding:0}
.cm-ds li{display:flex;align-items:center;gap:12px;padding:9px 0;border-top:1px solid var(--vien)}
.cm-ds li:first-child{border-top:0}
.cm-ds li.moi .cm-chu strong{color:#12395F}
.cm-ds .cm-chu{flex:1;min-width:0}
.cm-ds form{margin:0}
:root[data-giao-dien="toi"] .cm-ds li.moi .cm-chu strong{color:#9EC6EE}

/* v189: nút chọn tài khoản trên QR — khối tài khoản đang ẩn không bị luật display của khung đè */
[data-tk-o][hidden]{display:none !important}
.chon-tk-nut{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 12px}
.chon-tk-nut button{border:1px solid var(--vien,#cfd8e3);background:transparent;color:inherit;border-radius:999px;padding:6px 14px;font:inherit;font-size:.9rem;cursor:pointer}
.chon-tk-nut button[aria-pressed="true"]{background:#12395F;border-color:#12395F;color:#fff;font-weight:600}

/* v190: hộp tạo yêu cầu thanh toán — mỗi lựa chọn (còn nợ / gia hạn) một thẻ bấm được */
.the-chon-yctt{display:flex;gap:10px;align-items:flex-start;padding:10px 12px;margin:0 0 8px;border:1px solid var(--vien);border-radius:10px;cursor:pointer;font-weight:400}
.the-chon-yctt:has(input:checked){border-color:#12395F;background:rgba(18,57,95,.05)}
.the-chon-yctt input{margin-top:3px}

/* v192 (chị Huệ, Android: khung chuông tràn mép trái — chữ bị cắt): ở màn ≤ 640px mọi khung thả xuống của thanh đầu (chuông, ngôn ngữ,
   tài khoản) bám theo MÀN HÌNH, cách 2 mép 12px — cùng cách sửa bảng Phân hệ v169 */
@media (max-width:640px){
  .menu-xo.menu-tb,.menu-xo.menu-nn,.menu-xo.menu-toi{position:fixed;left:12px;right:12px;top:62px;width:auto;min-width:0;max-width:none;
    max-height:calc(100vh - 80px);overflow-y:auto}
  .menu-tb .ds-tb{max-height:calc(100vh - 190px)}
}
/* v201: đề nghị có khách — khối thông tin khách trong hộp tạo + trang xem */
.dnk-o{border:1px dashed var(--vien);border-radius:10px;padding:10px 12px;margin:0 0 12px;background:var(--nen-2)}
.dnk-o[hidden]{display:none}
.dnk-xem{border:1px solid var(--vien);border-radius:10px;padding:10px 12px;margin:0 0 12px}
/* v200: yêu cầu gia hạn — ô trạng thái + nút nhanh ở sổ Bán hàng */
.yc-o{min-width:170px}
/* v204 (ông chủ 16:49): 4 nút gia hạn ĐỒNG CỠ — lưới 2×2, mỗi nút cùng khổ, có chữ, cách nhau 8px (điện thoại: cao 44px, cách 10px) */
/* v205 (ông chủ 17:16): ✉ · Zalo · 📞 MỘT HÀNG, nút vuông cao bằng nút Gia hạn (máy tính 30px, điện thoại 40px) — không bao giờ xuống dòng */
.yc-nut{display:flex;flex-wrap:nowrap;gap:6px;margin-top:6px}
.yc-nut form,.yc-nut details{margin:0;min-width:0}
.yc-btn{display:inline-flex;align-items:center;justify-content:center;gap:4px;width:30px;height:30px;flex:none;margin:0;padding:0;box-sizing:border-box;
  border:1px solid var(--vien-dam);border-radius:7px;background:var(--trang);color:var(--chinh);font:inherit;font-size:.8rem;font-weight:600;
  line-height:1.15;text-align:center;text-decoration:none;cursor:pointer;-webkit-tap-highlight-color:transparent;white-space:nowrap}
.yc-btn:hover{border-color:var(--chinh);text-decoration:none}
.yc-btn:active{transform:translateY(1px)}
.yc-btn-do{color:#B3261E;border-color:#E8B4B0}
.yc-zalo{font-size:10.5px;font-weight:800;letter-spacing:-.2px;color:#0068FF}
:root[data-giao-dien="toi"] .yc-zalo{color:#6FA8FF}
/* ô nhập lý do "Không gia hạn" cạnh nút Gia hạn: nhãn · ô · nút xếp dọc, không tràn */
.dv-thao-tac .xoa-nham-o{display:grid;gap:6px;text-align:left}
.dv-thao-tac .xoa-nham-o input{width:100%;margin:0}
.dv-thao-tac .xoa-nham-o .nut{margin-top:2px!important;justify-self:end}
summary.yc-btn{list-style:none}
summary.yc-btn::-webkit-details-marker{display:none}
/* v205 (ông chủ 17:10–17:12): nút VUÔNG cùng cao nút Gia hạn — ✕ Không gia hạn / ↺ Mở lại / ✎ Sửa */
.nut.nut-vuong{width:30px;min-width:30px;padding:0;justify-content:center;font-size:.95rem;line-height:1}
summary.nut{list-style:none;cursor:pointer}
summary.nut::-webkit-details-marker{display:none}
.dv-thao-tac{flex-wrap:nowrap}
@media (pointer:coarse){
  .dv-thao-tac .nut.nho{min-height:40px}
  .dv-thao-tac .nut.nut-vuong{width:40px;min-width:40px;font-size:1.05rem}
}
.han-sua{display:inline-flex;align-items:center;justify-content:center;min-width:32px;min-height:32px;margin-left:2px;border-radius:8px;
  color:var(--chu-mo);text-decoration:none;vertical-align:middle}
.han-sua:hover{background:var(--nen-2);color:var(--chinh);text-decoration:none}
@media (pointer:coarse){
  .yc-nut{gap:8px}
  .yc-btn{width:40px;height:40px}
  .han-sua{min-width:44px;min-height:44px;font-size:1.15rem}
  .yc-nut-ct .nut{min-height:44px;font-size:.88rem;padding:0 14px}
}
.yc-day{flex-wrap:wrap;align-items:center}
.yc-ngay{display:inline-flex;gap:4px;align-items:center;margin:0 0 0 auto}
.yc-ngay input{width:64px;padding:3px 6px}
/* v203 → v204 (ông chủ 16:51 "nút loa XẤU" · 16:53 ảnh mẫu · 16:55 "cạnh tên người gửi"): ĐỌC TO — biểu tượng nét ▷ cùng bộ menu,
   không viền, xám nhạt (luôn hiện), đậm khi rê; đang đọc → ■ màu chính. Màu theo token nên chế độ tối tự dịu. */
.tn-doc,.cn-doc{position:relative;display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;padding:0;margin:0;border:0;
  border-radius:50%;background:none;color:inherit;opacity:.5;cursor:pointer;vertical-align:middle;line-height:1;transition:opacity .12s,background-color .12s}
.tn-doc::after,.cn-doc::after{content:"";position:absolute;inset:-8px}   /* vùng chạm rộng hơn hình (điện thoại) mà không đẩy dòng */
.tn-doc:hover,.cn-doc:hover{opacity:1;background:var(--nen-2)}
.tn-doc.dang-doc,.cn-doc.dang-doc{opacity:1;color:var(--chinh)}
.tn-dong.toi .tn-doc.dang-doc{color:#fff}
.tn-ten{display:flex;align-items:center;gap:2px}
.tn-ten .tn-doc{margin-left:2px;color:var(--chu-mo)}
.tn-gio .tn-doc{width:18px;height:18px;margin:-2px 3px 0 0}
.tn-gio .tn-doc svg{width:13px;height:13px}
.cn-ai{display:flex;align-items:center;gap:2px}
.cn-ai .cn-doc{width:18px;height:18px;margin-left:2px}
.cn-ai .cn-doc svg,.cn-gio .cn-doc svg{width:13px;height:13px}
.cn-gio{display:flex;align-items:center;gap:2px;min-height:18px}
.cua-toi .cn-gio{justify-content:flex-end}
.cn-gio .cn-doc{width:18px;height:18px}
/* Hàng thao tác: Sao chép · Chuyển tiếp · Thu hồi · Xoá — nổi ngay dưới bong bóng khi rê chuột / chạm tin (không thêm dòng dưới mỗi tin) */
.tn-tin{padding-bottom:36px}
.tn-tt{position:absolute;top:calc(100% - 4px);z-index:6;display:none;align-items:center;gap:1px;padding:2px;background:var(--trang);
  border:1px solid var(--vien);border-radius:999px;box-shadow:0 4px 14px rgba(15,35,60,.12)}
.tn-dong.ban .tn-tt{left:8px}
.tn-dong.toi .tn-tt{right:8px}
.tn-dong:hover .tn-tt,.tn-dong.hien-nut .tn-tt,.tn-tt:focus-within{display:inline-flex}
.tn-tt-nut,.cn-tt-nut{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;margin:0;border:0;border-radius:50%;
  background:none;color:var(--chu-mo);cursor:pointer;line-height:1}
.tn-tt-nut:hover,.cn-tt-nut:hover{background:var(--nen-2);color:var(--chu)}
.tn-tt-nut.da-chep,.cn-tt-nut.da-chep{color:#1E7B3A}
.tn-tt .tn-thu-hoi,.tn-tt .tn-xoa{display:inline-flex;align-items:center;height:28px;padding:0 9px;border-radius:999px;font-size:11.5px;opacity:1}
.tn-tt .tn-thu-hoi:hover,.tn-tt .tn-xoa:hover{background:var(--nen-2)}
.cn-tt-nut{display:none;width:22px;height:22px}
.cn-tt-nut svg{width:13px;height:13px}
.cn-tin:hover .cn-tt-nut,.cn-tin.hien-nut .cn-tt-nut{display:inline-flex}
/* v280 (Hộp yêu cầu #21): THẢ CẢM XÚC — dải ô biểu tượng ngay dưới bong bóng (đè nhẹ mép dưới, như Messenger) + bảng chọn 6 biểu tượng.
   Ô của chính mình viền màu chính. Bảng chọn đặt cố định cạnh nút ☺+ (public/js/cam-xuc.js tính vị trí, không tràn mép màn hình). */
.cx-hang{display:flex;flex-wrap:wrap;gap:3px;margin:-6px 8px 0;position:relative;z-index:2}
.cx-o{display:inline-flex;align-items:center;gap:3px;height:22px;padding:0 7px;border:1px solid var(--vien);border-radius:999px;background:var(--trang);
  color:var(--chu);font:inherit;font-size:12px;line-height:1;cursor:pointer;box-shadow:0 1px 3px rgba(15,35,60,.08)}
.cx-o:hover{background:var(--nen-2)}
.cx-o.cua-toi{border-color:var(--chinh);background:#EAF2FB}
:root[data-giao-dien="toi"] .cx-o.cua-toi{background:#1E3550}
.cx-bieu{font-size:13px}
.cx-so{font-size:11px;font-weight:600;color:var(--chu-mo)}
.cx-bang{position:fixed;z-index:1000;display:flex;gap:2px;padding:4px;background:var(--trang);border:1px solid var(--vien);border-radius:999px;
  box-shadow:0 6px 20px rgba(15,35,60,.18)}
.cx-chon{width:38px;height:38px;padding:0;border:0;border-radius:50%;background:none;font-size:22px;line-height:1;cursor:pointer;transition:transform .12s}
.cx-chon:hover,.cx-chon:focus-visible{transform:scale(1.22);background:var(--nen-2)}
@media (prefers-reduced-motion:reduce){.cx-chon{transition:none}.cx-chon:hover,.cx-chon:focus-visible{transform:none}}
/* "Đọc tin chưa đọc" (thanh đầu hội thoại) · "Đọc thông báo mới" (trang Thông báo) · ▷ trong chuông — nút ma, không viền */
.doc-nut-ma{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border:0;border-radius:999px;background:none;
  color:var(--chu-mo);font:inherit;font-size:.8rem;font-weight:500;cursor:pointer;white-space:nowrap}
.doc-nut-ma:hover{background:var(--nen-2);color:var(--chu)}
.doc-nut-ma.dang-doc{color:var(--chinh)}
.doc-nut-ma[hidden]{display:none}
.doc-nut-ma [data-bieu-doc],.doc-nut-tron [data-bieu-doc]{display:inline-flex}
.doc-nut-tron{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0;border:0;border-radius:50%;
  background:none;color:var(--chu-mo);cursor:pointer;flex:none}
.doc-nut-tron:hover{background:var(--nen-2);color:var(--chu)}
.doc-nut-tron.dang-doc{color:var(--chinh)}
@media (max-width:1280px){ .tn-dau-ht .doc-nut-ma .chu{display:none} .tn-dau-ht .doc-nut-ma{width:32px;padding:0;justify-content:center;flex:none} }
@media (pointer:coarse){ .tn-dau-ht .doc-nut-ma{width:40px;height:40px} }
/* v204: thanh đầu hội thoại trên điện thoại — tên + số thành viên một hàng, các nút xuống hàng dưới (trước bị bóp chữ từng dòng) */
@media (max-width:640px){ .tn-dau-ht{flex-wrap:wrap;row-gap:6px} .tn-dau-ht .tn-giua{flex:1 1 calc(100% - 96px);min-width:0} }
/* Thanh điều khiển khi đọc nhiều tin — gọn, nền theo token (sáng / tối), vạch tiến trình mảnh */
.doc-tin-thanh{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:70;display:flex;gap:4px;align-items:center;overflow:hidden;
  background:var(--trang);color:var(--chu);border:1px solid var(--vien);padding:5px 6px 7px 12px;border-radius:999px;box-shadow:0 8px 24px rgba(15,35,60,.16);font-size:.84rem}
.doc-tin-thanh[hidden]{display:none}
.doc-tin-thanh .dtt-bieu{display:inline-flex;color:var(--chinh)}
.doc-tin-thanh .dtt-chu{margin:0 6px 0 4px;white-space:nowrap;color:var(--chu-mo)}
.doc-tin-thanh .dtt-nut{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border:0;border-radius:50%;background:none;color:var(--chu);cursor:pointer;padding:0}
.doc-tin-thanh .dtt-nut:hover{background:var(--nen-2)}
.doc-tin-thanh .dtt-vach{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--vien)}
.doc-tin-thanh .dtt-vach i{display:block;height:100%;width:0;background:var(--chinh);transition:width .25s}
/* v198: nhắc tên "@" trong nhóm — gợi ý nổi trên ô soạn; tên được nhắc tô màu, nhắc tới mình nền vàng */
.tn-o-viet,.cn-viet{position:relative}
.nt-goi-y{position:absolute;left:0;right:0;bottom:calc(100% + 6px);z-index:40;background:var(--trang);border:1px solid var(--vien);border-radius:10px;box-shadow:0 8px 24px rgba(15,35,60,.16);max-height:240px;overflow-y:auto;padding:4px}
.nt-goi-y[hidden]{display:none}
.nt-muc{padding:7px 10px;border-radius:7px;cursor:pointer;font-size:.92rem}
.nt-muc.chon,.nt-muc:hover{background:var(--nen-2);color:var(--chinh)}
.nt-ten{color:var(--chinh);font-weight:600}
.nt-ten.toi{background:#FFF0B8;color:#5A4500;border-radius:4px;padding:0 3px}
/* v248 #58 (ông chủ 16:36: "tin anh tag em vào sao không thấy tiêu đề em đâu"): trong bong bóng CỦA MÌNH (nền --chinh) chữ @tên màu --chinh
   bị vô hình ⇒ theo màu chữ bong bóng + nền trắng mờ. Nhãn vàng .toi (nhắc tới chính mình / @tất cả) có nền riêng — giữ. */
.cua-toi .cn-bong .nt-ten:not(.toi){color:inherit;font-weight:700;background:rgba(255,255,255,.2);border-radius:4px;padding:0 3px}
/* v197: xoá nhập nhầm — ô lý do mở dưới nút */
.xoa-nham{position:relative}
.xoa-nham > summary{list-style:none}
.xoa-nham > summary::-webkit-details-marker{display:none}
.xoa-nham-o{position:absolute;right:0;top:calc(100% + 6px);z-index:30;width:min(340px,86vw);background:var(--trang);border:1px solid var(--vien);border-radius:10px;padding:12px;box-shadow:0 8px 24px rgba(15,35,60,.16)}
/* v195: dán / kéo-thả / chụp ảnh vào ô soạn tin — ảnh xem trước nhỏ, ✕ bỏ */
.da-xem{display:flex;flex-wrap:wrap;gap:6px}
.da-xem[hidden]{display:none}
.da-the{position:relative;width:64px;height:64px;border-radius:8px;overflow:hidden;border:1px solid var(--vien);background:var(--nen-2);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.da-the img{width:100%;height:100%;object-fit:cover;display:block}
.da-tep{font-size:11px;padding:4px;word-break:break-all;line-height:1.2;max-height:100%;overflow:hidden}
.da-bo{position:absolute;top:3px;right:3px;width:20px;height:20px;border-radius:50%;border:0;background:rgba(0,0,0,.62);color:#fff;font-size:11px;line-height:20px;padding:0;cursor:pointer}
.da-keo{outline:2px dashed var(--chinh);outline-offset:-4px}
.tn-anh{font-size:18px}
.cn-xem{padding:8px 8px 0;border-top:1px solid var(--vien)}
.cn-anh{cursor:pointer;font-size:16px;align-self:center}
.cn-tep-anh{display:block;margin-top:4px}
.cn-anh-gui{display:block;max-width:100%;max-height:180px;border-radius:8px}
/* v192: nút "↻ Có thông báo mới" trên trang Thông báo */
.tb-co-moi{position:fixed;top:72px;left:50%;transform:translateX(-50%);z-index:60;box-shadow:0 6px 18px rgba(15,35,60,.18)}

/* v207 (ông chủ): TRIỂN KHAI — số trên mục menu, dòng đang mở, ô ghi chú, hộp nút thao tác */
.dem-muc{margin-left:auto;min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:#C62828;color:#fff;font-size:.7rem;font-weight:700;
  display:inline-flex;align-items:center;justify-content:center;line-height:1;flex:none}
.bang-tk td{vertical-align:top}
.tk-dang-mo td{background:var(--nen-2)}
.tk-ghi{margin-top:4px;white-space:pre-wrap;overflow-wrap:anywhere}
.tk-nut{flex-wrap:wrap;justify-content:flex-end;margin-top:4px}
.tk-nut form{margin:0}
.xoa-nham-o.tk-hop{display:grid;gap:6px;text-align:left}
.xoa-nham-o.tk-hop textarea,.xoa-nham-o.tk-hop select{width:100%;margin:0}
.xoa-nham-o.tk-hop .nut{justify-self:end}
.nut.tk-chua{color:#B26A00;border-color:#E9C27A}
a.tk-dong{color:var(--chu-mo)}

/* v209 (ông chủ): TIÊU CHÍ KPI THEO BỘ PHẬN — cây bộ phận, chip tiêu chí đang áp dụng, khung chọn tiêu chí */
.kpi-bp{padding:12px 14px;margin-bottom:10px}
.kpi-chip{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0 0}
.kpi-sua{margin-top:10px}
.kpi-sua > summary{list-style:none;display:inline-flex}
.kpi-sua > summary::-webkit-details-marker{display:none}
.kpi-sua form{margin-top:10px}
.kpi-ds{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px;margin:10px 0}
.kpi-ds fieldset{border:1px solid var(--vien);border-radius:10px;padding:8px 12px;margin:0}
.kpi-ds legend{font-weight:700;font-size:.85rem;padding:0 4px}
.kpi-tc{display:flex;gap:8px;align-items:flex-start;font-weight:400;margin:6px 0}
.kpi-tc input{margin-top:3px;flex:none}
.kpi-ky{display:flex;flex-wrap:wrap;gap:4px 14px;margin-top:4px}
.kpi-ky label{display:inline-flex;align-items:center;gap:4px;font-weight:500;font-size:.82rem;margin:0}
.kpi-ky input{margin:0}
.kpi-so{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:6px}
.kpi-so label{display:inline-flex;align-items:center;gap:6px;font-weight:500;font-size:.82rem;margin:0}
.kpi-so input{width:86px;margin:0;padding:4px 8px}
.kpi-ls{margin-top:8px}
.kpi-ls > summary{cursor:pointer}
.kpi-ct input{width:130px;text-align:right;margin:0}
.kpi-ct th{white-space:nowrap}
.kpi-bang td,.kpi-bang th{vertical-align:top}
.kpi-bang th{min-width:110px}

/* v213 CHẤM ĐIỂM KPI (phương án B — máy chấm, trưởng bộ phận chấm lại): ô tổng điểm, màu xếp loại, ý kiến nhân viên, nhật ký, thang điểm */
.kpi-tom{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin:14px 0 0}
.kpi-tom > div{border:1px solid var(--vien);border-radius:10px;padding:8px 12px}
.kpi-tom strong{font-size:1.35rem}
.kpi-d{font-weight:700;margin-top:2px}
.kpi-tong{min-width:96px}
.kpi-xl.xl-A{color:#1E6B3E}.kpi-xl.xl-B{color:#1B4C7D}.kpi-xl.xl-C{color:#8A6514}.kpi-xl.xl-D{color:#A33636}
:root[data-giao-dien="toi"] .kpi-xl.xl-A{color:#9ADCB4}:root[data-giao-dien="toi"] .kpi-xl.xl-B{color:#9CC3EC}
:root[data-giao-dien="toi"] .kpi-xl.xl-C{color:#E8C877}:root[data-giao-dien="toi"] .kpi-xl.xl-D{color:#F0A3A3}
.kpi-yk{display:grid;grid-template-columns:auto 1fr;gap:14px;align-items:start}
@media (max-width:640px){.kpi-yk{grid-template-columns:1fr}}
.kpi-nk{margin:0;padding-left:18px}
.kpi-nk li{margin:4px 0}
.kpi-thang input{width:100px;text-align:right;margin:0;padding:4px 8px}
.kpi-thang td{vertical-align:top}
@media (max-width:640px){
  .kpi-thang thead{display:none}
  .kpi-thang tr{display:grid;grid-template-columns:1fr 1fr;gap:4px 12px;padding:10px 0;border-bottom:1px solid var(--vien)}
  .kpi-thang td{display:block;padding:0;border:0;text-align:left}
  .kpi-thang td:nth-child(1),.kpi-thang td:nth-child(2){grid-column:1/-1}
  .kpi-thang td[data-nhan]::before{content:attr(data-nhan);display:block;font-size:.75rem;color:var(--chu-mo);margin:4px 0 2px}
  .kpi-thang input{width:100%;text-align:left}
}
/* v214 KHAI BÁO TIÊU CHÍ KPI GỌN (ông chủ: "nhìn anh loạn hết cả lên"): tóm tắt theo nhóm · mỗi tiêu chí một dòng · trọng số hai tầng */
.kpi-tom-nhom{display:flex;flex-direction:column;gap:6px;margin:10px 0 0}
.kpi-tom-nhom > div{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.kpi-tn{font-weight:700;font-size:.85rem;margin-right:4px}
.kpi-tc-tom{display:inline-flex;gap:4px;align-items:center;border:1px solid var(--vien);border-radius:999px;padding:2px 10px;font-size:.8rem;background:var(--nen-2)}
.kpi-kieu{display:flex;flex-wrap:wrap;gap:6px 18px;margin-top:10px}
.kpi-kieu label{font-weight:500;margin:0}
.kpi-nhom-ds{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:12px}
.kpi-nhom{border:1px solid var(--vien);border-radius:10px;padding:10px 12px}
.kpi-nhom-dau{display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap;border-bottom:1px solid var(--vien);padding-bottom:8px;margin-bottom:4px}
.kpi-o-tn{display:inline-flex;align-items:center;gap:6px;font-weight:600;font-size:.82rem;margin:0}
.kpi-o-tn[hidden]{display:none}
.kpi-o-tn input,.kpi-o-ts input,.kpi-o-md input{width:78px;margin:0;padding:4px 8px}
.kpi-dong{padding:7px 0;border-bottom:1px dashed var(--vien)}
.kpi-dong:last-of-type{border-bottom:0}
.kpi-dong-ten{display:flex;gap:8px;align-items:flex-start;font-weight:400;margin:0;cursor:pointer}
.kpi-dong-ten input{margin-top:3px;flex:none}
.kpi-mo{display:block;font-size:.76rem;color:var(--chu-mo);line-height:1.35}
.kpi-co-js .kpi-dong.tat .kpi-mo{display:none}
.kpi-co-js .kpi-dong.tat b{font-weight:500;color:var(--chu-mo)}
.kpi-dong-so{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;margin:6px 0 0 26px}
.kpi-co-js .kpi-dong.tat .kpi-dong-so{display:none}
.kpi-o-ts,.kpi-o-md{display:inline-flex;align-items:center;gap:6px;font-size:.8rem;font-weight:500;margin:0}
.kpi-co-js:not(.hien-md) .kpi-o-md{display:none}
.kpi-ky-chip{display:inline-flex;flex-wrap:wrap;gap:4px}
.kpi-ky-chip label{display:inline-flex;align-items:center;gap:4px;border:1px solid var(--vien);border-radius:999px;padding:2px 9px;font-size:.78rem;font-weight:500;margin:0;cursor:pointer}
.kpi-ky-chip label:has(input:checked){background:#E9F0F8;border-color:#C2D4E8;color:#1B4C7D}
:root[data-giao-dien="toi"] .kpi-ky-chip label:has(input:checked){background:#1B3550;border-color:#2F5276;color:#CFE0F2}
.kpi-ky-chip input{margin:0}
.kpi-tong{margin-top:6px;color:#1E6B3E}
.kpi-tong:empty,.kpi-tong-nhom:empty{display:none}
.kpi-tong-nhom{margin-top:10px;font-weight:600;color:#1E6B3E}
.kpi-ct-nho{text-decoration:none}
.kpi-mo{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
/* v215 ĐẶT LẠI MẬT KHẨU ngay đầu trang tài khoản + hộp copy tài khoản / mật khẩu (ông chủ) */
.mk-khung{margin-bottom:14px}
.mk-dong{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center}
.mk-dong label{font-weight:500;margin:0;display:inline-flex;align-items:center;gap:5px}
.mk-dong input[type=text]{width:220px;margin:0}
.mk-moi{margin:0 0 12px}
.mk-moi-luoi{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:6px 10px;align-items:center;margin:10px 0}
.mk-moi-luoi code{font-size:1rem;word-break:break-all;background:var(--trang);border:1px solid var(--vien);border-radius:6px;padding:4px 8px}
.mk-moi-mk{font-weight:700;letter-spacing:.03em}
/* v216 (ông chủ): SỐ LẦN ĐÃ GỬI trên biểu tượng ✉ / Zalo / 📞 ở cột Yêu cầu gia hạn */
.yc-btn{position:relative}
.yc-dem{position:absolute;top:-7px;right:-7px;min-width:17px;height:17px;padding:0 4px;box-sizing:border-box;border-radius:999px;background:#C8922F;color:#fff;
  font-size:.66rem;font-weight:700;line-height:17px;text-align:center;box-shadow:0 0 0 2px var(--trang);pointer-events:none}
/* v216 (ông chủ): trạng thái thanh toán nằm dưới số tiền trong ô Thành tiền (bỏ cột Thanh toán) */
.dv-tt{margin-top:6px}
/* v217 ô "Ghi nhớ đăng nhập (30 ngày)" ở trang đăng nhập */
.dn-nho{display:flex;align-items:center;gap:8px;font-weight:500;margin:0 0 14px;cursor:pointer}
.dn-nho input{margin:0}
/* v219 Cài đặt phân hệ: ô NHIỀU lựa chọn (vd lớp lịch khách hàng) */
.cd-nhieu{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.cd-nhieu-the{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--vien);border-radius:10px;padding:10px 12px;font-weight:400;margin:0;cursor:pointer}
.cd-nhieu-the input{margin-top:3px;flex:none}
.cd-nhieu-the b{display:inline;margin-right:4px}
.cd-nhieu-the .nho{display:block;margin-top:2px}
.cd-cham{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:6px;vertical-align:middle}
/* v219 popup ghi tóm tắt giao tiếp (📞 / Zalo) */
.yc-gt-hop{border:1px solid var(--vien);border-radius:14px;padding:18px;width:min(460px,calc(100vw - 32px));background:var(--trang);color:var(--chu);box-shadow:0 18px 50px rgba(0,0,0,.18)}
.yc-gt-hop::backdrop{background:rgba(12,39,64,.35)}
.yc-gt-hop textarea{width:100%;box-sizing:border-box}
/* v298 Liên hệ chờ duyệt: nội dung dài chỉ 3 dòng, bấm ⇒ hộp nổi xem đủ */
.lh-nd-ngan{display:block;width:100%;padding:0;margin:0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.lh-nd-chu{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;overflow-wrap:anywhere}
.lh-nd-them{display:inline-block;margin-top:3px;color:var(--chinh);font-weight:600;font-size:.8rem}
.lh-nd-ngan:hover .lh-nd-them{text-decoration:underline}
.lh-nd-ngan:focus-visible{outline:2px solid var(--chinh);outline-offset:2px;border-radius:4px}
.lh-nd-hop{width:min(640px,calc(100vw - 32px))}
.lh-nd-noi{white-space:pre-wrap;overflow-wrap:anywhere;max-height:min(60vh,520px);overflow:auto;font-size:.95rem;line-height:1.6;
  background:var(--nen-2);border:1px solid var(--vien);border-radius:10px;padding:12px 14px}
/* v221 Triển khai: hệ nút dàn HÀNG NGANG phía dưới mỗi việc */
.bang-tk tr.tk-dong > td{border-bottom:0;padding-bottom:6px}
.bang-tk tr.tk-hang-nut > td{padding-top:0}
.tk-nut-ngang{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.tk-nut-ngang .tk-nut{display:contents}
.tk-nut-ngang .xoa-nham-o{left:0;right:auto}
.tk-nut-ngang .tk-nk{margin-left:auto}
/* v222 Dọn dẹp: ô Giữ lại + Xem lại + Lưu cùng một hàng */
.dd-ngay form{margin:0}
.dd-ngay-o{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.dd-ngay select{width:auto}
.dd-chua-luu{margin:6px 0 0}
/* v224 popup chọn nhân sự lọc sổ Bán hàng */
.loc-nv-hop input[type=search]{width:100%;box-sizing:border-box;margin:0}
.loc-nv-ds{max-height:min(52vh,420px);overflow:auto;display:grid;gap:2px;margin-top:8px;border:1px solid var(--vien);border-radius:10px;padding:6px}
.loc-nv-dong{display:flex;gap:10px;align-items:center;padding:7px 8px;border-radius:8px;cursor:pointer;margin:0;font-weight:400}
.loc-nv-dong:hover{background:var(--nen-2)}
.loc-nv-dong input{margin:0;flex:none}
.loc-nv-dong[hidden]{display:none}
button.chip-tt{font:inherit;cursor:pointer}
/* v217 NÃO AGENT 2 THẺ (ông chủ): khoá nhiều phạm vi + sửa khoá · "Cách kết nối" hai cột: phân khu | endpoint */
.am-tao2{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px;align-items:end;margin:6px 0 16px;padding:12px;border-radius:12px;border:1px solid var(--vien)}
.am-tao2 .truong{margin:0}
.am-tao2 .am-pv{grid-column:1/-1}
.am-pv{border:1px solid var(--vien);border-radius:10px;padding:8px 12px;margin:0}
.am-pv legend{font-weight:700;font-size:.85rem;padding:0 4px}
.am-pv label{display:inline-flex;align-items:center;gap:6px;margin:2px 16px 2px 0;font-weight:500}
.am-pv p{margin:6px 0 0}
.am-sua{display:inline-block;text-align:left}
.am-sua > summary{list-style:none}
.am-sua > summary::-webkit-details-marker{display:none}
.am-sua-o{margin-top:8px;padding:10px;border:1px solid var(--vien);border-radius:10px;min-width:280px;background:var(--trang)}
.am-sua-o .truong{margin:8px 0}
.am-kn{display:grid;grid-template-columns:230px minmax(0,1fr);gap:14px;align-items:start}
.am-kn-trai{position:sticky;top:70px;display:flex;flex-direction:column;gap:2px;padding:10px}
.am-kn-trai a{display:flex;justify-content:space-between;gap:8px;padding:6px 10px;border-radius:8px;text-decoration:none;color:var(--chu)}
.am-kn-trai a:hover{background:var(--nen-2)}
.am-kn-trai a.dang{background:var(--nen-2);font-weight:700;color:var(--chinh)}
.am-kn-nhom{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--chu-mo);margin:10px 10px 4px}
.am-kn-nhom:first-child{margin-top:0}
.am-kn-phai section{margin-bottom:14px}
.am-kn.co-js .am-kn-phai section[hidden]{display:none}
.am-kn-tim{width:240px;margin:0}
.am-pt{font-weight:700}
.am-pt-get{color:#1E6B3E}.am-pt-post{color:#1B4C7D}.am-pt-put{color:#8A6514}.am-pt-delete{color:#A33636}
:root[data-giao-dien="toi"] .am-pt-get{color:#9ADCB4}:root[data-giao-dien="toi"] .am-pt-post{color:#9CC3EC}
.am-luat{margin:6px 0;padding-left:18px}
.am-luat li{margin:4px 0}
@media (max-width:860px){.am-kn{grid-template-columns:1fr}.am-kn-trai{position:static;flex-direction:row;flex-wrap:wrap}.am-kn-nhom{width:100%}}
/* v225 Não Agent › Cách kết nối: endpoint web = một ô (phương thức + đường / mô tả bên dưới) — trước đây 3 cột + break-all làm cột đường
   co về một ký tự mỗi dòng ở màn vừa */
.am-api code.am-duong{word-break:normal;overflow-wrap:anywhere}
.am-api .am-mt{margin-top:3px}
/* v226 thư bị trả lại — lý do dưới nhãn ⚠ ở cột Tương tác / chi tiết dịch vụ */
.yc-tra-lai{margin-top:2px;max-width:280px;overflow-wrap:anywhere}
/* v227 Lịch: ô tìm lịch nhân sự + kết quả (＋ Thêm) + nút ✕ bỏ khỏi danh sách */
.lich-tim{margin:6px 0 4px}
.lich-tim input[type=search]{width:100%;box-sizing:border-box;margin:0;font-size:.85rem;padding:6px 10px}
.lich-kq{display:grid;gap:2px;margin:4px 0 8px}
.lich-kq-dong{display:flex;align-items:center;gap:6px;margin:0;padding:3px 4px;border-radius:6px}
.lich-kq-dong:hover{background:var(--nen-2)}
.lich-kq-dong .chu{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.88rem}
.lich-kq-dong .cham-lich{flex:none}
.mot-lich .lich-bo-ghim{margin-left:auto;border:0;background:transparent;color:var(--chu-mo);cursor:pointer;padding:0 4px;font-size:.8rem;opacity:.55}
.mot-lich:hover .lich-bo-ghim{opacity:1}
/* v229 sổ Bán hàng: MÃ PHIẾU BÁN HÀNG — ô xám bạc nhạt trên cùng cột "Bán gì", bấm là chép */
.ma-phieu-dong{margin:0 0 5px}
.ma-phieu-ban{display:inline-block;padding:1px 9px;border:1px solid #D3D9E0;border-radius:6px;background:#EEF1F4;color:#3D4A5C;
  font:600 .78rem/1.6 ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;letter-spacing:.02em;cursor:copy;user-select:all}
.ma-phieu-ban:hover{background:#E3E8EE;border-color:#BCC5CF}
:root[data-giao-dien="toi"] .ma-phieu-ban{background:#2A3340;border-color:#3A4656;color:#C9D3DF}

/* v232 (#33) Kết nối Facebook 1 chạm — Cài đặt CRM › Kênh nhắn tin */
.fbk-khoi{border:1px solid var(--vien);border-radius:10px;padding:12px 14px;margin:10px 0;background:var(--nen-2)}
.fbk-khoi h3{margin:0 0 8px}
.fbk-trang{width:100%}
.fbk-trang td{vertical-align:top}
.fbk-trang .nho{overflow-wrap:anywhere}
@media (max-width:600px){.fbk-trang th:nth-child(3),.fbk-trang td:nth-child(3){display:none}}
.fbk-trang th,.fbk-trang td{padding-left:6px;padding-right:6px}
.fbk-bao{margin-top:12px}
.fbk-bao summary,.fbk-tay summary{cursor:pointer;font-weight:600}
.fbk-bao ul{margin:6px 0 0;padding-left:4px;list-style:none}
.fbk-bao li{margin:3px 0;overflow-wrap:anywhere}
.fbk-bao li.ok{color:#1E5233}
.fbk-bao li.loi{color:#8A2B2B}
.fbk-tay{margin-top:14px}
.fbk-chon{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px solid var(--vien);cursor:pointer}
.fbk-chon input{margin-top:3px}

/* v239 (#41) TỔNG ĐÀI WEB — hộp "Khách đang gọi", thanh đang nói, hộp tóm tắt (public/js/tong-dai.js — mọi trang nội bộ) + trang phân hệ */
.tdw-hop{position:fixed;right:20px;bottom:20px;z-index:1000;width:300px;max-width:calc(100vw - 24px);background:var(--trang);color:var(--chu);border:1px solid var(--vien);border-radius:14px;box-shadow:0 14px 40px rgba(0,0,0,.22);padding:14px}
.tdw-hop-tieu{font-weight:700;margin-bottom:4px}
.tdw-hop-ten{font-weight:600}
.tdw-hop-phu{font-size:13px;color:var(--chu-mo);margin-top:2px;overflow-wrap:anywhere}
.tdw-hop-nut{display:flex;gap:8px;margin-top:12px}
.tdw-hop textarea{width:100%;box-sizing:border-box;margin-top:8px}
.tdw-thanh{position:fixed;left:50%;transform:translateX(-50%);bottom:18px;z-index:1000;display:flex;align-items:center;gap:10px;flex-wrap:wrap;background:#14532D;color:#fff;border-radius:12px;padding:10px 14px;box-shadow:0 10px 30px rgba(0,0,0,.25);max-width:calc(100vw - 24px)}
.tdw-thanh .nut.vien{background:transparent;color:#fff;border-color:rgba(255,255,255,.6)}
.tdw-thanh .tdw-cup{background:#C2372D;border-color:#C2372D;color:#fff}
.tdw-gio{font-variant-numeric:tabular-nums}
.tdw-bao{position:fixed;right:20px;bottom:20px;z-index:1001;background:var(--trang);border:1px solid var(--vien);border-radius:10px;padding:10px 14px;box-shadow:0 8px 24px rgba(0,0,0,.18)}
.tdw-so{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:14px}   /* v243: 4 ô số MỘT hàng gọn */
.tdw-so .o{margin:0;padding:8px 10px}
.tdw-so .mo{line-height:1.25}
.tdw-so strong{font-size:20px}
/* v243 (ông chủ ~14:50): trang chính 2 CỘT — 2/5 (số · nhân viên · nhỡ · gần đây) | 3/5 (khách đang ở web) */
.tdw-hai-cot{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);gap:16px;align-items:start}
.tdw-cot-1 > .o,.tdw-cot-2 > .o{margin-top:0;margin-bottom:14px}
.tdw-kdx-dau{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;padding:14px 16px;border-bottom:1px solid var(--vien)}
.tdw-kdx-tong{text-align:right;line-height:1.1}
.tdw-kdx-tong b{display:block;font-size:40px;font-weight:800;color:#16A34A}
.tdw-kdx-tong span{font-size:.8rem;color:var(--chu-mo)}
.tdw-gan{flex-wrap:nowrap;align-items:flex-start}
.tdw-gan-chu{flex:1;min-width:0}
@media (max-width:1100px){.tdw-hai-cot{grid-template-columns:1fr}.tdw-cot-2{order:-1}}
@media (max-width:560px){.tdw-so{grid-template-columns:repeat(2,minmax(0,1fr))}}
/* v243: bảng khách đang ở web trên ĐIỆN THOẠI ⇒ mỗi khách một thẻ (bảng 5 cột không co dưới ~500px, đẩy rộng cả trang) */
@media (max-width:640px){
  .tdw-kdx thead{display:none}
  .tdw-kdx,.tdw-kdx tbody,.tdw-kdx tr{display:block;width:100%}
  .tdw-kdx tr{padding:10px 12px;border-bottom:1px solid var(--vien)}
  .tdw-kdx td{display:block;padding:2px 0;border:0}
  .tdw-kdx td:nth-child(2),.tdw-kdx td:nth-child(3),.tdw-kdx td:nth-child(4){display:inline-block;vertical-align:top;margin-right:14px;font-size:.88rem}
  .tdw-kdx td.phai{text-align:left;margin-top:6px}
  .tdw-kdx-tong b{font-size:32px}
}
.tdw-dong{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 0;border-bottom:1px solid var(--vien)}
.tdw-dong.dang-mo,.bang-gon tr.dang-mo{background:var(--nen-2)}
/* v243 (#47): Tổng đài web › Nhân viên trực tuyến */
/* v253 (YC-0008): danh sách đơn gộp thêm trong hộp Đề nghị xuất HĐ */
.dnk-them{display:grid;gap:4px;max-height:200px;overflow:auto;padding:8px 10px;border:1px solid var(--vien);border-radius:8px;background:var(--nen-2)}
.dnk-them label{display:flex;gap:8px;align-items:flex-start;font-size:.88rem;cursor:pointer}
.tdw-nv{display:grid;gap:8px}
/* v252.4 (ông chủ 07/10, ảnh /tong-dai-web): nhãn dài "Bật trực nhưng đang tắt — không nghe chuông" ở cột `auto` của lưới ăn hết chỗ ⇒ tên +
   trạng thái bị ép thành cột 1 chữ. Đổi sang flex xuống dòng: tên giữ ≥ 200px, thiếu chỗ thì nhãn xuống dòng dưới (canh phải). */
.tdw-nv-dong{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:flex-start;padding:9px 10px;border:1px solid var(--vien);border-radius:12px}
.tdw-nv-dong .tdw-nv-cham{margin-top:6px;flex:0 0 12px}
.tdw-nv-ten{min-width:0;flex:1 1 200px;overflow-wrap:anywhere}
.tdw-nv-dong > .nhan{margin-left:auto;max-width:100%}
.tdw-nv-dong.tat{opacity:.72}
.tdw-nv-cham{width:12px;height:12px;border-radius:50%;background:#9CA3AF}
.tdw-nv-dong.bat .tdw-nv-cham{background:#22C55E;box-shadow:0 0 0 4px rgba(34,197,94,.18)}
/* v253 (#87): khung giữ cuộc gọi (mục 8) — trang mở bên trong, thanh cuộc gọi + hộp nổi vẫn ở trên */
.tdw-khung{position:fixed;inset:0;width:100%;height:100%;border:0;z-index:900;background:var(--nen,#fff)}
html.tdw-co-khung,html.tdw-co-khung body{overflow:hidden}
.tdw-thanh .nut.dang{background:#fff;color:#14532D}
.tdw-hop-nhan{display:block;font-size:13px;font-weight:600;margin-top:10px}
.tdw-hop input{width:100%;box-sizing:border-box;margin-top:4px}
.tdw-hop-hen{display:flex;align-items:center;gap:8px;margin-top:6px}
.tdw-hop-hen input{width:auto;margin:0}
/* cần gọi lại (mục 3) */
.tdw-gl{padding:9px 0;border-bottom:1px solid var(--vien)}
.tdw-gl:last-child{border-bottom:0}
.tdw-gl.qua-han{box-shadow:inset 3px 0 0 #C2372D;padding-left:9px}
.tdw-gl.da-xong{opacity:.8}
.tdw-gl-dau{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:2px}
.tdw-gl-viec{font-size:.92rem;margin:2px 0}
.tdw-gl-nut{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:6px}
.tdw-gl-nut form{margin:0}
.tdw-gl-kq{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.tdw-gl-kq input{min-width:180px;flex:1}
/* v258.1 (ông chủ 08/10 kèm ảnh: "khi link dài quá sẽ bị đẩy như này … tự ẩn phần vượt quá đi"): danh sách khách — link website dài tự cắt "…"
   (rê chuột thấy đủ qua title có sẵn), giữ "+N"; cột Liên lạc không bị kéo giãn đẩy cả bảng */
.o-web{display:flex;align-items:baseline;gap:4px;max-width:240px;min-width:0}
.o-web a{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.o-web .mo{flex:none}
/* v258: khung thông tin đăng nhập cổng khách (hồ sơ khách › Tài khoản đăng nhập) */
.tkg-hop{border:1px solid color-mix(in srgb,var(--chinh) 30%,var(--vien));background:color-mix(in srgb,var(--chinh) 5%,var(--trang));border-radius:10px;padding:12px 14px;margin:0 0 14px}
.tkg-ds{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:4px 12px;margin:10px 0 12px}
.tkg-ds dt{color:var(--chu-mo);font-size:.88rem}
.tkg-ds dd{margin:0;word-break:break-all}
.tkg-mk{font-size:1.05rem;font-weight:700;letter-spacing:.5px}
/* v256 (#90): khối mã nhúng nút gọi (Cài đặt › Gọi thoại qua web) */
.ma-nhung{margin:8px 0;padding:10px 12px;background:var(--nen-2);border:1px solid var(--vien);border-radius:8px;white-space:pre-wrap;word-break:break-all;font-size:.85rem}
/* v255 (YC-0011 mục 5): báo cáo tổng đài — 8 ô số (2 hàng), thanh ngang theo giờ / ngày */
.tdw-bc-so{grid-template-columns:repeat(4,minmax(0,1fr))}
.tdw-bc-hang{display:grid;grid-template-columns:48px minmax(0,1fr) 90px;gap:8px;align-items:center;padding:3px 0}
.tdw-bc-nhan{font-size:.82rem;color:var(--chu-mo);font-variant-numeric:tabular-nums}
.tdw-bc-thanh{display:flex;height:14px;border-radius:7px;background:var(--nen-2);overflow:hidden}
.tdw-bc-thanh span,.tdw-bc-chu{display:inline-block;height:100%}
.tdw-bc-thanh .nghe,.tdw-bc-chu.nghe{background:#22C55E}
.tdw-bc-thanh .nho-c,.tdw-bc-chu.nho-c{background:#F59E0B}
.tdw-bc-chu{width:10px;height:10px;border-radius:3px;vertical-align:middle}
/* v255 (YC-0011 mục 2): hồ sơ khách — trong hộp gọi đến + khung nhỏ trên thanh đang nói */
.tdw-hs{margin:8px 0 2px;padding:8px 10px;border-radius:10px;background:var(--nen-2);display:grid;gap:4px;font-size:13px}
.tdw-hs-dong{display:flex;gap:6px;align-items:flex-start;overflow-wrap:anywhere}
.tdw-hs-bieu{flex:none;width:18px;text-align:center}
.tdw-hs-noi{position:fixed;left:50%;transform:translateX(-50%);bottom:84px;z-index:1000;width:min(460px,calc(100vw - 24px));margin:0;
  background:var(--trang);border:1px solid var(--vien);box-shadow:0 10px 30px rgba(0,0,0,.18);padding-right:30px}
.tdw-hs-dong-nut{position:absolute;top:4px;right:6px;border:0;background:none;font-size:18px;line-height:1;cursor:pointer;color:var(--chu-mo)}
/* v254 (YC-0015): bản demo — website mẫu nhúng cạnh màn hình người trực để tự gọi thử */
.tdw-demo-thu{border:1px dashed var(--chinh)}
.tdw-demo-khung{display:block;width:100%;height:420px;border:1px solid var(--vien);border-radius:10px;background:#fff}
/* sao khách chấm (mục 7) · khách nóng (mục 5) */
.tdw-sao{color:#B7791F;letter-spacing:1px}
.bang-gon tr.tdw-nong{background:color-mix(in srgb,#F97316 8%,transparent)}
/* hộp thử máy + lịch trực (mục 1, 2) */
.tdw-trang-hop{width:min(520px,calc(100vw - 32px))}
.tdw-trang-hop h2{margin:0 0 4px}
.tdw-tm{display:grid;gap:8px;margin:12px 0}
.tdw-tm-dong{display:grid;grid-template-columns:150px 1fr;gap:4px 10px;align-items:start;padding:8px 10px;border:1px solid var(--vien);border-radius:10px}
.tdw-tm-muc{grid-column:2;height:8px;border-radius:4px;background:var(--nen-2);overflow:hidden}
.tdw-tm-muc span{display:block;height:100%;width:0;background:#22C55E;transition:width .1s}
.tdw-tm-hoi{grid-column:2;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.tdw-tm-hoi[hidden],.tdw-tm-muc[hidden]{display:none}   /* display:flex / block đè thuộc tính hidden */
.tdw-tm-ket{font-weight:700;margin:4px 0 12px}
.tdw-lt{display:grid;gap:10px;margin:12px 0 8px}
.tdw-lt-ca{padding:10px;border:1px solid var(--vien);border-radius:10px;display:grid;gap:8px}
.tdw-lt-ngay{display:flex;flex-wrap:wrap;gap:4px 10px}
.tdw-lt-ca input[type=time]{width:auto}
@media (max-width:560px){.tdw-tm-dong{grid-template-columns:1fr}.tdw-tm-muc,.tdw-tm-hoi{grid-column:1}}

/* v242 (#46): HOÁ ĐƠN của đơn bán (views/crm/_hd-don.ejs) — nút "Đề nghị xuất HĐ" / trạng thái + "Xem đề nghị HĐ" */
.hd-don{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px;margin-top:6px}
.hd-don.gon{justify-content:flex-end}
.hd-nut{white-space:nowrap}
/* v263: lịch tự động nhắc trước (trang dịch vụ › Tự động) — chip ngày có ✕ + ô thêm */
.lich-nhac{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:10px;padding-top:8px;border-top:1px dashed var(--vien)}
.lich-nhac-nhan{font-weight:600;font-size:.85rem;margin-right:2px}
.chip-moc{display:inline-flex;align-items:center;gap:2px;margin:0;padding:2px 4px 2px 10px;border-radius:999px;background:#E3F1E8;border:1px solid #9FCFB2;font-size:.8rem;font-weight:600;color:#1E6B43}
.chip-moc.mac-dinh{background:var(--nen-2);border-color:var(--vien);color:var(--chu-mo);font-weight:500}
.chip-moc button{border:0;background:none;cursor:pointer;color:inherit;font-size:.75rem;line-height:1;padding:2px 5px;border-radius:50%}
.chip-moc button:hover{background:rgba(180,35,24,.12);color:#B42318}
.lich-nhac-them{display:inline-flex;gap:4px;align-items:center;margin:0}
.lich-nhac-them input{width:120px;padding:3px 8px;font-size:.82rem;min-height:0}
.lich-nhac-chu{width:100%}
/* v263.1: dòng "Khi quá hạn: nhắc lại mỗi n ngày, tối đa m lần" */
.lich-nhac-qua{display:flex;flex-wrap:wrap;align-items:center;gap:6px;width:100%;margin:4px 0 0}
.lich-nhac-qua label{display:inline-flex;align-items:center;gap:4px;font-size:.82rem;margin:0;font-weight:400}
.lich-nhac-qua input{width:58px;padding:3px 6px;font-size:.82rem;min-height:0}
.lich-nhac-qua input.mac-dinh{color:var(--chu-mo);background:var(--nen-2)}
.nut-chu{border:0;background:none;padding:0 0 0 6px;color:var(--lien-ket, #1F5FA8);cursor:pointer;font-size:inherit;text-decoration:underline}
:root[data-giao-dien="toi"] .chip-moc:not(.mac-dinh){background:#173A28;border-color:#2E6B4A;color:#9FD8B7}
/* v261.7 (ông chủ 09/10: "cho cả hai nút này nhỏ lại thôi, hiện đang hơi to"): nút nhỏ ở cột tiền sổ Bán hàng — Yêu cầu thanh toán + Đề nghị xuất HĐ */
.nut.nut-mini{font-size:.72rem;padding:2px 8px;min-height:0;line-height:1.5;border-radius:6px;white-space:nowrap}
/* v261.9: dải tự nhắc gia hạn dưới ngày kết thúc (sổ Bán hàng) */
.tu-nhac-gh{margin-top:4px}
.tu-nhac-gh .nhan{font-size:.68rem;padding:1px 7px;white-space:nowrap;cursor:help}
/* v268.2: lý do ngắn + nút xử lý ngay dưới dải "Chưa tự động nhắc gia hạn"; dải bật hàng loạt (quản lý) */
.tu-nhac-ly{margin-top:3px;display:flex;flex-wrap:wrap;gap:2px 8px;align-items:center;color:var(--chu-mo);font-size:.72rem;line-height:1.35}
.tu-nhac-nut{display:inline;margin:0}
.tu-nhac-ly .nut-chu{padding:0;font-size:inherit;font-weight:600}
.tu-nhac-ly a{font-weight:600}
.tu-nhac-loat{display:flex;flex-wrap:wrap;gap:8px;align-items:center;justify-content:space-between}
.nut-dv-tien{margin:4px 0 2px}
.hd-don.gon{margin-top:2px}
/* v261.7: Công nợ & nhắc thu 6 ô = 2 hàng × 3 */
.the-so.the-6{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:760px){ .the-so.the-6{grid-template-columns:repeat(2,minmax(0,1fr))} }
.hd-xem{font-size:.82rem;white-space:nowrap}
/* v246 (#52): trang chi tiết đơn — HỘP 3 THẺ (Thu tiền · Mốc việc & đợt thu · Liên quan): tiêu đề cũ trong thẻ ẩn (đã có trên thẻ), giữ nhãn phụ */
.hop-the-don .tab-don{margin:-4px 0 12px}
.hop-the-don .the-don-noi > h2.cung-dong > span:first-child,.hop-the-don #lien-quan > h2{display:none}
.hop-the-don .the-don-noi > h2.cung-dong{justify-content:flex-end !important;margin:0 0 6px;font-size:.95rem}
.hop-the-don .the-don-noi > h2.cung-dong:empty{display:none}
/* v251 Cập nhật phần mềm (views/cap-nhat/) */
.cnpm-the.cnpm-loi{border-left:4px solid #D93025}
.cnpm-kn summary{cursor:pointer}
.cnpm-kn-form{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(0,1fr) auto;gap:10px;align-items:end}
.cnpm-kn-form .truong{margin:0}
@media (max-width:900px){.cnpm-kn-form{grid-template-columns:minmax(0,1fr)}}
.cnpm-dau{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;align-items:flex-start}
.cnpm-dau > div:first-child{flex:1 1 260px;min-width:0}
.cnpm-nd{white-space:pre-line;overflow-wrap:anywhere;margin-top:8px}
/* v254 (#88): Tính năng mới của nhà cung cấp — mỗi dòng một tính năng, nút "Xin cập nhật" bên phải */
.cnpm-tn{display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:10px 0;border-top:1px solid var(--vien)}
.cnpm-tn:first-of-type{border-top:0}
.cnpm-tn-chu{flex:1 1 280px;min-width:0}
/* v268: tab Kho — lọc (chờ / đã có / tất cả × giá) + tìm + phân trang */
.cnpm-loc{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0 0 12px}
.cnpm-loc a{display:inline-flex;align-items:center;gap:6px;padding:4px 11px;border:1px solid var(--vien);border-radius:99px;background:var(--trang);color:var(--chu);text-decoration:none;font-size:.86rem}
.cnpm-loc a.dang{border-color:var(--chinh,#12395F);box-shadow:inset 0 0 0 1px var(--chinh,#12395F);font-weight:700}
.cnpm-loc-gach{width:1px;align-self:stretch;background:var(--vien);margin:0 4px}
.cnpm-tim{margin:0 0 0 auto;flex:0 1 240px}
.cnpm-tim input{width:100%}
.cnpm-kho{padding:6px 16px}
.cnpm-nhom{margin:14px 0 2px;font-size:1rem}
@media (max-width:700px){.cnpm-tim{flex:1 1 100%;margin:0}}
.cnpm-anh{display:block;max-width:min(100%,420px);max-height:260px;border-radius:8px;border:1px solid var(--vien);margin-top:8px}
.cnpm-bo summary,.cnpm-sua summary{list-style:none;cursor:pointer}
.cnpm-sua{margin-top:10px}
.cnpm-sua summary::-webkit-details-marker{display:none}
.cnpm-sua-form{margin-top:10px;padding:12px;border:1px dashed var(--vien-dam);border-radius:10px;background:var(--nen-2)}
.cnpm-bo summary::-webkit-details-marker{display:none}
.cnpm-ds li{padding:10px 0}

/* v259.6 (#14): GỬI GIA HẠN GỘP — danh sách dịch vụ tick chọn (views/crm/yc-gh-gop.ejs) + gợi ý gộp ở hộp soạn một dịch vụ */
.ycg-ds{display:grid;gap:6px}
.ycg-dong{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:9px 12px;border:1px solid var(--vien);border-radius:10px;cursor:pointer;background:var(--trang)}
.ycg-dong:has(input:checked){border-color:var(--chinh);background:color-mix(in srgb,var(--chinh) 6%,var(--trang))}
.ycg-dong input{margin:0;width:auto}
.ycg-ten{flex:1 1 220px;min-width:0}
.ycg-goi-y{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;border-color:#F0B35C;background:#FFF8EC}
:root[data-giao-dien="toi"] .ycg-goi-y{background:#3a2c14;border-color:#7a5a20}

/* v259.7: "+ Lập báo giá ▾" — chọn LOẠI báo giá (mặc định / loại do module cấp) */
.bg-chon-loai{position:relative}
.bg-chon-loai>summary{list-style:none;cursor:pointer}
.bg-chon-loai>summary::-webkit-details-marker{display:none}
.bg-chon-loai-ds{position:absolute;right:0;top:calc(100% + 6px);z-index:30;min-width:260px;background:var(--trang);border:1px solid var(--vien);border-radius:12px;box-shadow:0 12px 30px rgba(15,35,60,.16);padding:6px;display:grid;gap:2px}
.bg-chon-loai-ds a{display:flex;flex-direction:column;gap:2px;padding:9px 12px;border-radius:8px;color:var(--chu);text-decoration:none}
.bg-chon-loai-ds a:hover{background:var(--nen-2)}
@media (max-width:640px){ .bg-chon-loai-ds{right:auto;left:0} }

/* v259.8 (ông chủ: "chỗ chữ dài này nó đẩy" — tên hiển thị dịch vụ là link Facebook dài đẩy rộng bảng Bán hàng):
   chuỗi liền (link, mã) được ngắt giữa chừng; ô bảng: THU GỌN một dòng trong khung cột (…), bỏ https://www., rê chuột (title) thấy đủ
   (ông chủ: "cho nó thu gọn, kiểu gì thì cũng chỉ ở trong khung của cột đó thôi") */
.chu-dai{overflow-wrap:anywhere;word-break:break-word}
.ten-hien-o{max-width:240px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* v260: số trên tab (tab riêng của module ở Triển khai) */
.tab .dem-tab{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 6px;border-radius:99px;background:#F07B22;color:#fff;font-size:.72rem;font-weight:700;margin-left:4px}

/* v260.2: khoá API ứng dụng ngoài — khung Nâng cao (người cùng phụ trách · đơn · webhook) */
.api-nc td{background:var(--nen-2);border-top:0 !important;padding-top:4px !important}
.api-nc summary{cursor:pointer;padding:4px 0}
.api-nc-luoi{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:10px}
.api-nc-chon{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px 10px;max-height:150px;overflow:auto;border:1px solid var(--vien);border-radius:8px;padding:6px 8px;background:var(--trang)}
.api-nc-chon label{font-weight:400;font-size:.88rem}
@media (max-width:900px){ .api-nc-luoi{grid-template-columns:1fr} }

/* v260.3: ô / nhãn không xuống dòng (danh sách báo giá — ông chủ: "có vẻ hơi bị co nhỉ") */
.khong-gay{white-space:nowrap}

/* v267 (ông chủ 09/10): KPI 2 CỘT — cột 1 bộ phận · cột 2 tiêu chí theo KHỐI (người bán · người làm) + người trong bộ phận + chỉ tiêu riêng */
.kpi-2cot{display:grid;grid-template-columns:minmax(220px,280px) minmax(0,1fr);gap:16px;align-items:start;margin-bottom:16px}
/* v269: BỘ TIÊU CHÍ KPI THEO BSC — phần TẤT CẢ / QUẢN LÝ, nhóm thu gọn, 4 cột A B C D */
.kpi-bsc-chu{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center;margin:0 0 12px}
.kpi-bsc-chu b,.kpi-bo-o-dau b,.kpi-cot-dau{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 4px;border-radius:6px;background:var(--chinh,#12395F);color:#fff;font-size:.78rem;font-weight:700}
.kpi-may{font-size:.78rem;margin-left:2px;cursor:help}
.kpi-bo-tom{display:grid;gap:10px;margin-top:12px}
.kpi-bo-phan{border:1px solid var(--vien);border-radius:12px;padding:10px 12px}
.kpi-bo-tat_ca,.kpi-phan-tat_ca{border-top:3px solid #1E6B3E}
.kpi-bo-quan_ly,.kpi-phan-quan_ly{border-top:3px solid #12395F}
.kpi-bo-phan-ten{font-weight:700;margin-bottom:8px}
.kpi-bo-bsc{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.kpi-bo-o{display:flex;flex-direction:column;gap:4px;align-items:flex-start;min-width:0}
.kpi-bo-o.rong{opacity:.5}
.kpi-bo-o-dau{display:flex;gap:6px;align-items:center;font-size:.85rem;font-weight:600}
.kpi-phan{border:1px solid var(--vien);border-radius:12px;padding:12px;margin-top:12px}
.kpi-phan-dau{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline}
.kpi-phan-dau h3{margin:0;font-size:1rem}
.kpi-phan-tong{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center;margin:8px 0 4px}
.kpi-phan-tong .kpi-tong{margin-top:0}
.kpi-bsc-tong{display:inline-flex;gap:10px;flex-wrap:wrap}
.kpi-bsc-tong i{font-style:normal;font-weight:600}
.kpi-o-ql{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:8px 0 0}
.kpi-o-ql input{width:70px;margin:0;padding:4px 8px}
.kpi-nhom{border:1px solid var(--vien);border-radius:10px;margin-top:8px;background:var(--trang)}
.kpi-nhom > summary{cursor:pointer;padding:9px 12px;display:flex;flex-wrap:wrap;gap:4px 10px;align-items:baseline;list-style:none}
.kpi-nhom > summary::-webkit-details-marker{display:none}
.kpi-nhom > summary::before{content:'▸';color:var(--chu-mo);width:10px}
.kpi-nhom[open] > summary::before{content:'▾'}
.kpi-nhom-ten{font-weight:700}
.kpi-nhom-mo{flex:1 1 220px}
.kpi-nhom.co .kpi-nhom-dem{color:#1E6B3E;font-weight:600}
.kpi-nhom-chon{flex-basis:100%;font-size:.8rem;color:var(--chu-mo);padding-left:20px}
.kpi-nhom-chon:empty{display:none}
.kpi-luoi-bsc{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:8px 12px 12px;border-top:1px dashed var(--vien)}
.kpi-cot-bsc{min-width:0}
.kpi-cot-dau{margin-bottom:4px;cursor:help}
.kpi-cot-rong{padding:6px 0}
.kpi-luoi-bsc .kpi-dong{display:flex;flex-direction:column;gap:4px}
.kpi-luoi-bsc .kpi-o-ts{margin-left:24px}
.kpi-luoi-bsc .kpi-dong.tat .kpi-o-ts{display:none}
.kpi-cot-ql{background:rgba(18,57,95,.06)}
@media (max-width:1100px){.kpi-luoi-bsc,.kpi-bo-bsc{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.kpi-luoi-bsc,.kpi-bo-bsc{grid-template-columns:minmax(0,1fr)}}
.kpi-ds-bp{padding:8px 0;position:sticky;top:12px}
.kpi-ds-bp-dau{font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--chu-mo);padding:4px 14px 8px}
.kpi-bp-dong{display:flex;flex-direction:column;gap:3px;padding:8px 12px;border-left:3px solid transparent;text-decoration:none;color:var(--chu)}
.kpi-bp-dong:hover{background:var(--nen-2)}
.kpi-bp-dong.dang{background:#EAF1F8;border-left-color:#12395F}
.kpi-bp-ten{font-weight:600}
.kpi-bp-dong .nhan{align-self:flex-start}
.kpi-bp-ct{margin-top:6px;border-top:1px solid var(--vien);font-size:.88rem}
.kpi-cot-phai{min-width:0}
.kpi-cot-phai > .o{margin-top:0}
.kpi-hai-khoi{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}
.kpi-khoi-the{border:1px solid var(--vien);border-radius:10px;padding:10px 12px;border-top:4px solid #2E8B57}
.kpi-khoi-the.kpi-khoi-th{border-top-color:#1F5FA8}
.kpi-khoi-ten{font-weight:700;margin-bottom:6px}
.kpi-tc-tom{display:inline-block;margin:0 6px 6px 0;padding:3px 9px;border-radius:999px;background:var(--nen-2);font-size:.82rem}
.kpi-nhan-nhom{display:inline-block;min-width:16px;text-align:center;font-size:.68rem;font-weight:700;color:var(--chu-mo);border:1px solid var(--vien);border-radius:4px;padding:0 3px;margin-right:2px}
.kpi-khoi-the .kpi-dong{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:5px 0;border-bottom:1px dashed var(--vien)}
.kpi-khoi-the .kpi-dong.tat{opacity:.55}
.kpi-khoi-the .kpi-dong-ten{display:flex;align-items:center;gap:6px;margin:0;font-weight:400;font-size:.86rem}
.kpi-khoi-the .kpi-o-ts input{width:70px;padding:3px 6px;text-align:right}
.kpi-khoi-the .kpi-o-ts{white-space:nowrap;font-size:.82rem;margin:0}
.kpi-ky-md{margin-top:10px}
.kpi-ky-bang td{padding:4px 8px;font-size:.84rem;vertical-align:middle}
.kpi-nguoi select{min-width:130px}
.kpi-ngoai-bo{background:var(--nen-2)}
:root[data-giao-dien="toi"] .kpi-bp-dong.dang{background:#16263A;border-left-color:#8FB6E0}
@media (max-width:900px){.kpi-2cot{grid-template-columns:1fr}.kpi-ds-bp{position:static}.kpi-hai-khoi{grid-template-columns:1fr}}
/* v267: trang Hoa hồng & thưởng — hai khối */
.hh-khoi-td{font-size:1.05rem;margin:18px 0 8px}
.hh-o{width:58px;text-align:right}
.hh-bang th{white-space:normal;vertical-align:bottom}
.hh-bang td .nhan{white-space:nowrap}
.hh-o.hh-o-tien{width:110px}
.hh-muc-chung{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px}
.hh-muc-chung label{display:inline-flex;align-items:center;gap:6px;margin:0}
/* v267.1: danh sách nhân sự chấm KPI */
.kpi-ng tr.kpi-ng-tat td{color:var(--chu-mo)}
.kpi-ng tr.kpi-ng-tat td strong{font-weight:500}
/* v267.3: chỉ tiêu KPI nhân sự — mức bộ phận / cá nhân */
.kpi-ng-ct{min-width:260px}
.kpi-ng-o{display:inline-flex;align-items:center;gap:6px;margin:2px 14px 6px 0;font-weight:400;font-size:.86rem}
.kpi-ng-o input{width:140px;padding:3px 8px;text-align:right}
.kpi-ng-o i{font-style:normal}
.kpi-ct-kieu{display:flex;flex-direction:column;gap:8px;margin:12px 0}
.kpi-ct-kieu label{display:flex;gap:8px;align-items:baseline;margin:0;font-weight:400}
.kpi-ct-bang{width:100%;max-width:760px}
.kpi-ct-bang input{width:160px;text-align:right}
.kpi-ct-bang[data-kieu="bo_phan"] td:nth-child(3){opacity:.45}
.kpi-ct-bang[data-kieu="ca_nhan"] td:nth-child(2){opacity:.6}
.vang-chu{color:#B7791F}
/* v270 QUẢN TRỊ ĐIỀU HÀNH › MỤC TIÊU — thanh tiến độ (vạch = mức lẽ ra tới nay) · bản đồ 4 góc BSC · bảng theo tháng */
.mt-thanh{position:relative;height:5px;background:var(--nen-2);border-radius:3px;margin-top:4px;min-width:90px}
.mt-thanh i{display:block;height:100%;border-radius:3px;background:var(--chinh)}
.mt-thanh i.xanh{background:#2F855A}.mt-thanh i.cam{background:#DD8A1E}.mt-thanh i.do{background:#C53030}.mt-thanh i.xam{background:#A0AEC0}
.mt-thanh s{position:absolute;top:-3px;width:2px;height:11px;background:var(--chu);opacity:.55;text-decoration:none}
.mt-bsc{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px}
.mt-bsc-o{padding:12px 14px}
.mt-bsc-dau{display:flex;align-items:center;gap:8px;margin-bottom:8px}
.mt-bsc-dong{display:flex;justify-content:space-between;gap:8px;padding:5px 0;border-top:1px solid var(--vien);color:inherit;text-decoration:none;font-size:.9rem}
.mt-bsc-dong:hover{color:var(--chinh)}
.mt-bang tr.mt-goc td{background:var(--nen-2)}
.mt-thang-bang th,.mt-thang-bang td{white-space:nowrap}
.mt-thang-bang .mt-nay{background:rgba(66,153,225,.10)}
.mt-thang{display:grid;grid-template-columns:repeat(6,minmax(70px,1fr));gap:6px;max-width:620px}
.mt-thang label{display:flex;flex-direction:column;font-size:.8rem;font-weight:500}
.mt-thang input{width:100%;text-align:right}
@media (max-width:640px){.mt-thang{grid-template-columns:repeat(4,1fr)}}
.mt-bang td.mt-ten{min-width:230px}
.mt-bang td.mt-ten .nhan{margin-left:4px}
.mt-chu{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 4px;border-radius:6px;background:var(--chinh,#12395F);color:#fff;font-size:.78rem;font-weight:700;margin-right:6px;vertical-align:middle}
/* v272 CHẤM CÔNG — bảng công tháng (cột tên dính trái, ngày nghỉ tô nền) · ô Chấm công ở Trang chủ */
.cc-bang{font-size:.82rem}
.cc-bang th,.cc-bang td{padding:4px 3px;text-align:center}
.cc-bang .cc-ten{text-align:left;position:sticky;left:0;background:var(--trang);z-index:1;min-width:150px;padding-left:8px}
.cc-bang .cc-ngay{min-width:26px;font-weight:600}
.cc-bang .cc-nghi{background:var(--nen-2)}
.cc-bang .cc-nay{box-shadow:inset 0 0 0 2px rgba(66,153,225,.45)}
.cc-o a{display:block;color:inherit;text-decoration:none;font-weight:700}
.cc-o.cc-du a{color:#2F855A}.cc-o.cc-muon a,.cc-o.cc-thieu_ra a{color:#B7791F}.cc-o.cc-vang a{color:#C53030}.cc-o.cc-phep a{color:#6B46C1}.cc-o.cc-lam_nghi a{color:#2B6CB0}
.cc-sai{font-style:normal;color:#C53030;font-size:.7rem;vertical-align:super}
.cc-the-so{display:flex;gap:22px;margin:10px 0}
.cc-the-so div{display:flex;flex-direction:column}
.cc-the-so b{font-size:1.3rem}
.cc-nut{width:100%;font-size:1.05rem;padding:10px}
.cc-nguoi{display:flex;flex-wrap:wrap;gap:6px 16px;max-height:220px;overflow:auto}
.cc-nguoi label{font-weight:500}
/* v273 CHẤM CÔNG PRO — lưới lịch ca: đậm = xếp riêng ngày đó, nhạt = ca mặc định, "–" = nghỉ; ô đang chọn viền xanh */
.cc-lich td.cc-l{font-size:.78rem;color:#718096;min-width:34px}
.cc-lich td.cc-gd{color:#1A365D;font-weight:700;background:rgba(66,153,225,.08)}
.cc-lich td.cc-chon-o{box-shadow:inset 0 0 0 2px #3182CE}
/* v279 HOÁ ĐƠN MUA VÀO + THUẾ GTGT (views/finance/hdm-*.ejs, vat.ejs) */
.hdm-h2{font-size:1.02rem;margin:0 0 12px;display:flex;align-items:center;gap:8px}
.hdm-h3{font-size:.92rem;margin:16px 0 8px;color:var(--chinh-dam)}
.hdm-ket-ds{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.hdm-ket-ds li{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:7px 10px;border-radius:8px;background:var(--nen-2);border-left:3px solid #188038}
.hdm-ket-ds li.loi{border-left-color:#C5221F}
.hdm-ten-tep{flex-basis:100%;word-break:break-all}
.hdm-goi-y{margin:8px 0 0;padding-left:18px;display:grid;gap:4px}
.hdm-bang{width:100%}
.hdm-bang td{padding:6px 6px;vertical-align:top}
.hdm-bang input,.hdm-bang select{margin:0;width:100%;min-width:0}
.hdm-bang td:first-child input{min-width:180px}
.hdm-bang tfoot td{border-bottom:none;padding:6px 10px}
.hdm-tra{border-top:1px solid var(--vien);margin-top:14px;padding-top:2px}
.hdm-tep{list-style:none;margin:0 0 12px;padding:0;display:grid;gap:6px}
.hdm-tep li{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.hdm-pc{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px 16px}
@media (max-width:760px){.hdm-bang td:first-child input{min-width:140px}}

/* v280 (YC-0024): CRM › Cài đặt › Liên hệ mới — mỗi quy tắc một hàng (mảng · chữ trong Quan tâm · bộ phận nhận · link gửi kèm thư chào · ✕) */
.lhm-luat{display:grid;grid-template-columns:minmax(120px,1fr) minmax(160px,1.4fr) minmax(160px,1.4fr) minmax(160px,1.4fr) auto;gap:10px;align-items:end;
  padding:10px 0;border-bottom:1px dashed var(--vien)}
.lhm-luat .truong{margin:0}
.lhm-bo{align-self:center;margin-top:16px}
@media (max-width:900px){.lhm-luat{grid-template-columns:1fr 1fr}.lhm-bo{justify-self:end}}
@media (max-width:520px){.lhm-luat{grid-template-columns:1fr}}

/* v281 (YC-0025): báo giá — chọn luồng (Đơn trước / Tiền trước) + khung "Đã thu tiền" khi Chờ thanh toán */
.bgtt-luong{border:1px solid var(--vien);border-radius:10px;padding:8px 12px 10px;margin:10px 0 0}
.bgtt-luong legend{padding:0 4px;color:var(--chu-mo)}
.bgtt-luong label{display:block;margin:4px 0;font-weight:400}
.bgtt-thu{margin:10px 0 12px;padding:10px 12px;border:1px solid var(--vien);border-radius:10px;background:var(--nen-2)}
.bgtt-thu .hang{margin-top:6px}

/* v281.3 (ông chủ 11/10: "dùng dropdown list chọn, hiện 1 ô thôi"): CHỌN MÃ QR — một danh sách thả xuống + một ô QR của tài khoản đang chọn */
.chon-qr{display:flex;flex-direction:column;gap:8px;max-width:440px}
.chon-qr select{width:100%}
.chon-qr-o{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px;border:1px solid var(--vien);border-radius:12px;background:var(--trang);text-align:center}
.chon-qr-o img{width:200px;height:auto;border-radius:8px;border:1px solid var(--vien);background:#fff}
.chon-qr-o img[hidden]{display:none}
/* v281.2: hộp tạo yêu cầu thanh toán — hai cột: biểu mẫu (trái) · ô QR từng tài khoản (phải); màn hẹp xếp dọc */
.yctt-luoi{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,380px);gap:18px;align-items:start}
.yctt-luoi > .o{margin-bottom:0}
@media (max-width:1000px){ .yctt-luoi{grid-template-columns:1fr} }
/* v281.6: điện thoại / màn hẹp — biểu mẫu → Mã QR (ô chọn tài khoản) → bảng phiếu đã tạo (cột trái gỡ khung để xếp xen) */
@media (max-width:1000px){ .yctt-luoi > .yctt-cot{display:contents} .yctt-luoi .yctt-trai{order:1} .yctt-luoi > .yctt-qr{order:2} .yctt-luoi .yctt-cot > .o.mong{order:3} }
/* v281.3 (ông chủ 11/10: "cột phải bằng 1/3 cột trái, cột trái là thông tin hiện tại"): màn một báo giá — trái 3 phần (bước kế tiếp, dòng, điều khoản /
   biểu mẫu sửa) · phải 1 phần (Mã QR thanh toán: chọn tài khoản + Lưu), cột phải dính khi cuộn; màn hẹp xếp dọc */
.bg-2cot{display:grid;grid-template-columns:minmax(0,3fr) minmax(240px,1fr);gap:18px;align-items:start}
.bg-trai{min-width:0}
.bg-phai{position:sticky;top:72px}
.bg-phai .chon-qr{max-width:none}
.bg-phai .chon-qr-o img{width:100%;max-width:220px}
@media (max-width:1000px){ .bg-2cot{grid-template-columns:1fr} .bg-phai{position:static} }
/* v281.4 (ông chủ 11/10: "cột phải đang có không gian lệch ⇒ cho cột phải sát lên"): trang phiếu yêu cầu thanh toán — hai cột ĐỘC LẬP, khối nào cột nấy
   xếp sát nhau (trước là hai hàng lưới: hàng 2 bị đẩy theo khối trái cao hơn) + ô đổi tài khoản ở đầu khối QR */
.yctt-2cot{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);gap:20px;align-items:start}
.yctt-cot{display:flex;flex-direction:column;gap:20px;min-width:0}
.yctt-cot > .o{margin-bottom:0}
.yctt-doi-tk{text-align:left;margin:0 0 14px;padding-bottom:12px;border-bottom:1px solid var(--vien)}
.yctt-doi-tk select{flex:1 1 auto;min-width:0}
@media (max-width:900px){ .yctt-2cot{grid-template-columns:1fr} }
/* v281.5: nút "Báo giá lại" cuối ô Tương tác của sổ Bán hàng & dịch vụ */
.yc-bglai{margin:6px 0 0}

/* v284: Quản trị › Hệ thống dữ liệu POS */
.pm-bang td{vertical-align:top}
.pm-nut-viec{justify-content:flex-end;flex-wrap:wrap;gap:6px}
.pm-nut-viec form{margin:0}
.pm-sua{margin-top:6px;text-align:left}
.pm-form{display:flex;flex-direction:column;gap:10px;max-width:520px}
.pm-form .truong{margin:0}
.pm-luoi{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:18px;align-items:start}
.pm-luoi > .o{margin-bottom:0}
.pm-dau{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;flex-wrap:wrap;padding:14px 16px 0}
.pm-de-xuat{margin:10px 0;padding-left:18px;display:grid;gap:4px}
.pm-bang td:first-child{min-width:170px}
.pm-form button{align-self:flex-start}

/* v289: cảnh báo TIẾNG THẬT trên thanh cuộc gọi + nhãn tiếng một chiều ở danh sách cuộc gọi */
.tdw-canh{background:#FDECEC;color:#8F1D14;border-radius:8px;padding:4px 10px;font-size:.84rem;font-weight:600;max-width:420px}
.tdw-mot-chieu{color:#B42318;font-weight:600;font-size:.82rem}

/* ===== v291 — TAB DỌC Cài đặt hệ thống (ông chủ 13/10: "chuyển tab thành tab dọc ở cột 1 và chi tiết ở cột 2") ===== */
.cd-khung{display:grid;grid-template-columns:250px minmax(0,1fr);gap:22px;align-items:start}
.cd-noi{min-width:0}
.tab-doc{display:flex;flex-direction:column;gap:2px;background:var(--trang);border:1px solid var(--vien);border-radius:12px;padding:8px;position:sticky;top:72px}
.tab-doc a{display:block;padding:9px 12px;border-radius:8px;color:var(--chu);font-size:.9rem;font-weight:600;line-height:1.35}
.tab-doc a:hover{background:var(--nen-2);color:var(--chinh);text-decoration:none}
.tab-doc a.dang{background:#E8F0FE;color:var(--chinh);box-shadow:inset 3px 0 0 var(--nhan)}
:root[data-giao-dien="toi"] .tab-doc a.dang{background:#16263A}
.tab-doc-ngan{display:block;height:1px;background:var(--vien);margin:6px 4px}
@media (max-width:900px){
  .cd-khung{grid-template-columns:minmax(0,1fr)}
  .tab-doc{position:static;flex-direction:row;flex-wrap:wrap}
  .tab-doc a{padding:8px 10px}
  .tab-doc-ngan{display:none}
}

/* ===== v291 — KHU VỰC LỄ TÂN (src/le-tan.js · views/home-le-tan.ejs · views/login.ejs · views/partials/nhan-vat.ejs) ===== */
.nv-hinh{display:block;width:100%;height:auto}
.nv-vay{transform-box:fill-box;transform-origin:0% 100%;animation:nv-vay 1.1s ease-in-out 3}
.nv-khoi{animation:nv-khoi 2.4s ease-in-out infinite}
@keyframes nv-vay{0%,100%{transform:rotate(0)}50%{transform:rotate(-12deg)}}
@keyframes nv-khoi{0%{opacity:0;transform:translateY(6px)}50%{opacity:.8}100%{opacity:0;transform:translateY(-10px)}}
/* hai cánh cửa kính — dùng chung cho trang đăng nhập (đứng yên) và trang lễ tân (mở ra) */
.lt-canh{position:absolute;top:0;bottom:0;width:50%;background:#BFD3E3;overflow:hidden;box-sizing:border-box}
.lt-canh.lt-trai{left:0;border-right:2px solid #8FA6BC}
.lt-canh.lt-phai{right:0;border-left:2px solid #8FA6BC}
.lt-canh::before{content:"";position:absolute;top:-10%;left:30%;width:18px;height:130%;background:#D9E6F0;transform:rotate(18deg)}
.lt-canh i{position:absolute;top:50%;width:8px;height:96px;margin-top:-48px;background:#C8922F;border-radius:4px}
.lt-canh.lt-trai i{right:14px}
.lt-canh.lt-phai i{left:14px}
/* — trang đăng nhập ở cửa — */
.vo-dn.lt-dn{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:0;padding:0;background:#D5DCE4}
.lt-dn-bien{align-self:stretch;display:flex;align-items:center;justify-content:center;gap:12px;padding:16px 20px;background:#0C2740;color:#fff;margin-bottom:auto}
.lt-dn-bien img{height:34px;width:auto;border-radius:6px;background:#fff;padding:2px}
.lt-dn-bien b{font-size:1rem;letter-spacing:.06em;text-transform:uppercase;text-align:center}
.lt-dn-khung{position:relative;width:min(520px,calc(100% - 24px));min-height:min(78vh,620px);margin-top:28px;box-sizing:border-box;
  border:12px solid #4A5160;border-bottom:0;border-radius:8px 8px 0 0;background:#F3E9DA;overflow:hidden;
  display:grid;place-items:center;padding:28px 22px}
.lt-dn-khung .the-dn{position:relative;z-index:2;max-width:380px;padding:22px 22px 18px;box-shadow:0 18px 40px rgba(12,39,64,.32)}
.lt-dn-td{margin-bottom:14px}
.lt-dn-td span{display:block;font-size:.69rem;letter-spacing:.11em;font-weight:700;color:#8A5A00;text-transform:uppercase}
.lt-dn-td h1{margin:2px 0 0;line-height:1.25}
.lt-dn-san{align-self:stretch;height:28px;background:#9AA5B3}
/* cp3.1 CỬA HOLDINGS – VÀNG ĐEN (bản riêng HOÀNG KIM HOLDINGS — Cài đặt › Lễ tân › Phong cách sảnh): nền đêm, biển đen chữ vàng, khung cửa vàng,
   cánh kính khói, hai cột đá đen chân / đầu vàng, sàn đá đen viền vàng */
.vo-dn.lt-dn.lt-hk{position:relative;background:radial-gradient(ellipse at 50% 34%,#2C2519 0%,#131210 46%,#070707 100%)}
.lt-hk .lt-dn-bien{flex-direction:column;gap:8px;padding:18px 20px 14px;background:linear-gradient(180deg,#0B0B0C,#151412);border-bottom:2px solid #C9A45C;color:#E9CF8E}
.lt-hk .lt-dn-bien img{background:transparent;padding:0;border-radius:0;height:36px}
.lt-hk .lt-dn-bien b{letter-spacing:.3em;font-weight:600;color:#E9CF8E;background:linear-gradient(180deg,#F7E1A3,#CFA651 58%,#9A7432);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.lt-hk-dau{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1.5px solid #C9A45C;box-shadow:inset 0 0 0 3px #0B0B0C,inset 0 0 0 4px rgba(201,164,92,.6);
  color:#E9CF8E;font-weight:600;font-size:.8rem;letter-spacing:.06em}
.lt-bien .lt-hk-dau{width:34px;height:34px;font-size:.68rem}
.lt-hk-phu{position:relative;display:block;width:180px;height:10px;background:linear-gradient(90deg,transparent,#C9A45C 22%,#C9A45C 78%,transparent) center/100% 1px no-repeat}
.lt-hk-phu::after{content:"";position:absolute;left:50%;top:50%;width:7px;height:7px;background:#E2BE6E;transform:translate(-50%,-50%) rotate(45deg)}
.lt-hk .lt-dn-khung{border-width:10px;border-color:#C9A45C;border-image:linear-gradient(180deg,#F4DB98,#B8893A 60%,#8E6A2C) 1;box-shadow:0 0 70px rgba(201,164,92,.18);
  background:linear-gradient(118deg,transparent 0 44%,rgba(214,174,88,.22) 44.2% 44.5%,transparent 44.8%),linear-gradient(162deg,transparent 0 61%,rgba(255,255,255,.05) 61.2% 61.5%,transparent 61.8%),
  radial-gradient(circle at 50% 42%,#1F1D1A 0,#0B0B0C 72%)}
.lt-hk .lt-canh{background:linear-gradient(180deg,rgba(30,28,25,.9),rgba(12,12,12,.94));border-color:#8A6E3A}
.lt-hk .lt-canh::before{background:rgba(255,226,160,.06)}
.lt-hk .lt-canh i{background:linear-gradient(180deg,#F4DB98,#B8893A);box-shadow:0 0 10px rgba(226,190,110,.45)}
.lt-hk .lt-dn-td span{color:#B8893A}
.lt-hk .lt-dn-khung .the-dn{box-shadow:0 22px 56px rgba(0,0,0,.6),0 0 0 1px rgba(201,164,92,.55)}
.lt-hk .the-dn .nut,.lt-trang.lt-hk .lt-vao:not(.vien){background:#141312;border-color:#C9A45C;color:#F1D58F}
.lt-hk .the-dn .nut:hover,.lt-trang.lt-hk .lt-vao:not(.vien):hover{background:#1F1D1A}
.lt-hk .lt-dn-san{background:repeating-linear-gradient(90deg,#0F0F10 0 44px,#1A1917 44px 88px);border-top:3px solid #C9A45C}
.vo-dn.lt-hk::before,.vo-dn.lt-hk::after{content:"";position:absolute;bottom:28px;width:clamp(22px,4.4vw,46px);height:min(70vh,560px);
  background:repeating-linear-gradient(90deg,#0D0D0E 0 5px,#211F1B 5px 8px);border-top:12px solid #C9A45C;border-bottom:10px solid #C9A45C;border-radius:2px;
  left:calc(50% - min(260px,50% - 12px) - clamp(36px,7vw,82px))}
.vo-dn.lt-hk::after{left:auto;right:calc(50% - min(260px,50% - 12px) - clamp(36px,7vw,82px))}
@media (max-width:640px){.vo-dn.lt-hk::before,.vo-dn.lt-hk::after{display:none}}
.lt-chao-cua{margin:0 0 6px;font-style:italic;line-height:1.5;color:#8A5A00;border-left:3px solid #C9A45C;padding-left:10px}   /* cp3.1 câu lễ tân nói ở cửa */
/* cp3.1 sảnh lễ tân 2D Holdings: nền đêm vàng · quầy đen viền vàng · thẻ lời chào màu ngà viền vàng (chữ đậm dễ đọc) */
.lt-trang.lt-hk{background:radial-gradient(ellipse at 30% 0%,#2C2519 0%,#0E0D0C 58%,#070707 100%)}
.lt-hk .lt-quay{background:linear-gradient(180deg,#171512,#0B0B0A);border-color:#6E5A33}
.lt-hk .lt-bien{background:#0A0A0B;border-color:#C9A45C;color:#E9CF8E}
.lt-hk .lt-bien img{background:transparent}
.lt-hk .lt-loi{background:#FFFCF5;border-color:#C9A45C;box-shadow:0 22px 56px rgba(0,0,0,.5)}
.lt-trang.lt-hk .lt-vao.vien{border-color:#C9A45C;color:#6E5220}
/* v323.25 khung "Bắt đầu với sổ cổ đông" (sổ chính) */
.bd-khung{border-left:4px solid #C8922F;margin-bottom:16px}
.bd-ds{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.bd-ds li{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--vien);border-radius:10px;background:var(--trang)}
.bd-ds li > div{flex:1 1 auto;min-width:0}
.bd-ds li .nut{flex:0 0 auto}
.bd-so{flex:0 0 auto;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:.85rem;background:#FFF4DF;color:#8A5A00;border:1px solid #E8C98A}
.bd-ds li.xong{background:#F3FAF5;border-color:#CFE8D8}
.bd-ds li.xong .bd-so{background:#1E7A4F;color:#fff;border-color:#1E7A4F}
.bd-ds li.xong b{color:var(--chu-mo);text-decoration:line-through;text-decoration-color:rgba(30,122,79,.45)}
.bd-ds li.tuy-chon{border-style:dashed}
/* — trang lễ tân — */
.lt-trang{margin:0;min-height:100vh;background:#F3E9DA;color:#1B1D21}
.lt-mo-cua{position:fixed;inset:0;z-index:50;pointer-events:none}
.lt-mo-cua .lt-canh{animation:lt-mo-trai 1.2s .3s ease-in-out forwards}
.lt-mo-cua .lt-canh.lt-phai{animation-name:lt-mo-phai}
.lt-lan2 .lt-mo-cua .lt-canh{animation-duration:.6s;animation-delay:0s}
@keyframes lt-mo-trai{to{transform:translateX(-102%)}}
@keyframes lt-mo-phai{to{transform:translateX(102%)}}
.lt-sanh{max-width:1180px;margin:0 auto;padding:28px 20px 40px;display:flex;flex-wrap:wrap;gap:24px;align-items:stretch;min-height:100vh;box-sizing:border-box}
.lt-quay{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;align-items:center;gap:18px;background:#EFE1CC;border:1px solid #E2D3BC;border-radius:16px;padding:24px 20px 0;overflow:hidden}
.lt-bien{display:flex;align-items:center;gap:10px;background:#0C2740;color:#fff;border:1px solid #C8922F;border-radius:10px;padding:10px 16px;max-width:100%}
.lt-bien img{height:28px;width:auto;border-radius:5px;background:#fff;padding:2px}
.lt-bien b{font-size:.85rem;letter-spacing:.06em;text-transform:uppercase}
.lt-nv{width:100%;max-width:420px;margin-top:auto}
.lt-loi{flex:999 1 480px;min-width:0;background:#fff;border:1px solid #E2D3BC;border-radius:16px;padding:26px 28px;display:flex;flex-direction:column;gap:16px;
  animation:lt-hien .5s 1.2s ease-out both}
.lt-lan2 .lt-loi{animation-delay:.5s}
@keyframes lt-hien{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
/* v295 (ông chủ 13/10 "chuẩn font chữ cho khu vực lễ tân theo style chung của cplatform"): cùng thang chữ khu nội bộ — tiêu đề = h1 chung (1.5rem),
   chữ thường = thân trang (15px), nhãn nhỏ = nhãn nhóm menu (.69rem · .11em), nút = .nut (.9rem; họ chữ: luật chung v296 đầu tệp) */
.lt-nhan{font-size:.69rem;letter-spacing:.11em;font-weight:700;color:#8A5A00;text-transform:uppercase}
.lt-loi h1{margin:0;line-height:1.25}
.lt-cau{margin:0}
.lt-ho-so{display:flex;align-items:center;gap:14px;background:#FFFBF0;border:1.5px solid #C8922F;border-radius:12px;padding:14px 16px;color:#1B1D21}
.lt-ho-so:hover{text-decoration:none;box-shadow:0 4px 14px rgba(200,146,47,.2)}
.lt-ho-so-anh{flex:0 0 auto;width:44px;height:44px;border-radius:10px;background:#C8922F;color:#fff;display:grid;place-items:center}
.lt-ho-so > span:last-child{display:flex;flex-direction:column;gap:2px;color:#0C2740}
.lt-ho-so .nho{color:#8A5A00;font-weight:600}
.lt-tin{list-style:none;margin:0;padding:0}
.lt-tin li{display:flex;align-items:baseline;gap:12px;padding:9px 0;border-bottom:1px dashed #E4E7EC}
.lt-cham{flex:0 0 auto;width:10px;height:10px;border-radius:50%;transform:translateY(-1px)}
.lt-do{background:#B42318}.lt-vang{background:#C8922F}.lt-xanh{background:#12395F}.lt-luc{background:#1E7A4F}.lt-xam{background:#8A93A3}
.lt-cc{display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;background:#F7F9FC;border-radius:10px;padding:10px 14px}
.lt-cc > span{flex:1 1 200px}
.lt-cc form{margin:0}
.lt-nut-cc{background:#1E6B45;border-color:#1E6B45}
.lt-chan{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;margin-top:auto}
.lt-vao{min-height:48px;padding:0 22px}
.lt-cai-dat{margin-left:auto;color:var(--chu-mo);text-decoration:none;white-space:nowrap}   /* v303 nút Cài đặt lễ tân (quản trị) */
.lt-cai-dat:hover{color:var(--chinh);text-decoration:underline}
@media (max-width:700px){
  .lt-sanh{padding:14px 12px 28px;gap:14px}
  .lt-quay{flex-basis:100%;padding-top:16px}
  .lt-nv{max-width:300px}
  .lt-loi{padding:20px}
  .lt-loi h1{font-size:1.3rem}
  .lt-dn-khung{min-height:min(84vh,600px);padding:22px 14px}
}
@media (prefers-reduced-motion: reduce){
  .nv-vay,.nv-khoi,.lt-loi{animation:none!important}
  .lt-mo-cua{display:none}
}
/* v291 — thẻ hình đầu cột trái Trang chủ: ngồi bàn làm việc / quán cà phê (views/partials/vo-dau.ejs) */
.ben-cho-ngoi{display:flex;flex-direction:column;gap:6px;margin:4px 6px 12px;padding-bottom:12px;border-bottom:1px solid var(--vien)}
.ben-cho-ngoi-anh{border-radius:12px;overflow:hidden;border:1px solid var(--vien);background:#fff;max-width:240px}
.ben-cho-ngoi-chon{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px;background:var(--nen);border-radius:9px;padding:3px;margin:0;max-width:240px}
.ben-cho-ngoi-chon button{font:inherit;font-size:12.5px;font-weight:600;min-height:34px;border:0;border-radius:7px;background:transparent;color:var(--chu-mo);cursor:pointer}
.ben-cho-ngoi-chon button.dang{background:var(--trang);color:var(--chinh);box-shadow:0 1px 3px rgba(16,32,52,.18)}
.ben-cho-ngoi-nv{display:flex;align-items:center;gap:6px;margin:0;font-size:12px;color:var(--chu-mo)}
.ben-cho-ngoi-nv button{font:inherit;font-size:12px;border:0;background:none;padding:4px 2px;color:var(--chu-mo);cursor:pointer;text-decoration:underline;text-underline-offset:2px}
.ben-cho-ngoi-nv button.dang{color:var(--chinh);font-weight:700;text-decoration:none}
.vo.thu .ben-cho-ngoi{display:none}
/* ===== v292 BÀN LÀM VIỆC đợt B — dải số · danh sách việc gộp · Hôm nay công ty · Ai đang ở văn phòng · Tuỳ chỉnh ===== */
.blv-tren{gap:8px;align-items:flex-start}
.blv-tuy{position:relative}
.blv-tuy > summary{list-style:none;cursor:pointer}
.blv-tuy > summary::-webkit-details-marker{display:none}
.blv-tuy-hop{position:absolute;right:0;top:calc(100% + 6px);z-index:20;width:300px;max-width:calc(100vw - 32px);display:flex;flex-direction:column;gap:6px;
  box-shadow:0 10px 30px rgba(12,39,64,.16)}
.blv-chip{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}
.blv-o{display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:4px 14px 4px 6px;border-radius:10px;border:1.5px solid;font:inherit;font-size:13.5px;
  font-weight:600;cursor:pointer;text-decoration:none;background:#fff}
.blv-o:hover{text-decoration:none}
.blv-o b{min-width:28px;height:28px;padding:0 6px;box-sizing:border-box;border-radius:7px;display:grid;place-items:center;color:#fff;font-variant-numeric:tabular-nums}
.blv-o.blv-do{border-color:#F5C2C0;color:#B42318;background:#FDECEC}.blv-o.blv-do b{background:#B42318}
.blv-o.blv-vang{border-color:#EED7A1;color:#8A5A00;background:#FFF4DC}.blv-o.blv-vang b{background:#C8922F}
.blv-o.blv-lam{border-color:#C9D9EE;color:#12395F;background:#E8F0FA}.blv-o.blv-lam b{background:#12395F}
.blv-o.blv-luc{border-color:#BFE3CF;color:#1E6B45;background:#E7F5EE}.blv-o.blv-luc b{background:#1E7A4F}
.blv-o[aria-pressed="true"]{box-shadow:0 0 0 2px currentColor inset}
.blv-cty h2{margin:0 0 10px}
.blv-cty-luoi{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:10px}
.blv-cty-luoi > div{display:flex;flex-direction:column;gap:3px;padding:12px 14px;background:var(--nen-2);border-radius:9px}
.blv-cty-luoi b{font-size:1.3rem;color:var(--chinh-dam);font-variant-numeric:tabular-nums}
.blv-cty-luoi .blv-cty-do{background:#FDECEC}.blv-cty-do b{color:#B42318}
.blv-thanh{display:block;height:8px;border-radius:99px;background:var(--vien);overflow:hidden}
.blv-thanh i{display:block;height:100%;background:#C8922F;border-radius:99px}
.blv-dang-loc{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;background:var(--nen-2);border-radius:8px;padding:6px 8px 6px 12px;margin-bottom:8px;font-size:13.5px}
.blv-nhom{margin-top:6px}
.blv-nhom-dau{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid var(--vien);font-size:12px;font-weight:700;letter-spacing:.08em}
.blv-n-qh{color:#B42318}.blv-n-nay{color:var(--chinh)}.blv-n-toi{color:var(--chu-mo)}
.blv-dong{display:flex;align-items:flex-start;gap:10px;padding:10px 0;border-bottom:1px dashed var(--vien);color:var(--chu)}
.blv-dong:hover{text-decoration:none;color:var(--chinh)}
.blv-dong .nhan{flex:0 0 auto;margin-top:1px}
.blv-nd{display:flex;flex-direction:column;min-width:0;line-height:1.4;font-size:14px}
.blv-nd b{font-weight:600}
.blv-ai h2{margin-bottom:6px}
.blv-ai-dong{display:flex;align-items:center;gap:8px;padding:5px 0;font-size:13.5px}
.blv-ai-dong .nho{margin-left:auto}
.blv-ai-cho{flex:0 0 auto;width:10px;height:10px;border-radius:50%}
.blv-cho-ban{background:#12395F}.blv-cho-cafe{background:#C8922F}
.blv-dang-loc[hidden],.blv-dong[hidden],.blv-nhom[hidden]{display:none}
/* v292: khối Cần bạn quyết định dài quá 5 dòng thì gọn lại, bấm "Xem thêm" mở hết (div.qd-dau là div thứ 1 ⇒ dòng thứ 6 = div thứ 7) */
.qd-khoi:not(.mo-het) .qd-dong:nth-of-type(n+7){display:none}
.qd-khoi.mo-het [data-qd-them]{display:none}
/* ===== v292 KHÔNG GIAN VĂN PHÒNG (views/home-khong-gian.ejs) + hai lối đi ở lễ tân + nút "Đứng lên nhìn quanh" ===== */
.ben-dung-len{display:flex;align-items:center;justify-content:center;gap:6px;max-width:240px;min-height:36px;border-radius:9px;border:1px dashed var(--vien-dam);
  font-size:12.5px;font-weight:600;color:var(--chinh)}
.ben-dung-len:hover{background:var(--nen-2);text-decoration:none}
.lt-di{display:flex;flex-wrap:wrap;gap:10px;margin:0}
.kg-chu-thich{display:flex;flex-wrap:wrap;gap:6px 18px;margin:-6px 0 14px;font-size:13px;color:var(--chu-mo)}
.kg-chu-thich span{display:inline-flex;align-items:center;gap:6px}
.kg-cham{width:11px;height:11px;border-radius:50%;display:inline-block}
.kg-cham.kg-co{background:#1E7A4F}.kg-cham.kg-o-cafe{background:#C8922F}.kg-cham.kg-vang{background:#C9CDD4}.kg-cham.kg-toi{background:#12395F;box-shadow:0 0 0 2px #E9C27A}
.kg-san{display:grid;gap:14px;grid-template-columns:minmax(0,1fr) minmax(0,1fr) minmax(260px,.9fr);
  grid-template-areas:"gd hop cafe" "lam lam cafe" "sanh sanh cafe";
  background:#D9DEE5;border:8px solid #4A5160;border-radius:16px;padding:14px}
.kg-phong{position:relative;border-radius:10px;padding:12px 14px 14px;display:flex;flex-direction:column;gap:10px;min-width:0;box-shadow:inset 0 0 0 2px rgba(255,255,255,.5)}
.kg-bien{margin:0;align-self:flex-start;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;background:#0C2740;color:#E9C27A;border-radius:6px;padding:4px 10px}
.kg-gd{grid-area:gd;background:#EADCC6}
.kg-hop{grid-area:hop;background:#E3ECF7}
.kg-cafe{grid-area:cafe;background:#F5EBDD}
.kg-lam{grid-area:lam;background:#F4F6F9;background-image:linear-gradient(90deg,rgba(18,57,95,.04) 1px,transparent 1px),linear-gradient(rgba(18,57,95,.04) 1px,transparent 1px);background-size:24px 24px}
.kg-sanh{grid-area:sanh;background:#F3E9DA}
.kg-gd-ban{display:flex;align-items:center;gap:14px}
.kg-ban-lon{width:90px;height:44px;border-radius:8px;background:#8A5A3C;box-shadow:inset 0 -6px 0 #6E4630}
.kg-ban-hop{display:block;height:30px;border-radius:99px;background:#9FB3C8;max-width:220px}
.kg-hop-dong{display:block;font-size:13.5px;color:var(--chu)}
.kg-cafe-anh{max-width:220px;border-radius:12px;overflow:hidden;align-self:center}
.kg-ban-tron{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-start;padding:12px;border-radius:99px 99px 18px 18px;background:#E8D6BE;min-height:60px}
.kg-cum-ds{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px}
.kg-cum{background:#fff;border:1px solid var(--vien);border-radius:10px;padding:10px}
.kg-cum-dau{display:flex;justify-content:space-between;align-items:baseline;gap:8px;margin-bottom:8px;font-size:13.5px}
.kg-ban-ds{display:grid;grid-template-columns:repeat(auto-fill,minmax(74px,1fr));gap:8px}
.kg-ban{display:flex;flex-direction:column;align-items:center;padding:6px 2px 8px;border-radius:8px;background:#F7F3EC;box-shadow:inset 0 5px 0 #B98A5A}
.kg-sanh-noi{display:flex;flex-wrap:wrap;align-items:flex-end;gap:16px}
.kg-le-tan{width:150px}
.kg-sanh-chu{display:flex;flex-wrap:wrap;gap:8px;padding-bottom:10px}
.kg-nguoi{position:relative}
.kg-nguoi > summary{list-style:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:3px;min-width:56px;padding:2px}
.kg-nguoi > summary::-webkit-details-marker{display:none}
.kg-anh{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:14px;color:#fff;background:#1E7A4F;box-shadow:0 0 0 3px #fff}
.kg-ten{font-size:12px;font-weight:600;max-width:76px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kg-nguoi.kg-o-cafe:not(.kg-ngoi-cafe) .kg-anh{background:#fff;color:#C8922F;box-shadow:0 0 0 2px #C8922F inset}
.kg-nguoi.kg-o-cafe:not(.kg-ngoi-cafe) .kg-ten{color:var(--chu-mo)}
.kg-ngoi-cafe .kg-anh{background:#C8922F}
.kg-nguoi.kg-vang .kg-anh{background:#C9CDD4;box-shadow:0 0 0 3px #fff}
.kg-nguoi.kg-vang .kg-ten{color:var(--chu-mo);font-weight:500}
.kg-nguoi.kg-toi .kg-anh{background:#12395F;box-shadow:0 0 0 3px #E9C27A}
.kg-the{position:absolute;z-index:30;left:50%;top:calc(100% + 4px);transform:translateX(-50%);width:210px;background:#fff;border:1px solid var(--vien);border-radius:10px;
  padding:10px 12px;box-shadow:0 10px 26px rgba(12,39,64,.18);display:flex;flex-direction:column;gap:6px;font-size:13px}
.kg-the form{margin:0}
@media (max-width:1000px){
  .kg-san{grid-template-columns:minmax(0,1fr);grid-template-areas:"sanh" "lam" "cafe" "hop" "gd";border-width:5px;padding:10px}
}
/* v295 Cài đặt Trang chủ › Khối Trang chủ theo vai trò */
.khoi-vt-bang{width:100%;border-collapse:collapse;min-width:520px}
.khoi-vt-bang th,.khoi-vt-bang td{padding:9px 10px;border-bottom:1px solid var(--vien);text-align:left;vertical-align:middle}
.khoi-vt-bang .giua{text-align:center}
.khoi-vt-bang th:first-child,.khoi-vt-bang td:first-child{width:44%;min-width:230px}
.khoi-vt-bang th.giua{width:14%;font-size:.78rem;letter-spacing:.04em;white-space:normal}
.khoi-vt-bang input[type=checkbox]{width:18px;height:18px;accent-color:var(--chinh)}
.khoi-vt-md{display:block;font-weight:400;white-space:normal;text-transform:none;letter-spacing:0}
.khoi-vt-co-dinh td{background:var(--nen-2)}

/* v305 (ông chủ 16/10 "trên di động module crm bị lỗi giao diện" — ảnh: thanh đầu chỉ còn ☰ + logo + "THANHTHANH…", mất hết nút):
   ở bề ngang điện thoại cụm nút bên phải (.phai) đặt cứng KHÔNG CO (~307 px trên màn 369 px) ⇒ logo / tên công ty và cụm nút tranh chỗ,
   bên thua biến mất (máy anh mất nút, máy thử mất logo). Điện thoại: chỉ giữ LOGO trong khung cố định (tên công ty dài đã có trong trang),
   nút gọn, cụm nút co được; màn rất hẹp ẩn nút ngôn ngữ (đổi ngôn ngữ vẫn có ở đáy cột trái). */
@media (max-width:600px){
  .tren-cung{gap:6px;padding:0 8px}
  .tren-cung .nut-thu{flex-shrink:0}
  .tren-cung .hieu{flex:0 0 auto}
  .tren-cung .hieu img{width:26px;height:26px;object-fit:contain}
  .tren-cung .hieu b{display:none}
  .tren-cung .phai{flex-shrink:1;min-width:0;gap:4px}
  .tren-cung .cum-chon-tren{gap:2px;margin-right:0}
  .tren-cung .nut-tim-nhanh{width:36px;height:36px;padding:0;justify-content:center}
  .tren-cung .nut-chuong{width:34px;height:34px}
  .tren-cung .nut-phan-he{width:34px}
  .tren-cung .nut-nn{padding:5px 7px}
  .tren-cung .ai-nut{padding:4px;gap:2px}
  .tren-cung .ai-nut .mui-xuong{display:none}
}
@media (max-width:360px){
  .tren-cung .cum-chon-tren .chon-nhom:has(.nut-nn){display:none}
}

/* v306 ĐỐI TÁC BÁN HÀNG — bảng gọn (ông chủ "format lại"): tiêu đề không xuống dòng, số canh phải cùng độ rộng chữ số, cột tên đủ rộng một dòng */
.bang-dt th{white-space:nowrap}
.bang-dt th.so,.bang-dt td.so{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.bang-dt td.dt-ten{min-width:260px}
.bang-dt td.dt-ten > a strong,.bang-dt td.dt-ten > a b,.bang-dt td.dt-ten > b{white-space:nowrap}
.bang-dt td .nhan{white-space:nowrap}
.dt-cs{margin:0;padding-left:18px;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:4px 28px;line-height:1.55;color:var(--chu-mo)}
/* điện thoại: bảng có lớp .bang-the thành THẺ — mỗi dòng một thẻ, ô số thành "nhãn ……… số" (nhãn lấy từ data-nhan) */
@media (max-width:600px){
  .bang-the thead{display:none}
  .bang-the,.bang-the tbody,.bang-the tr,.bang-the td{display:block;width:100%}
  .bang-the tr{padding:10px 0;border-top:1px solid var(--vien)}
  .bang-the tr:first-child{border-top:none}
  .bang-the td{padding:3px 2px;border:0}
  .bang-the td.dt-ten{min-width:0}
  .bang-the td.so{display:flex;justify-content:space-between;gap:12px}
  .bang-the td.so::before{content:attr(data-nhan);color:var(--chu-mo);font-size:.82rem;font-weight:400}
  .bang-the td.phai{text-align:left}
}

/* v307 (ông chủ 17/10 10:18, ảnh app điện thoại CRM › Tổng quan: thanh đầu chỉ còn ☰ + logo, trang kéo ngang được — tệp 108 ngày 16/10 cùng lỗi):
   nguyên nhân THẬT = khối "Việc làm gần đây" in nguyên link Facebook 178 ký tự không dấu cách (giao tiếp #865/#866) ⇒ trang rộng ~1.000 px;
   Chrome Android nới khung nhìn theo bề rộng trang nên thanh đầu cố định giãn theo, cụm nút (margin-left:auto) bị đẩy ra ngoài màn hình.
   Lớp 1: chữ dài không dấu cách tự ngắt (danh sách việc / dòng thời gian, khối trong cột xếp Tổng quan được co); cả vùng chính ngắt từ quá dài.
   Lớp 2: điện thoại — thanh đầu bám đúng bề ngang màn hình (100vw) dù sau này trang nào đó còn tràn. */
.chinh{overflow-wrap:break-word}
.cot-xep > *{min-width:0}
.dong-tg li,.ds-viec li{overflow-wrap:anywhere}
@media (max-width:600px){
  .tren-cung{right:auto;width:100vw}
}
/* v307 ẩn nút Tìm nhanh ("ít dùng") ⇒ v309 HIỆN LẠI (ông chủ 18/10 "Cho hiện lại nút tìm kiếm. nhưng check kỹ giao diện … máy tính và điện thoại" —
   chị Huệ thấy rối, điện thoại không có Ctrl+K): giữ nguyên kiểu cũ — máy tính nút có chữ + Ctrl K, ≤ 1100 px chỉ kính lúp, ≤ 600 px nút 36 px. */

/* v309 ＋ THÊM ĐỐI TÁC (CRM › Đối tác bán hàng — views/crm/_doi-tac-them.ejs) */
.dt-them-hop{width:min(560px,calc(100vw - 24px));max-height:calc(100dvh - 24px);overflow:auto;padding:18px 20px 0}
/* hàng nút dính đáy hộp — điện thoại hộp dài vẫn luôn thấy nút Thêm đối tác */
.dt-them-nut{position:sticky;bottom:0;z-index:1;justify-content:flex-end;gap:8px;flex-wrap:wrap;margin-top:14px;padding:12px 0 16px;background:var(--trang);border-top:1px solid var(--vien)}
.dt-them-hop h3{margin:0 0 4px}
.dt-them-kieu{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:12px 0 14px}
.dt-them-kieu label{display:flex;align-items:center;gap:8px;border:1px solid var(--vien);border-radius:10px;padding:10px 12px;cursor:pointer;font-weight:600;font-size:.9rem;min-width:0}
.dt-them-kieu label:has(input:checked){border-color:var(--chinh);background:color-mix(in srgb,var(--chinh) 8%,var(--trang));color:var(--chinh-dam)}
.dt-them-loai{display:flex;gap:14px;flex-wrap:wrap;margin:0 0 10px;font-size:.9rem}
.dt-them-loai label{display:flex;align-items:center;gap:6px;cursor:pointer}
.dt-them-2{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}
.dt-them-hop details{border:1px dashed var(--vien);border-radius:10px;padding:8px 12px;margin:4px 0 12px}
.dt-them-hop summary{cursor:pointer;font-weight:600;font-size:.88rem;color:var(--chinh-dam)}
.dt-them-hop details[open] summary{margin-bottom:8px}
.dt-them-tk{display:flex;align-items:center;gap:8px;font-weight:600;margin:4px 0 8px;cursor:pointer}
.dt-them-hop [hidden]{display:none}
@media (max-width:520px){.dt-them-kieu,.dt-them-2{grid-template-columns:1fr}.dt-them-hop{padding:14px 14px 0}}
.dt-chua-tk{color:#C2410C;font-weight:600}

/* v310 NHẮC KHI CÓ THU + PHIẾU THU RỜI (src/thu-nhac.js): khung cảnh báo ở Lập phiếu thu · nhãn "chưa gắn đơn" ở sổ Bán hàng */
.thn-hop{border-color:#F0C27B;background:color-mix(in srgb,#F59E0B 7%,var(--trang))}
.thn-hop h3{margin:0 0 4px;font-size:1rem;color:#9A3412}
.thn-ds{margin:0;padding-left:18px;display:grid;gap:6px;font-size:.9rem;overflow-wrap:anywhere}
.thn-van-lap{display:flex;align-items:center;gap:8px;margin:0 0 10px;font-weight:600;color:#9A3412;cursor:pointer}
.thn-tag{display:inline-block;margin-top:4px;padding:3px 8px;border-radius:8px;font-size:.76rem;font-weight:600;color:#9A3412;
  background:color-mix(in srgb,#F59E0B 14%,var(--trang));overflow-wrap:anywhere;cursor:help}
:root[data-giao-dien="toi"] .thn-hop h3,:root[data-giao-dien="toi"] .thn-van-lap,:root[data-giao-dien="toi"] .thn-tag{color:#FDBA74}

/* v311 (#222 — chị Hương đưa ảnh Bàn làm việc MISA, ông chủ 20/10 "liệt kê các ứng dụng ngay ở phía dưới header" + "hiện cả ở top dưới header của các
   module luôn"): HÀNG PHÂN HỆ đầu MỌI trang nội bộ (partials/vo-dau.ejs, PHAN_HE_TAT).
   v313 (ông chủ 21/10 kèm ảnh: "chỉ cho một danh sách với icon nhỏ bằng 2/3 hiện tại và nằm sát với header (rê chuột vào thì hiện ra tên của phân hệ).
   không cần hiển thị tiêu đề luôn. canh giữa => TIẾT KIỆM KHÔNG GIAN"): một dải biểu tượng 30px (2/3 của 44px), không khung, không chữ, canh giữa,
   kéo lên sát thanh đầu (ăn vào phần đệm trên của .chinh). Tên phân hệ = bong bóng khi rê chuột / focus bàn phím (link có aria-label cho trình đọc màn hình).
   Mỗi phân hệ một màu (--ph); phân hệ đang mở có vòng viền. Điện thoại: một hàng vuốt ngang trong khung, không bong bóng.
   v313 (ông chủ ngay sau: "để nó trong dải nền màu trắng sát với header"): dải NỀN TRẮNG dính liền dưới thanh đầu, tràn hết bề ngang vùng nội dung
   (lề âm bằng đúng phần đệm của .chinh ở từng cỡ màn), viền dưới mảnh như thanh đầu. */
.ph-hang{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin:-24px -28px 18px;padding:6px 12px;min-width:0;
  background:var(--trang);border-bottom:1px solid var(--vien)}
.ph-o{--ph:#5F6368;position:relative;display:flex;align-items:center;justify-content:center;padding:3px;border-radius:10px;text-decoration:none}
.ph-o:hover,.ph-o:focus-visible{background:var(--nen-2);text-decoration:none}
.ph-o:focus-visible{outline:2px solid var(--chinh);outline-offset:1px}
.ph-bieu{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:9px;background:var(--ph);color:#fff;
  box-shadow:0 1px 2px rgba(12,39,64,.16);transition:transform .15s ease}
.ph-o:hover .ph-bieu{transform:translateY(-1px)}
.ph-bieu svg{display:block}
.ph-chu{position:absolute;top:calc(100% + 6px);left:50%;transform:translateX(-50%);z-index:30;white-space:nowrap;padding:4px 9px;border-radius:7px;
  background:#1F2933;color:#fff;font-size:.76rem;font-weight:600;line-height:1.3;box-shadow:0 4px 12px rgba(0,0,0,.18);pointer-events:none;
  opacity:0;visibility:hidden;transition:opacity .12s ease}
.ph-o:hover .ph-chu,.ph-o:focus-visible .ph-chu{opacity:1;visibility:visible}
:root[data-giao-dien="toi"] .ph-chu{background:#E8EAED;color:#1F2933}
.ph-o.dang .ph-bieu{box-shadow:0 0 0 2px var(--nen),0 0 0 4px var(--ph)}
.ph-o[data-ma="crm"]{--ph:#1A73E8}
.ph-o[data-ma="mail"]{--ph:#D93025}
.ph-o[data-ma="hr"]{--ph:#188038}
.ph-o[data-ma="finance"]{--ph:#E37400}
.ph-o[data-ma="management"]{--ph:#8430CE}
.ph-o[data-ma="calendar"]{--ph:#129EAF}
.ph-o[data-ma="tong-dai-web"]{--ph:#F06292}
.ph-o[data-ma="admin"]{--ph:#455A64}
.ph-o[data-ma="trung-tam-khach"]{--ph:#3949AB}
html[data-app] .ph-hang{margin-top:-16px}
@media (max-width:860px){ .ph-hang{margin:-16px -13px 14px} }
@media (max-width:600px){
  .ph-hang{flex-wrap:nowrap;justify-content:flex-start;overflow-x:auto;padding:5px 10px;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .ph-hang::-webkit-scrollbar{display:none}
  .ph-o{flex:0 0 auto}
  .ph-chu{display:none}
}
@media (max-width:480px){ .ph-hang{margin:-14px -10px 12px} }

/* v311 (#223): Lịch làm việc khách hàng — nhóm "Đã liên hệ — chưa đóng việc" (vàng, khác đỏ "chưa liên hệ") + nút ✓ Đã làm xong ở cuối dòng */
.lkh-ngay.qua-han-lh{background:#FEF7E0;color:#8A5A00}
:root[data-giao-dien="toi"] .lkh-ngay.qua-han-lh{background:rgba(253,214,99,.12);color:#FDD663}
.lkh-lh-chu{color:#8A5A00}
:root[data-giao-dien="toi"] .lkh-lh-chu{color:#FDD663}
.lkh-cum{display:flex;align-items:center;border-top:1px solid var(--vien);min-width:0}
.lkh-cum .lkh-dong{flex:1;min-width:0;border-top:0}
.lkh-xong{flex-shrink:0;padding:0 14px 0 4px}
.lkh-xong .nut{white-space:nowrap}
@media (max-width:600px){
  .lkh-cum{flex-wrap:wrap}
  .lkh-cum .lkh-dong{flex-basis:100%}
  .lkh-xong{padding:0 12px 10px 82px}
}

/* v312 CỔ ĐÔNG & VỐN (Quản trị điều hành) + CỔNG NHÀ ĐẦU TƯ (/investor) — views/management/ndt-*.ejs, views/investor/*.ejs */
.ndt-hai-cot{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:20px;align-items:start}
.ndt-hai-cot > *{min-width:0}   /* v314: bảng rộng trong cột lưới cuộn trong khung của nó — không kéo cả trang ngang trên điện thoại */
/* v323.1 TÀI KHOẢN NHÀ ĐẦU TƯ TẠO SAU: màn Thêm — "Tạo sau" thì ẩn mật khẩu / gửi thư, email thành email liên lạc */
/* v323.3 TÀI KHOẢN MẶC ĐỊNH CHƯA TẠO: mặc định chưa tạo (.ndt-tk-sau hiện) · bấm "＋ Tạo tài khoản ngay" (ô tick ẩn trong nút) ⇒ hiện mật khẩu / gửi thông tin */
.ndt-tk-them .ndt-tk-ngay{display:none}
.ndt-tk-them:has(input[name="tao_tk_ngay"]:checked) .ndt-tk-ngay{display:block}
.ndt-tk-them:has(input[name="tao_tk_ngay"]:checked) span.ndt-tk-ngay{display:inline}
.ndt-tk-them:has(input[name="tao_tk_ngay"]:checked) .ndt-tk-sau{display:none}
.ndt-tk-bat{cursor:pointer}
.an-o{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.ndt-tk-tao > summary{list-style:none;display:inline-flex;cursor:pointer}
.ndt-tk-tao > summary::-webkit-details-marker{display:none}
.ndt-tk-tao[open] > summary{display:none}
/* v321.4 TRANG DỰ ÁN HAI CỘT: cột 1 mô tả + người góp · cột 2 việc + kinh doanh + giao dịch — hẹp thì xếp chồng */
.duan-2cot{display:flex;flex-wrap:wrap;gap:0 20px;align-items:flex-start}
.duan-2cot > div:first-child{flex:1 1 360px}
.duan-2cot > div:last-child{flex:1.3 1 440px}
.duan-2cot > div{min-width:0}
.duan-mo-ta{white-space:pre-line;overflow-wrap:anywhere;line-height:1.6}
.ndt-thanh{display:flex;height:22px;border-radius:7px;overflow:hidden;background:var(--nen-2)}
.ndt-thanh span{display:block;height:100%;min-width:2px}
.ndt-chu-giai{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px;font-size:.84rem}
.ndt-chu-giai i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.ndt-sim{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin-top:6px}
.ndt-sim div{background:var(--nen-2);border-radius:8px;padding:10px 12px;display:flex;flex-direction:column;gap:2px}
.ndt-sim span{font-size:.8rem}
.ndt-o-tk{border:2px solid var(--chinh);background:color-mix(in srgb,var(--chinh) 6%,var(--trang))}
.ndt-quy-o{border:1px solid var(--vien);border-radius:10px;padding:12px 14px;margin-bottom:12px}
.ndt-so-nho,.ndt-the{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:10px 0 6px}
.ndt-so-nho div,.ndt-the div{display:flex;flex-direction:column;gap:2px;min-width:0}
.ndt-so-nho span,.ndt-the span{font-size:.76rem;letter-spacing:.04em;text-transform:uppercase;color:var(--chu-mo)}
.ndt-so-nho b{font-size:1.05rem;color:var(--chinh-dam)}
.ndt-the b{font-size:1.45rem;color:var(--chinh-dam);line-height:1.25;overflow-wrap:anywhere}
.ndt-the small{font-size:.78rem;color:var(--chu-mo)}
.ndt-xem-dong{display:flex;justify-content:space-between;gap:10px;padding:6px 0;border-bottom:1px solid var(--vien)}
.ndt-xem-dong:last-child{border-bottom:0}
.ndt-buoc{list-style:none;margin:0 0 16px;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.ndt-buoc li{flex:1 1 160px;border-radius:10px;padding:8px 12px;background:var(--nen-2);color:var(--chu-mo);font-size:.86rem;display:flex;flex-direction:column}
.ndt-buoc li.xong{background:#E8F3EC;color:#1E5233}
.ndt-buoc li.dang{background:#FEF3E2;color:#8A5A00;box-shadow:inset 0 0 0 2px #E3B567}
.ndt-phieu{border:1px solid var(--vien);border-radius:10px;padding:10px 14px 0;margin:0 0 15px}
.ndt-phieu legend{font-weight:700;font-size:.9rem;padding:0 4px}
.ndt-chon-dong{display:flex;gap:10px;align-items:flex-start;padding:9px 0;border-bottom:1px solid var(--vien);cursor:pointer}
.ndt-chon-dong:last-of-type{border-bottom:0}
.ndt-chon-dong input{margin-top:4px}
.ndt-chon-dong > span{display:flex;flex-direction:column;gap:2px}
.ndt-cs{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px}
.ndt-cs-o{border:1px solid var(--vien);border-radius:10px;padding:12px 14px;display:flex;flex-direction:column;gap:3px;min-width:0}
.ndt-cs-ten{font-size:.84rem;color:var(--chu-mo)}
.ndt-cs-o b{font-size:1.3rem;color:var(--chinh);overflow-wrap:anywhere}
/* v318 vòng 1 cổng: ô tìm / sắp trên bảng nhiều dự án · thẻ "hôm nay các dự án của tôi" ở Trang của tôi */
.ndt-bang-loc{margin:4px 18px 10px}
.ndt-bang-loc input[type=search]{border:1px solid var(--vien);background:var(--trang);color:var(--chu)}
.ndt-hn-the{display:flex;align-items:center;gap:14px;flex-wrap:wrap;text-decoration:none;color:inherit}
.ndt-hn-the:hover{border-color:var(--chinh)}
.ndt-hn-chu{display:flex;flex-direction:column;gap:2px;flex:1 1 220px;min-width:0}
.ndt-hn-so{display:flex;gap:18px;flex-wrap:wrap}
.ndt-hn-so b{font-size:1.15rem}
/* v318 vòng 3 cổng: dải "mới từ lần trước" */
.ndt-moi{display:flex;align-items:center;gap:10px 16px;flex-wrap:wrap;border-left:4px solid var(--nhan)}
.ndt-moi-ds{display:flex;gap:8px;flex-wrap:wrap}
.ndt-moi-ds a{display:inline-block;padding:5px 11px;border:1px solid var(--vien);border-radius:99px;font-size:.9rem;font-weight:600;background:var(--trang)}
.ndt-moi-ds a.xanh{border-color:#9BD3B0;background:#ECF8F0;color:#17663A}
.ndt-moi-trong{margin:-4px 0 14px}
@media (max-width:600px){
  .ndt-cong .ndt-cs{grid-template-columns:1fr 1fr;gap:8px}
  .ndt-cong .ndt-cs-o{padding:10px 11px}
  .ndt-cong .ndt-cs-o b{font-size:1.05rem}
  .ndt-cong .sl-bang-cuon .bang-gon td:first-child{min-width:128px}
}
.ndt-giai-thich{margin-top:14px;background:var(--nen-2);border-radius:10px;padding:12px 14px}
.ndt-giai-thich p{margin:4px 0 0;white-space:pre-line}
.ndt-dong-link{display:flex;justify-content:space-between;gap:10px;padding:8px 0;border-bottom:1px solid var(--vien);color:var(--chu);text-decoration:none}
.ndt-dong-link:hover{color:var(--chinh)}
tr.ndt-toi td{font-weight:700;color:var(--chinh)}
:root[data-giao-dien="toi"] .ndt-buoc li.xong{background:#14301F;color:#9ADCB4}
:root[data-giao-dien="toi"] .ndt-buoc li.dang{background:#32241A;color:#EBB98C}
/* v314 ĐỢT TĂNG VỐN + HỎI ĐÁP — views/management/ndt-dot*.ejs, ndt-hoi.ejs, views/investor/moi*.ejs, hoi.ejs */
.vang-chu{color:#8A5A00}
.dot-thanh-nho{height:4px;border-radius:2px;background:var(--nen-2);margin-top:4px;overflow:hidden}
.dot-thanh-nho span{display:block;height:100%;background:#1E8E3E}
.dot-cach{margin:8px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:4px}
.dot-cach li.xong{color:#1E8E3E}
.dot-cach li.xong::marker{content:'✓  '}
.dot-viec{position:relative}
.dot-viec summary{list-style:none;cursor:pointer;white-space:nowrap}
.dot-viec summary::-webkit-details-marker{display:none}
/* khung Việc nổi GIỮA màn (bảng nằm trong khung cuộn ngang — khung bám nút sẽ bị cắt); bấm nền mờ = đóng */
.dot-viec-xo{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:41;width:min(340px,92vw);max-height:86vh;overflow:auto;background:var(--trang);border:1px solid var(--vien);border-radius:12px;box-shadow:var(--bong);padding:14px;display:flex;flex-direction:column;gap:12px;text-align:left;white-space:normal}
.dot-viec[open] > summary::before{content:'';position:fixed;inset:0;background:rgba(15,23,42,.32);z-index:40;cursor:default}
.dot-viec-xo form + form{border-top:1px solid var(--vien);padding-top:12px}
.dot-hoi{border-bottom:1px solid var(--vien);padding:10px 0}
.dot-hoi:last-of-type{border-bottom:0}
.dot-hoi p{margin:4px 0 8px;white-space:pre-line}
.dot-tra-loi{background:var(--nen-2);border-left:3px solid var(--chinh);border-radius:0 8px 8px 0;padding:8px 12px;white-space:pre-line;font-size:.92rem}
a.dot-the-moi{display:flex;flex-direction:column;gap:3px;text-decoration:none;color:var(--chu)}
a.dot-the-moi:hover{border-color:var(--chinh)}
.dot-nda{background:var(--nen-2);border-radius:10px;padding:12px 14px;max-height:280px;overflow:auto;white-space:pre-line;font-size:.9rem;line-height:1.55}
.dot-hai-o{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:10px}
.dot-hai-o > div{border-radius:10px;padding:12px 14px;display:flex;flex-direction:column;gap:2px}
.dot-hai-o b{font-size:1.35rem}
.dot-o-xanh{background:#E8F3EC;color:#1E5233}
.dot-o-cam{background:#FEF3E2;color:#8A5A00}
.dot-nop{display:flex;flex-wrap:wrap;gap:16px;align-items:flex-start;margin-top:12px}
.dot-nop img{border-radius:10px;border:1px solid var(--vien);background:#fff;width:200px;height:auto}
.dot-nop > div{flex:1;min-width:200px;display:flex;flex-direction:column;gap:4px}
.ndt-cong-dem{display:inline-block;min-width:18px;padding:0 5px;border-radius:9px;background:#F9AB00;color:#0C2740;font-size:.74rem;font-weight:700;text-align:center;line-height:18px}
:root[data-giao-dien="toi"] .vang-chu{color:#EBB98C}
:root[data-giao-dien="toi"] .dot-o-xanh{background:#14301F;color:#9ADCB4}
:root[data-giao-dien="toi"] .dot-o-cam{background:#32241A;color:#EBB98C}
/* v315 CỔNG NHÀ ĐẦU TƯ ĐƠN GIẢN HOÁ (ông chủ 21/10 "sao để các nhà đầu tư sử dụng dễ nhất") — views/investor/tong-quan.ejs, moi-ct.ejs */
.ndt-chao{font-size:1.55rem;margin:4px 0 16px;color:var(--chinh-dam)}
.ndt-muc{font-size:1.05rem;margin:24px 0 10px;color:var(--chu-mo);text-transform:uppercase;letter-spacing:.05em}
.ndt-viec h2{margin:0 0 10px;font-size:1.05rem}
.ndt-viec-trong{margin:0;color:#1E8E3E;font-weight:600}
.ndt-viec-dong{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;margin-top:8px;border-radius:12px;background:#FEF7E0;color:var(--chu);text-decoration:none;border:1px solid #F6D58A}
.ndt-viec-dong:hover{border-color:#E3A008}
.ndt-viec-dong.cho_xac_nhan,.ndt-viec-dong.sap_mo{background:var(--nen-2);border-color:var(--vien)}
.ndt-viec-chu{display:flex;flex-direction:column;gap:2px;min-width:0}
.ndt-viec-chu b{font-size:1.02rem}
.ndt-viec-chu span{font-size:.86rem;color:var(--chu-mo)}
.ndt-viec-dong .nut{flex:none}
.ndt-cty-luoi{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:16px;margin-top:16px}
.ndt-cty{display:flex;flex-direction:column;gap:8px;margin:0}
.ndt-cty-ten{display:flex;justify-content:space-between;align-items:center;gap:8px}
.ndt-cty-ten b{font-size:1.08rem}
.ndt-cty-so{font-size:2rem;font-weight:700;color:var(--chinh-dam);line-height:1.15}
.ndt-cty-so small{font-size:1rem;font-weight:500;color:var(--chu-mo)}
.ndt-cty-hang{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.ndt-cty-hang div{display:flex;flex-direction:column;gap:2px;background:var(--nen-2);border-radius:10px;padding:10px 12px;min-width:0}
.ndt-cty-hang b{font-size:1.15rem;overflow-wrap:anywhere}
.ndt-cty-hang span{font-size:.8rem;color:var(--chu-mo)}
.ndt-cty-ghi{margin:0;padding-left:18px;font-size:.86rem;color:var(--chu-mo)}
.ndt-cty-xem{align-self:flex-start;font-size:.92rem;font-weight:600}
.ndt-song{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:10px}
.ndt-song div{display:flex;flex-direction:column;gap:2px;border:1px solid var(--vien);border-radius:10px;padding:10px 12px}
.ndt-song span{font-size:.82rem;color:var(--chu-mo)}
.ndt-song b{font-size:1.2rem;color:var(--chinh)}
.ndt-b h2{display:flex;align-items:center;gap:10px;margin:0 0 12px;font-size:1.1rem}
.ndt-b-so{flex:none;width:30px;height:30px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:var(--nen-2);color:var(--chu-mo);font-size:.95rem;font-weight:700}
.ndt-b.dang{border:2px solid var(--chinh)}
.ndt-b.dang .ndt-b-so{background:var(--chinh);color:#fff}
.ndt-b.xong .ndt-b-so{background:#1E8E3E;color:#fff}
.ndt-b-ket{margin:0;color:#1E5233;font-weight:600}
.ndt-dk{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px;margin:0}
.ndt-dk div{display:flex;flex-direction:column;gap:2px;min-width:0}
.ndt-dk div.rong{grid-column:1 / -1}
.ndt-dk dt{font-size:.8rem;color:var(--chu-mo)}
.ndt-dk dd{margin:0;font-weight:600;font-size:1.05rem;white-space:pre-line}
.ndt-tl-chip{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.ndt-tl-chip a{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid var(--vien);border-radius:999px;font-size:.9rem;text-decoration:none;color:var(--chu)}
.ndt-tl-chip a:hover{border-color:var(--chinh);color:var(--chinh)}
.ndt-chon{display:flex;gap:12px;align-items:flex-start;padding:12px 14px;border:1px solid var(--vien);border-radius:12px;margin-bottom:8px;cursor:pointer}
.ndt-chon:has(input[type=radio]:checked){border:2px solid var(--chinh);background:color-mix(in srgb,var(--chinh) 6%,var(--trang))}
.ndt-chon > input[type=radio]{margin-top:4px;width:18px;height:18px;flex:none}
.ndt-chon > span{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}
.ndt-chon > span > span{font-size:.86rem;color:var(--chu-mo)}
.ndt-chon input[name=so_luong]{max-width:240px;margin:2px 0}
.ndt-nop-tien{display:flex;flex-direction:column;margin-bottom:6px}
.ndt-nop-tien span{font-size:.82rem;color:var(--chu-mo)}
.ndt-nop-tien b{font-size:1.6rem;color:var(--chinh-dam)}
.ndt-lich{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0}
.ndt-lich li{position:relative;padding:0 0 14px 22px;display:flex;flex-direction:column;gap:2px;font-size:.9rem;color:var(--chu-mo)}
.ndt-lich li::before{content:'';position:absolute;left:4px;top:5px;width:10px;height:10px;border-radius:50%;background:var(--vien)}
.ndt-lich li:not(:last-child)::after{content:'';position:absolute;left:8px;top:17px;bottom:2px;width:2px;background:var(--vien)}
.ndt-lich li b{color:var(--chu)}
.ndt-lich li.dang::before{background:var(--chinh);box-shadow:0 0 0 3px color-mix(in srgb,var(--chinh) 25%,transparent)}
.ndt-lich li.xong::before{background:#1E8E3E}
@media (max-width:600px){ .ndt-cty-so{font-size:1.7rem} .ndt-viec-dong{flex-direction:column;align-items:flex-start} .ndt-cty-luoi{grid-template-columns:1fr} }
/* v315 CHỌN SỔ (công ty / dự án) bằng hàng nút · thẻ sổ ở Công ty & dự án — views/management/_ndt-quy-chon.ejs, ndt-quy.ejs */
.quy-chip{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:-4px 0 16px}
.quy-chip a{display:flex;flex-direction:column;padding:7px 14px;border:1px solid var(--vien);border-radius:10px;background:var(--trang);color:var(--chu);text-decoration:none;font-weight:600;font-size:.92rem;line-height:1.25}
.quy-chip a small{font-weight:400;font-size:.74rem;color:var(--chu-mo)}
.quy-chip a:hover{border-color:var(--chinh)}
.quy-chip a.dang{border:2px solid var(--chinh);background:color-mix(in srgb,var(--chinh) 8%,var(--trang));color:var(--chinh-dam)}
.quy-luoi{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}
.quy-the{display:flex;flex-direction:column;gap:8px;margin:0}
.quy-the.mo{opacity:.65}
.hop-nd{padding:10px 0;border-bottom:1px solid var(--vien)}
.hop-nd:last-of-type{border-bottom:0}
.hop-chon{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:6px}
.hop-chon .ndt-chon{margin:0;align-items:center}
.hop-chon .ndt-chon.tan_thanh:has(input:checked){border-color:#1E8E3E;background:#E8F3EC}
.hop-chon .ndt-chon.khong_tan_thanh:has(input:checked){border-color:#D93025;background:#FCE8E6}
@media (max-width:600px){ .hop-chon{grid-template-columns:1fr} }
/* v316 TẤT CẢ NHÀ ĐẦU TƯ · nhãn vai trò — views/management/ndt-tat-ca.ejs */
.vai-chip{display:flex;flex-wrap:wrap;gap:4px}
.chip-loc{display:flex;flex-wrap:wrap;gap:6px}
.chip-loc a{padding:6px 12px;border:1px solid var(--vien);border-radius:999px;background:var(--trang);color:var(--chu);text-decoration:none;font-size:.88rem}
.chip-loc a:hover{border-color:var(--chinh)}
.chip-loc a.dang{background:var(--chinh);border-color:var(--chinh);color:#fff}
.chip-loc a.dang .mo{color:rgba(255,255,255,.8)}
/* v317 — gợi ý số chia từ lãi lỗ khối / công ty */
.ctc-goi-y{border:1px solid var(--vien);border-radius:10px;padding:10px 12px;margin:0 0 14px;background:rgba(46,125,143,.06)}
.ctc-gy-so{display:flex;justify-content:space-between;gap:10px;padding:3px 0;border-bottom:1px dashed var(--vien)}
.ctc-gy-so:last-of-type{border-bottom:0}
.ctc-gy-so span{color:var(--chu-mo);font-size:.9rem}
/* v317 — cổng nhà đầu tư › số liệu dự án thời gian thực */
.sl-chon{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.sl-chon select{flex:1 1 220px;min-width:0;max-width:100%}
.sl-bang-cuon{overflow-x:auto}
.sl-ngay td{padding-top:5px;padding-bottom:5px}
.sl-cot{display:block;height:6px;border-radius:3px;min-width:0;margin:2px 0}
.sl-cot.thu{background:#2E7D5B}
.sl-cot.chi{background:#B3261E;opacity:.75}
.sl-loc{display:flex;flex-wrap:wrap;gap:10px;align-items:flex-end}
.sl-loc label{display:flex;flex-direction:column;gap:3px;font-size:.85rem;color:var(--chu-mo)}
/* v317 — Tất cả nhà đầu tư: cột dự án gom gọn · ô khoá gói Đa dự án */
.tc-du-an{display:flex;flex-wrap:wrap;gap:4px 6px}
.tc-du-an a{border:1px solid var(--vien);border-radius:999px;padding:1px 8px;white-space:nowrap;text-decoration:none}
.goi-khoa-o{border:1px dashed var(--vien-dam);border-radius:10px;padding:12px 14px;background:rgba(201,140,40,.07)}
/* v317 — cổng nhà đầu tư: ô lọc DỰ ÁN ở đầu mọi trang */
.ndt-loc-da{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;border:1px solid var(--vien);border-radius:10px;padding:8px 12px;margin:0 0 14px}
.ndt-loc-da label{display:inline-flex;align-items:center;gap:6px}
.ndt-loc-da select{flex:1 1 220px;min-width:0;max-width:420px}
.ndt-loc-da.dang{border-color:#2E7D8F;background:rgba(46,125,143,.07)}
/* v317 — Công ty & dự án dạng DANH SÁCH + khung bên phải (Thêm / Cài đặt) */
.quy-ds td{vertical-align:top}
.quy-ds tr.quy-dang-sua td{background:rgba(46,125,143,.08)}
#cai-dat,#dinh-gia{scroll-margin-top:96px}   /* cuộn tới khung: thanh đầu trang không che tiêu đề + nút Đóng */
.ndt-hai-cot .quy-ds th:nth-child(2),.ndt-hai-cot .quy-ds td:nth-child(2),
.ndt-hai-cot .quy-ds th:nth-child(6),.ndt-hai-cot .quy-ds td:nth-child(6){display:none}   /* khung đang mở: bớt cột phụ cho bảng khỏi chật */
/* v317 — Dự án & thông tin: ô chọn dự án đầu trang · thẻ Tổng quan */
.duan-chon{margin-bottom:16px}
.duan-the{margin-bottom:16px}
.duan-hai{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.duan-cham{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:7px;vertical-align:middle}
.duan-viec{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.duan-viec a{display:flex;flex-direction:column;gap:2px;border:1px solid var(--vien);border-radius:10px;padding:9px 11px;text-decoration:none;color:inherit}
.duan-viec a:hover{border-color:var(--chinh)}
.duan-viec span{font-size:.84rem;color:var(--chu-mo)}
/* v317 — hồ sơ nhà đầu tư › thẻ Dự án tham gia: thao tác gập trong dòng */
.hs-da-them summary{cursor:pointer;white-space:nowrap}
.hs-da-them[open]{min-width:260px}
/* v317 — Dự án › Kết nối dữ liệu: mẫu gọi API / mẫu tệp */
.ks-mau{background:var(--nen-2);border:1px solid var(--vien);border-radius:8px;padding:10px 12px;font-size:.8rem;overflow-x:auto;white-space:pre;margin:8px 0}
/* v317 — Cài đặt dự án & cổ đông: thẻ dọc chia nhóm */
.tab-doc .tab-nhom{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--chu-mo);padding:12px 14px 4px}
.tab-doc .tab-nhom:first-child{padding-top:4px}
.cd-api-h{font-size:.95rem;margin:16px 0 6px}   /* v317 Cài đặt › API dự án › Cách gửi dữ liệu */
/* v318 — Bảng điều hành đa dự án */
.bdh-bang th a{color:inherit;text-decoration:none}
.bdh-bang th a.dang{color:var(--chinh)}
.bdh-bang tr.bdh-lo td{background:rgba(179,38,30,.04)}
/* — khung cổng nhà đầu tư — */
body.ndt-cong{margin:0;background:var(--nen);color:var(--chu);min-height:100vh;display:flex;flex-direction:column}
.ndt-cong-dau{display:flex;flex-wrap:wrap;align-items:center;gap:10px 22px;padding:10px 24px;background:#0C2740;color:#fff}
.ndt-cong-hieu{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none}
.ndt-cong-hieu:hover{color:#fff;text-decoration:none}
.ndt-cong-hieu img{width:32px;height:32px;border-radius:8px;background:#fff;object-fit:contain;padding:2px}
.ndt-cong-hieu span{display:flex;flex-direction:column;line-height:1.2}
.ndt-cong-hieu small{color:#B9C9DC;font-size:.76rem}
/* v315 MENU TRÁI (ông chủ 21/10 "chuyển thành menu trái") — máy tính: cột trái dính; điện thoại: nút "☰ Menu" gập */
.ndt-cong-khung{flex:1;display:grid;grid-template-columns:232px minmax(0,1fr);width:100%;max-width:1320px;margin:0 auto;box-sizing:border-box}
.ndt-cong-trai{position:sticky;top:0;align-self:start;display:flex;flex-direction:column;gap:2px;padding:20px 12px;min-height:calc(100vh - 60px);box-sizing:border-box;border-right:1px solid var(--vien)}
.ndt-cong-trai a,.ndt-cong-menu-dt nav a{display:flex;align-items:center;gap:12px;padding:11px 14px;border-radius:10px;color:var(--chu);text-decoration:none;font-size:.97rem}
.ndt-cong-trai a:hover,.ndt-cong-menu-dt nav a:hover{background:var(--nen-2)}
.ndt-cong-trai a.dang,.ndt-cong-menu-dt nav a.dang{background:color-mix(in srgb,var(--chinh) 12%,var(--trang));color:var(--chinh-dam);font-weight:700}
.ndt-cong-trai .bieu,.ndt-cong-menu-dt .bieu{display:inline-flex;color:var(--chu-mo)}
.ndt-cong-trai a.dang .bieu,.ndt-cong-menu-dt a.dang .bieu{color:var(--chinh)}
.ndt-cong-trai .chu,.ndt-cong-menu-dt .chu{flex:1}
.ndt-cong-menu-dt{display:none}
.ndt-cong-phai{margin-left:auto;display:flex;align-items:center;gap:10px}
.ndt-cong-nn{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.4);border-radius:8px;padding:5px 10px;font:inherit;font-size:.8rem;cursor:pointer;min-height:36px}
.ndt-cong-toi{position:relative}
.ndt-cong-toi summary{list-style:none;cursor:pointer;padding:6px 10px;border-radius:8px;border:1px solid rgba(255,255,255,.25);font-size:.9rem;min-height:36px;display:flex;align-items:center}
.ndt-cong-toi summary::-webkit-details-marker{display:none}
.ndt-cong-ten{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ndt-cong-toi-xo{position:absolute;right:0;top:calc(100% + 6px);background:var(--trang);color:var(--chu);border:1px solid var(--vien);border-radius:10px;box-shadow:var(--bong);min-width:190px;padding:6px;z-index:20}
.ndt-cong-toi-xo a,.ndt-cong-toi-xo button{display:block;width:100%;text-align:left;padding:9px 10px;border-radius:7px;color:var(--chu);text-decoration:none;background:none;border:0;font:inherit;cursor:pointer}
.ndt-cong-toi-xo a:hover,.ndt-cong-toi-xo button:hover{background:var(--nen-2)}
.ndt-cong-than{flex:1;width:100%;max-width:1080px;margin:0 auto;padding:24px 28px;box-sizing:border-box;min-width:0}
.ndt-cong-khung .ndt-cong-than{margin:0;max-width:1060px}
.ndt-cong-chan{text-align:center;color:var(--chu-mo);font-size:.8rem;padding:18px 16px 26px}
.ndt-dn{display:flex;justify-content:center;padding:40px 0}
.ndt-dn-o{width:100%;max-width:400px}
.ndt-dn-o h1{font-size:1.4rem;margin:0 0 4px;color:var(--chinh-dam)}
.ndt-dn-ma{font-size:1.5rem;letter-spacing:.4em;text-align:center}
@media (max-width:860px){ .ndt-hai-cot{grid-template-columns:1fr} }
@media (max-width:860px){
  .ndt-cong-khung{display:block}
  .ndt-cong-trai{display:none}
  .ndt-cong-menu-dt{display:block;background:var(--trang);border-bottom:1px solid var(--vien)}
  .ndt-cong-menu-dt summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;font-size:.95rem;min-height:44px;box-sizing:border-box}
  .ndt-cong-menu-dt summary::-webkit-details-marker{display:none}
  .ndt-cong-menu-dt summary b{color:var(--chinh-dam)}
  /* v323.11 VÍ LÊN MENU (ông chủ 23/10 "menu trái trên phone là nổi lên chứ không phải là đẩy nội dung xuống"): NGĂN KÉO NỔI bên trái.
     Nền mờ (summary::after) + ô ✕ (summary::before) là phần của <summary> ⇒ chạm là đóng; khung chồng riêng (z-index) nổi trên nội dung. */
  .ndt-cong-menu-dt{position:relative;z-index:60}
  .ndt-cong-menu-dt nav{position:fixed;top:0;left:0;bottom:0;width:min(300px,86vw);overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:2px;
    padding:60px 10px 18px;box-sizing:border-box;background:var(--trang);box-shadow:6px 0 28px rgba(0,0,0,.22);z-index:2}
  .ndt-cong-menu-dt[open] nav{animation:ndt-ngan-vao .2s ease-out}
  .ndt-cong-menu-dt[open] summary::after{content:'';position:fixed;inset:0;background:rgba(12,39,64,.5);z-index:1}
  .ndt-cong-menu-dt[open] summary::before{content:'✕   ' attr(data-dong);position:fixed;top:0;left:0;width:min(300px,86vw);height:50px;display:flex;align-items:center;
    padding:0 18px;box-sizing:border-box;background:#0C2740;color:#fff;font-weight:700;font-size:.95rem;z-index:3}
  body.ndt-cong:has(.ndt-cong-menu-dt[open]){overflow:hidden}
}
@keyframes ndt-ngan-vao{from{transform:translateX(-100%)}to{transform:none}}
@media (prefers-reduced-motion:reduce){.ndt-cong-menu-dt[open] nav{animation:none}}
/* v323.11: ví 0 ₫ — biểu mẫu rút hiện mờ để thấy công cụ */
.gdt-ghi-tien.vi-mo{opacity:.6}
.vi-trong{margin:0 0 10px;padding:10px 12px;border-radius:10px;background:var(--nen-2);color:var(--chu)}
@media (max-width:600px){
  .ndt-cong-dau{padding:10px 14px}
  .ndt-cong-than{padding:16px}
  .ndt-cong-ten{max-width:110px}
  .ndt-dn{padding:16px 0}
}

/* v318 THANH LỌC MỘT HÀNG (ông chủ 22/10 "rà soát các ô tìm kiếm và nút tìm kiếm cho bằng nhau nhỏ thôi và 1 hàng"):
   mọi ô (tìm · chọn · ngày · số) và nút trong thanh CÙNG CAO 34px; ô tìm co giãn vừa phải (không chiếm cả hàng đẩy nút xuống dòng).
   Dùng: <form class="loc-hang"> … </form>. Biểu mẫu có nhãn trên ô (.truong) vẫn dùng được — ô trong .truong giãn hết ô. */
.loc-hang{display:flex;align-items:center;gap:6px;flex-wrap:nowrap}   /* KHÔNG gập: đứng cạnh hàng chip, biểu mẫu bị ép hẹp rồi tự gập nút xuống dòng */
.loc-hang input:not([type=hidden]):not([type=checkbox]):not([type=radio]),.loc-hang select{width:auto;height:34px;min-height:34px;margin:0;padding:0 10px;font-size:.87rem;border-radius:8px;box-sizing:border-box}
.loc-hang select{padding-right:26px;max-width:240px}
.loc-hang input[type=search],.loc-hang input[type=text],.loc-hang input:not([type]){flex:1 1 200px;min-width:140px;max-width:320px}
.loc-hang .nut,.loc-hang .nut.nho{height:34px;min-height:34px;padding:0 14px;font-size:.85rem;border-radius:8px;flex:0 0 auto;white-space:nowrap;margin:0;line-height:1}
.loc-hang > label{margin:0;display:inline-flex;align-items:center;gap:5px;font-weight:500;white-space:nowrap}
.loc-hang > label input{margin:0}
.loc-hang > a:not(.nut){white-space:nowrap;font-size:.86rem}
.loc-hang .truong input:not([type=hidden]):not([type=checkbox]),.loc-hang .truong select{width:100%;max-width:none}
@media (max-width:600px){
  .loc-hang{flex-wrap:wrap}
  .loc-hang input[type=search],.loc-hang input[type=text],.loc-hang input:not([type]){flex:1 1 150px;max-width:none}
}

/* v319 thẻ Ban dự án & quy tắc · duyệt tiền vốn */
.ban-vai{display:grid;grid-template-columns:minmax(150px,220px) 1fr;gap:6px 14px;padding:10px 0;border-top:1px solid var(--vien)}
.ban-vai:first-of-type{border-top:0}
.ban-vai-ten{display:flex;flex-direction:column;gap:2px}
.ban-vai-ds{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.ban-nguoi{display:inline-flex;align-items:center;gap:4px;padding:4px 6px 4px 10px;border:1px solid var(--vien);border-radius:99px;background:var(--trang);font-size:.88rem}
.ban-nguoi.ndt{border-color:#E0C27A;background:#FFF8E6}
.ban-bo{display:inline;margin:0}
.nut-x{border:0;background:none;cursor:pointer;color:var(--chu-mo);font-size:1rem;line-height:1;padding:0 4px;border-radius:50%}
.nut-x:hover{color:#C5221F;background:var(--nen-2)}
.ban-qt-thanh{display:flex;height:26px;border-radius:8px;overflow:hidden;font-size:.8rem;font-weight:700;color:#fff}
.ban-qt-thanh span{display:flex;align-items:center;justify-content:center;min-width:34px}
.ban-qt-thanh .chia{background:var(--chinh)}
.ban-qt-thanh .quy{background:#C8922F}
.ban-quy-so{font-size:1.25rem;color:var(--chinh)}
.dn-tu-choi{display:inline-block;margin-left:4px}
.dn-tu-choi summary{list-style:none;cursor:pointer}
.dn-tu-choi summary::-webkit-details-marker{display:none}
@media (max-width:600px){ .ban-vai{grid-template-columns:1fr} }

/* v319 hiệu quả đầu tư */
.hq-luoi{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin-top:12px}
.hq-luoi > div{border:1px solid var(--vien);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column;gap:2px;min-width:0}
.hq-luoi span{font-size:.82rem;color:var(--chu-mo)}
.hq-luoi b{font-size:1.15rem;color:var(--chinh);overflow-wrap:anywhere}
.hq-luoi small{font-size:.78rem;color:var(--chu-mo)}

/* v319 kế hoạch ↔ thực tế */
.kh-bang input{width:130px;max-width:100%;text-align:right;padding:5px 8px}
.kh-bang tr.kh-chay td{background:#FFFBEA}
/* v319 bảng điều hành nhiều cột: tên dự án một dòng (bảng cuộn ngang khi hẹp) */
.bdh-bang td:first-child,.bdh-bang th{white-space:nowrap}
/* v320 Giao dịch vốn: thanh lọc gập được · cột tiền · dòng tổng · trang một giao dịch */
.gdt-loc{flex-wrap:wrap;margin:0 0 12px}
.gdt-loc .gdt-ngay{display:inline-flex;align-items:center;gap:4px;font-weight:400}
.gdt-loc .gdt-ngay input{width:150px}
.gdt-bang td.gdt-tien .nhan{margin-top:3px;white-space:nowrap}
.gdt-bang td.giua,.gdt-bang th.giua{text-align:center}
.gdt-tong td{background:var(--nen-nhe,#F6F8FB);border-top:1px solid var(--vien)}
.gdt-tong tr:first-child td{border-top:2px solid var(--vien)}
.gdt-ct-luoi{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;margin-bottom:16px}
.gdt-ct-luoi > .o{margin:0}
.gdt-dl{display:grid;grid-template-columns:minmax(110px,160px) 1fr;gap:8px 14px;margin:0}
.gdt-dl dt{color:var(--chu-mo,#6B7280);font-size:.88rem}
.gdt-dl dd{margin:0}
.gdt-so4{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin:8px 0}
.gdt-so4 > div{display:flex;flex-direction:column;gap:2px;padding:10px 12px;border:1px solid var(--vien);border-radius:10px;background:var(--trang)}
.gdt-so4 b{font-size:1.05rem;font-variant-numeric:tabular-nums;white-space:nowrap}
.gdt-bang td.gdt-tien{white-space:nowrap}
.gdt-bang td.gdt-cc{min-width:120px;max-width:240px}
.gdt-bang td.gdt-cc > span,.gdt-bang td.gdt-cc > div{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.gdt-ghi-tien{margin-top:14px;padding:12px 14px;border:1px dashed var(--vien);border-radius:10px;display:flex;flex-direction:column;gap:8px}
/* v321.4 SỔ DỰ ÁN · MÔ TẢ GỌN: mô tả dự án trong danh sách gọn 2 dòng */
.ndt-mo-ta-gon{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;max-width:34rem;overflow-wrap:anywhere}
/* v321.3 GÓP BẰNG TÀI SẢN / HIỆN VẬT: ô tài sản + căn cứ định giá chỉ hiện khi chọn hình thức "tài sản" */
.gdt-ts,.gdt-ts-mo{display:none}
.gdt-ghi-tien:has(option[value="tai_san"]:checked) .gdt-ts{display:flex;flex-direction:column;gap:8px}
.gdt-ghi-tien:has(option[value="tai_san"]:checked) .gdt-ts-mo,.gdt-tien-ngay:has(option[value="tai_san"]:checked) .gdt-ts-mo{display:block}
.gdt-ghi-tien:has(option[value="tai_san"]:checked) .gdt-mo-phieu{display:none}
/* v323.6 ĐỔI TIỀN TÀI SẢN: "Góp bằng: Tiền | Tài sản / hiện vật" ở khung Ghi nhận của trang giao dịch */
.gdt-ghi-tien:has(input[name="kieu_gop"][value="tai_san"]:checked) .gdt-ts{display:flex;flex-direction:column;gap:8px}
.gdt-ghi-tien:has(input[name="kieu_gop"][value="tai_san"]:checked) .gdt-ts-mo{display:inline}
.gdt-ghi-tien:has(input[name="kieu_gop"][value="tai_san"]:checked) .gdt-mo-phieu,.gdt-ghi-tien:has(input[name="kieu_gop"][value="tai_san"]:checked) .gd-chi-tien{display:none}
.gd-kieu-gop{align-items:center}
/* hộp Ghi giao dịch: Điều chỉnh không phát sinh tiền ⇒ ẩn khung Tiền đã nhận (như Thanh toán bằng) */
.gd-form:has(#g-loai-gd option[value="dieu_chinh"]:checked) fieldset.gdt-tien-ngay{display:none}
.gdt-tien-ngay{border:1px solid var(--vien);border-radius:10px;padding:8px 12px 10px;margin:0 0 12px}
.gdt-tien-ngay legend{font-weight:600;font-size:.9rem;padding:0 6px}
/* v323.4 BIỂU QUYẾT THEO GIAO DỊCH: hộp Ghi giao dịch — giá chuyển nhượng chỉ khi chuyển nhượng · tài sản thay tiền đã nhận · mua lại / rút vốn không trả bằng tài sản */
.gd-form .gd-chi-cn,.gd-form .gd-ts{display:none}
.gd-form:has(#g-loai-gd option[value="chuyen_nhuong"]:checked) .gd-chi-cn{display:block}
.gd-form:has(input[name="thanh_toan"][value="tai_san"]:checked) .gd-ts{display:block}
.gd-form:has(input[name="thanh_toan"][value="tai_san"]:checked) fieldset.gdt-tien-ngay:not(.gd-ts){display:none}
.gd-form:has(#g-loai-gd option[value="mua_lai"]:checked) .gd-tt-ts,.gd-form:has(#g-loai-gd option[value="rut_von"]:checked) .gd-tt-ts,.gd-form:has(#g-loai-gd option[value="dieu_chinh"]:checked) .gd-tt{display:none}
.gd-tt .nhan-o{display:block;font-weight:600;font-size:.9rem;margin-bottom:6px}
/* v323.6 HUỶ GỠ HẲN GIAO DỊCH */
.gd-huy{margin-top:14px;padding-top:12px;border-top:1px dashed var(--vien)}
.gd-huy > details > summary{list-style:none;display:inline-flex;cursor:pointer}
.gd-huy > details > summary::-webkit-details-marker{display:none}
.nut.nut-do{background:#B42318;border-color:#B42318;color:#fff}
.gdt-nhan-lon{font-size:.92rem;padding:6px 12px}
@media (max-width:900px){ .gdt-ct-luoi{grid-template-columns:1fr} }
.ndt-gd-tep{display:flex;flex-direction:column;gap:2px;margin-top:4px}
.ndt-gd-tep a{display:inline-flex;align-items:center;gap:4px}
/* v321 cổng nhà đầu tư: menu trái CHIA NHÓM · biểu đồ 12 tháng · Sắp tới · quy tắc chuyển nhượng · tài khoản */
.ndt-cong-nhom{display:flex;flex-direction:column;gap:2px}
.ndt-cong-nhom + .ndt-cong-nhom{margin-top:10px;padding-top:10px;border-top:1px solid var(--vien)}
.ndt-cong-nhom-ten{font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--chu-mo);padding:2px 14px 4px}
.ndt-cong-trai a{padding:9px 14px}
.ndc-cot{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:6px;align-items:end;height:180px;padding-top:6px}
.ndc-cot-o{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:4px;min-width:0}
.ndc-cot-than{width:100%;max-width:34px;background:linear-gradient(180deg,color-mix(in srgb,var(--chinh) 75%,#fff),var(--chinh));border-radius:6px 6px 2px 2px}
.ndc-cot-so{font-size:.68rem;color:var(--chu-mo);white-space:nowrap}
.ndc-cot-ten{font-size:.7rem;color:var(--chu-mo);white-space:nowrap}
.ndc-dong{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 0;border-top:1px solid var(--vien)}
.ndc-dong:first-of-type{border-top:0}
.ndc-dong > span{display:flex;flex-direction:column;gap:2px;min-width:0}
.ndc-dong > span.phai{align-items:flex-end;text-align:right}
.ndc-tk{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px;padding-top:12px;border-top:1px dashed var(--vien)}
.ndc-sap h2{margin-top:0}
.ndc-sap-ds{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:8px}
.ndc-sap-dong{display:flex;align-items:center;gap:12px;padding:10px 12px;border:1px solid var(--vien);border-radius:12px;text-decoration:none;color:var(--chu);background:var(--trang)}
.ndc-sap-dong:hover{border-color:var(--chinh)}
.ndc-sap-ngay{display:flex;flex-direction:column;align-items:center;justify-content:center;min-width:46px;height:46px;border-radius:10px;background:color-mix(in srgb,var(--chinh) 10%,var(--trang));color:var(--chinh-dam);line-height:1.05}
.ndc-sap-ngay b{font-size:1.15rem}
.ndc-sap-ngay small{font-size:.68rem;text-transform:uppercase}
.ndc-sap-dong.tra .ndc-sap-ngay{background:color-mix(in srgb,#16A34A 12%,var(--trang));color:#166534}
.ndc-sap-dong.moi .ndc-sap-ngay,.ndc-sap-dong.bp .ndc-sap-ngay{background:color-mix(in srgb,#F59E0B 16%,var(--trang));color:#92400E}
.ndc-sap-chu{display:flex;flex-direction:column;gap:2px;min-width:0}
.ndc-sap-chu .nho{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ndc-quy-tac{padding:12px 16px}
.ndc-quy-tac summary{cursor:pointer}
.ndc-quy-tac ol{margin:4px 0 0;padding-left:18px;display:flex;flex-direction:column;gap:4px}
.ndc-ds-luc{margin:0;padding-left:18px;font-size:.88rem;display:flex;flex-direction:column;gap:2px}
.ndc-cot-ten i{font-style:normal}
@media (max-width:700px){ .ndc-cot{height:140px;gap:3px} .ndc-cot-so{display:none} .ndc-cot-ten i{display:none} }
/* v322 ví lợi nhuận · chuyển nhượng chờ thanh toán */
.vi-khung .vi-cach{display:flex;flex-direction:column;gap:6px}
.cn-chuyen{margin-top:6px;padding:8px 10px;border:1px dashed var(--vien);border-radius:8px;background:color-mix(in srgb,#F59E0B 6%,var(--trang))}
/* v322 chế độ xem của đợt — thẻ bấm chọn nhiều */
.dot-che-do{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:8px}
.dot-viec-xo .dot-che-do{grid-template-columns:1fr}
.the-kieu.khoa{opacity:.62;cursor:not-allowed}
/* v323 DANH MỤC ĐẦU TƯ — phân bổ theo dự án (6 màu phân loại thứ tự cố định, đã soát mù màu; khe 2px giữa các mảng) */
.dm-khung{--dm-1:#2a78d6;--dm-2:#eb6834;--dm-3:#1baf7a;--dm-4:#eda100;--dm-5:#e87ba4;--dm-6:#008300;--dm-khac:#B9BFC8}
:root[data-giao-dien="toi"] .dm-khung{--dm-1:#3987e5;--dm-2:#d95926;--dm-3:#199e70;--dm-4:#c98500;--dm-5:#d55181;--dm-6:#008300;--dm-khac:#5B6573}
.dm-thanh{display:flex;gap:2px;height:14px;border-radius:4px;overflow:hidden;background:var(--trang)}
.dm-thanh span{min-width:3px;flex-basis:0}
.dm-1{background:var(--dm-1)}.dm-2{background:var(--dm-2)}.dm-3{background:var(--dm-3)}.dm-4{background:var(--dm-4)}.dm-5{background:var(--dm-5)}.dm-6{background:var(--dm-6)}.dm-khac{background:var(--dm-khac)}
.dm-chu-giai{list-style:none;margin:8px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:6px 16px;font-size:.84rem}
.dm-chu-giai li{display:inline-flex;align-items:center;gap:6px;min-width:0}
.dm-chu-giai i{width:10px;height:10px;border-radius:3px;flex:none}
.dm-chu-giai span{color:var(--chu-mo);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:220px}
.dm-chu-giai b{font-weight:600;color:var(--chu)}
/* v323 kinh doanh tăng vốn (cổng) · giá trị dự án + phần của tôi (Sở hữu) */
.kdtv-da{border-top:1px solid var(--vien);margin-top:12px;padding-top:12px}
.kdtv-dk{margin-top:8px;border:1px solid var(--vien);border-radius:10px;padding:8px 12px;background:var(--nen-2)}
.kdtv-dk summary{cursor:pointer}
.kdtv-cs{white-space:pre-wrap;max-height:320px;overflow:auto;margin-top:8px;line-height:1.55}
.kdtv-link{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-top:8px;padding:8px 10px;border:1px dashed var(--vien);border-radius:8px}
.kdtv-link code{word-break:break-all}
.kdtv-link.vua{border-color:var(--chinh);box-shadow:inset 0 0 0 1px var(--chinh)}
.sh-gia-tri{margin-top:12px;padding:10px 12px;border-radius:10px;background:var(--nen-2)}
.sh-gt-thanh{height:8px;border-radius:4px;background:color-mix(in srgb,var(--chinh) 14%,var(--trang));margin:8px 0 4px;overflow:hidden}
.sh-gt-thanh span{display:block;height:100%;background:var(--chinh);border-radius:4px}
/* v323 thanh tab chung của nhóm trang (menu gom) — đứng đầu trang */
.ndt-nhom-tab{margin:0 0 14px}
/* v323 nhận diện riêng của dự án (đầu trang cổng) */
.ndt-cong-hieu.nd-rieng img{max-height:34px;width:auto;max-width:120px;object-fit:contain}
/* v323 sản phẩm kinh doanh tăng vốn: 2 cột (thông tin 2/3 · dự án 1/3) */
.kdtv-sp-luoi{display:grid;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);gap:16px;align-items:start}
.kdtv-sp-luoi > .o{margin:0}
.kdtv-da-chon{position:sticky;top:12px}
.kdtv-ds-da{list-style:none;margin:0;padding:0;max-height:min(60vh,520px);overflow:auto;border:1px solid var(--vien);border-radius:10px}
.kdtv-ds-da li{border-top:1px solid var(--vien)}
.kdtv-ds-da li:first-child{border-top:0}
.kdtv-ds-da label{display:flex;align-items:flex-start;gap:8px;padding:8px 10px;margin:0;cursor:pointer;font-weight:500}
.kdtv-ds-da label:has(input:checked){background:color-mix(in srgb,var(--chinh) 8%,var(--trang))}
.kdtv-ds-da input{margin-top:3px}
@media (max-width:900px){ .kdtv-sp-luoi{grid-template-columns:1fr} .kdtv-da-chon{position:static} }
/* v323 sổ thu chi cổng: tên dự án trên nội dung phiếu */
.sl-so-da{display:flex;align-items:center;gap:4px;color:var(--chinh-dam);margin-bottom:2px}
/* v323.21 POPUP ĐỀ NGHỊ THU CHI: popup đề nghị thu / chi ở thẻ Sổ thu chi (cổng) — mở bằng :target, không cần JS */
.ndt-popup{display:none;position:fixed;inset:0;z-index:90;align-items:flex-start;justify-content:center;overflow-y:auto;padding:48px max(16px,env(safe-area-inset-right,0px)) 32px max(16px,env(safe-area-inset-left,0px));box-sizing:border-box}
.ndt-popup:target{display:flex}
.ndt-popup-nen{position:fixed;inset:0;background:rgba(12,39,64,.5)}
.ndt-popup-hop{position:relative;background:var(--trang);color:var(--chu);border-radius:14px;box-shadow:0 18px 50px rgba(0,0,0,.28);width:100%;max-width:760px;padding:20px 22px;box-sizing:border-box}
.ndt-popup-dong{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:8px;border:1px solid var(--vien);color:var(--chu);text-decoration:none;font-size:1rem}
.ndt-popup-dong:hover{background:var(--nen-2);text-decoration:none}
body.ndt-cong:has(.ndt-popup:target){overflow:hidden}