:root{--brand:#0f766e;--brand-dark:#115e59;--brand-light:#f0fdfa;--ink:#0f172a;--muted:#64748b;--line:#e2e8f0;--bg:#f8fafc;--card:#fff;--ok:#15803d;--warn:#b45309;--danger:#b91c1c;--shadow:0 2px 8px #0f172a0d, 0 10px 28px #0f172a0a;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#root{background:var(--bg);height:100%;color:var(--ink);-webkit-font-smoothing:antialiased;margin:0}button{cursor:pointer;color:inherit;background:0 0;border:none;font-family:inherit}input,select,textarea{font-family:inherit;font-size:14px}.pos-shell{flex-direction:column;height:100vh;display:flex;overflow:hidden}.topbar{background:var(--card);border-bottom:1px solid var(--line);flex-shrink:0;align-items:center;gap:16px;padding:10px 20px;display:flex;box-shadow:0 2px 10px #00000005}.brand-mark{letter-spacing:-.2px;align-items:center;gap:10px;font-size:16px;font-weight:800;display:flex}.brand-logo{background:var(--brand);color:#fff;border-radius:10px;place-items:center;width:36px;height:36px;display:grid}.tabs{background:#f1f5f9;border-radius:12px;gap:4px;padding:4px;display:flex}.tab{color:var(--muted);white-space:nowrap;border-radius:9px;align-items:center;gap:7px;padding:8px 16px;font-size:13.5px;font-weight:600;transition:all .15s;display:flex}.tab.active{background:var(--card);color:var(--brand);box-shadow:0 2px 8px #0000000f}.tab:hover:not(.active){color:var(--ink)}.pos-body{flex:1;grid-template-columns:1fr 410px;display:grid;overflow:hidden}.pos-main{padding:18px 22px;overflow-y:auto}.pos-side{background:var(--card);border-left:1px solid var(--line);flex-direction:column;display:flex;overflow:hidden}@media (width<=1100px){.pos-body{grid-template-columns:1fr}.pos-side{display:none}}.card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:16px;box-shadow:0 2px 6px #00000005}.grid-products{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px;display:grid}.product-tile{background:var(--card);border:1.5px solid var(--line);text-align:left;cursor:pointer;border-radius:14px;flex-direction:column;padding:0;transition:transform .15s cubic-bezier(.175,.885,.32,1.275),border-color .15s,box-shadow .15s;display:flex;position:relative;overflow:hidden}.product-tile:hover:not(:disabled){border-color:var(--brand);transform:translateY(-2px);box-shadow:0 8px 20px #0f766e1f}.product-tile:active:not(:disabled){transform:scale(.98)}.product-tile:disabled{opacity:.45;cursor:not-allowed}.product-tile:focus-visible{outline:2px solid var(--brand);outline-offset:2px}.product-thumb-wrapper{background:var(--brand-light);width:100%;height:104px;position:relative;overflow:hidden}.product-thumb-img{object-fit:cover;width:100%;height:100%;transition:transform .3s;display:block}.product-tile:hover .product-thumb-img{transform:scale(1.06)}.sku-badge{color:#fff;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);letter-spacing:.3px;z-index:2;background:#0f172ad9;border-radius:5px;padding:2px 6px;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:9.5px;font-weight:700;position:absolute;top:6px;left:6px;box-shadow:0 2px 4px #00000026}.stock-chip-badge{z-index:2;border-radius:5px;padding:2px 6px;font-size:9.5px;font-weight:700;position:absolute;top:6px;right:6px;box-shadow:0 2px 4px #0000001a}.product-tile-body{flex-direction:column;flex:1;justify-content:space-between;padding:11px 12px 13px;display:flex}.product-tile-title{color:var(--ink);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin-bottom:6px;font-size:13.5px;font-weight:700;line-height:1.35;display:-webkit-box;overflow:hidden}.chip{color:var(--muted);white-space:nowrap;background:#f1f5f9;border-radius:999px;align-items:center;gap:5px;padding:5px 11px;font-size:12px;font-weight:600;display:inline-flex}.chip.brand{background:var(--brand-light);color:var(--brand-dark)}.chip.ok{color:var(--ok);background:#f0fdf4}.chip.warn{color:var(--warn);background:#fffbeb}.chip.danger{color:var(--danger);background:#fef2f2}.chip.info{color:#1d4ed8;background:#eff6ff}.btn{background:#f1f5f9;border-radius:11px;justify-content:center;align-items:center;gap:8px;padding:12px 18px;font-size:14px;font-weight:650;transition:filter .15s,transform 80ms;display:inline-flex}.btn:active{transform:scale(.985)}.btn:focus-visible{outline:2px solid var(--brand);outline-offset:2px}.btn.primary{background:var(--brand);color:#fff}.btn.primary:hover{filter:brightness(1.08)}.btn.dark{background:var(--ink);color:#fff}.btn.danger{color:var(--danger);background:#fef2f2}.btn.outline{border:1.5px solid var(--line);background:0 0}.btn.block{width:100%}.btn.lg{padding:14px 20px;font-size:15px}.btn:disabled{opacity:.45;cursor:not-allowed}.row{justify-content:space-between;align-items:center;gap:10px;display:flex}.muted{color:var(--muted)}.tiny{font-size:12px}.small{font-size:13.5px}.bold{font-weight:700}.strike{color:var(--muted);text-decoration:line-through}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.divider{background:var(--line);height:1px;margin:12px 0}.field{margin-bottom:14px}.field label{margin-bottom:6px;font-size:13px;font-weight:600;display:block}.field input,.field select,.field textarea{border:1.5px solid var(--line);background:#fff;border-radius:10px;width:100%;padding:11px 14px}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--brand);outline:none}.modal-backdrop{z-index:100;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0f172a99;place-items:center;padding:20px;animation:.15s fade;display:grid;position:fixed;inset:0}.modal{background:var(--card);border-radius:18px;flex-direction:column;width:100%;max-height:90vh;animation:.18s cubic-bezier(.2,.8,.2,1) pop;display:flex;box-shadow:0 20px 40px #0000002e}@keyframes fade{0%{opacity:0}}@keyframes pop{0%{opacity:0;transform:scale(.97)}}.modal-head{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:12px;padding:16px 20px;display:flex}.modal-body{flex:1;padding:20px;overflow-y:auto}.modal-foot{border-top:1px solid var(--line);padding:16px 20px}.icon-btn{background:#f1f5f9;border-radius:10px;place-items:center;width:38px;height:38px;font-size:15px;transition:background .15s;display:grid}.icon-btn:hover{background:#e2e8f0}.floor-plan-container{background:var(--card);border:1.5px solid var(--line);border-radius:16px;padding:20px;box-shadow:0 4px 14px #00000008}.floor-plan-zone{background:#fafafa;border:1.5px dashed #cbd5e1;border-radius:14px;margin-bottom:20px;padding:16px;position:relative}.floor-plan-zone-header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;margin-bottom:14px;padding-bottom:8px;display:flex}.table-grid-visual{grid-template-columns:repeat(auto-fill,minmax(170px,1fr));gap:14px;display:grid}.table-card-visual{text-align:left;border:2px solid var(--line);background:var(--card);cursor:pointer;border-radius:14px;flex-direction:column;justify-content:space-between;min-height:120px;padding:14px;transition:transform .15s,box-shadow .15s,border-color .15s;display:flex;position:relative}.table-card-visual:hover{transform:translateY(-2px);box-shadow:0 8px 20px #00000014}.table-card-visual.available{background:#ecfdf5;border-color:#a7f3d0}.table-card-visual.occupied{background:#fff7ed;border-color:#fdba74}.table-card-visual.reserved{background:#faf5ff;border-color:#c084fc}.table-card-visual.cleaning{background:#fefce8;border-color:#fde047}.table-card-visual.blocked{opacity:.8;background:#fef2f2;border-color:#fca5a5}.keypad{grid-template-columns:repeat(3,1fr);gap:10px;display:grid}.keypad button{background:#f1f5f9;border-radius:12px;padding:16px 0;font-size:20px;font-weight:700;transition:background .15s}.keypad button:hover{background:#e2e8f0}.toast{background:var(--ink);color:#fff;z-index:200;box-shadow:var(--shadow);border-radius:999px;padding:12px 22px;font-size:14px;font-weight:600;animation:.2s toastIn;position:fixed;bottom:24px;left:50%;transform:translate(-50%)}@keyframes toastIn{0%{opacity:0;transform:translate(-50%,10px)}}.scroll-x{scrollbar-width:none;gap:8px;display:flex;overflow-x:auto}.scroll-x::-webkit-scrollbar{display:none}.pulse{animation:1.6s ease-in-out infinite pulse}@keyframes pulse{50%{opacity:.45}}
