/* Whitespace POS — terminal styles. Scoped under .wpos-root / wpos- classes. */

.wpos-root { --wpos-bg:#0f1115; --wpos-panel:#171a21; --wpos-line:#232732; --wpos-ink:#e7e9ee; --wpos-mut:#8b93a3; --wpos-accent:#c8884a; --wpos-ok:#3fb950; --wpos-warn:#d6a625; --wpos-bad:#e5534b; }
.wpos-root, .wpos-root * { box-sizing:border-box; }
.wpos-root { font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif; color:var(--wpos-ink); }

/* Login */
.wpos-login { min-height:80vh; display:flex; align-items:center; justify-content:center; background:var(--wpos-bg); }
.wpos-login-card { background:var(--wpos-panel); padding:32px; border-radius:16px; width:320px; text-align:center; box-shadow:0 12px 40px rgba(0,0,0,.4); }
.wpos-login-card h1 { margin:0 0 4px; font-size:22px; letter-spacing:.3px; }
.wpos-pin { width:100%; font-size:24px; letter-spacing:8px; text-align:center; padding:12px; border-radius:10px; border:1px solid var(--wpos-line); background:#0c0e12; color:var(--wpos-ink); margin:12px 0; }
.wpos-error { color:var(--wpos-bad); font-size:13px; }

/* Buttons */
.wpos-btn { border:1px solid var(--wpos-line); background:var(--wpos-panel); color:var(--wpos-ink); padding:10px 14px; border-radius:10px; cursor:pointer; font-size:14px; }
.wpos-btn:hover { border-color:var(--wpos-accent); }
.wpos-btn-primary { background:var(--wpos-accent); border-color:var(--wpos-accent); color:#1a1207; font-weight:600; }
.wpos-btn[disabled] { opacity:.4; cursor:not-allowed; }

/* Terminal layout — fixed, no page scroll */
.wpos-terminal { height:88vh; display:flex; flex-direction:column; background:var(--wpos-bg); border-radius:14px; overflow:hidden; border:1px solid var(--wpos-line); }
.wpos-header { display:flex; align-items:center; gap:16px; padding:10px 16px; background:var(--wpos-panel); border-bottom:1px solid var(--wpos-line); }
.wpos-brand { font-weight:700; }
.wpos-user { color:var(--wpos-mut); font-size:13px; }
.wpos-sync { margin-left:auto; font-size:12px; padding:3px 10px; border-radius:20px; background:#0c0e12; text-transform:capitalize; }
.wpos-sync.wpos-ok { color:var(--wpos-ok); } .wpos-sync.wpos-warn { color:var(--wpos-warn); } .wpos-sync.wpos-bad { color:var(--wpos-bad); }

.wpos-body { flex:1; display:flex; min-height:0; }

/* Catalog */
.wpos-catalog { flex:1; display:flex; flex-direction:column; min-width:0; }
.wpos-cats { display:flex; gap:8px; padding:12px; overflow-x:auto; border-bottom:1px solid var(--wpos-line); }
.wpos-cat { white-space:nowrap; border:1px solid var(--wpos-line); background:transparent; color:var(--wpos-mut); padding:6px 14px; border-radius:20px; cursor:pointer; font-size:13px; }
.wpos-cat.active { background:var(--wpos-accent); color:#1a1207; border-color:var(--wpos-accent); }
.wpos-grid { flex:1; overflow-y:auto; padding:12px; display:grid; grid-template-columns:repeat(auto-fill,minmax(120px,1fr)); gap:10px; align-content:start; }
.wpos-product { display:flex; flex-direction:column; align-items:flex-start; gap:6px; padding:14px; background:var(--wpos-panel); border:1px solid var(--wpos-line); border-radius:12px; cursor:pointer; min-height:84px; text-align:left; }
.wpos-product:hover { border-color:var(--wpos-accent); }
.wpos-emoji { font-size:20px; }
.wpos-pname { font-size:13px; line-height:1.2; }
.wpos-pprice { margin-top:auto; color:var(--wpos-accent); font-weight:600; font-size:13px; }

/* Cart */
.wpos-cart { width:340px; background:var(--wpos-panel); border-left:1px solid var(--wpos-line); display:flex; flex-direction:column; min-height:0; }
.wpos-slots { display:flex; gap:6px; padding:10px; border-bottom:1px solid var(--wpos-line); }
.wpos-slot { flex:1; border:1px solid var(--wpos-line); background:transparent; color:var(--wpos-mut); padding:8px; border-radius:8px; cursor:pointer; font-size:12px; }
.wpos-slot.active { background:#0c0e12; color:var(--wpos-ink); border-color:var(--wpos-accent); }
.wpos-lines { flex:1; overflow-y:auto; padding:8px; }
.wpos-line { padding:10px; border-bottom:1px solid var(--wpos-line); }
.wpos-line-main { display:flex; justify-content:space-between; gap:8px; }
.wpos-line-name { font-size:14px; }
.wpos-line-price { color:var(--wpos-accent); font-size:13px; }
.wpos-line-mods, .wpos-line-note { color:var(--wpos-mut); font-size:12px; margin-top:3px; }
.wpos-line-ctl { display:flex; align-items:center; gap:6px; margin-top:8px; }
.wpos-qbtn { width:30px; height:30px; border:1px solid var(--wpos-line); background:#0c0e12; color:var(--wpos-ink); border-radius:8px; cursor:pointer; font-size:15px; }
.wpos-qbtn.wpos-rm { color:var(--wpos-bad); margin-left:auto; }
.wpos-qty { min-width:22px; text-align:center; }
.wpos-totals { padding:10px 14px; border-top:1px solid var(--wpos-line); }
.wpos-trow { display:flex; justify-content:space-between; font-size:13px; color:var(--wpos-mut); padding:3px 0; }
.wpos-trow.strong { color:var(--wpos-ink); font-size:16px; font-weight:700; padding-top:8px; }
.wpos-pay { margin:12px; }

/* Modals */
.wpos-modal-overlay { position:fixed; inset:0; background:rgba(0,0,0,.55); display:flex; align-items:center; justify-content:center; z-index:99999; }
.wpos-modal { background:var(--wpos-panel); color:var(--wpos-ink); padding:22px; border-radius:14px; width:340px; border:1px solid var(--wpos-line); }
.wpos-modal h3 { margin:0 0 12px; }
.wpos-mod-list { display:flex; flex-direction:column; gap:8px; margin-bottom:14px; }
.wpos-mod { display:flex; align-items:center; gap:8px; font-size:14px; }
.wpos-modal-actions { display:flex; gap:8px; justify-content:flex-end; flex-wrap:wrap; }
.wpos-muted { color:var(--wpos-mut); font-size:13px; }

/* Toast */
.wpos-toast { position:fixed; bottom:24px; left:50%; transform:translateX(-50%) translateY(20px); background:#0c0e12; color:var(--wpos-ink); border:1px solid var(--wpos-accent); padding:12px 18px; border-radius:10px; opacity:0; transition:all .25s; z-index:99999; }
.wpos-toast.show { opacity:1; transform:translateX(-50%) translateY(0); }

@media (max-width:760px) {
  .wpos-body { flex-direction:column; }
  .wpos-cart { width:auto; border-left:none; border-top:1px solid var(--wpos-line); max-height:46vh; }
}