:root{--bg:#ffffff;--page:#f4f5f7;--panel:#fff;--border:#dcdfe3;--text:#263238;--muted:#78909c;--primary:#3498db;--primary-dark:#2c82c0;--cyan:#00a8e8;--green:#1fa65a;--teal:#26a69a;--orange:#f7941d;--red:#e74c3c;--blue-btn:#0d8fd9;--th:#3498db;--zebra:#f1f1f1;--total:#5bc4a8;--field:#fffde7;--accent:#e53935;--ok:#1fa65a;--warn:#f7941d;--link:#1a73c8}*{box-sizing:border-box}body,html{margin:0;padding:0;height:100%}body{font-family:Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:13px;color:var(--text);background:var(--bg)}a{color:var(--link);text-decoration:none}h1{font-size:18px;margin:0}h2{font-size:15px;margin:0 0 10px}h3{font-size:13px;margin:0 0 8px}.shell{display:flex;height:100vh}.side{width:200px;background:#fff;border-right:1px solid var(--border);overflow-y:auto;flex-shrink:0;transition:margin .2s;display:flex;flex-direction:column}.side.closed{margin-left:-200px}.brand{height:56px;padding:0 14px;display:flex;align-items:center;gap:8px;font-weight:800;font-size:20px;color:var(--primary);letter-spacing:.5px;border-bottom:1px solid #eee;background:#fff}.brand b{background:var(--primary);color:#fff;border-radius:6px;padding:1px 7px;font-size:16px}.nav{flex:1 1}.nav-group>.nav-title,.nav-link{display:flex;align-items:center;gap:10px;padding:10px 14px;cursor:pointer;color:#37474f;font-size:13px;border:0;background:none;width:100%;text-align:left;border-left:3px solid transparent}.nav-link:hover,.nav-title:hover{background:#f1f6fb}.nav-title .chev{margin-left:auto;font-size:10px;color:#90a4ae;transition:transform .15s}.nav-group.open>.nav-title .chev{transform:rotate(90deg)}.nav-sub{display:none;background:#fafbfc}.nav-group.open>.nav-sub{display:block}.nav-sub .nav-link{padding-left:38px;font-size:12.5px}.nav-sub .nav-sub .nav-link{padding-left:52px}.nav-link.pin{border-left-color:var(--cyan)}.nav-link.active{background:#e8f3fc;color:var(--primary-dark);font-weight:600;border-left-color:var(--primary)}.nav-icon{width:16px;text-align:center;color:#90a4ae;font-size:13px}.side-foot{padding:10px 14px;font-size:11px;color:var(--accent);border-top:1px solid #eee}.side-foot span{display:block;color:#78909c}.main{flex:1 1;display:flex;flex-direction:column;min-width:0;background:#fff}.topbar{height:56px;background:#f6f7f9;border-bottom:1px solid #e4e6ea;display:flex;align-items:center;gap:10px;padding:0 16px;flex-shrink:0}.topbar .ham{background:none;border:0;font-size:20px;cursor:pointer;color:#546e7a}.topbar .title{font-size:18px;color:#37474f;border-right:1px solid #ddd;padding-right:14px}.topbar .spacer{flex:1 1}.ticon{width:30px;height:30px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;background:none;border:0;cursor:pointer;color:#4aa3df;font-size:18px;text-decoration:none}.ticon:hover{background:#e6eef6}.ticon.red{color:var(--red)}.ticon.user{background:#e1f1fb;border-radius:50%;color:#1f7fc0}.content{flex:1 1;overflow:auto;padding:0;background:#fff}.content.padded{padding:4px 10px 24px}.page{padding:0 8px 70px}.pad{padding:14px 16px 70px}.tabbar{display:flex;background:#eceff1;padding-right:10px;gap:2px;flex-wrap:nowrap}.tab,.tabbar{align-items:center;height:38px}.tab{padding:0 14px;display:inline-flex;cursor:pointer;background:transparent;border:0;border-top:3px solid transparent;font-size:13.5px;color:#37474f;font-family:inherit}.tab.on{background:#fff;border-top-color:#d32f2f}.tabbar .grow{flex:1 1}.tbtn{border:0;color:#fff;padding:6px 14px;font-size:13px;font-weight:600;cursor:pointer;display:inline-flex;align-items:center;gap:6px;font-family:inherit}.tbtn.new{background:var(--green);border-radius:18px}.tbtn.edit{background:var(--orange);border-radius:6px}.tbtn:disabled{opacity:.5;cursor:not-allowed}.circle{width:28px;height:28px;border-radius:50%;border:0;background:#1ea5e4;color:#fff;cursor:pointer;font-size:14px;display:inline-flex;align-items:center;justify-content:center}.circle.dark{color:#222}.circle.dark,.learn{background:#fff;border:1px solid #333}.learn{border-radius:18px;padding:4px 12px;font-weight:700}.learn,.sublink{cursor:pointer;font-family:inherit}.sublink{display:inline-block;margin:10px 4px 8px 8px;color:var(--link);font-size:13px;background:none;border:0}.filters{display:flex;gap:12px;flex-wrap:wrap;padding:4px 8px 12px;align-items:flex-end}.listbox{margin:6px 8px 0}.listhead{background:#eeeeee;border:1px solid #ddd;border-bottom:0;padding:6px 8px;display:flex;align-items:center;gap:8px}.listhead b{font-size:12.5px;flex:1 1}.xbtn{background:var(--green);color:#fff;border:0;padding:3px 9px;font-size:11.5px;cursor:pointer;border-radius:2px;font-family:inherit}.xbtn.apply{background:var(--orange);padding:5px 12px}.tbl-wrap{overflow:auto;max-height:calc(100vh - 260px);background:#fff;border:1px solid #ddd}table.tbl{width:100%;border-collapse:collapse;background:#fff}.tbl th{text-align:left;font-size:13px;font-weight:500;color:#fff;padding:8px;background:var(--th);white-space:nowrap;position:-webkit-sticky;position:sticky;top:0;border-right:1px solid #5aa9e0}.tbl td{padding:6px 8px;border:1px solid #e3e3e3;vertical-align:middle}.tbl tbody tr:nth-child(odd) td{background:var(--zebra)}.tbl tbody tr:nth-child(2n) td{background:#fff}.tbl tbody tr:hover td{background:#e3f2fd}.tbl tbody tr.sel td{background:#bbdefb!important}.tbl tr.total td{background:var(--total)!important;color:#fff;font-weight:600}.tbl .num{font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.tbl .num,.tbl th.num{text-align:right}.pager{display:flex;align-items:center;gap:18px;padding:14px 20px;flex-wrap:wrap}.pager input,.pager select{width:46px;border:1px solid #ccc;border-radius:3px;padding:4px;text-align:center;font-family:inherit}.pager .info{color:var(--accent);font-size:12px}.pages{margin-left:auto;display:inline-flex;border:1px solid #ccc;border-radius:4px;overflow:hidden}.pages button{border:0;border-right:1px solid #ccc;background:#fff;padding:7px 12px;cursor:pointer;color:#1a73c8;font-family:inherit}.pages button:last-child{border-right:0}.pages button.on{background:#1a73e8;color:#fff}.pages button:disabled{color:#aaa;background:#f3f3f3;cursor:default}.formtitle{color:var(--green);font-size:14px;padding:10px 8px 8px;font-weight:600}.fgrid{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:16px 14px;gap:16px 14px;padding:8px}.fgrid.c2{grid-template-columns:repeat(2,1fr)}.fgrid .span2{grid-column:span 2}.fgrid .span3{grid-column:1/-1}.fl{position:relative}.fl>label{position:absolute;top:-8px;left:10px;background:linear-gradient(#fff 0 50%,transparent 50%);padding:0 3px;font-size:11.5px;color:var(--cyan);z-index:1}.fl .input{background:var(--field);border:1px solid #cfd8dc;border-radius:4px;padding:9px 10px}.fl select.input{background:#fff}.fl .input:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 1px var(--primary)}.actionbar{position:fixed;bottom:0;right:0;left:200px;padding:10px 24px;display:flex;gap:10px;justify-content:flex-end;background:#fff;border-top:1px solid #eee;z-index:20}.side.closed~.main .actionbar{left:0}.abtn{border:0;color:#fff;padding:8px 18px;border-radius:4px;font-weight:600;font-size:12.5px;cursor:pointer;text-transform:uppercase;font-family:inherit;box-shadow:0 2px 3px rgba(0,0,0,.2)}.abtn.cancel{background:#3b86e8}.abtn.save{background:var(--teal)}.abtn.del,.abtn.upd{background:#9e9e9e}.abtn.upd.on{background:var(--orange)}.abtn.del.on{background:var(--red)}.abtn:disabled{opacity:.55;cursor:not-allowed}.card{background:var(--panel);border:1px solid var(--border);border-radius:6px;padding:14px}.card+.card{margin-top:14px}.page-head{display:flex;align-items:center;gap:10px;margin:0;padding:10px 8px;flex-wrap:wrap;background:#fff}.page-head .grow{flex:1 1}.btn{background:var(--green);color:#fff;border:0;border-radius:4px;padding:7px 14px;font-size:13px;cursor:pointer;font-weight:600;display:inline-flex;align-items:center;gap:6px;font-family:inherit;text-decoration:none}.btn:hover{filter:brightness(.93)}.btn:disabled{opacity:.55;cursor:not-allowed}.btn.sec{background:#fff;color:var(--text);border:1px solid #bbb}.btn.sec:hover{background:#f4f6fa;filter:none}.btn.danger{background:var(--red)}.btn.ok{background:var(--green)}.btn.warn{background:var(--orange)}.btn.blue{background:var(--blue-btn)}.btn.sm{padding:3px 9px;font-size:12px}.input,select.input,textarea.input{border:1px solid #cfd8dc;border-radius:4px;padding:8px 10px;font-size:13px;width:100%;background:#fff;color:var(--text);font-family:inherit}.input:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 1px var(--primary)}.input[readonly]{background:#f3f5f7}label.lbl{display:block;font-size:12px;color:var(--cyan);margin-bottom:4px}.grid{display:grid;grid-gap:12px;gap:12px}.grid.c2{grid-template-columns:repeat(2,1fr)}.grid.c3{grid-template-columns:repeat(3,1fr)}.grid.c4{grid-template-columns:repeat(4,1fr)}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.badge{display:inline-block;padding:2px 8px;border-radius:99px;font-size:11.5px;font-weight:600;background:#e3f2fd;color:#1976d2}.badge.ok{background:#dcf5e8;color:var(--ok)}.badge.warn{background:#fdeccd;color:#c46b00}.badge.bad{background:#fde0e1;color:var(--accent)}.badge.gray{background:#eceff4;color:var(--muted)}.modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:50;padding:16px}.modal{background:#fff;border-radius:4px;width:100%;max-width:560px;max-height:92vh;overflow:auto;padding:0;box-shadow:0 8px 30px rgba(0,0,0,.35)}.modal.wide{max-width:820px}.modal-head{display:flex;align-items:center;background:#424f58;color:#fff;padding:14px 16px}.modal-head h2{margin:0;flex:1 1;font-size:16px}.modal-body{padding:16px}.x{background:none;border:0;font-size:22px;cursor:pointer}.toast,.x{color:#fff}.toast{position:fixed;bottom:70px;right:20px;background:#263238;padding:11px 16px;border-radius:6px;z-index:99;box-shadow:0 6px 20px rgba(0,0,0,.25);max-width:380px}.toast.err{background:var(--red)}.err-text{color:var(--accent);margin:8px}.muted{color:var(--muted)}.tiles{display:flex;flex-wrap:wrap;gap:16px;padding:14px 14px 4px}.tile{width:136px;height:100px;background:#fff;border:1px solid #e6e9ed;border-radius:6px;box-shadow:0 1px 3px rgba(0,0,0,.12);text-align:center;color:#37474f;font-size:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;transition:.15s}.tile:hover{box-shadow:0 4px 12px rgba(52,152,219,.3);transform:translateY(-2px)}.tile .ic{font-size:26px;color:#0aa0d8;line-height:1}.kpis{display:flex;flex-wrap:wrap;gap:14px;padding:14px}.kpi{width:160px;background:#fff;border:1px solid #e6e9ed;border-top:3px solid var(--k,#3498db);border-radius:4px;padding:12px 8px;text-align:center;box-shadow:0 1px 3px rgba(0,0,0,.1)}.kpi .ico{font-size:22px;color:var(--k,#3498db)}.kpi b{display:block;font-size:17px;margin:6px 0 2px;color:#263238}.kpi span{color:#546e7a;font-size:11.5px}.chartrow{display:grid;grid-template-columns:1fr 1fr;grid-gap:14px;gap:14px;padding:0 14px 14px}.chartcard{border:1px solid #e6e9ed;border-radius:4px;padding:12px;box-shadow:0 1px 3px rgba(0,0,0,.08)}.chartcard h3{text-align:center;color:#546e7a;font-weight:500;margin:0 0 10px}.donutwrap{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap}.legend{font-size:11.5px}.legend div{display:flex;align-items:center;gap:6px;margin:3px 0}.legend i{width:10px;height:10px;display:inline-block}.cols{display:grid;grid-template-columns:1fr 1fr;grid-gap:14px;gap:14px}@media (max-width:900px){.chartrow,.cols,.fgrid,.grid.c3,.grid.c4{grid-template-columns:1fr}.side{position:fixed;z-index:40;height:100%}}.login-wrap{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#e8f3fc,#fff)}.login{background:#fff;border-radius:8px;padding:34px;width:360px;border:1px solid #dde6ee;box-shadow:0 10px 40px rgba(52,152,219,.2)}.login h1{text-align:center;margin-bottom:4px;color:var(--primary)}.login p{text-align:center;color:var(--muted);margin:0 0 20px}.posroot{position:fixed;inset:0;z-index:30;flex-direction:column}.posroot,.postop{background:#fff;display:flex}.postop{height:50px;gap:10px;padding:0 12px;flex-shrink:0}.modepill,.postop{align-items:center}.modepill{background:var(--cyan);color:#fff;border:0;border-radius:22px;padding:0 22px;height:38px;font-size:15px;font-weight:600;cursor:pointer;display:inline-flex;gap:12px;min-width:170px;justify-content:center;position:relative;font-family:inherit}.modemenu{position:absolute;top:44px;left:0;background:#fff;color:#333;border-radius:6px;box-shadow:0 4px 16px rgba(0,0,0,.25);padding:6px 0;min-width:160px;text-align:left;z-index:5;font-weight:400}.modemenu div{padding:7px 14px;cursor:pointer;font-size:13px}.modemenu div:hover{background:#e8f3fc}.postop .input{height:34px;border-radius:18px;padding:0 12px;border-color:#4aa3df}.postop .sel{width:160px}.posbody{flex:1 1;display:grid;grid-template-columns:1fr 620px;min-height:0}.posleft{display:flex;flex-direction:column;min-height:0;padding:4px;gap:6px}.deptbar{border:1px solid #ddd;border-radius:6px;padding:8px;align-items:flex-start;min-height:130px;flex-shrink:0;box-shadow:0 1px 3px rgba(0,0,0,.1)}.deptbar,.deptbtns{display:flex;gap:8px}.deptbtns{flex-direction:column}.homebtn{background:#e57397;border:2px solid #5aa9e0;border-radius:4px;padding:10px 18px;font-size:14px;display:flex;gap:10px;font-family:inherit}.custbtn,.homebtn{color:#fff;cursor:pointer}.custbtn{background:var(--cyan);border:0;border-radius:4px;padding:10px;font-size:15px}.depts{display:flex;flex-wrap:wrap;gap:8px;align-content:flex-start;padding-left:14px}.dept{padding:10px 12px;border-radius:4px;cursor:pointer;font-size:13px;border:0;font-family:inherit;color:#263238}.dept.on{outline:2px solid #333}.posmain{flex:1 1;display:grid;grid-template-columns:132px 1fr;border:1px solid #ddd;border-radius:6px;min-height:0;box-shadow:0 1px 3px rgba(0,0,0,.1)}.actcol{padding:8px 6px;display:flex;flex-direction:column;gap:8px;border-right:1px solid #e3e3e3;overflow:auto}.act{border:0;color:#fff;padding:10px 6px;border-radius:3px;font-size:13px;cursor:pointer;text-align:center;font-family:inherit;box-shadow:0 1px 2px rgba(0,0,0,.2)}.act.g{background:#2fa860}.act.b{background:#0f8fd8}.act.t{background:#2fb58d}.act.r{background:#e74c3c}.act:disabled{opacity:.5;cursor:not-allowed}.tilearea{padding:8px;overflow:auto;display:grid;grid-template-columns:repeat(auto-fill,minmax(145px,1fr));grid-gap:8px;gap:8px;align-content:start}.itile{border:1px solid #ddd;border-top:8px solid #1b95db;border-radius:4px;height:86px;display:flex;align-items:center;justify-content:center;text-align:center;padding:6px;cursor:pointer;background:#fff;font-size:12.5px;box-shadow:0 1px 2px rgba(0,0,0,.1);position:relative}.itile:hover{box-shadow:0 2px 8px rgba(27,149,219,.45)}.itile.out{opacity:.5}.itile small{right:6px;color:#78909c;font-size:10.5px}.itile .pr,.itile small{position:absolute;bottom:2px}.itile .pr{left:6px;color:#1b95db;font-size:11px;font-weight:600}.tablearea{padding:10px;display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));grid-gap:10px;gap:10px;align-content:start;overflow:auto}.dtable{border-radius:8px;padding:18px 8px;text-align:center;cursor:pointer;color:#fff;background:#2fa860;font-weight:600}.dtable.busy{background:#e57373}.dtable.sel{outline:3px solid #333}.poscart{display:flex;flex-direction:column;border-left:1px solid #ddd;min-height:0}.cartgrid{flex:1 1;overflow:auto;background:#fff}.cartgrid table{width:100%;border-collapse:collapse}.cartgrid th{background:var(--th);color:#fff;padding:7px;font-weight:500;text-align:left;font-size:12.5px;position:-webkit-sticky;position:sticky;top:0}.cartgrid td{padding:6px 7px;border-bottom:1px solid #eee}.cartgrid tr.cur td{background:#e3f2fd}.cartgrid .qty input{width:52px;border:1px solid #ccc;border-radius:3px;padding:3px;text-align:center}.cartfoot{border-top:1px solid #ddd;background:#f4f5f7;padding:8px 12px}.cartfoot .line{display:flex;justify-content:space-between;margin:3px 0;color:#455a64}.nettotal{padding:6px 12px 0}.nettotal b{color:var(--accent);font-size:14px;display:block}.nettotal .amt{text-align:right;color:var(--cyan);font-size:34px;font-weight:700;line-height:1.1}.cartlinks{display:flex;gap:14px;padding:4px 12px 10px}.cartlinks button{background:none;border:0;color:var(--cyan);cursor:pointer;font-size:12px;font-family:inherit}.seg{display:flex;gap:6px;flex-wrap:wrap}.seg button{flex:1 1;min-width:70px;padding:8px;border:1px solid #cfd8dc;border-radius:4px;background:#fff;cursor:pointer;font-size:13px;font-family:inherit;text-transform:capitalize}.seg button.on{background:var(--cyan);color:#fff;border-color:var(--cyan)}.receipt{font-family:Courier New,monospace;font-size:12.5px;width:300px;margin:0 auto;color:#000}.receipt hr{border:0;border-top:1px dashed #000}.receipt .c{text-align:center}.receipt .r{display:flex;justify-content:space-between}@media print{body *{visibility:hidden}.print-area,.print-area *{visibility:visible}.print-area{position:absolute;left:0;top:0}}