/* ===== Check-in mã định danh · phiếu nhận phòng · khai báo lưu trú ===== */
#app .btn.dis{opacity:.45;pointer-events:none;filter:saturate(.4);cursor:not-allowed}
#app .inp{width:100%;min-width:0;height:46px;border-radius:14px;border:1px solid rgba(30,42,48,.16);background:#fff;color:#1E2A30;padding:0 12px;font:600 15px/1 inherit;font-family:inherit;outline:none}
#app .inp:focus{border-color:#0C7A87;box-shadow:0 0 0 3px rgba(12,122,135,.15)}
#app .inp[type=date]{font-size:14px}
html.dk #app .inp{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.16);color:#EEF3F5;color-scheme:dark}
#app .fl{display:flex;flex-direction:column;gap:4px;margin-top:8px}
#app .scbox{position:relative;border-radius:18px;overflow:hidden;background:#0E1A1F;display:flex;align-items:center;justify-content:center}
#app .scbox video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0}
#app .scbox.live video{opacity:1}#app .scbox.live .scph{display:none}
#app .scfr{position:absolute;width:62%;aspect-ratio:1;max-height:78%;border-radius:18px;border:3px solid rgba(127,231,240,.9);box-shadow:0 0 0 999px rgba(5,15,19,.35);pointer-events:none}
#app .scph{position:relative;display:flex;flex-direction:column;align-items:center;gap:8px;color:#DCEFF2;font-size:13px;font-weight:700;text-align:center;max-width:72%;line-height:1.45;z-index:1}
#app .rmc{padding:9px 12px;border-radius:14px;display:flex;flex-direction:column;gap:2px;min-width:0;cursor:pointer}
#app .rmc b{font-size:15px}
#app .shots{display:flex;gap:10px}
#app .shot{flex:1;min-width:0;aspect-ratio:1.586;border-radius:14px;border:2px dashed rgba(12,122,135,.45);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;font-size:13px;font-weight:800;color:#0C7A87;position:relative;overflow:hidden;cursor:pointer;background:rgba(12,122,135,.05)}
#app .shot.has{border-style:solid;border-color:#16A37B}
#app .shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
#app .shot input{position:absolute;inset:0;opacity:0;cursor:pointer}
html.dk #app .shot{color:#7FE7F0;border-color:rgba(127,231,240,.45);background:rgba(127,231,240,.05)}
#app .fakeid{position:absolute;inset:0;background:linear-gradient(135deg,#DDEBF2,#C6DCE8);padding:10% 8%}
#app .fakeid.f i{position:absolute;left:8%;top:22%;width:26%;height:52%;border-radius:6px;background:linear-gradient(#9FB4C0,#7F97A5)}
#app .fakeid.f b{display:block;height:7%;border-radius:3px;background:rgba(30,60,80,.32);margin:6% 0 0 38%;width:52%}
#app .fakeid.b{background:linear-gradient(135deg,#E5EEF2,#D2E1E8)}
#app .fakeid.b i{position:absolute;right:8%;top:14%;width:18%;height:28%;border-radius:4px;background:#B7C7CF}
#app .fakeid.b b{display:block;height:6%;border-radius:3px;background:rgba(30,60,80,.28);margin:8% 0 0 0;width:70%}
#app .okc{width:48px;height:48px;border-radius:16px;background:#5EF2B5;display:flex;align-items:center;justify-content:center;flex:none}
#app .rjc{width:46px;height:46px;border-radius:15px;display:flex;align-items:center;justify-content:center;flex:none}
#app .wnt{color:#B26A00;font-weight:800}html.dk #app .wnt{color:#FFD27A}
#app .ercard{padding:4px 0 0}
#app .ericon{width:40px;height:40px;border-radius:13px;background:#7FE7F0;display:flex;align-items:center;justify-content:center;flex:none}
#app .erprev{margin-top:10px;padding:12px;border-radius:14px;background:#fff;color:#1E2A30;border:1px solid rgba(30,42,48,.12);font-size:12.5px;line-height:1.6}
html.dk #app .erprev{background:#F4F7F8;color:#1E2A30}
#app .erprev .bd{color:#fff}
/* tờ A4 (luôn nền trắng, chữ đen – giống bản in) */
#app .a4wrap{position:relative;overflow:hidden;border-radius:12px;background:#D9DFE3}
html.dk #app .a4wrap{background:#2A3238}
#app .a4mini{position:absolute;left:50%;top:10px;transform-origin:top center}
#app .a4wrap.pg{overflow:auto;padding:14px;height:auto}
#app .a4scale{transform-origin:top left}
.a4{width:794px;height:1123px;box-sizing:border-box;padding:45px 45px 40px;background:#fff;color:#111;font:13px/1.45 -apple-system,"Segoe UI",Roboto,Arial,sans-serif;display:flex;flex-direction:column;box-shadow:0 4px 20px rgba(0,0,0,.18)}
.a4 *{color:#111}
.a4h{display:flex;justify-content:space-between;gap:20px;border-bottom:2px solid #111;padding-bottom:12px;font-size:12px}
.a4hn{font-size:19px;font-weight:800}.a4t{font-size:21px;font-weight:900;letter-spacing:.5px}
.a4g{display:flex;gap:20px;margin-top:16px}.a4g>div:first-child{flex:1}
.a4k{border-collapse:collapse;width:100%}.a4k td{padding:5px 0;vertical-align:top;border-bottom:1px solid #e3e3e3}.a4k td:first-child{width:150px;color:#555}
.a4q{width:140px;text-align:center;font-size:11px}
.a4n{margin-top:14px;border:2px solid #111;padding:9px 12px;font-size:12.5px}
.a4s{margin-top:18px;font-weight:800;font-size:14px}
.a4l{width:100%;border-collapse:collapse;margin-top:6px;font-size:12px}.a4l th{background:#EEF1F3;text-align:left;padding:6px;border:1px solid #cfd5d9}.a4l td{padding:6px;border:1px solid #cfd5d9}
.a4c{margin-top:18px;font-size:13px}
.a4sig{display:flex;gap:24px;margin-top:14px}.a4sig>div{flex:1;height:150px;border:1px solid #999;display:flex;flex-direction:column;align-items:center;padding-top:10px;gap:2px}.a4sig i{font-size:12px;color:#555}
.a4f{margin-top:auto;display:flex;justify-content:space-between;font-size:11px;color:#555;border-top:1px solid #ccc;padding-top:6px}
#tqtoast{position:fixed;left:50%;bottom:110px;transform:translateX(-50%) translateY(20px);background:#1E2A30;color:#fff;padding:11px 16px;border-radius:14px;font:700 13.5px/1.4 -apple-system,"Segoe UI",Roboto,sans-serif;opacity:0;transition:.25s;z-index:9999;pointer-events:none;max-width:88vw;text-align:center}
#tqtoast.on{opacity:1;transform:translateX(-50%)}
@page{size:A4 portrait;margin:12mm}
#printroot{display:none}
@media print{
 html,body{background:#fff!important;margin:0}
 body>*:not(#printroot){display:none!important}
 #printroot{display:block!important}
 #printroot .a4{width:186mm;height:271mm;max-height:271mm;padding:0;box-shadow:none;overflow:hidden;page-break-after:avoid;page-break-inside:avoid;font-size:12px}
 #printroot .a4sig>div{height:36mm}
}
/* ---- đặt trước 12 tháng ---- */
.avw{border-radius:12px;padding:9px 11px;font-size:12.5px;line-height:1.5;background:rgba(255,122,107,.12);border:1px solid rgba(210,65,47,.35);color:#7A1F14}
html.dk .avw{background:rgba(255,122,107,.14);border-color:rgba(255,122,107,.4);color:#FFC2BA}
.avscroll{overflow-x:auto;padding-bottom:6px;-webkit-overflow-scrolling:touch}
.avtl{display:grid;grid-auto-flow:column;grid-template-rows:26px;align-items:center;column-gap:0;min-width:max-content;border-top:1px solid rgba(30,42,48,.06)}
.avtl .rn{grid-column:1;grid-row:1;position:sticky;left:0;z-index:2;font-size:11.5px;font-weight:800;background:var(--avbg,#F3F8F8);height:100%;display:flex;align-items:center;padding-left:2px}
.avtl .bar{grid-row:1;height:20px;border-radius:6px;margin:0 1px;font-size:10px;font-weight:800;color:#05343A;display:flex;align-items:center;padding:0 5px;overflow:hidden;white-space:nowrap;cursor:pointer}
.avtl .bar.cf{outline:2px solid #D2412F;outline-offset:-1px}
.avtl.h{grid-template-rows:34px;border-top:none}
.avtl.h .avd{grid-row:1;text-align:center;font-size:11px;font-weight:800;line-height:1.1}
.avtl.h .avd i{display:block;font-style:normal;font-weight:600;font-size:9px;opacity:.65}
.avtl.h .avd.we{color:#0A6E7A}.avtl.h .avd.ev{color:#B26A00}
.avtl.a>div:not(.rn){grid-row:1;text-align:center;font-size:10.5px;font-weight:700;opacity:.8}
.avtl.a .hi{color:#0A7A55;opacity:1}.avtl.a .ob{color:#D2412F;opacity:1}
html.dk .avtl{border-top-color:rgba(255,255,255,.06)}
html.dk .avtl .rn{--avbg:#1A2226}
html.dk .avtl.h .avd.we{color:#7FE3EC}html.dk .avtl.h .avd.ev{color:#FFD27A}
html.dk .avtl.a .hi{color:#5EF2B5}html.dk .avtl.a .ob{color:#FF9C90}
.avtl .bar.fl{opacity:.42;cursor:default}
html.dk .avtl .bar.fl{opacity:.34}
/* sidebar vừa màn 900px */
@media (max-height:1090px){#app .dnav{gap:0;padding:14px 14px}#app .dnav .it{padding:4.5px 12px;font-size:13px;gap:10px}#app .dnav .grp{margin:6px 12px 1px}#app .dnav .it svg{width:17px;height:17px}#app .dnav>img{margin-bottom:0!important}#app .dnav>.gl2{display:none}}