*{box-sizing:border-box}
html,body{margin:0;height:100%}
body{font:13px/1.4 "Open Sans","Segoe UI",Arial,sans-serif;color:#555;background:#f2f2f2}
a{color:#2a8fe8;text-decoration:none}a:hover{text-decoration:underline}
.topbar{position:fixed;top:0;left:0;right:0;height:38px;background:#3cb878;display:flex;align-items:center;gap:8px;padding:0 10px;z-index:20;color:#fff}
.brand{font-weight:700;font-size:15px;letter-spacing:.3px;width:120px}
.burger{background:none;border:0;color:#fff;font-size:20px;cursor:pointer;padding:0 8px}
.spacer{flex:1}
.who{display:flex;align-items:center;gap:8px}
.who .whoname{color:#fff;font-weight:600}.who small{opacity:.85;font-weight:400;margin-left:4px}
.avatar{width:26px;height:26px;border-radius:50%;background:#fff;color:#3cb878;display:inline-flex;align-items:center;justify-content:center;font-weight:700}
.linkbtn{background:none;border:0;color:#fff;cursor:pointer;opacity:.9;text-decoration:underline;font:inherit}
.side{position:fixed;top:38px;left:0;bottom:0;width:98px;background:#fff;border-right:1px solid #e3e3e3;overflow:auto;z-index:10}
.side a{display:flex;flex-direction:column;align-items:center;gap:3px;padding:14px 4px;color:#555;font-size:12px;text-align:center;border-left:3px solid transparent}
.side a:hover{background:#f7f7f7;text-decoration:none}
.side a.on{background:#eee;color:#222;border-left-color:#3cb878}
.side svg{color:#333}
body.collapsed .side{display:none}body.collapsed .content{margin-left:0}
.content{margin:38px 0 0 98px;padding:12px 14px 40px}
.plain{max-width:380px;margin:80px auto;padding:0 14px}
.card{background:#fff;border:1px solid #e8e8e8;border-radius:2px;padding:14px;margin-bottom:12px;box-shadow:0 1px 1px rgba(0,0,0,.03)}
.card h2,.card h3{margin:0 0 10px;font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:#444}
.pagehead{display:flex;align-items:center;gap:10px;margin:2px 0 10px}
.pagehead h1{font-size:12px;text-transform:uppercase;letter-spacing:.5px;margin:0;color:#444;font-weight:700}
.btn,button.btn{display:inline-block;border:0;border-radius:3px;padding:6px 12px;font:inherit;font-size:12px;cursor:pointer;color:#fff;background:#3cb878;line-height:1.3}
.btn:hover{text-decoration:none;filter:brightness(.95)}
.btn.blue{background:#2a8fe8}.btn.red{background:#f0585a}.btn.gray{background:#8d99a3}.btn.light{background:#fff;color:#555;border:1px solid #ccc}
.btn.sm{padding:3px 8px;font-size:11px}
input[type=text],input[type=password],input[type=number],input[type=date],input[type=email],input[type=search],select,textarea{width:100%;border:1px solid #ccc;background:#fff;border-radius:2px;padding:6px 8px;font:inherit;color:#444;min-height:30px}
textarea{min-height:60px}
input:focus,select:focus,textarea:focus{outline:0;border-color:#3cb878}
label{display:block;font-size:11.5px;font-weight:700;margin:10px 0 3px;color:#444}
.filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}
.filters>*{flex:0 1 auto}
.filters input,.filters select{width:auto;min-width:150px}
.filters input[type=text]{min-width:260px}
.filters input[type=checkbox]{min-width:0}
.filters .ac{min-width:210px}.filters .ac input{width:100%}
table.t{width:100%;border-collapse:collapse;background:#fff;font-size:12px}
table.t th{text-align:left;padding:8px 6px;border-bottom:2px solid #ddd;color:#444;white-space:nowrap;font-weight:700;background:#fff}
table.t th a{color:#444}
table.t td{padding:7px 5px;border-bottom:1px solid #eee;vertical-align:top}
table.t tr:hover td{background:#fafcfb}
table.t td.r,table.t th.r{text-align:right;white-space:nowrap}
.wrap{overflow-x:auto}
.badge{display:inline-block;padding:2px 7px;border-radius:2px;color:#fff;font-size:11px;font-weight:600;white-space:nowrap}
.b-unpaid{background:#f0585a}.b-partial{background:#e8892b}.b-paid{background:#2cbe6a}.b-cancelled{background:#9aa5ad}
.b-not_shipped{background:#34495e}.b-shipped{background:#2a8fe8}
.muted{color:#999}.small{font-size:11px}
.pos{color:#1e9a52;font-weight:600}.neg{color:#d9363e;font-weight:600}
.flash{padding:9px 12px;margin-bottom:10px;border-radius:2px;border:1px solid}
.flash.error{background:#fdecec;border-color:#f3b4b5;color:#a12327}
.flash.ok{background:#e8f7ee;border-color:#a9dfc0;color:#17693a}
.pager{display:flex;gap:14px;align-items:center;justify-content:center;padding:10px;color:#777}
.tabs{display:flex;border-bottom:1px solid #ddd;margin-bottom:12px}
.tabs a{padding:8px 18px;color:#666;border-bottom:2px solid transparent}
.tabs a.on{color:#3cb878;border-bottom-color:#3cb878;font-weight:600}
.cols{display:grid;grid-template-columns:300px minmax(0,1fr);gap:12px;align-items:start}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.kv{display:grid;grid-template-columns:150px 1fr;gap:6px 10px;font-size:12.5px}
.kv dt{color:#888}.kv dd{margin:0}
.stat{display:flex;gap:12px;align-items:center}
.stat .ring{width:42px;height:42px;border-radius:50%;background:#2a8fe8;color:#fff;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700}
.row{display:flex;gap:8px;align-items:flex-end;flex-wrap:wrap}
.row>div{flex:1;min-width:110px}
.row>.fix{flex:0 0 auto;min-width:0}
.ac{position:relative}
.ac-list{position:absolute;left:0;right:0;top:100%;background:#fff;border:1px solid #bbb;z-index:30;max-height:300px;overflow:auto;box-shadow:0 4px 10px rgba(0,0,0,.12)}
.ac-list div{padding:6px 9px;cursor:pointer;border-bottom:1px solid #f0f0f0}
.ac-list div:hover,.ac-list div.act{background:#eaf7f0}
.ac-list small{display:block;color:#888}
.totals{margin-left:auto;width:340px;font-size:13px}
.totals td{padding:5px 8px;border-bottom:1px solid #eee}
.totals tr.big td{font-weight:700;font-size:14px}
.yellow{background:#fdf6df;border:1px solid #f1e2ac;padding:10px;border-radius:2px}
.bar{height:14px;background:#3cb878;border-radius:2px;min-width:2px}
.bar.m{background:#2a8fe8}
.kpi{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.kpi .card{flex:1;min-width:170px;margin:0}
.kpi b{display:block;font-size:20px;color:#222;margin-top:3px}
.inl{display:inline}.inl form{display:inline}
.rowform input{padding:3px 5px;min-height:26px;font-size:12px}
pre.log{background:#fafafa;border:1px solid #eee;padding:8px;max-height:320px;overflow:auto;font-size:11.5px;white-space:pre-wrap}
.login{background:#fff;padding:24px;border:1px solid #e5e5e5;border-radius:3px}
.login h1{text-align:center;color:#3cb878;margin:0 0 6px;font-size:20px}
@media(max-width:900px){.cols{grid-template-columns:minmax(0,1fr)}.content{margin-left:0}.side{display:none}body:not(.collapsed) .side{display:none}.grid2{grid-template-columns:1fr}.topbar .btn{display:none}}
@media print{.topbar,.side,.btn,form{display:none}.content{margin:0}}