:root{
  --bg:#eef2f6;
  --page:#eef2f6;
  --card:#ffffff;
  --card2:#f8fbff;
  --header:#1267af;
  --header2:#0f5e9f;
  --side:#ffffff;
  --side2:#f7f9fc;
  --line:#d5e0ec;
  --line2:#abc2dc;
  --text:#1e2b3a;
  --muted:#64748b;
  --blue:#1267af;
  --blue2:#e8f3ff;
  --green:#15a05a;
  --green2:#e9fbf1;
  --red:#dc3545;
  --red2:#fff0f2;
  --amber:#f59e0b;
  --amber2:#fff7e6;
  --purple:#7357d9;
  --purple2:#f3f0ff;
  --shadow:0 3px 10px rgba(16,24,40,.06);
}
*{box-sizing:border-box}
html,body{
  margin:0;padding:0;min-height:100%;background:var(--page);color:var(--text);
  font-family:Inter,system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  font-size:13px;font-weight:400;font-variant-numeric:tabular-nums;-webkit-font-smoothing:antialiased;
}
body{zoom:100%}
a{color:var(--blue);text-decoration:none}a:hover{text-decoration:none;color:#0b4f8d}
button,input,select,textarea{font-family:inherit;font-weight:400}button{cursor:pointer}
b,strong,h1,h2,h3,h4,h5,h6,label,th,.card-title,.brand-title,.admin-name,.nav-item,.btnx,.top-link,.badge,.pill{font-weight:500!important}
input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{appearance:none;-webkit-appearance:none;margin:0}
input[type=number]{appearance:textfield;-moz-appearance:textfield}
select{appearance:none;-webkit-appearance:none;-moz-appearance:none;background-image:linear-gradient(45deg,transparent 50%,#60758f 50%),linear-gradient(135deg,#60758f 50%,transparent 50%)!important;background-position:calc(100% - 15px) 50%,calc(100% - 10px) 50%!important;background-size:5px 5px,5px 5px!important;background-repeat:no-repeat!important;padding-right:28px!important}
.app{min-height:100vh;display:flex}.menu-backdrop{display:none}.main{margin-left:220px;width:calc(100% - 220px);min-width:0}
/* single light admin side panel */
.side-menu{width:220px;background:var(--side);border-right:1px solid var(--line);position:fixed;inset:0 auto 0 0;z-index:60;display:flex;flex-direction:column;box-shadow:2px 0 10px rgba(16,24,40,.05);overflow-y:auto;overflow-x:hidden;padding:0}
.brand-box{height:56px;display:flex;align-items:center;gap:8px;padding:0 10px;border-bottom:1px solid var(--line);background:linear-gradient(180deg,#ffffff,#f4f8fc)}
.brand-icon{width:32px;height:32px;border-radius:8px;background:linear-gradient(135deg,#1267af,#4196db);display:grid;place-items:center;color:#fff;font-size:17px;flex:none}
.brand-title{font-size:15px;color:#102033;white-space:nowrap;overflow:hidden;letter-spacing:-.1px}.brand-sub{font-size:9.5px;color:#667085;margin-top:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mobile-menu-close{position:absolute;right:8px;top:10px;width:30px;height:30px;border:1px solid var(--line);border-radius:6px;background:#fff;color:#26384d;display:none;place-items:center;z-index:5}
.admin-mini{margin:8px;display:flex;align-items:center;gap:7px;padding:6px;border:1px solid var(--line);border-radius:8px;background:#f8fbff}
.admin-mini img{width:29px;height:29px;border-radius:50%;object-fit:cover;border:1px solid #c7ddf5}.admin-name{font-size:12.5px;color:#172334}.admin-status{font-size:10.5px;color:var(--green);margin-top:0}
.nav-list{padding:0 8px 10px;display:grid;gap:4px;overflow-x:hidden}.nav-item{display:flex;align-items:center;gap:8px;padding:7px 8px;border:1px solid #dbe6f2;border-radius:6px;background:#fff;color:#26384d;min-height:34px;font-size:12.8px;min-width:0;transition:.12s ease}
.nav-item:hover{background:#eef6ff;border-color:#b8d4f2;color:#0f5dcc}.nav-item.active{background:#0f67b2;border-color:#0f67b2;color:#fff}.nav-item.active i{background:rgba(255,255,255,.18);color:#fff}
.nav-item i{font-size:15px;width:22px;height:22px;display:grid;place-items:center;flex:none;border-radius:5px;background:#eaf4ff;color:var(--blue)}.nav-item:nth-child(4n+2) i{background:var(--green2);color:var(--green)}.nav-item:nth-child(4n+3) i{background:var(--amber2);color:var(--amber)}.nav-item:nth-child(4n+4) i{background:var(--purple2);color:var(--purple)}.nav-item span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
/* fixed compact blue header */
.topbar{height:50px;display:flex;align-items:center;gap:8px;padding:0 10px;background:linear-gradient(180deg,var(--header),var(--header2));border-bottom:1px solid #0b508b;position:sticky;top:0;z-index:35;box-shadow:0 2px 8px rgba(16,24,40,.12)}
.icon-btn{width:34px;height:34px;border:1px solid rgba(255,255,255,.35);border-radius:6px;background:rgba(255,255,255,.10);color:#fff;display:grid;place-items:center}.icon-btn:hover{background:rgba(255,255,255,.18)}.icon-btn i{font-size:18px}.top-spacer{flex:1}.top-actions{display:flex;gap:6px;align-items:center;flex-wrap:nowrap}.top-link{height:32px;padding:0 10px;border:1px solid rgba(255,255,255,.30);border-radius:5px;background:rgba(255,255,255,.12);color:#fff;display:inline-flex;align-items:center;gap:5px;font-size:11.8px;white-space:nowrap}.top-link:hover{background:#fff;color:var(--blue);border-color:#fff}.top-link.important:nth-child(1){background:#17a34a;border-color:#17a34a}.top-link.important:nth-child(2){background:#6f42c1;border-color:#6f42c1}.top-link.important:nth-child(3){background:#e74c3c;border-color:#e74c3c}.top-link.important:hover{filter:brightness(.98);color:#fff}
.content{padding:10px;display:grid;gap:9px}.grid{display:grid;gap:9px}.split{display:grid;grid-template-columns:1.15fr .85fr;gap:9px}.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.form-grid.two{grid-template-columns:repeat(2,minmax(0,1fr))}
.card{background:#fff;border:1px solid var(--line);border-radius:4px;overflow:hidden;box-shadow:var(--shadow)}.card-header{display:flex;align-items:center;gap:7px;justify-content:space-between;padding:7px 9px;border-bottom:1px solid #0e5fa9;background:var(--header);color:#fff}.card-title{display:flex;align-items:center;gap:7px;font-size:15px}.card-title i{font-size:16px;width:20px;height:20px;display:grid;place-items:center;color:#fff}.card-header .muted,.card-header span{color:#d9edff!important}.card-body{padding:9px;background:#fff}.muted{color:var(--muted)!important}.field{min-width:0}.field label{display:flex;align-items:center;gap:4px;margin:0 0 3px;color:#334155;font-size:12px}.field label i{color:var(--blue)}
input,select,textarea,.input{width:100%;min-width:0;border:1px solid var(--line2);border-radius:4px;background:#fff;color:#111827;padding:6px 8px;outline:none;font-size:13px;line-height:1.25;transition:border .12s,box-shadow .12s}input:focus,select:focus,textarea:focus,.input:focus{border-color:var(--blue);box-shadow:0 0 0 2px rgba(18,104,179,.11)}input::placeholder,textarea::placeholder{color:#94a3b8}input[readonly],textarea[readonly]{background:#edf2f7!important;color:#475569!important}.input.big{height:37px!important;font-size:14px!important}.input.money{text-align:right}textarea{min-height:76px;resize:vertical}input[type=checkbox]{width:14px!important;height:14px!important;accent-color:var(--blue);padding:0!important;margin:0}
.search-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:7px;align-items:center;width:100%}.search-box{position:relative;min-width:0;width:100%}.search-box i{position:absolute;left:9px;top:50%;transform:translateY(-50%);color:var(--blue);font-size:15px;z-index:2}.search-box input{height:36px!important;padding-left:31px!important;background:#fff!important;border-color:var(--line2)!important;color:#172334!important}.btnx{display:inline-flex;align-items:center;justify-content:center;gap:4px;padding:6px 9px;border-radius:4px;color:#fff!important;font-size:12px;line-height:1;border:1px solid transparent;box-shadow:none;cursor:pointer;text-decoration:none!important;white-space:nowrap;background:#1683e3}.btnx i{font-size:13px}.btnx:hover{filter:brightness(.97);transform:none}.btnx.blue{background:#1683e3}.btnx.green{background:#16a34a}.btnx.red{background:#e3344d}.btnx.orange{background:#f59e0b}.btnx.purple{background:#7c3aed}.btnx.gray{background:#64748b}.btnx.big{height:39px;font-size:13px;border-radius:5px;padding:0 14px}.btnx:disabled{opacity:.50;cursor:not-allowed}.actions{display:flex;justify-content:flex-end;gap:7px;margin-top:8px;flex-wrap:wrap}.inline-actions{display:flex;gap:5px;align-items:center;flex-wrap:nowrap}
.table-wrap{overflow:auto;width:100%;max-width:100%;border-radius:4px;border:1px solid var(--line);background:#fff}.table{width:100%;border-collapse:collapse;min-width:980px;table-layout:auto;background:#fff}.table.fit{min-width:0}.table th,.table td{padding:6px 7px;border:1px solid #d9e4f2;text-align:left;vertical-align:middle;white-space:nowrap;line-height:1.25}.table th{font-size:11.6px;text-transform:uppercase;color:#fff;background:#1468b0;letter-spacing:0}.table td{color:#1f2937;font-size:12.8px;background:#fff}.table tbody tr:nth-child(even) td{background:#f8fbff}.table tbody tr:hover td{background:#fff9d7}.num{text-align:right}.center{text-align:center}.clip{max-width:340px;overflow:hidden;text-overflow:ellipsis}.tight{width:1%;white-space:nowrap}.model-cell{white-space:normal;min-width:340px}.pill{display:inline-flex;align-items:center;gap:4px;border-radius:5px;padding:3px 7px;font-size:11.5px;background:#e8f3ff;color:#0f5dcc;border:1px solid #b7d8fa}.badge{display:inline-flex;align-items:center;gap:3px;padding:3px 6px;border-radius:5px;font-size:11px;white-space:nowrap}.badge.green{background:var(--green2);color:#087b36;border:1px solid #b7efcd}.badge.red{background:var(--red2);color:#b3122d;border:1px solid #ffc5d1}.badge.amber{background:var(--amber2);color:#a76200;border:1px solid #ffe0a3}.badge.blue{background:var(--blue2);color:#0f5dcc;border:1px solid #b7d8fa}.stock-diff-mark{margin-left:6px;background:#ffeff2!important;color:#b3122d!important;border-color:#ffb8c4!important}.empty-state{padding:22px 10px;text-align:center;color:var(--muted)}
.stat-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}.stat{position:relative;overflow:hidden;min-height:65px;border:1px solid var(--line);border-radius:5px;background:#fff;padding:9px;color:#172334;box-shadow:var(--shadow);cursor:pointer}.stat:hover{border-color:#9fc5ee;background:#f8fbff}.stat.active{border-color:#1683e3;background:#eaf4ff}.stat h3{margin:0 0 2px;font-size:20px;line-height:1}.stat p{margin:0;font-size:12px;color:#334155}.stat i.bg{position:absolute;right:8px;bottom:-8px;font-size:48px;color:#d4e4f4;opacity:.80;pointer-events:none}.stat.green i.bg{color:#ccf0dc}.stat.red i.bg{color:#ffd2da}.stat.amber i.bg{color:#ffe5b5}.stat.purple i.bg{color:#ded5ff}
.pager{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:8px;background:#f7fbff;border:1px solid var(--line);border-radius:4px;padding:7px}.pager-info{color:#667085;display:flex;align-items:center;gap:5px}.pager-controls{display:flex;gap:4px;align-items:center;justify-content:flex-end;flex-wrap:wrap}.page-btn{min-width:29px;height:29px;padding:0 8px;border-radius:4px;border:1px solid #cbd9ea;background:#fff;color:#334155;display:inline-flex;align-items:center;justify-content:center;gap:4px;text-decoration:none;font-size:11.8px}.page-btn:hover,.page-btn.active{background:#1683e3;border-color:#1683e3;color:#fff}.page-btn.disabled{opacity:.45;pointer-events:none}
.modal-bg{position:fixed;inset:0;background:rgba(15,23,42,.34);backdrop-filter:blur(2px);display:none;align-items:center;justify-content:center;z-index:1000;padding:10px;overflow:auto}.modal-bg.show{display:flex}.modal-card{width:min(840px,100%);max-height:94vh;overflow:auto;margin:auto;background:#fff;border:1px solid var(--line);border-radius:8px;padding:9px;box-shadow:0 18px 60px rgba(15,23,42,.18)}.modal-card.wide{width:min(1120px,100%)}.modal-card.small{width:min(520px,100%)}.modal-top{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px 10px;background:#1468b0;color:#fff;border-radius:5px;margin-bottom:9px}.modal-title{display:flex;align-items:center;gap:7px;font-size:15px}.close-modal{border:1px solid rgba(255,255,255,.35);background:rgba(255,255,255,.15);color:#fff;border-radius:5px;width:32px;height:32px;display:grid;place-items:center;font-size:18px;cursor:pointer}.hint-box{border:1px solid var(--line);border-radius:5px;background:#f7fbff;padding:8px;color:#667085}.suggest-box,.product-suggestions{position:absolute;z-index:50;background:#fff;border:1px solid var(--line2);border-radius:6px;box-shadow:0 9px 24px rgba(15,23,42,.13);max-height:280px;overflow:auto;width:100%;display:none}.suggest-item{padding:8px 10px;border-bottom:1px solid #eef3f8;cursor:pointer;color:#172334}.suggest-item:hover{background:#eef6ff}.suggest-item b{display:block}.suggest-item small{color:#667085}.product-card{border:1px solid var(--line);border-radius:6px;background:#f8fbff;padding:9px}.product-card h2{margin:0 0 4px;font-size:16px}.product-card .price{font-size:20px;color:#0f5dcc}.cart-total{border:1px solid var(--line);border-radius:7px;background:#f8fbff;padding:9px;text-align:right}.cart-total span{display:block;color:var(--muted)}.cart-total strong{font-size:24px;color:#102033}.save-bar{position:sticky;bottom:0;z-index:25;padding-top:6px;background:linear-gradient(180deg,rgba(232,237,243,0),var(--page) 52%)}.save-inner{display:flex;justify-content:flex-end;gap:8px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:6px;padding:8px;box-shadow:0 -3px 10px rgba(16,24,40,.05)}
.simple-invoice{max-width:1100px;margin:0 auto}.invoice-summary{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:8px}.mini-stat{border:1px solid var(--line);border-radius:5px;background:#f8fbff;padding:8px}.mini-stat span{display:block;color:#667085;font-size:11.5px}.mini-stat b{font-size:15px;color:#172334}.total-band{display:flex;align-items:center;justify-content:space-between;gap:9px;border:1px solid #b7d8fa;border-radius:7px;background:#eaf4ff;padding:10px}.total-band span{color:#334155}.total-band strong{font-size:26px;color:#0f5dcc}.single-product-field{position:relative}
.login-card{background:#fff!important;border:1px solid var(--line)!important;border-radius:8px!important;box-shadow:var(--shadow)!important}.login-title{color:#172334!important}.login-error{background:#fff0f2!important;border:1px solid #ffc5d1!important;color:#b3122d!important}
@media(max-width:1200px){.stat-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.invoice-summary{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.side-menu{transform:translateX(-100%);width:260px}.side-menu.open{transform:translateX(0)}.menu-backdrop.show{display:block;position:fixed;inset:0;background:rgba(15,23,42,.45);backdrop-filter:blur(2px);z-index:55}.mobile-menu-close{display:grid}.brand-box{padding-right:50px}.main{margin-left:0;width:100%}.content{padding:8px}.topbar{height:auto;min-height:50px;padding:7px;flex-wrap:wrap}.top-spacer{display:none}.top-actions{order:2;width:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:5px}.top-link{justify-content:center;font-size:11px;padding:0 5px}.form-grid,.form-grid.two,.split{grid-template-columns:1fr}.stat-grid{grid-template-columns:repeat(2,1fr)}.search-row{grid-template-columns:1fr}.table{min-width:920px}.table.fit{min-width:820px}.pager{align-items:stretch;flex-direction:column}.pager-controls{justify-content:center}.save-inner{flex-direction:column;align-items:stretch}.btnx.big{width:100%}.invoice-summary{grid-template-columns:1fr}.simple-invoice{max-width:none}.total-band{display:block;text-align:right}.total-band span{display:block;text-align:left}}


/* v7 clean light admin refinements */
.stat-grid.manager-cards{
  display:grid!important;
  grid-template-columns:repeat(6,minmax(130px,1fr))!important;
  gap:8px!important;
  align-items:stretch!important;
}
.stat-card{
  position:relative!important;
  display:block!important;
  min-height:76px!important;
  border:1px solid #c9dcec!important;
  border-radius:7px!important;
  background:linear-gradient(180deg,#ffffff,#f7fbff)!important;
  color:#12314e!important;
  padding:12px 12px!important;
  overflow:hidden!important;
  box-shadow:0 2px 8px rgba(16,24,40,.045)!important;
}
.stat-card:hover,.stat-card.active{border-color:#1267af!important;background:#eef7ff!important;text-decoration:none!important}
.stat-card h3{margin:0 0 5px!important;font-size:22px!important;line-height:1!important;font-weight:500!important;color:#07579b!important}
.stat-card p{margin:0!important;font-size:12.5px!important;color:#27394d!important;font-weight:400!important}
.stat-card .bg{position:absolute!important;right:10px!important;bottom:-8px!important;font-size:54px!important;opacity:.13!important;color:#1267af!important;pointer-events:none!important}
.stat-card.stat-active .bg,.stat-card.stat-onhand .bg{color:#16a34a!important}.stat-card.stat-inactive .bg,.stat-card.stat-stockover .bg{color:#f59e0b!important}.stat-card.stat-duplicate .bg{color:#dc3545!important}
.model-toolbar{
  display:grid!important;
  grid-template-columns:minmax(280px,1fr) auto auto auto minmax(180px,220px) auto!important;
  gap:7px!important;
  align-items:center!important;
  width:100%!important;
}
.model-toolbar .search-box{min-width:0!important;width:100%!important}.model-toolbar .search-box input{height:35px!important}.model-toolbar .btnx{height:35px!important}.model-toolbar select{height:35px!important;background-color:#fff!important}

/* Create invoice wide POS-style page */
.invoice-page-wide{width:100%;max-width:none;margin:0!important}
.invoice-card{max-width:none!important;width:100%!important}.invoice-card .card-body{padding:10px!important}
.invoice-two-col{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:10px}.invoice-two-col.money-block{grid-template-columns:1.05fr .95fr}
.invoice-section{border:1px solid var(--line);border-radius:6px;background:#fff;padding:10px;min-width:0}.section-title{display:flex;align-items:center;gap:6px;margin:0 0 8px;color:#0f5e9f;font-size:14px;font-weight:500}.section-title i{font-size:16px}.form-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}.compact-fields{gap:8px}.field.required label:after{content:' *';color:#dc3545}.mini-help{margin-top:5px;font-size:12px;color:#64748b}.single-product-field{position:relative}.invoice-summary.no-cost{grid-template-columns:2fr .65fr .9fr;margin-top:8px}.mini-stat.model-stat b{font-size:14px}.invoice-bottom-row{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center}.invoice-actions{margin:0}.input:disabled,input:disabled{background:#f1f5f9!important;color:#94a3b8!important;cursor:not-allowed!important}.product-suggestions{left:0;top:100%;margin-top:3px}.suggest-item.no-pick{cursor:default;color:#64748b}.suggest-item.no-pick:hover{background:#fff}

/* Duplicate popup list */
.dup-title{display:flex;align-items:center;gap:6px;font-size:13px;color:#475569;margin:0}.dup-title.ok{color:#16803f}.dup-title.bad{color:#c02636}.dup-list{display:grid;gap:5px;margin-top:7px}.dup-row{display:grid;grid-template-columns:auto 1fr auto;gap:8px;align-items:center;border:1px solid #dbe6f2;background:#fff;border-radius:5px;padding:7px}.dup-row span{color:#0f5e9f;background:#e8f3ff;border:1px solid #bfd9f5;border-radius:4px;padding:2px 6px;font-size:12px}.dup-row b{font-size:13px;font-weight:500!important;color:#16263a}.dup-row small{color:#64748b;font-size:12px}.modal-card{box-shadow:0 22px 70px rgba(16,24,40,.18)!important}.modal-card.small{width:min(560px,100%)!important}

/* models manager readability */
.models-table .model-cell{min-width:360px}.models-table th,.models-table td{padding:7px 8px!important}.models-table .tight{width:1%;white-space:nowrap}.stock-diff-mark{margin-left:8px}.table.fit{min-width:760px!important}

@media(max-width:1250px){.stat-grid.manager-cards{grid-template-columns:repeat(3,minmax(0,1fr))!important}.model-toolbar{grid-template-columns:1fr auto auto!important}.model-toolbar select,.model-toolbar #selectVisible,.model-toolbar #applyBulk{grid-column:auto}.invoice-two-col,.invoice-two-col.money-block{grid-template-columns:1fr}.form-grid.three{grid-template-columns:1fr}}
@media(max-width:900px){.stat-grid.manager-cards{grid-template-columns:repeat(2,minmax(0,1fr))!important}.model-toolbar{grid-template-columns:1fr!important}.model-toolbar .btnx,.model-toolbar select{width:100%;justify-content:center}.invoice-bottom-row{grid-template-columns:1fr}.invoice-actions{justify-content:stretch}.invoice-actions .btnx{width:100%;justify-content:center}.invoice-summary.no-cost{grid-template-columns:1fr}.models-table .model-cell{min-width:260px}}