:root{--bg-app: #e8f3ec;--bg-panel: #ffffff;--bg-navy: #16263f;--bg-navy-2: #1f3151;--bg-overlay: rgba(150, 173, 201, .92);--bg-grid-head: #26364f;--bg-row-alt: #f4f8f5;--green: #16a34a;--green-dark: #0f7a38;--purple: #574b9e;--purple-dark: #463a86;--red: #d64541;--amber: #e6a817;--accent: #2f6fed;--text: #1f2a37;--text-muted: #6b7280;--text-on-dark: #f5f8fc;--text-on-dark-muted: #b9c4d4;--border: #d4dde7;--border-strong: #b7c3d0;--font: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;--fs-sm: 12px;--fs-base: 13px;--fs-md: 15px;--fs-lg: 18px;--fs-xl: 24px;--red-bar: #e3002b;--head-grey: #8b969f;--teal: #1fc8c8;--cart-head: #41c6c6;--mint: #ecf8f1;--mint-card: #f4fbf7;--tile-green: #2e8b57;--tile-purple: #574b9e;--tile-blue: #4a89bd;--tile-pink: #df6f9c;--tile-grey: #868d96;--radius: 6px;--radius-lg: 10px;--shadow-card: 0 1px 3px rgba(16, 32, 56, .12), 0 1px 2px rgba(16, 32, 56, .08);--shadow-pop: 0 10px 30px rgba(10, 22, 40, .28);--gutter: 12px}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:var(--font);font-size:var(--fs-base);color:var(--text);background:var(--bg-app);-webkit-font-smoothing:antialiased}button{font-family:inherit;cursor:pointer}input,select,textarea{font-family:inherit;font-size:var(--fs-base)}.btn{border:1px solid var(--border-strong);background:var(--bg-panel);color:var(--text);border-radius:4px;padding:8px 14px;font-size:var(--fs-md);font-weight:600;display:inline-flex;flex-direction:column;align-items:center;gap:2px;line-height:1.1}.btn .fkey{font-size:10px;color:var(--text-muted);font-weight:500}.btn:hover{background:#f0f4f8}.btn:active{transform:translateY(1px)}.btn-primary{background:var(--green);border-color:var(--green-dark);color:#fff}.btn-primary:hover{background:var(--green-dark)}.btn-danger{background:var(--red);border-color:#b2332f;color:#fff}.btn-accent{background:var(--accent);border-color:#1f58d0;color:#fff}.btn:disabled{opacity:.5;cursor:not-allowed}.tile{background:var(--bg-panel);border:2px solid transparent;border-radius:var(--radius-lg);box-shadow:var(--shadow-card);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:16px;min-height:120px;-webkit-user-select:none;user-select:none}.tile:hover,.tile:focus-visible{border-color:var(--accent);outline:none}.tile .tile-label{font-size:var(--fs-md);color:var(--text)}.tile .tile-icon{font-size:40px;line-height:1}.grid{width:100%;border-collapse:collapse;background:var(--bg-panel);font-size:var(--fs-base)}.grid th{background:var(--bg-grid-head);color:var(--text-on-dark);text-align:left;padding:7px 10px;font-weight:600;position:sticky;top:0}.grid td{padding:6px 10px;border-bottom:1px solid var(--border)}.grid tr:nth-child(2n) td{background:var(--bg-row-alt)}.grid tr.selected td{background:#d9e7fb}.input{width:100%;padding:7px 9px;border:1px solid var(--border-strong);border-radius:4px;background:#fff}.input:focus{outline:2px solid var(--accent);outline-offset:-1px}.label{font-size:var(--fs-sm);color:var(--text-muted);margin-bottom:3px;display:block}.badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:600}.badge-free{background:#dcfce7;color:#166534}.badge-occupied{background:#fee2e2;color:#991b1b}.badge-billed{background:#fef3c7;color:#92400e}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0c162673;display:flex;align-items:center;justify-content:center;z-index:50}.modal{background:var(--bg-panel);border-radius:var(--radius-lg);box-shadow:var(--shadow-pop);max-height:90vh;overflow:auto}.scroll{overflow:auto}.app-root{display:grid;grid-template-columns:176px 1fr;height:100vh;overflow:hidden}.side{background:var(--bg-navy);display:flex;flex-direction:column;color:#c9d2de;-webkit-user-select:none;user-select:none}.side-gap{flex:.7 1 0}.side-item{background:none;border:none;color:#d7dde6;font-size:22px;text-align:center;padding:15px 8px;width:100%}.side-item:hover{background:#ffffff0d;color:#fff}.side-item.active{color:var(--teal)}.side-spacer{flex:1 1 0}.side-view{align-self:center;background:#e9edf2;color:#1f2a37;border:1px solid #c3ccd6;border-radius:3px;font-size:13px;padding:4px 22px;margin-bottom:10px}.side-quit{background:none;border:none;color:#e3002b;font-size:22px;padding:10px 8px 22px;width:100%}.side-quit:hover{color:#ff2a4e}.main-col{display:flex;flex-direction:column;min-width:0;overflow:hidden}.red-bar{background:var(--red-bar);height:28px;display:flex;align-items:center;justify-content:flex-end;gap:2px;padding-right:6px;flex-shrink:0}.red-bar .wbtn{background:none;border:none;color:#fff;font-size:15px;width:34px;height:28px;line-height:1}.red-bar .wbtn:hover{background:#ffffff2e}.red-bar .wbtn.close:hover{background:#c40020}.screen{flex:1;display:flex;flex-direction:column;min-height:0;background:var(--mint)}.scr-head{background:var(--head-grey);height:92px;flex-shrink:0;display:flex;align-items:center;padding:0 30px;position:relative}.scr-title{color:var(--teal);font-size:40px;font-weight:700;line-height:1}.scr-title:after{content:"";position:absolute;left:30px;bottom:6px;width:150px;height:4px;background:var(--teal)}.scr-total{margin-left:auto;margin-right:22%;color:#0a0f14;font-size:58px;font-weight:700;line-height:1}.bill-body{flex:1;display:grid;grid-template-columns:1.18fr 1fr;min-height:0;background:var(--mint)}.bill-left{display:flex;flex-direction:column;min-width:0;padding:0}.bill-right{display:flex;flex-direction:column;min-width:0;border-left:3px solid #cdeadd}.card-cust{background:var(--mint-card);border:1px solid #cfe6da;margin:10px;padding:18px 16px;display:grid;grid-template-columns:90px 1fr auto;gap:14px 14px;align-items:start}.card-cust .lbl{font-size:17px;padding-top:4px}.fld{border:1px solid #b9c3cd;background:#fff;padding:7px 8px;width:100%}textarea.fld{resize:none;height:86px}.btn-flat{background:#f2f4f7;border:1px solid #b9c3cd;color:#1f2a37;font-size:15px;padding:7px 20px;border-radius:2px;min-width:92px}.btn-flat:hover{background:#e6eaef}.navy-strip{background:var(--bg-navy);height:74px;margin:2px 0;flex-shrink:0}.card-entry{padding:10px 16px 0}.entry-row1{display:flex;align-items:center;gap:14px;margin-bottom:26px}.entry-row1 .lbl,.entry-row2 .lbl{font-size:17px}.entry-row1 .fld{max-width:230px}.sel{border:1px solid #b9c3cd;background:#fff;padding:7px 8px;min-width:230px}.entry-row2{display:grid;grid-template-columns:150px 1fr 120px;gap:16px;align-items:end}.entry-row2 .col .lbl{display:block;margin-bottom:4px}.prod-area{flex:1;margin:12px 10px 10px;background:var(--mint-card);border:1px solid #cfe6da;overflow:auto}.cart-box{margin:10px 10px 0;border:1px solid #b9c3cd;background:var(--mint-card);display:flex;flex-direction:column;flex:1;min-height:0}.cart-tbl{width:100%;border-collapse:collapse}.cart-tbl thead th{background:var(--cart-head);color:#12303a;font-size:16px;font-weight:700;text-align:left;padding:4px 10px;border-right:1px solid #8fd6d6;position:sticky;top:0}.cart-tbl tbody td{padding:4px 10px;border-bottom:1px solid #e0ece6;font-size:14px}.cart-tbl tbody tr.sel td{background:#d9f2ea}.cart-scroll{flex:1;overflow:auto}.act-row{display:grid;grid-template-columns:repeat(6,1fr);margin:0 10px;border:1px solid #b9c3cd;border-top:none}.act-btn{background:#fff;border:none;border-right:1px solid #c7ced6;padding:8px 2px 6px;display:flex;flex-direction:column;align-items:center;gap:2px}.act-btn:last-child{border-right:none}.act-btn:hover{background:#eef2f6}.act-btn .t{font-size:17px;font-weight:700;color:#1f2a37}.act-btn .f{font-size:12px;color:#6b7280}.act-btn:disabled{opacity:.45}.tiles-wrap{background:var(--bg-navy);margin:14px 10px 0;padding:18px}.tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.ktile{height:86px;border:none;color:#fff;position:relative;display:flex;align-items:center;justify-content:center}.ktile .num{font-size:40px;font-weight:700}.ktile .cap{position:absolute;left:8px;bottom:6px;font-size:15px;font-weight:700}.ktile.center{flex-direction:column;font-size:22px;font-weight:600;line-height:1.15}.bot-bar{display:flex;align-items:center;gap:10px;padding:10px;margin:10px;background:#fff;border:1px solid #cfd7df}.bot-bar .bl{font-size:17px;font-weight:700}.bot-bar .bv{font-size:16px}
