:root{--navy:#0b263b;--navy2:#103852;--blue:#158bb8;--cyan:#31add2;--bg:#f3f6f8;--surface:#fff;--border:#dfe7ec;--text:#172631;--muted:#6d7d88;--success:#24835d;--warning:#d1922e;--danger:#c94747;--shadow:0 8px 28px rgba(17,38,53,.06);--radius:14px}*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:var(--bg)}button,input,select,textarea{font:inherit}a{color:var(--blue);text-decoration:none}.app-shell{display:flex;min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:238px;background:linear-gradient(180deg,var(--navy),#0a2031);color:#fff;padding:22px 14px;display:flex;flex-direction:column;z-index:50}.brand{display:flex;align-items:center;gap:11px;padding:2px 10px 24px}.brand strong{display:block;font-size:21px;letter-spacing:.2px}.brand small{display:block;color:#a9c3d2;font-size:11px;letter-spacing:1.3px;text-transform:uppercase}.brand-mark{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:linear-gradient(135deg,var(--cyan),var(--blue));font-weight:800;color:#fff;box-shadow:0 8px 18px rgba(49,173,210,.2)}.brand-mark.big{width:54px;height:54px;border-radius:16px;font-size:27px;margin:auto}.sidebar nav{display:flex;flex-direction:column;gap:3px}.nav-link{color:#c9d7df;padding:10px 12px;border-radius:9px;font-size:14px;font-weight:600}.nav-link:hover{background:rgba(255,255,255,.07);color:#fff}.nav-sep{height:1px;background:rgba(255,255,255,.08);margin:8px 8px}.sidebar-footer{margin-top:auto;padding:12px 10px;color:#8099a8;display:flex;flex-direction:column;gap:3px;font-size:12px}.main{margin-left:238px;min-width:0;width:calc(100% - 238px)}.topbar{height:76px;padding:0 28px;background:rgba(255,255,255,.92);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:30;backdrop-filter:blur(12px)}.topbar h1{font-size:20px;margin:0 0 2px}.topbar small{color:var(--muted)}.topbar-user{display:flex;align-items:center;gap:14px;font-size:13px}.content{padding:24px 28px 48px;max-width:1500px;margin:auto}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:18px}.metric-grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.metric,.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}.metric{padding:20px}.metric span{display:block;color:var(--muted);font-size:13px}.metric strong{display:block;font-size:24px;margin:8px 0 3px}.metric small{color:#9aa8b1}.panel{padding:20px;margin-bottom:18px}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:17px}.panel-head h2{font-size:16px;margin:0}.panel-head p{font-size:12px;color:var(--muted);margin:4px 0 0}.grid-2{display:grid;grid-template-columns:minmax(0,2fr) minmax(300px,1fr);gap:18px}.align-start{align-items:start}.bars{height:220px;display:flex;align-items:flex-end;gap:11px;padding-top:10px}.bar-item{flex:1;height:100%;display:grid;grid-template-rows:1fr auto auto;gap:5px;text-align:center;min-width:0}.bar-track{height:100%;display:flex;align-items:flex-end;justify-content:center}.bar-fill{width:min(34px,80%);min-height:4px;background:linear-gradient(180deg,var(--cyan),var(--blue));border-radius:7px 7px 2px 2px}.bar-item small{color:var(--muted);font-size:10px}.bar-item b{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stock-warning{height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:8px}.stock-warning strong{font-size:48px;color:var(--warning)}.stock-warning span{color:var(--muted);margin-bottom:10px}.btn{border:0;border-radius:9px;padding:10px 14px;display:inline-flex;align-items:center;justify-content:center;gap:7px;font-weight:700;font-size:13px;cursor:pointer;transition:.15s}.btn:hover{transform:translateY(-1px)}.btn-primary{background:var(--blue);color:#fff}.btn-secondary{background:#eaf4f8;color:#116c8d}.btn-danger{background:#f9eaea;color:var(--danger)}.btn-ghost{background:transparent;color:var(--muted);border:1px solid var(--border)}.btn-sm{padding:7px 10px;font-size:12px}.btn-lg{padding:14px}.btn-block{width:100%}.toolbar{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:18px}.search-form,.filter-form{display:flex;gap:8px;align-items:end}.search-form input{width:min(520px,60vw)}label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:#53636e;font-weight:650}input,select,textarea{width:100%;border:1px solid #ccd9e0;border-radius:9px;background:#fff;color:var(--text);padding:10px 11px;outline:none;transition:.15s}input:focus,select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px rgba(21,139,184,.11)}.form-stack{display:flex;flex-direction:column;gap:14px}.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.span-2{grid-column:span 2}.form-page{display:flex;flex-direction:column}.actions{display:flex;justify-content:flex-end;gap:9px}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:13px}th{text-align:left;padding:10px;border-bottom:1px solid var(--border);color:#74838d;font-size:11px;text-transform:uppercase;letter-spacing:.45px;white-space:nowrap}td{padding:12px 10px;border-bottom:1px solid #edf1f3;vertical-align:middle}tbody tr:last-child td{border-bottom:0}.right{text-align:right}.empty{text-align:center!important;color:var(--muted);padding:30px!important}.cell-sub{display:block;color:#99a6ae;margin-top:3px}.badge{display:inline-flex;background:#edf4f7;color:#42606f;padding:4px 8px;border-radius:999px;font-size:11px;font-weight:700}.row-warning{background:#fffaf1}.inline-adjust{display:flex;gap:6px;min-width:330px}.inline-adjust input[type=number]{width:70px}.alert{border-radius:10px;padding:12px 14px;margin-bottom:16px;font-size:13px}.alert-success{background:#e9f6ef;color:#1b6b49}.alert-error{background:#faeded;color:#963737}.guest-body{background:radial-gradient(circle at 70% 20%,#164868 0,#0b263b 45%,#071a28 100%);display:grid;place-items:center;min-height:100vh;padding:22px}.guest-wrap{width:min(420px,100%)}.login-card{background:#fff;padding:34px;border-radius:20px;box-shadow:0 26px 70px rgba(0,0,0,.24)}.login-brand{text-align:center;margin-bottom:26px}.login-brand h1{margin:14px 0 4px;font-size:24px}.login-brand p{margin:0;color:var(--muted)}.empty-state{text-align:center;padding:50px 20px}.empty-state h2{margin:8px 0}.empty-state p{color:var(--muted)}.empty-icon{width:62px;height:62px;margin:auto;background:#eaf4f8;color:var(--blue);border-radius:18px;display:grid;place-items:center;font-size:26px;font-weight:800}.open-cash-form{display:flex;max-width:380px;margin:20px auto 0;gap:10px;align-items:end}.open-cash-form label{flex:1}.mini-list{display:flex;flex-direction:column}.mini-list>div{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid #edf1f3}.mini-list small{display:block;color:var(--muted)}.positive{color:var(--success)}.negative{color:var(--danger)}.mb{margin-bottom:14px}.narrow{max-width:720px}.sale-head{display:flex;justify-content:space-between;align-items:center}.sale-head span,.sale-total span{color:var(--muted);font-size:12px}.sale-head h2{margin:4px 0}.sale-head p{margin:4px 0;color:var(--muted)}.sale-total{text-align:right}.sale-total strong{display:block;font-size:28px;margin-top:4px}.pos-shell{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(360px,.8fr);gap:18px;align-items:start}.pos-catalog,.pos-cart{margin:0}.pos-search input{font-size:16px;padding:14px}.pos-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}.product-result{border:1px solid var(--border);border-radius:11px;padding:13px;display:flex;justify-content:space-between;gap:10px;cursor:pointer;background:#fff}.product-result:hover{border-color:#9bcfe2;background:#f8fcfe}.product-result strong{font-size:14px}.product-result small{display:block;color:var(--muted);margin-top:4px}.product-result b{white-space:nowrap;color:var(--blue)}.cart-items{max-height:340px;overflow:auto}.cart-line{display:grid;grid-template-columns:1fr auto;gap:10px;padding:11px 0;border-bottom:1px solid #edf1f3}.cart-line small{display:block;color:var(--muted)}.qty-controls{display:flex;align-items:center;gap:7px}.qty-controls button{width:28px;height:28px;border:1px solid var(--border);background:#fff;border-radius:7px;cursor:pointer}.cart-summary{border-top:1px solid var(--border);padding-top:12px;margin-top:8px}.cart-summary>div{display:flex;justify-content:space-between;padding:5px 0}.cart-summary label{margin:7px 0}.cart-total{font-size:17px;border-top:1px dashed var(--border);margin-top:8px;padding-top:12px!important}.cart-total strong{font-size:22px;color:var(--navy)}.payment-row{display:grid;grid-template-columns:1fr 1fr auto;gap:7px;margin:10px 0}.payment-list>div{display:flex;justify-content:space-between;padding:7px 0;font-size:12px}.mobile-only{display:none}.icon-btn{border:0;background:transparent;font-size:22px}.sidebar-backdrop{display:none}
@media(max-width:1050px){.metric-grid{grid-template-columns:repeat(2,1fr)}.grid-2{grid-template-columns:1fr}.pos-shell{grid-template-columns:1fr}.pos-cart{position:static}.pos-results{grid-template-columns:repeat(3,1fr)}}
@media(max-width:820px){.mobile-only{display:inline-flex}.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.open{transform:translateX(0)}.sidebar-backdrop.open{display:block;position:fixed;inset:0;background:rgba(0,0,0,.35);z-index:40}.main{margin-left:0;width:100%}.topbar{height:68px;padding:0 16px;justify-content:flex-start;gap:10px}.topbar-user{margin-left:auto}.topbar-user>span{display:none}.content{padding:16px}.pos-results{grid-template-columns:repeat(2,1fr)}}
@media(max-width:600px){.metric-grid,.metric-grid-3{grid-template-columns:1fr 1fr;gap:10px}.metric{padding:15px}.metric strong{font-size:19px}.panel{padding:14px;border-radius:12px}.toolbar{align-items:stretch;flex-direction:column}.search-form,.filter-form{width:100%;flex-wrap:wrap}.search-form input{width:100%;flex:1}.form-grid{grid-template-columns:1fr}.span-2{grid-column:span 1}.topbar h1{font-size:17px}.content{padding:12px}.pos-results{grid-template-columns:1fr}.payment-row{grid-template-columns:1fr 1fr}.payment-row button{grid-column:span 2}.sale-head{align-items:flex-start}.sale-total strong{font-size:21px}.open-cash-form{flex-direction:column;align-items:stretch}.inline-adjust{min-width:300px}}
