/* ============================================================================
   30/09/2026 dot 3 (a Thinh chot): DOCK GOP LEN DAU TRANG + 1 O TIM + THONG BAO (A bao nhanh / B chuong / C dai do)
   + MAU NHOM MON man goi mon + THE "TIEN VAO" chuyen khoan. Nap SAU pc_v2.css.
   ============================================================================ */
/* bo dock day + o tim thu 2 + dong thong bao cu (da thanh bao nhanh) */
body.pc2 #pc2Dock{display:none !important}
body.pc2 #floorSmartSearch{display:none !important}
body.pc2 #globalMsg{display:none !important}
body.pc2 #appView .topbar #userLine{white-space:nowrap}

/* ---------- TAB tren dau trang ---------- */
#pc2Tabs{display:none}
body.pc2 #pc2Tabs{display:flex;align-items:center;gap:2px;position:relative;flex:1 1 auto;min-width:0;overflow:hidden;padding:3px;margin-left:6px;border-left:1px solid #d3d9e1;padding-left:10px}
body.pc2 #pc2Tabs button{all:unset;position:relative;z-index:1;display:flex;align-items:center;gap:6px;height:34px;padding:0 11px;border-radius:999px;cursor:pointer;white-space:nowrap;font-size:13.5px;font-weight:600;color:var(--tc,#5f6673);transition:color .25s;flex:0 0 auto}
body.pc2 #pc2Tabs button .pc2i{width:18px;height:18px;color:var(--tc,#5f6673);transition:color .25s}
body.pc2 #pc2Tabs button:hover{background:rgba(0,0,0,.04)}
body.pc2 #pc2Tabs button.on,body.pc2 #pc2Tabs button.on .pc2i{color:#fff}
body.pc2 #pc2Tabs button.on:hover{background:transparent}
body.pc2 #pc2Tabs em{position:absolute;top:-2px;right:-2px;min-width:17px;height:17px;padding:0 4px;box-sizing:border-box;border-radius:9px;background:#E24B4A;color:#fff;font-size:10px;font-style:normal;font-weight:700;display:flex;align-items:center;justify-content:center;border:1.5px solid #fff}
body.pc2 #pc2Tabs em:empty{display:none}
body.pc2 #pc2Tabs .sep{display:block;width:1px;height:20px;background:#d3d9e1;margin:0 4px;flex:0 0 auto}
body.pc2 #pc2Tabs.icons .lb{display:none}
body.pc2 #pc2Tabs.icons button{padding:0 9px}
/* vien mau truot */
body.pc2 #pc2Tabs .pc2ind{position:absolute;left:0;top:3px;height:34px;border-radius:999px;background:var(--ic,#185FA5);z-index:0;opacity:0;transition:transform .32s cubic-bezier(.2,.8,.2,1),width .32s cubic-bezier(.2,.8,.2,1),background .3s,opacity .2s;pointer-events:none}
body.pc2 #pc2Tabs [data-d="floor"]{--tc:#185FA5}body.pc2 #pc2Tabs [data-d="order"],body.pc2 #pc2Tabs [data-d="cash"]{--tc:#0F6E56}
body.pc2 #pc2Tabs [data-d="rv"]{--tc:#534AB7}body.pc2 #pc2Tabs [data-d="dashboard"],body.pc2 #pc2Tabs [data-d="kho"]{--tc:#854F0B}
body.pc2 #pc2Tabs [data-d="ls"],body.pc2 #pc2Tabs [data-d="admin"]{--tc:#5F5E5A}body.pc2 #pc2Tabs [data-d="chat"]{--tc:#185FA5}
body.pc2 #pc2Tabs .pc2ind[data-d="floor"],body.pc2 #pc2Tabs .pc2ind[data-d="chat"]{--ic:#185FA5}
body.pc2 #pc2Tabs .pc2ind[data-d="order"],body.pc2 #pc2Tabs .pc2ind[data-d="cash"]{--ic:#1D9E75}
body.pc2 #pc2Tabs .pc2ind[data-d="rv"]{--ic:#534AB7}
body.pc2 #pc2Tabs .pc2ind[data-d="dashboard"]{--ic:#BA7517}
body.pc2 #pc2Tabs .pc2ind[data-d="ls"],body.pc2 #pc2Tabs .pc2ind[data-d="admin"]{--ic:#5F5E5A}
body.pc2 #pc2Tabs button[data-d="kho"].run::after{content:'';position:absolute;bottom:2px;left:50%;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:#854F0B}
/* o tim that tren dau trang */
body.pc2 .pc2srch{cursor:text}
body.pc2 .pc2srch input{all:unset;flex:1;min-width:0;font-size:13.5px;color:#15181d}
body.pc2 .pc2srch input::placeholder{color:#8a929e}
body.pc2 .pc2srch:focus-within{border-color:#185FA5;background:#fff;box-shadow:0 0 0 3px rgba(24,95,165,.12)}
body.pc2 .pc2-net{width:12px;height:12px;min-width:12px;padding:0 !important;border-radius:50% !important;font-size:0 !important;background:#1D9E75 !important;border:2px solid #E1F5EE !important;box-sizing:content-box}
body.pc2 .pc2-net.bad{background:#E24B4A !important;border-color:#FCEBEB !important;animation:pc2pz 1.2s infinite}
@keyframes pc2pz{50%{box-shadow:0 0 0 5px rgba(226,75,74,.25)}}
@media (max-width:1280px){body.pc2 .pc2srch{min-width:170px} body.pc2 .pc2srch kbd{display:none} body.pc2 #appView .topbar #userLine{display:none}}

/* ---------- hieu ung doi man: noi dung truot vao ---------- */
@keyframes pc2in{from{opacity:0;transform:translateX(14px)}to{opacity:1;transform:none}}
body.pc2.pc2-enter #appView > .section:not(.hidden):not(#globalMsg),body.pc2.pc2-enter #pc2Home,body.pc2.pc2-enter #pc2Frame,body.pc2.pc2-enter #pc2PaneHd{animation:pc2in .3s cubic-bezier(.2,.8,.2,1)}
/* 30/9 FIX: truoc la 'body.pc2.pc2-enter *' -> may bat "giam hieu ung" (Windows tat Animation effects) moi lan chuyen the
   xoa animation cua CA man khoi dong #bootSplash -> mat trang thai 'da mo di' -> logo meo hien lai full man. Chi ap trong #appView. */
@media (prefers-reduced-motion:reduce){body.pc2.pc2-enter #appView *,body.pc2.pc2-enter #pc2Home,body.pc2.pc2-enter #pc2Frame,body.pc2.pc2-enter #pc2PaneHd{animation:none !important}}

/* ---------- A. BAO NHANH (giua, duoi dau trang) ---------- */
#pc2Toasts{position:fixed;left:50%;top:64px;transform:translateX(-50%);z-index:100055;display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
.pc2t{display:flex;align-items:center;gap:8px;max-width:min(560px,90vw);padding:9px 16px;border-radius:999px;background:#fff;border:1px solid #9FE1CB;color:#15181d;font-size:13.5px;font-weight:600;box-shadow:0 8px 24px rgba(15,40,70,.14);animation:pc2tin .25s cubic-bezier(.2,.8,.2,1)}
.pc2t .dot{width:8px;height:8px;border-radius:50%;background:#1D9E75;flex:0 0 auto}
.pc2t.bad{background:#FCEBEB;border-color:#F09595;color:#A32D2D}.pc2t.bad .dot{background:#E24B4A}
.pc2t.out{opacity:0;transform:translateY(-6px);transition:opacity .25s,transform .25s}
@keyframes pc2tin{from{opacity:0;transform:translateY(-8px) scale(.97)}to{opacity:1;transform:none}}
/* thong bao cu cua he thong (posAppNotice) cung kieu */
body.pc2 #posAppNotice{top:64px !important;bottom:auto !important}

/* ---------- C. DAI CANH BAO NANG ---------- */
#pc2Banner{display:none}
body.pc2 #pc2Banner{grid-column:1/-1;grid-row:2;display:flex;flex-direction:column;gap:4px;margin:0 0 8px}
body.pc2 #pc2Banner[style*="none"]{display:none !important}
body.pc2 .pc2bn{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:12px;background:#FCEBEB;border:1px solid #F09595;color:#A32D2D;font-size:13.5px;font-weight:600}
body.pc2 .pc2bn span{flex:1}
body.pc2 .pc2bn button{all:unset;cursor:pointer;padding:5px 12px;border-radius:999px;background:#fff;border:1px solid #F09595;font-size:12.5px;font-weight:700}

/* ---------- B. NGAN CHUONG ---------- */
#pc2BellP{position:fixed;z-index:100050;width:min(380px,92vw);max-height:70vh;overflow:auto;background:#fff;border:1px solid #d3d9e1;border-radius:14px;box-shadow:0 14px 40px rgba(0,0,0,.16);padding:6px 10px 10px;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;font-size:13px;color:#15181d}
#pc2BellP .hd{padding:6px 2px 4px;font-size:15px}
#pc2BellP .sec{margin:8px 2px 4px;color:#5f6673;font-size:12px;font-weight:700;text-transform:none}
#pc2BellP .empty{color:#8a929e;padding:6px 2px}
#pc2BellP .na .title{display:none}

/* ---------- MAU NHOM MON ---------- */
body.pc2 [data-cg="cua"]{--cgl:#FAEEDA;--cgd:#854F0B;--cgb:#EF9F27}
body.pc2 [data-cg="tom"]{--cgl:#FCEBEB;--cgd:#A32D2D;--cgb:#F09595}
body.pc2 [data-cg="ca"]{--cgl:#E6F1FB;--cgd:#185FA5;--cgb:#85B7EB}
body.pc2 [data-cg="oc"]{--cgl:#EEEDFE;--cgd:#534AB7;--cgb:#AFA9EC}
body.pc2 [data-cg="rau"]{--cgl:#EAF3DE;--cgd:#3B6D11;--cgb:#97C459}
body.pc2 [data-cg="nuoc"]{--cgl:#E1F5EE;--cgd:#0F6E56;--cgb:#5DCAA5}
body.pc2 [data-cg="khac"]{--cgl:#F1EFE8;--cgd:#5F5E5A;--cgb:#B4B2A9}
body.pc2 #menuGrid .v5GroupTitle[data-cg]{background:var(--cgl) !important;color:var(--cgd) !important;border-color:var(--cgb) !important}
body.pc2 #menuGrid .v5ItemCard[data-cg]:not(.item-soldout){border-left:4px solid var(--cgb) !important}
body.pc2 #menuGrid .v5ItemCard[data-cg]:not(.item-soldout):hover{background:var(--cgl) !important}
body.pc2 #orderGroupChips button[data-cg]:not([data-cg="all"]){background:var(--cgl) !important;color:var(--cgd) !important;border-color:var(--cgb) !important}
body.pc2 #orderGroupChips button[data-cg].active{background:var(--cgd) !important;color:#fff !important;border-color:var(--cgd) !important}
body.pc2 #sec-order > .toolbar[data-st="serving"]{background:#E8F6EF !important;border-color:#9FE1CB !important}
body.pc2 #sec-order > .toolbar[data-st="serving"] #orderTitle{color:#0F6E56 !important}
body.pc2 #sec-order > .toolbar[data-st="paying"]{background:#FDEEEE !important;border-color:#F09595 !important}
body.pc2 #sec-order > .toolbar[data-st="paying"] #orderTitle{color:#A32D2D !important}

/* ---------- THE "TIEN VAO" (chuyen khoan) — chay ca ngoai che do PC ---------- */
#ckIncPop{position:fixed;right:14px;top:64px;z-index:100045;display:flex;flex-direction:column;gap:8px;width:min(340px,92vw);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
#ckIncPop:empty{display:none}
.cki{background:#fff;border:2px solid #9FE1CB;border-radius:14px;padding:10px 12px;box-shadow:0 14px 36px rgba(15,40,70,.18);animation:pc2tin .3s cubic-bezier(.2,.8,.2,1);color:#15181d}
.cki.wn{border-color:#EF9F27}.cki.nf{border-color:#85B7EB}
.cki-h{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:#0F6E56}
.cki.wn .cki-h{color:#854F0B}.cki.nf .cki-h{color:#185FA5}
.cki-h .m{margin-left:auto;color:#5f6673;font-weight:500}
.cki-h .x{all:unset;cursor:pointer;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#8a929e;font-size:12px}
.cki-h .x:hover{background:#f2f4f7}
.cki-a{font-size:22px;font-weight:800;margin:3px 0 4px;letter-spacing:-.3px}
.cki-s{font-size:12.5px;padding:5px 8px;border-radius:8px;background:#E1F5EE;color:#0F6E56;font-weight:600}
.cki.wn .cki-s{background:#FAEEDA;color:#854F0B}.cki.nf .cki-s{background:#E6F1FB;color:#185FA5}
.cki-w{margin-top:5px;font-size:12px;color:#A32D2D;font-weight:600}
.cki-b,.ckw-b{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}
.cki-b button,.ckw-b button{all:unset;cursor:pointer;flex:1 1 auto;text-align:center;padding:7px 10px;border-radius:10px;border:1px solid #d3d9e1;background:#fff;font-size:12.5px;font-weight:700;color:#15181d;white-space:nowrap}
.cki-b button.pri,.ckw-b button.pri{background:#185FA5;border-color:#185FA5;color:#fff}
.cki-b button.pri.g,.ckw-b button.pri.g{background:#1D9E75;border-color:#1D9E75}
.ckw-b{margin-top:4px;width:100%}.ckw-b button{padding:5px 8px;font-size:12px}
#ckIncW{font-size:13px}
#ckIncW .ckw-r{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:6px 0;border-top:1px solid #e7ebf0}
#ckIncW .ckw-r:first-child{border-top:0}
#ckIncW .ckw-r .t{color:#5f6673;width:42px}
#ckIncW .ckw-r b{flex:1}
#ckIncW .st{font-size:11.5px;font-weight:700;padding:2px 8px;border-radius:999px;background:#F1EFE8;color:#5F5E5A}
#ckIncW .st.done{background:#E1F5EE;color:#0F6E56}#ckIncW .st.wait{background:#E1F5EE;color:#0F6E56}
#ckIncW .st.pick{background:#FAEEDA;color:#854F0B}#ckIncW .st.none{background:#E6F1FB;color:#185FA5}
#ckIncW .ckw-f{margin-top:6px;padding-top:6px;border-top:1px solid #e7ebf0;color:#5f6673;font-size:12px}
#ckIncW .dz{color:#A32D2D}
#ckIncW .ckw-empty,.ckw-empty{color:#8a929e}
#pc2BellP .ckb-r{display:flex;flex-direction:column;gap:2px;padding:7px 2px;border-top:1px solid #e7ebf0}
#pc2BellP .ckb-r .m{color:#5f6673;font-size:12px}
/* hop chon ban */
#ckIncPick{position:fixed;inset:0;z-index:100070;background:rgba(0,0,0,.32);display:flex;align-items:center;justify-content:center;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif}
#ckIncPick .ckp{background:#fff;border-radius:18px;width:min(420px,92vw);max-height:80vh;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.25)}
#ckIncPick .ckp-h{display:flex;align-items:center;padding:14px 16px;border-bottom:1px solid #e7ebf0;font-size:15px}
#ckIncPick .ckp-h b{flex:1}
#ckIncPick .ckp-h button{all:unset;cursor:pointer;width:30px;height:30px;border-radius:50%;background:#f2f4f7;display:flex;align-items:center;justify-content:center}
#ckIncPick .ckp-l{overflow:auto;padding:8px;display:flex;flex-direction:column;gap:6px}
#ckIncPick .ckp-l button{all:unset;cursor:pointer;display:flex;justify-content:space-between;align-items:center;padding:10px 12px;border:1px solid #d3d9e1;border-radius:12px;font-size:14px}
#ckIncPick .ckp-l button:hover{background:#f5f7fa}
#ckIncPick .ckp-l button.eq{border-color:#1D9E75;background:#E1F5EE}
#ckIncPick .ckp-l span{color:#5f6673;font-size:12.5px}
#ckIncPick .ckp-e{color:#8a929e;padding:14px;text-align:center}

/* ===== 30/9 dot 4 (a Thinh chon A): DAU TRANG ICON TRON (giong dock cham cong) + chu nho duoi ===== */
body.pc2 #pc2Tabs{gap:0;padding:2px 0 2px 10px;align-items:flex-start}
body.pc2 #pc2Tabs .pc2ind{display:none !important}
body.pc2 #pc2Tabs button{flex-direction:column;gap:2px;height:auto;padding:2px 4px;min-width:54px;border-radius:12px;font-size:10.5px;font-weight:600;color:#5f6673}
body.pc2 #pc2Tabs button:hover{background:transparent}
body.pc2 #pc2Tabs button .ic{width:34px;height:34px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--tl,#F1EFE8);color:var(--tc,#5f6673);transition:transform .15s,background .25s,color .25s}
body.pc2 #pc2Tabs button .ic .pc2i{width:18px;height:18px;color:inherit}
body.pc2 #pc2Tabs button:hover .ic{transform:translateY(-2px) scale(1.06)}
body.pc2 #pc2Tabs button:active .ic{transform:scale(.9)}
body.pc2 #pc2Tabs button .lb{line-height:1.1;white-space:nowrap}
body.pc2 #pc2Tabs button.on{color:var(--tc,#185FA5)}
body.pc2 #pc2Tabs button.on .ic{background:var(--tc,#185FA5);color:#fff;box-shadow:0 3px 8px rgba(0,0,0,.15)}
body.pc2 #pc2Tabs button.on .pc2i{color:#fff}
body.pc2 #pc2Tabs button.on::after{content:'';width:4px;height:4px;border-radius:50%;background:var(--tc,#185FA5);margin-top:1px}
body.pc2 #pc2Tabs button[data-d="kho"].run::after{position:static;margin:1px 0 0;bottom:auto;left:auto}
body.pc2 #pc2Tabs em{top:-3px;right:6px}
body.pc2 #pc2Tabs .sep{height:30px;margin:4px 4px 0}
body.pc2 #pc2Tabs.icons .lb{display:none}
body.pc2 #pc2Tabs.icons button{min-width:42px}
body.pc2 #pc2Tabs [data-d="floor"],body.pc2 #pc2Tabs [data-d="chat"]{--tl:#E6F1FB}
body.pc2 #pc2Tabs [data-d="order"],body.pc2 #pc2Tabs [data-d="cash"]{--tl:#E1F5EE}
body.pc2 #pc2Tabs [data-d="rv"]{--tl:#EEEDFE}
body.pc2 #pc2Tabs [data-d="dashboard"],body.pc2 #pc2Tabs [data-d="kho"]{--tl:#FAEEDA}
body.pc2 #pc2Tabs [data-d="ls"],body.pc2 #pc2Tabs [data-d="admin"]{--tl:#F1EFE8}

/* luat chung "nut khong class = nen trang + vien" (pc_v2.css) dang boc tung tab thanh o vuong -> go ra cho tab dau trang */
body.pc2 #appView #pc2Tabs button,body.pc2 #appView #pc2Tabs button:hover{background:transparent !important;border:0 !important;box-shadow:none !important;outline:0}
body.pc2 #appView #pc2Tabs button:focus-visible .ic{box-shadow:0 0 0 3px rgba(24,95,165,.25)}
body.pc2 #appView #pc2Tabs{border-left:1px solid #e3e7ec}

/* ===== 30/9 (a Thinh, anh quan B): bang "ban dang goi nhan vien" (co san tu 7/9, gan cung trai-tren) de len tab tang
   + so do ban -> dua sang GOC PHAI duoi dau trang, gon lai; the "Tien vao" chuyen xuong goc phai duoi de khong chong ===== */
body.pc2 #gcallBanner{left:auto !important;right:14px !important;top:64px !important;width:min(300px,92vw) !important;max-height:46vh !important;gap:5px !important;z-index:100046 !important}
body.pc2 #gcallBanner .gcallHd{border-radius:999px;padding:5px 12px;font-size:12px;box-shadow:none}
body.pc2 #gcallBanner .gcallRow{border-radius:12px;padding:7px 8px 7px 11px;box-shadow:0 8px 22px rgba(163,45,45,.25);animation:tblCallPz 1.6s infinite}
body.pc2 #gcallBanner .gcallRow .sp{font-size:12.5px}
body.pc2 #gcallBanner .gcallRow button{padding:5px 10px;font-size:12px;border-radius:999px}
body.pc2 #ckIncPop{top:auto;bottom:14px}
/* so ban 4 chu so bi nut QR / nhan goc de: day so ban xuong duoi hang nhan */
body.pc2 #tables .table{padding-top:24px !important;position:relative}
body.pc2 #tables .tblQrBtn{top:4px !important;right:4px !important;padding:2px 5px !important;font-size:10px !important}
body.pc2 #tables .tblFlag{position:absolute !important;top:4px !important;left:4px !important;max-width:calc(100% - 52px) !important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px !important;padding:2px 6px !important;line-height:1.3 !important;margin:0 !important}
body.pc2 #tables .table .tableId{font-size:20px !important}

/* ===== 30/9: nut QUAY LAI man goi mon (↩ nho, lech) -> nut to "‹ Sơ đồ bàn" canh deu voi "QR gọi món" ===== */
body.pc2 #sec-order > .toolbar > div:last-child{display:flex !important;align-items:center !important;gap:8px !important}
body.pc2 #sec-order > .toolbar button[onclick^="backToFloor"]{font-size:0 !important;min-width:0 !important;min-height:46px !important;height:46px !important;padding:0 18px 0 14px !important;display:inline-flex !important;align-items:center !important;justify-content:center !important;gap:6px;border-radius:12px !important;background:#185FA5 !important;border:0 !important;color:#fff !important;line-height:1 !important}
body.pc2 #sec-order > .toolbar button[onclick^="backToFloor"]::before{content:'\2039';font-size:26px;font-weight:700;line-height:1;margin-top:-3px}
body.pc2 #sec-order > .toolbar button[onclick^="backToFloor"]::after{content:'Sơ đồ bàn';font-size:15px;font-weight:700}
body.pc2 #sec-order > .toolbar button[onclick^="backToFloor"]:hover{background:#0C447C !important}
body.pc2 #sec-order > .toolbar button[onclick^="showGuestOrderQr"]{min-height:46px !important;height:46px !important;border-radius:12px !important;font-size:14px !important;display:inline-flex !important;align-items:center !important}
/* 30/9 dot 5: luat chung pc_v2 "#appView #sec-order > .toolbar button" (2 id) de len font-size:0/padding cua nut quay lai -> hien ca "↩".
   Them #appView de nut "‹ Sơ đồ bàn" dung nhu thiet ke. */
body.pc2 #appView #sec-order > .toolbar button[onclick^="backToFloor"]{font-size:0 !important;min-width:0 !important;min-height:46px !important;height:46px !important;padding:0 18px 0 14px !important}
/* 30/9 dot 5 (a Thinh): "▣ QR gọi món" -> nut ICON vuong 46px nen teal nhat, icon QR teal (giu title lam tooltip) */
body.pc2 #appView #sec-order > .toolbar button[onclick^="showGuestOrderQr"]{font-size:0 !important;color:transparent !important;width:46px !important;min-width:46px !important;max-width:46px;height:46px !important;min-height:46px !important;padding:0 !important;flex:0 0 46px;
  justify-content:center !important;border-radius:12px !important;border:1px solid #9FE1CB !important;box-sizing:border-box !important;overflow:hidden;
  background:#E1F5EE url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230F6E56' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='3' width='7' height='7' rx='1'/%3E%3Crect x='14' y='3' width='7' height='7' rx='1'/%3E%3Crect x='3' y='14' width='7' height='7' rx='1'/%3E%3Cpath d='M14 14h3v3M21 14v.01M14 21h.01M17 21h4v-4M6.5 6.5h.01M17.5 6.5h.01M6.5 17.5h.01'/%3E%3C/svg%3E") no-repeat center / 24px 24px !important}
body.pc2 #appView #sec-order > .toolbar button[onclick^="showGuestOrderQr"]:hover{background-color:#C8EDDF !important;border-color:#5DCAA5 !important}

/* ===== 30/9: KET QUA TIM MON (kinh trong suot 32%) nam de len widget khung phai -> chu chong chu. Doi thanh the TRANG DAC ===== */
body.pc2 #floorSearchDock{z-index:100030 !important;border-radius:14px}
body.pc2 #floorSearchDock #activeSearchResults,body.pc2 #paidBillResults{background:#fff !important;-webkit-backdrop-filter:none !important;backdrop-filter:none !important;
  border:1px solid #d3d9e1 !important;border-radius:14px !important;box-shadow:0 18px 44px rgba(15,40,70,.22) !important}
body.pc2 #floorSearchDock #activeSearchResults *{text-shadow:none !important}
/* dang tim -> lam mo widget phia sau cho de doc */
body.pc2.pc2-searching #pc2Home{visibility:hidden !important;pointer-events:none !important}
body.pc2.pc2-searching.pc2-home #pc2PaneT{visibility:hidden}
/* 30/9 (quan B van chong): khong phu thuoc JS (JS cu con cache van chay) -> CSS tu nhan: o tim co chu HOAC hop ket qua dang hien */
body.pc2:has(#pc2Q:not(:placeholder-shown)) #pc2Home,
body.pc2:has(#activeSearchResults:not(:empty):not([style*="none"])) #pc2Home,
body.pc2:has(#paidBillResults:not(:empty):not([style*="none"])) #pc2Home{visibility:hidden !important;pointer-events:none !important}
body.pc2:has(#activeSearchResults:not(:empty):not([style*="none"])) #ckIncW,
body.pc2:has(#pc2Q:not(:placeholder-shown)) #ckIncW{visibility:hidden !important}

/* ===== 30/9 (a Thinh): O BAN + O MON NOI KHOI lai nhu cu (bong do + vien day duoi + nhac len khi re chuot, lun xuong khi bam) ===== */
body.pc2 #tables .table{box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 3px 0 rgba(15,40,70,.10),0 6px 14px rgba(15,40,70,.10) !important;
  background-image:linear-gradient(180deg,rgba(255,255,255,.85),rgba(255,255,255,0) 60%) !important;transition:transform .12s ease,box-shadow .12s ease,border-color .15s}
/* 30/9 FIX: transition o tren KHONG duoc !important -> truoc no de len transition 0.6s cua hieu ung "ban luot tu trai sang" khi doi khu (__zoneSweep dat inline) -> mat song */
body.pc2 #tables .table:hover{transform:translateY(-2px) !important;box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 5px 0 rgba(15,40,70,.10),0 12px 22px rgba(15,40,70,.14) !important}
body.pc2 #tables .table:active{transform:translateY(2px) !important;box-shadow:0 1px 0 rgba(15,40,70,.12) inset,0 1px 0 rgba(15,40,70,.10),0 2px 6px rgba(15,40,70,.10) !important}
body.pc2 #tables .table.serving{box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 3px 0 rgba(15,110,86,.22),0 6px 14px rgba(15,110,86,.14) !important}
body.pc2 #tables .table.paying,body.pc2 #tables .table.attn-red{box-shadow:0 1px 0 rgba(255,255,255,.8) inset,0 3px 0 rgba(163,45,45,.22),0 6px 14px rgba(163,45,45,.14) !important}
body.pc2 #menuGrid .v5ItemCard,body.pc2 .menuGrid .item{box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 3px 0 rgba(15,40,70,.09),0 5px 12px rgba(15,40,70,.09) !important;
  background-image:linear-gradient(180deg,rgba(255,255,255,.9),rgba(255,255,255,0) 70%) !important;transition:transform .12s ease,box-shadow .12s ease,background-color .15s !important}
body.pc2 #menuGrid .v5ItemCard:not(.item-soldout):hover,body.pc2 .menuGrid .item:not(.item-soldout):hover{transform:translateY(-2px) !important;box-shadow:0 1px 0 rgba(255,255,255,.9) inset,0 5px 0 rgba(15,40,70,.10),0 10px 20px rgba(15,40,70,.13) !important}
body.pc2 #menuGrid .v5ItemCard:not(.item-soldout):active,body.pc2 .menuGrid .item:not(.item-soldout):active{transform:translateY(2px) scale(.99) !important;box-shadow:0 1px 0 rgba(15,40,70,.12) inset,0 1px 3px rgba(15,40,70,.10) !important}
body.pc2 #menuGrid .v5ItemCard.item-soldout{box-shadow:none !important;background-image:none !important}
/* (bo dong 'reduced-motion -> transition:none !important' cho o ban: may quan bat giam hieu ung -> mat luon song doi khu) */

/* ===== 30/9 (a Thinh chot): MAN BAN - cot phai HEP (~320px) + nut thu gon thanh dai icon; o ban TO hon (khong nhoi them ban),
   3 nut Xem/Bill/Kiem nam GON trong o ===== */
body.pc2.pc2-home:not(.pc2-order) #appView:not(.hidden){grid-template-columns:minmax(0,1fr) 320px !important}
body.pc2.pc2-home.pc2-railmin:not(.pc2-order) #appView:not(.hidden){grid-template-columns:minmax(0,1fr) 52px !important}
body.pc2:not(.pc2-order) #tables{grid-template-columns:repeat(auto-fill,minmax(150px,1fr)) !important;gap:10px !important}
body.pc2:not(.pc2-order) #tables .table{min-height:118px;padding-left:8px !important;padding-right:8px !important;box-sizing:border-box;overflow:hidden}
body.pc2:not(.pc2-order) #tables .quickPrintBtnRow{width:100%;box-sizing:border-box;flex-wrap:nowrap !important;justify-content:stretch !important;gap:4px !important;margin-top:6px !important}
body.pc2:not(.pc2-order) #tables .quickPrintBtnRow .quickPrintBtn{flex:1 1 0;min-width:0;justify-content:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:4px 2px !important;font-size:11.5px !important}
/* cot phai gon */
body.pc2 #pc2Home .pc2railbar{display:flex;align-items:center;justify-content:space-between;padding:0 2px;font-size:13px;font-weight:700;color:#5f6673}
body.pc2 #pc2Home .pc2railbar button{all:unset;cursor:pointer;font-size:12px;font-weight:600;color:#185FA5;padding:3px 8px;border-radius:999px}
body.pc2 #pc2Home .pc2railbar button:hover{background:#E6F1FB}
body.pc2.pc2-order #pc2Home .pc2railbar{display:none}
body.pc2 #pc2Home .pc2w{padding:8px 10px}
body.pc2 #pc2Home .pc2wh b{font-size:13px}
body.pc2 .pc2w #todayBox{display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;gap:6px !important}
body.pc2 .pc2w #todayBox .card{padding:6px 6px !important;margin:0 !important;min-width:0}
body.pc2 .pc2w #todayBox .card *{font-size:11px !important;line-height:1.25 !important;white-space:normal}
body.pc2 .pc2w #todayBox .card > :last-child{font-size:19px !important;font-weight:800 !important;margin-top:2px}
/* 6/10 (cot phai khong tran ngang): o so khong bao gio day rong cot (so dai thi ...), o thu 4 (Phi the NH = so tien) chiem ca hang */
body.pc2 .pc2w #todayBox .card{overflow:hidden;box-sizing:border-box}
body.pc2 .pc2w #todayBox .card > :last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-variant-numeric:tabular-nums}
body.pc2 .pc2w #todayBox .card:nth-child(n+4){grid-column:1/-1}
/* 18/10 (a Thinh chot: sua loi POS): doanh thu 9+ chu so (vd 123.456.789) bi cat "..." -> chu nho lai theo be ngang + cho xuong dong o dau cham, KHONG mat so */
body.pc2 .pc2w #todayBox .card > :last-child{font-size:clamp(13px,1.15vw,19px) !important;white-space:normal !important;overflow:visible !important;text-overflow:clip !important;overflow-wrap:anywhere;word-break:break-word;line-height:1.15 !important}
/* 6/10 (cot phai khong tran ngang): khung cot phai KHONG cuon ngang; widget/tieu de co the co lai */
body.pc2 #pc2Home{overflow-x:hidden !important}
body.pc2 #pc2Home .pc2w{min-width:0;max-width:100%;box-sizing:border-box}
body.pc2 #pc2Home .pc2wh b{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.pc2 #pc2Home #ckIncW:not(.all) .ckw-r:nth-child(n+4){display:none}
body.pc2 #pc2Home #ckIncW .ckw-f{cursor:pointer}
body.pc2 #pc2Home #ckIncW:not(.all) .ckw-f::after{content:' · Xem tất cả ›';color:#185FA5;font-weight:600}
body.pc2 #pc2Home #ckIncW.all .ckw-f::after{content:' · Thu gọn ‹';color:#185FA5;font-weight:600}
body.pc2 #pc2Home #ckIncW .ckw-r{gap:6px;font-size:12.5px}
/* 30/9: khoi "Can chu y" khong co viec -> an han (truoc hien khung trong) */
body.pc2 #pc2Home .pc2w.bare:has(#needAttnBox:empty),body.pc2 #pc2Home .pc2w[data-w="attn"]:not(:has(#needAttnBox *)){display:none}
/* dai icon khi thu gon */
#pc2RailIcons{display:none}
body.pc2.pc2-railmin:not(.pc2-order) #pc2Home > *:not(#pc2RailIcons){display:none !important}
body.pc2.pc2-railmin:not(.pc2-order) #pc2Home #pc2RailIcons{display:flex;flex-direction:column;align-items:center;gap:8px;padding-top:4px}
body.pc2.pc2-home.pc2-railmin:not(.pc2-order) #pc2PaneHd{visibility:hidden}
/* cot phai hep/thu gon -> ket qua tim khong bi bop theo be ngang cot */
body.pc2.pc2-home:not(.pc2-order) #floorSearchDock{left:auto !important;width:min(440px,46vw) !important}
#pc2RailIcons button{all:unset;cursor:pointer;position:relative;width:38px;height:38px;border-radius:11px;background:#fff;border:1px solid #e3e7ec;display:flex;align-items:center;justify-content:center;color:#5f6673;font-size:18px;font-weight:700}
#pc2RailIcons button:hover{background:#f2f5f8}
#pc2RailIcons button .pc2i{width:18px;height:18px}
#pc2RailIcons button.warn{color:#BA7517}
#pc2RailIcons button.ok{color:#1D9E75}
#pc2RailIcons em{position:absolute;top:-5px;right:-5px;min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:#E24B4A;color:#fff;font-size:10px;font-style:normal;display:flex;align-items:center;justify-content:center;box-sizing:border-box}
#pc2RailIcons em:empty{display:none}

/* ===== the chuyen khoan GON: 1 the nho, khong khop ban thi chi bao 1 dong tu tat ===== */
#ckIncPop{width:min(290px,92vw)}
.cki{padding:8px 10px;border-width:1.5px}
.cki-h{gap:6px}
.cki-h .cki-a{font-size:16px;margin:0 0 0 2px;color:#15181d}
.cki-h .x{margin-left:auto}
.cki-s{margin-top:5px;font-size:12px;padding:4px 8px}
.cki-w{color:#A32D2D}
.cki-b{margin-top:6px}
.cki-more{margin-top:6px;font-size:11.5px;color:#5f6673}
#ckIncW .ckw-r{flex-wrap:nowrap}
#ckIncW .st.info{background:transparent;color:#8a929e;font-weight:600;padding:2px 0}
#ckIncW .st.old{background:transparent;color:#b4b2a9;padding:2px 0}
#ckIncW .ckw-go{all:unset;cursor:pointer;padding:3px 10px;border-radius:999px;background:#1D9E75;color:#fff;font-size:11.5px;font-weight:700}
/* 3/10 (thang cot): dong CK = grid cot co dinh: gio | tien (phai, tabular) | trang thai | slot Thoat (giu cho khi khong co nut) */
#ckIncW .ckw-r{display:grid;grid-template-columns:40px 84px minmax(0,1fr) 54px;column-gap:6px;align-items:center}
#ckIncW .ckw-r .t{width:auto;grid-column:1;font-variant-numeric:tabular-nums;white-space:nowrap}
#ckIncW .ckw-r b{grid-column:2;flex:none;text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
#ckIncW .ckw-r .st{grid-column:3;justify-self:start;max-width:100%;min-width:0;box-sizing:border-box;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#ckIncW .ckw-r .ckw-go{grid-column:4;justify-self:end}
/* 6/10 (cot phai khong tran ngang): gio/tien = toi thieu 40/84px (van thang cot), so dai hon thi tu no ra thay vi tran;
   slot nut Thoat = auto (khong co nut -> 0, chip trang thai rong hon); chip trang thai co lai + ... */
#ckIncW{min-width:0;overflow-x:hidden}
#ckIncW .ckw-r{grid-template-columns:minmax(40px,max-content) minmax(84px,max-content) minmax(0,1fr) auto;min-width:0}
#ckIncW .ckw-r .ckw-go{white-space:nowrap}
/* chuong: tien | gio | trang thai */
#pc2BellP .ckb-r .ckb-l{display:grid;grid-template-columns:minmax(96px,max-content) minmax(40px,max-content) minmax(0,1fr);column-gap:8px;align-items:baseline} /* 18/10 chong che chu: tien/gio dai tu noi cot, khong de len cot sau */
#pc2BellP .ckb-r .ckb-l b{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
#pc2BellP .ckb-r .ckb-l .t{color:#5f6673;font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap}
#pc2BellP .ckb-r .ckb-l .m{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ===== 30/9 (a Thinh chot): MOI THONG BAO 1 COT GOC TRAI DUOI (#pc2Stack do pc_v2.js dat left/width theo khung) =====
   duoi cung = goi NV (do) -> tien vao khop ban (xanh) -> bao nhanh (trang/vang). Cac hop con bo fixed, xep trong cot. */
#pc2Stack{position:fixed;bottom:14px;left:14px;width:300px;z-index:100050;display:flex;flex-direction:column;justify-content:flex-end;gap:6px;pointer-events:none;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;transition:left .25s cubic-bezier(.2,.8,.2,1),width .25s,opacity .2s,transform .2s}
#pc2Stack > *{pointer-events:auto}
#pc2Stack #pc2Toasts{order:1;position:static !important;left:auto;top:auto;transform:none !important;align-items:stretch;pointer-events:none}
#pc2Stack #ckIncPop{order:2;position:static !important;top:auto !important;bottom:auto !important;right:auto !important;left:auto !important;width:100% !important}
#pc2Stack #gcallBanner{order:3;position:static !important;top:auto !important;left:auto !important;right:auto !important;width:100% !important;max-height:40vh !important;overflow:auto}
#pc2Stack #gcallBanner .gcallHd ~ .gcallRow:nth-child(n+4){display:none}
/* 18/10 (a Thinh chot: sua loi POS): don khach QR bi giu (gheldBanner) xep trong cot thong bao, khong con fixed z 9001 */
#pc2Stack #gheldBanner{order:4;position:static !important;top:auto !important;left:auto !important;right:auto !important;width:100% !important;max-height:40vh !important;overflow-y:auto;overflow-x:hidden;z-index:auto !important}
/* 6/10 (cot phai khong tran ngang): ly do goi NV dai / khong dau cach -> xuong dong trong the, nut Da xu ly giu nguyen */
#pc2Stack #gcallBanner{overflow-x:hidden}
#gcallBanner .gcallRow .sp{min-width:0;overflow-wrap:anywhere}
#gcallBanner .gcallRow button{flex:none}
#pc2Stack .pc2t{max-width:none;border-radius:12px;padding:8px 12px;font-size:13px;animation:pc2sin .28s cubic-bezier(.2,.8,.2,1)}
#pc2Stack .pc2t.out{transform:translateX(-12px)}
.pc2t.warn{background:#FAEEDA;border-color:#EF9F27;color:#633806}.pc2t.warn .dot{background:#BA7517}
#pc2Stack .cki,#pc2Stack .gcallRow{animation:pc2sin .28s cubic-bezier(.2,.8,.2,1)}
#pc2Stack #gcallBanner .gcallRow{animation:pc2sin .28s cubic-bezier(.2,.8,.2,1),tblCallPz 1.6s .3s infinite}
@keyframes pc2sin{from{opacity:0;transform:translateX(-18px)}to{opacity:1;transform:none}}
/* dang tim mon / dang mo hop thanh toan -> thu nho, mo di; re chuot vao thi ro lai */
body.pc2.pc2-searching #pc2Stack,body.pc2:has(.paymentModalSummary) #pc2Stack{opacity:.35;transform:scale(.9);transform-origin:left bottom}
body.pc2.pc2-searching #pc2Stack:hover,body.pc2:has(.paymentModalSummary) #pc2Stack:hover{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){#pc2Stack,#pc2Stack *{animation:none !important;transition:none !important}}
/* 18/10 (a Thinh chot: sua loi POS): cot thong bao (z 100050) nam TREN moi hop -> bam nham xuyen qua hop thanh toan/tach bill/chot ca.
   Dang co hop (modalHost co con / .modalMask / posDlg) -> cot thong bao KHONG nhan chuot (van hien de doc). */
body.pc2:has(#modalHost > *) #pc2Stack,body.pc2:has(#modalHost > *) #pc2Stack *,
body.pc2:has(.modalMask) #pc2Stack,body.pc2:has(.modalMask) #pc2Stack *,
body.pc2:has(#posDlgLayer) #pc2Stack,body.pc2:has(#posDlgLayer) #pc2Stack *{pointer-events:none !important}
/* 18/10 (a Thinh chot: sua loi POS): o ket qua tim (#floorSearchDock z 100030) khong de len hop dang mo */
body.pc2:has(#modalHost > *) #floorSearchDock,body.pc2:has(#posDlgLayer) #floorSearchDock{z-index:60 !important}
/* 18/10 (a Thinh chot: sua loi POS): #floorSearchDock duoc pc_v2.js dua ra body (de Ctrl+K o man goi mon van thay ket qua)
   -> chi hien o man Ban / Goi mon (pc2-home), cac man khac an nhu truoc (truoc an theo #sec-floor) */
body.pc2:not(.pc2-home) #floorSearchDock{display:none !important}
