:root{color:#153648;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;background:#f5f8f8;font-family:system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}body{min-width:320px;margin:0}button,input,select,textarea{font:inherit}button{cursor:pointer;border:0;border-radius:10px;min-height:48px;margin-top:9px;padding:10px 15px}input,select,textarea{color:#16374c;background:#fff;border:1px solid #97abb3;border-radius:9px;width:100%;min-height:48px;margin:6px 0 14px;padding:10px 12px;display:block}textarea{resize:vertical}label{font-size:14px;font-weight:750;display:block}form{min-width:0}summary{color:#0c6170;cursor:pointer;min-height:44px;padding:10px 0;font-weight:700}.live-app{color:#103c55;background:#f4f7f8;min-height:100vh}.live-app .app-header{z-index:20;color:#fff;background:#153c57;justify-content:space-between;align-items:center;min-height:72px;padding:16px;display:flex;position:sticky;top:0}.live-app .app-header button{color:#fff;background:0 0;border:1px solid #abc3cf;border-radius:10px;padding:10px 14px}.live-main{max-width:760px;margin:0 auto;padding:16px 16px 130px}.live-main h1{margin:20px 0 8px;font-size:25px;line-height:1.3}.live-main h2{margin:20px 0 12px;font-size:19px}.live-stage{color:#784b00;background:#fff3d6;border-radius:12px;padding:12px;line-height:1.5}.live-error{color:#8d2721;background:#fbe5e3;border-radius:12px;padding:12px}.live-success{color:#235a3d;background:#e2f2e8;border-radius:12px;padding:12px}.live-pending-operation{color:#604309;background:#fff3d6;border:2px solid #b77c11;border-radius:12px;margin:12px 0;padding:14px;line-height:1.5}.live-pending-operation p{margin:0 0 10px}.live-pending-operation button{min-height:46px}.live-summary{grid-template-columns:1fr 1fr;gap:10px;margin:18px 0;display:grid}.live-summary>div{background:#fff;border:1px solid #d9e5e9;border-radius:14px;gap:4px;padding:14px;display:grid}.live-summary strong{font-size:30px}.live-sticky{z-index:10;background:#f4f7f8;padding:6px 0 10px;position:sticky;top:72px}.live-sticky input{border:1px solid #a7bec8;border-radius:10px;width:100%;min-height:46px;padding:0 12px;font-size:16px}.live-filters{gap:7px;padding-top:9px;display:flex;overflow-x:auto}.live-filters button{background:#fff;border:1px solid #c6d9de;border-radius:99px;flex:none;min-height:38px;padding:6px 12px}.live-filters button.active{background:#e3f2f1;border-color:#15717a}.live-list{gap:10px;display:grid}.live-list>button{text-align:left;width:100%;color:inherit;background:#fff;border:1px solid #d6e4e8;border-radius:15px;gap:7px;padding:15px;font-size:16px;display:grid}.live-list>button span{font-size:14px}.live-main .panel{margin:14px 0}.live-main .panel label{margin:12px 0;display:block}.live-main .panel input,.live-main .panel textarea{border:1px solid #a7bec8;border-radius:10px;width:100%;min-height:46px;margin-top:5px;padding:10px;font-size:16px;display:block}.live-back{color:#086777;background:0 0;border:0;padding:10px 0;font-size:16px}.live-product{text-align:left;color:#0b5961;background:#e9f5f4;border:1px solid #9bc9ca;border-radius:10px;width:100%;min-height:52px;margin:5px 0;padding:10px}.live-product-shortcuts{grid-template-columns:1fr 1fr;gap:8px;margin:2px 0 10px;display:grid}.live-product-shortcuts button{text-align:left;border-radius:10px;min-height:48px;padding:8px}.live-product-shortcuts button:only-child{grid-column:1/-1}.product-price-row{border-top:1px solid #d8e5e8;padding:10px 0}.product-price-row .secondary{min-height:44px}.live-draft:has(label){grid-template-columns:1fr 58px}.live-draft:has(label) label{grid-column:1/2;margin:0}.live-draft:has(label) small{color:#526b78;margin-top:5px;font-size:12px;line-height:1.4;display:block}.live-temp{border-top:1px solid #d8e5e8;margin:16px 0;padding-top:10px}.live-draft{grid-template-columns:1fr 80px 58px;align-items:center;gap:6px;margin:12px 0;display:grid}.live-draft input{margin:0!important}.live-draft button{color:#8e3636;background:0 0;border:0;min-height:44px}.live-draft span{grid-column:1/-1;justify-self:end}.live-walkin-switch{z-index:18;color:#0b5961;background:#e3f2f1;border:1px solid #9bc9ca;border-radius:99px;padding:10px 14px;position:fixed;bottom:75px;right:12px;box-shadow:0 2px 8px #0002}.live-app .bottom-nav{z-index:19}@media (width>=760px){.live-main{padding-left:24px;padding-right:24px}}.closing-panel .close-summary>div:last-child{border-bottom:0}.closing-panel .close-math>div{border-bottom:1px solid #e6ecee;justify-content:space-between;gap:12px;padding:11px 0;display:flex}.closing-panel .close-math>div:last-child{border-bottom:0;font-size:20px}.closing-panel .close-math strong,.closing-panel .close-summary strong{text-align:right}.closing-small{color:#526b78;font-size:13px}.closing-success{color:#235a3d;background:#e2f2e8;border-radius:10px;padding:12px;font-weight:700}.closing-events{max-height:360px;overflow-y:auto}.closing-events>div{border-bottom:1px solid #e6ecee;justify-content:space-between;gap:12px;padding:11px 0;display:flex}.closing-events small{color:#526b78;margin-top:3px;display:block}.closing-events strong{flex:none}.closing-events span{overflow-wrap:anywhere;min-width:0}.customer-matches button{text-align:left;color:#104b57;background:#edf7f5;border:1px solid #aac9cb;width:100%;min-height:44px;margin:6px 0;display:block}.offline-panel .live-list{margin-top:16px}.offline-warning{color:#604309;background:#fff3d6;border:2px solid #b77c11;border-radius:12px;padding:12px;line-height:1.5}.offline-confirm{border-top:1px solid #d8e5e8;margin-top:16px;padding-top:12px}.offline-panel .secondary.wide{min-height:46px;margin:5px 0}.offline-panel .primary.wide{min-height:50px}.live-sync-status{color:#235a3d;background:#e2f2e8;border-radius:12px;justify-content:space-between;align-items:center;gap:10px;margin:12px 0;padding:8px 12px;display:flex}.live-sync-status button{min-height:42px}#root,.pos-shell{min-height:100svh}.topbar{z-index:30;min-height:64px;padding:10px max(16px, env(safe-area-inset-right)) 10px max(16px, env(safe-area-inset-left));color:#fff;background:#123752;justify-content:space-between;align-items:center;gap:12px;display:flex;position:sticky;top:0}.topbar strong,.topbar small{display:block}.topbar strong{letter-spacing:.02em;font-size:18px}.topbar small{color:#d0e5ed;margin-top:2px;font-size:12px}.settings-button{color:#fff;background:0 0;border:1px solid #8bb4c2;flex:none;min-height:44px;padding:0 12px}.app-content{width:min(100%,680px);padding:16px 16px calc(100px + env(safe-area-inset-bottom));margin:0 auto}.demo-banner{color:#634614;background:#fff4d7;border:1px solid #e8c87a;border-radius:12px;margin-bottom:16px;padding:12px 14px;font-size:13px;line-height:1.45}.hero{padding:20px 2px 12px}.hero span{color:#64768a;font-size:12px;font-weight:700}.hero h1{margin:5px 0 4px;font-size:clamp(24px,6vw,32px);line-height:1.28}.hero p,.page-title p{color:#5c6c7b;margin:0}.summary-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-bottom:18px;display:grid}.summary-grid>div{background:#fff;border:1px solid #dae5e8;border-radius:14px;min-height:92px;padding:14px}.summary-grid strong,.summary-grid span{display:block}.summary-grid strong{color:#0d4a64;font-size:29px;line-height:1.1}.summary-grid span{color:#465b69;margin-top:8px;font-size:14px;font-weight:700}.panel{background:#fff;border:1px solid #dce5e6;border-radius:16px;margin:0 0 14px;padding:18px;box-shadow:0 3px 15px #102f4710}.panel h2{margin:0 0 14px;font-size:18px}.panel p{line-height:1.5}.demand>div{grid-template-columns:1fr 1fr;gap:10px;display:grid}.demand p{background:#f1f7f6;border-radius:12px;margin:0;padding:12px}.demand strong,.demand span{display:block}.demand strong{color:#0a5260;font-size:18px}.demand span{margin-top:4px;font-size:13px}.demand small{color:#5d6f77;margin-top:12px;display:block}.section-title{margin:24px 0 12px;font-size:21px}.list-tools{z-index:20;background:#f5f8f8;border-bottom:1px solid #dbe5e7;margin:0 -16px;padding:10px 16px 11px;position:sticky;top:64px}.list-tools input{margin:0}.filter-row{scrollbar-width:none;gap:7px;margin-top:10px;padding-bottom:2px;display:flex;overflow-x:auto}.filter-row button{color:#284455;background:#fff;border:1px solid #c8d8d9;border-radius:99px;flex:none;min-height:40px;margin:0;padding:7px 13px;font-size:14px}.filter-row button.active{color:#064854;background:#dceff0;border-color:#0b5968;font-weight:800}.hint{color:#60727c;margin:9px 2px 13px;font-size:13px;line-height:1.45}.order-list{gap:9px;display:grid}.order-card{text-align:left;color:#16374c;background:#fff;border:1px solid #dae4e6;border-radius:14px;grid-template-columns:61px minmax(0,1fr);gap:11px;width:100%;min-height:96px;margin:0;padding:14px 12px;display:grid;box-shadow:0 2px 9px #102f4709}.order-card:active{background:#eef6f5}.order-time{padding-top:3px;font-size:18px}.order-content,.order-content>span{min-width:0;display:block}.order-content>strong{font-size:18px;display:block}.order-content>span:nth-child(2){color:#4c6470;text-overflow:ellipsis;white-space:nowrap;margin-top:5px;font-size:14px;overflow:hidden}.order-footer{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:6px;margin-top:8px;display:flex!important}.order-footer b{font-size:17px}.tag-row{flex-wrap:wrap;gap:5px;display:flex}.tag{color:#304856;white-space:nowrap;background:#e8eef1;border-radius:7px;align-items:center;min-height:25px;padding:3px 8px;font-size:12px;font-style:normal;font-weight:700;display:inline-flex}.tag.pending,.tag.unpaid{color:#7b480d;background:#fff0dc}.tag.ready{color:#14594b;background:#dff2ee}.tag.completed,.tag.paid{color:#25603b;background:#e1eee5}.tag.cancelled,.tag.voided{color:#824445;background:#f1e7e7}.empty{text-align:center;color:#657780;padding:40px 16px}.page-title{margin:10px 0 18px}.page-title h1{margin:4px 0;font-size:28px}.back-link{color:#0d6170;background:0 0;border:0;min-height:44px;margin:0;padding:0 4px;font-weight:700}.create-form{gap:0;display:grid}.create-form .panel{margin-bottom:12px}.form-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.form-grid>div{min-width:0}.quick-products{grid-template-columns:1fr 1fr;gap:9px;margin-bottom:10px;display:grid}.product-add{text-align:left;color:#124954;background:#edf7f5;border:1px solid #95b9ba;min-height:83px;margin:0;padding:12px;font-weight:800}.product-add small{color:#4d6470;margin-top:6px;font-size:11px;font-weight:500;display:block}.item-row{border-bottom:1px solid #e7eded;grid-template-columns:1fr auto;align-items:center;gap:6px 10px;padding:13px 0;display:grid}.item-row>div:first-child{min-width:0}.item-row small{color:#667880;margin-top:4px;display:block}.item-row>b{text-align:right}.item-edit{align-items:center;gap:5px;display:flex}.item-edit input{width:80px;margin:0}.item-edit button{color:#813d2e;background:#f3e9e6;border:0;min-height:44px;margin:0;padding:8px;font-size:13px}.form-total{justify-content:space-between;align-items:center;padding:16px 3px;font-size:18px;display:flex}.form-total strong{font-size:24px}.detail-head h2{margin:8px 0 12px;font-size:27px}.detail-head small{color:#5d717c}.detail-line,.detail-total,.cash-line,.close-math>div,.close-summary>div{border-bottom:1px solid #e6ecee;justify-content:space-between;align-items:center;gap:14px;padding:12px 0;display:flex}.detail-line span,.close-summary span{min-width:0}.detail-line strong,.close-summary strong{flex:none}.detail-total{border-top:2px solid #cad9dc;border-bottom:0;margin-top:9px;font-size:20px}.note{white-space:pre-wrap;background:#f3f6f6;border-radius:9px;padding:9px 12px}.other-actions{grid-template-columns:1fr 1fr;gap:8px;margin-top:10px;display:grid}.other-actions button{color:#285064;background:#fff;border:1px solid #c5d5d8;margin:0}.close-summary{grid-template-columns:1fr;gap:0;display:grid}.close-summary>div:first-child{padding-top:0}.close-summary>div:last-child{border:0;padding-bottom:0}.basis{color:#604715;background:#fff4d8;border-radius:10px;padding:10px 12px;font-weight:700}.close-math{margin:20px 0}.close-math>div:last-child{border:0;font-size:20px}.payment-list{max-height:340px;margin:10px 0;overflow-y:auto}.payment-list button{color:#16374c;text-align:left;background:#fff;border:0;border-bottom:1px solid #e3eaea;border-radius:0;justify-content:space-between;width:100%;margin:0;display:flex}.language-row{gap:8px;display:flex}.language-row button{color:#194254;background:#fff;border:1px solid #c8d9dc;flex:1;margin:0}.language-row button.active{color:#0a4f55;background:#e1f0ed;border-color:#0d6870;font-weight:800}.bottom-nav{z-index:35;min-height:calc(68px + env(safe-area-inset-bottom));padding:4px max(8px, env(safe-area-inset-right)) env(safe-area-inset-bottom) max(8px, env(safe-area-inset-left));background:#fff;border-top:1px solid #b6cbd1;grid-template-columns:repeat(4,1fr);display:grid;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -3px 18px #122f481a}.bottom-nav button{color:#3e5c68;background:0 0;border:0;border-radius:0;min-width:0;min-height:56px;margin:0;padding:7px 2px;font-size:14px;font-weight:700}.bottom-nav button.current{color:#0a6070;box-shadow:inset 0 3px #0a6070}.bottom-nav .nav-add{color:#0a6070;flex-direction:column;justify-content:center;align-items:center;font-size:26px;line-height:1;display:flex}.nav-add span{margin-top:3px;font-size:13px}.back-top{right:14px;bottom:calc(82px + env(safe-area-inset-bottom));z-index:34;color:#fff;background:#163d54;border-radius:99px;min-height:44px;padding:10px 14px;position:fixed;box-shadow:0 4px 12px #163d5444}.modal{z-index:50;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.shade{background:#0d223b8c;position:absolute;inset:0}.modal-card{width:min(100%,680px);max-height:90svh;padding:22px 18px calc(20px + env(safe-area-inset-bottom));background:#fff;border-radius:20px 20px 0 0;position:relative;overflow-y:auto}.modal-card h2{margin:0 0 20px}.modal-buttons{grid-template-columns:1fr 1fr;gap:9px;margin-top:18px;display:grid}.modal-buttons button{margin:0}.choice{color:#104b57;text-align:left;background:#edf7f5;border:1px solid #aac9cb;width:100%;margin:0 0 9px;padding:16px}.cash-line{margin:8px 0;font-size:18px}.form-error{color:#9b3f31;font-weight:700}.toast{left:16px;right:16px;bottom:calc(78px + env(safe-area-inset-bottom));z-index:60;color:#fff;background:#123f4e;border-radius:12px;width:min(100% - 32px,648px);margin:auto;padding:13px 16px;position:fixed;box-shadow:0 5px 18px #0a2f3c55}.auth-shell{width:min(100%,480px);margin:0 auto;padding:26px 16px}.auth-header{justify-content:space-between;align-items:center;gap:10px;margin-bottom:24px;display:flex}.auth-header>strong{font-size:20px}.auth-header .language-row button{min-width:50px;min-height:44px}.auth-message{background:#fff4d8;border-radius:8px;padding:12px}.wide{width:100%}.primary{color:#fff;background:#0d5969;border:0;font-weight:800}.secondary{color:#175066;background:#fff;border:1px solid #b6cbd0;font-weight:700}button:disabled{opacity:.5;cursor:not-allowed}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline-offset:2px;outline:3px solid #c0852b}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@media (width>=720px){.app-content{padding-top:24px}.summary-grid{grid-template-columns:repeat(4,1fr)}.bottom-nav{border-left:1px solid #b6cbd1;border-right:1px solid #b6cbd1;width:680px;left:50%;right:auto;transform:translate(-50%)}.modal{align-items:center}.modal-card{border-radius:18px;padding-bottom:22px}}.detail-page .app-content{padding-bottom:calc(180px + env(safe-area-inset-bottom))}.detail-primary{left:50%;bottom:calc(76px + env(safe-area-inset-bottom));z-index:34;width:min(100% - 32px,648px);margin:0;position:fixed;transform:translate(-50%);box-shadow:0 6px 20px #0d596955}.lang-vi .demand>div{grid-template-columns:1fr}
