/* ===== SOURCE: app.css ===== */
:root{--nav:#202B63;--nav2:#202B63;--accent:#2563eb;--accent2:#0ea5e9;--bg:#f4f7fb;--card:#fff;--text:#162235;--muted:#66758b;--border:#d9e2ee;--danger:#c92a2a;--success:#178344;--warning:#a16207;--sidebar:255px}*{box-sizing:border-box}html{font-size:15px}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,Segoe UI,Arial,sans-serif}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.app-shell{min-height:100vh}.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar);background:#202B63;color:#eaf3ff;padding:14px 10px;overflow-y:auto;z-index:50}.brand{display:flex;gap:10px;align-items:center;padding:9px 10px 18px}.brand-mark{width:38px;height:38px;border-radius:11px;background:linear-gradient(135deg,#38bdf8,#2563eb);display:grid;place-items:center;font-weight:900;color:#fff}.brand strong,.brand small{display:block}.brand small{opacity:.7;font-size:.72rem;margin-top:2px}.sidebar nav>a,.sidebar summary,.sidebar details div a{display:block;border-radius:8px;padding:8px 10px;margin:2px 0}.sidebar nav>a:hover,.sidebar details div a:hover{background:rgba(255,255,255,.1)}.sidebar summary{cursor:pointer;font-weight:750;list-style:none}.sidebar summary::-webkit-details-marker{display:none}.sidebar details div{padding-left:12px}.sidebar details div a{font-size:.88rem;color:#c8d8ea}.app-main{margin-left:var(--sidebar);min-height:100vh}.topbar{height:60px;background:#fff;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:12px;padding:0 20px;position:sticky;top:0;z-index:40}.topbar-title{font-weight:800;flex:1}.icon-btn{display:none;border:0;background:#edf3fa;width:38px;height:38px;border-radius:9px}.user-chip{text-align:right}.user-chip span,.user-chip small{display:block}.user-chip small{color:var(--muted);font-size:.75rem}.content{padding:20px;max-width:1700px;margin:auto}.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;flex-wrap:wrap;margin-bottom:16px}.page-head h1{margin:0;font-size:1.55rem}.page-head p{margin:5px 0 0;color:var(--muted)}.actions{display:flex;gap:7px;align-items:center;flex-wrap:wrap}.btn{border:1px solid transparent;border-radius:8px;padding:9px 13px;background:#e8eef6;color:var(--text);font-weight:700;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:6px}.btn:hover{filter:brightness(.98)}.btn.primary{background:var(--accent);color:#fff}.btn.success{background:var(--success);color:#fff}.btn.warning{background:#f59f00;color:#fff}.btn.danger{background:var(--danger);color:#fff}.btn.ghost{background:#fff;border-color:var(--border)}.btn.sm{padding:6px 9px;font-size:.78rem}.btn:disabled{opacity:.45;cursor:not-allowed}.grid{display:grid;gap:14px}.metrics{grid-template-columns:repeat(6,minmax(0,1fr));margin-bottom:16px}.metric{background:var(--card);border:1px solid var(--border);border-radius:13px;padding:15px;box-shadow:0 5px 18px rgba(28,53,85,.05)}.metric .label{color:var(--muted);font-size:.78rem;font-weight:700}.metric .value{font-size:1.55rem;font-weight:900;margin-top:5px}.metric .hint{font-size:.72rem;color:var(--muted);margin-top:4px}.two-col{grid-template-columns:minmax(0,1.35fr) minmax(300px,.65fr)}.three-col{grid-template-columns:repeat(3,minmax(0,1fr))}.panel{background:var(--card);border:1px solid var(--border);border-radius:13px;margin-bottom:15px;box-shadow:0 4px 16px rgba(28,53,85,.04);overflow:hidden}.panel-head{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;border-bottom:1px solid var(--border)}.panel-head h2{font-size:1.02rem;margin:0}.panel-head p{font-size:.78rem;color:var(--muted);margin:3px 0 0}.panel-body{padding:15px}.toolbar{display:flex;gap:8px;align-items:end;flex-wrap:wrap;padding:13px 15px;background:#fbfcfe;border-bottom:1px solid var(--border)}.field{display:flex;flex-direction:column;gap:5px;min-width:150px}.field.grow{flex:1;min-width:220px}.field label{font-size:.74rem;font-weight:750;color:#526176;text-transform:uppercase;letter-spacing:.02em}.input{width:100%;border:1px solid #cbd7e5;border-radius:8px;background:#fff;padding:9px 10px;color:var(--text)}.input:focus{outline:2px solid rgba(37,99,235,.16);border-color:var(--accent)}textarea.input{min-height:80px;resize:vertical}.form-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.form-grid .span-2{grid-column:span 2}.form-grid .span-4{grid-column:1/-1}.required:after{content:' *';color:var(--danger)}.table-wrap{overflow:auto}.data-table{width:100%;border-collapse:collapse;min-width:760px}.data-table th{background:#edf3fa;color:#34455d;font-size:.72rem;text-transform:uppercase;letter-spacing:.02em;text-align:left;white-space:nowrap;padding:10px;border-bottom:1px solid var(--border);position:sticky;top:0}.data-table td{padding:9px 10px;border-bottom:1px solid #e8edf4;vertical-align:middle}.data-table tbody tr:hover{background:#f8faff}.data-table.compact td{padding:7px 9px}.product-name{font-weight:800}.barcode{font-family:Consolas,monospace;font-size:.75rem;color:var(--muted);margin-top:2px}.muted{color:var(--muted)}.small{font-size:.78rem}.status{display:inline-flex;border-radius:999px;padding:4px 8px;font-size:.7rem;font-weight:850;background:#e7eef7;color:#40516a}.status-draft{background:#fff4ce;color:#7a5600}.status-reviewed,.status-entered{background:#e0f2fe;color:#075985}.status-approved,.status-checked{background:#e8e6ff;color:#4938a6}.status-confirmed,.status-dispatched{background:#dbeafe;color:#1d4ed8}.status-posted,.status-received,.status-closed{background:#dcfce7;color:#166534}.status-partially-received{background:#ffedd5;color:#9a3412}.status-cancelled{background:#fee2e2;color:#991b1b}.alert{border-radius:9px;padding:11px 13px;margin-bottom:13px;display:flex;justify-content:space-between;gap:10px}.alert button{border:0;background:transparent;font-size:1.2rem}.alert.success{background:#dcfce7;color:#14532d}.alert.danger{background:#fee2e2;color:#7f1d1d}.alert.warning{background:#fff4ce;color:#713f12}.alert.info{background:#e0f2fe;color:#0c4a6e}.pager{display:flex;justify-content:space-between;align-items:center;padding:12px 15px;gap:10px;color:var(--muted);font-size:.82rem}.empty{padding:35px!important;text-align:center;color:var(--muted)}.chart-box{height:260px;padding:12px}.bar-list{display:grid;gap:8px;padding:15px}.bar-row{display:grid;grid-template-columns:130px 1fr 80px;gap:9px;align-items:center;font-size:.8rem}.bar-track{height:10px;background:#edf2f7;border-radius:99px;overflow:hidden}.bar-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent2));border-radius:99px}.inline-form{display:flex;gap:8px;align-items:center;padding:14px 16px;flex-wrap:wrap}.file-list{padding:0 16px 14px}.file-row{display:flex;justify-content:space-between;gap:10px;padding:10px 0;border-top:1px solid var(--border)}.file-row strong,.file-row small{display:block}.file-row small{color:var(--muted);margin-top:3px}.locked{border-left:4px solid #f59f00;background:#fff8e1;padding:10px 12px;margin-bottom:12px;border-radius:7px}.workflow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.workflow .arrow{color:#9aa8ba}.item-actions{display:flex;gap:4px}.login-page{min-height:100vh;display:grid;place-items:center;background:radial-gradient(circle at top left,#1b5b92,#0b223c 55%,#071727)}.login-card{width:min(430px,92vw);background:#fff;border-radius:18px;padding:28px;box-shadow:0 24px 60px rgba(0,0,0,.3)}.login-logo{display:flex;align-items:center;gap:12px;margin-bottom:22px}.login-logo .brand-mark{width:50px;height:50px}.login-card h1{margin:0}.login-card p{color:var(--muted)}.login-card .field{margin-bottom:12px}.mobile-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.mobile-card{background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px;text-align:center}.mobile-card .icon{font-size:2rem}.mobile-card h2{margin:10px 0 5px}.mobile-card p{color:var(--muted);min-height:38px}.search-results{position:absolute;z-index:20;background:#fff;border:1px solid var(--border);border-radius:9px;box-shadow:0 12px 25px rgba(0,0,0,.12);max-height:330px;overflow:auto;width:100%}.search-result{display:block;width:100%;border:0;background:#fff;text-align:left;padding:10px;border-bottom:1px solid #edf0f5}.search-result:hover{background:#f2f7ff}.relative{position:relative}.print-only{display:none}
@media(max-width:1200px){.metrics{grid-template-columns:repeat(3,1fr)}.form-grid{grid-template-columns:repeat(2,1fr)}.form-grid .span-4{grid-column:1/-1}}
@media(max-width:800px){html{font-size:14px}.sidebar{transform:translateX(-100%);transition:transform .2s}.sidebar.open{transform:translateX(0)}.app-main{margin-left:0}.icon-btn{display:block}.content{padding:12px}.topbar{padding:0 12px}.user-chip{display:none}.metrics{grid-template-columns:repeat(2,1fr)}.two-col,.three-col,.mobile-cards{grid-template-columns:1fr}.form-grid{grid-template-columns:1fr}.form-grid .span-2,.form-grid .span-4{grid-column:auto}.toolbar{display:grid;grid-template-columns:1fr 1fr}.toolbar .field.grow{grid-column:1/-1}.toolbar .btn{width:100%}.page-head .actions{width:100%}.page-head .actions .btn{flex:1}.panel{border-radius:10px}.file-row{align-items:flex-start;flex-direction:column}.workflow{display:grid;grid-template-columns:1fr}.workflow .arrow{display:none}.workflow form,.workflow .btn{width:100%}input,select,textarea,button{font-size:16px}.data-table{font-size:.82rem}}
@media(max-width:450px){.metrics{grid-template-columns:1fr 1fr;gap:8px}.metric{padding:11px}.metric .value{font-size:1.25rem}.toolbar{grid-template-columns:1fr}.toolbar .field.grow{grid-column:auto}.content{padding:8px}.topbar-title{font-size:.9rem}}
@media print{.sidebar,.topbar,.no-print,.alert{display:none!important}.app-main{margin:0}.content{padding:0}.panel{box-shadow:none;border:0}.print-only{display:block}.data-table th{position:static}}
.report-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.report-card{display:flex;flex-direction:column;gap:5px;border:1px solid var(--border);border-radius:10px;padding:15px;background:#fbfdff}.report-card:hover{border-color:#8fb3e6;background:#f3f8ff}.report-card span{font-size:.76rem;color:var(--muted)}.check-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.permission-item{display:flex;gap:9px;align-items:flex-start;border:1px solid var(--border);border-radius:9px;padding:10px;background:#fbfcfe}.permission-item strong,.permission-item small{display:block}.permission-item small{font-size:.7rem;color:var(--muted);margin-top:3px}.mobile-item-list{display:grid;gap:10px;padding:12px}.mobile-line{background:#fff;border:1px solid var(--border);border-radius:11px;padding:12px}.mobile-line-head{display:flex;justify-content:space-between;gap:8px;align-items:flex-start}.mobile-line-head strong,.mobile-line-head small{display:block}.mobile-line-head small{color:var(--muted);margin-top:3px}.mobile-line-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:10px}.mobile-line-grid label{font-size:.72rem;font-weight:700;color:var(--muted)}.mobile-line-grid .input{margin-top:4px}.mobile-submit{position:sticky;bottom:8px;width:100%;padding:13px}.label-print-area{display:none}.label-card{border:.15mm solid #bbb;overflow:hidden;padding:1.4mm;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;page-break-inside:avoid;background:#fff;color:#000}.label-name{font-size:9pt;font-weight:800;line-height:1.05;max-height:8mm;overflow:hidden}.label-price{font-size:13pt;font-weight:900;line-height:1.1;margin:.7mm 0}.label-card img{max-width:90%;height:11mm;object-fit:fill}.label-code{font-family:Consolas,monospace;font-size:8pt;line-height:1}.label-foot{font-size:5.5pt;margin-top:.7mm}.disabled{pointer-events:none;opacity:.45}
@media(max-width:800px){.report-grid,.check-grid{grid-template-columns:1fr}.mobile-line-grid{grid-template-columns:1fr 1fr}}
@media print{body.printing-labels .app-shell,body.printing-labels main,body.printing-labels .no-print{display:none!important}body.printing-labels #labelPrintArea{display:grid!important;position:absolute;left:0;top:0;margin:0!important;padding:0!important}.label-card{box-shadow:none}}
/* v1.1 product, modal, export, sharing and PWA improvements */
.data-table th.sortable{cursor:pointer;padding-right:24px;user-select:none}.data-table th.sortable:after{content:'⇅';position:absolute;right:7px;opacity:.4}.data-table th.sortable[data-dir='asc']:after{content:'▲';opacity:.9}.data-table th.sortable[data-dir='desc']:after{content:'▼';opacity:.9}.product-thumb{width:48px;height:48px;object-fit:cover;border-radius:7px}.product-image-preview{width:100px;height:100px;object-fit:cover;border-radius:9px;display:block;margin-bottom:5px}.picture-grid{margin-top:14px}.soft-toolbar{background:#fff9e8}.export-options{border-top:1px solid var(--border);border-bottom:1px solid var(--border);background:#fbfcfe}.export-options summary{cursor:pointer;padding:12px 15px;font-weight:800}.column-choice-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-bottom:12px}.column-choice-grid label{border:1px solid var(--border);border-radius:7px;padding:8px;background:#fff;font-size:.8rem}.modal-overlay{position:fixed;inset:0;background:rgba(7,23,39,.62);z-index:1000;display:grid;place-items:center;padding:18px}.modal-overlay[hidden]{display:none}.modal-card{width:min(620px,96vw);max-height:92vh;background:#fff;border-radius:14px;box-shadow:0 24px 70px rgba(0,0,0,.35);overflow:auto}.modal-card.wide{width:min(1450px,98vw)}.modal-head{position:sticky;top:0;z-index:4;background:#fff;display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding:15px;border-bottom:1px solid var(--border)}.modal-head h2,.modal-head p{margin:0}.modal-head p{margin-top:4px;color:var(--muted);font-size:.8rem}.modal-head .icon-btn{display:grid;place-items:center;font-size:1.35rem}.modal-filters{display:grid;grid-template-columns:2fr repeat(4,1fr) auto;gap:8px;padding:12px;border-bottom:1px solid var(--border)}.modal-summary,.modal-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 14px}.modal-table{max-height:58vh}.modal-table .data-table{min-width:1100px}.modal-table .input{padding:7px}.scanner-video{position:fixed;inset:10%;width:80%;height:70%;object-fit:cover;z-index:9999;background:#000;border:4px solid #fff;border-radius:14px}.document-totals{margin-left:auto;width:min(420px,100%);display:grid;grid-template-columns:1fr auto;gap:8px 18px;padding:14px}.document-totals strong{font-size:1.05rem}.install-card{border:1px dashed #60a5fa;background:#eff6ff;border-radius:12px;padding:14px;margin-bottom:14px}.line-index{display:inline-block;min-width:1.6em}
@media(max-width:1100px){.column-choice-grid{grid-template-columns:repeat(3,1fr)}.modal-filters{grid-template-columns:1fr 1fr 1fr}.modal-filters [data-filter='q']{grid-column:1/-1}}
@media(max-width:800px){.column-choice-grid{grid-template-columns:1fr 1fr}.modal-overlay{padding:4px}.modal-card,.modal-card.wide{width:100%;max-height:98vh;border-radius:10px}.modal-filters{grid-template-columns:1fr 1fr}.modal-filters [data-filter='q']{grid-column:1/-1}.modal-filters .btn{width:100%}.modal-actions{position:sticky;bottom:0;background:#fff;border-top:1px solid var(--border)}}
/* v1.2 consistent dialogs, live search, product picker and barcode preview */
.notice-card,.confirm-card{width:min(520px,96vw)}
.notice-body{display:grid;grid-template-columns:48px 1fr;gap:14px;align-items:center;padding:22px 20px;font-size:.96rem;line-height:1.5}
.notice-icon{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:#e0f2fe;color:#075985;font-size:1.4rem;font-weight:900}
#erpNoticeDialog[data-tone='success'] .notice-icon{background:#dcfce7;color:#166534}
#erpNoticeDialog[data-tone='danger'] .notice-icon{background:#fee2e2;color:#991b1b}
#erpNoticeDialog[data-tone='warning'] .notice-icon,.notice-icon.warning{background:#fff4ce;color:#854d0e}
.modal-table select.input,.picker-mode{min-width:92px;padding-right:34px!important;background-position:right 10px center}
.modal-table .picker-by{min-width:110px}
.live-search-hint{font-size:.72rem;color:var(--muted);margin-top:3px}
.product-modal-trigger{display:inline-flex;align-items:center;gap:6px}
.barcode-preview-shell{background:#eef3f8;border-top:1px solid var(--border);padding:16px}
.barcode-preview-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px;flex-wrap:wrap}
.barcode-preview-canvas{background:#fff;border:1px solid var(--border);min-height:160px;padding:10px;overflow:auto}
.label-preview-area{display:grid;gap:0;align-content:start;justify-content:start}
.label-preview-area .label-card{box-shadow:0 1px 5px rgba(0,0,0,.08)}
.table-live-summary{font-size:.76rem;color:var(--muted);padding:4px 0}
@media(max-width:800px){.notice-body{grid-template-columns:38px 1fr;padding:16px}.notice-icon{width:36px;height:36px}.modal-table select.input,.picker-mode{min-width:100px}}
.feature-banner{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:12px;padding:11px 14px;border:1px solid #bfd3ed;border-radius:10px;background:#eef5fc;color:#173b67}.feature-banner strong{font-size:.86rem}.feature-banner span{font-size:.76rem;color:#4c627b}
.table-live-toolbar{display:flex;align-items:end;justify-content:space-between;gap:12px;padding:10px 14px;background:#f8fbff;border-bottom:1px solid var(--border)}
.table-live-toolbar .field{max-width:520px}
@media(max-width:800px){.table-live-toolbar{align-items:stretch;flex-direction:column}.table-live-toolbar .field{max-width:none}}

/* v1.3 product-picker native select spacing: prevent arrow/text overlap. */
.modal-table td.picker-by{min-width:132px;width:132px}
.modal-table .picker-mode{min-width:116px;padding:7px 40px 7px 10px!important;background-position:right 12px center!important}

/* v1.4: profit margin and bulk import presentation */
.margin-badge{display:inline-flex;align-items:center;justify-content:center;min-width:62px;padding:5px 9px;border-radius:999px;font-weight:850;color:hsl(var(--margin-hue) 62% 24%);border:1px solid hsl(var(--margin-hue) 55% 66%);background:linear-gradient(135deg,hsl(var(--margin-hue) 88% 96%),hsl(var(--margin-hue) 72% 82%));box-shadow:inset 0 1px 0 rgba(255,255,255,.75)}
.bulk-item-toolbar{background:linear-gradient(90deg,#f7fbff,#eef7ff)}
.bulk-item-toolbar input[type=file]{min-width:260px}
.report-filter-form{align-items:end}
.permission-item small{overflow-wrap:anywhere}
@media(max-width:800px){.bulk-item-toolbar .field{width:100%}.bulk-item-toolbar input[type=file]{min-width:0}}

/* v1.5 transient messages */
.alert{transition:opacity .2s ease,transform .2s ease}
.alert.fade-out{opacity:0;transform:translateY(-4px)}

/* v1.6 simplified PO / Transfer flow */
.simple-flow{align-items:center;flex-wrap:wrap}
.flow-step{display:inline-flex;align-items:center;min-height:38px;padding:8px 13px;border:1px solid #cbd5e1;border-radius:999px;background:#f8fafc;color:#475569;font-weight:700;font-size:13px}
.flow-step.active{border-color:#2563eb;background:#dbeafe;color:#1d4ed8;box-shadow:0 0 0 3px rgba(37,99,235,.08)}
.flow-step.done{border-color:#16a34a;background:#dcfce7;color:#166534}
@media(max-width:700px){.simple-flow .arrow{display:none}.flow-step{width:100%;justify-content:center}}

/* v1.6.1 barcode modal and reliable browser print portal */
.barcode-preview-modal{width:min(1120px,96vw);max-height:94vh;display:flex;flex-direction:column}
.barcode-preview-controls{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;border-bottom:1px solid var(--border);flex-wrap:wrap}
.barcode-preview-scroll{overflow:auto;min-height:240px;max-height:68vh;padding:16px;background:#eef3f8}
.barcode-preview-scroll .label-preview-area{background:#fff;border:1px solid var(--border);border-radius:10px;padding:14px;min-height:180px}
@media print{
  body.printing-labels > *:not(#labelPrintArea){display:none!important}
  body.printing-labels #labelPrintArea{display:block!important;background:#fff!important}
}

/* v1.6.2 reliable confirmed form submission and visible processing state */
.processing-overlay{z-index:1200;cursor:wait}
.processing-card{width:min(470px,94vw);display:flex;align-items:center;gap:18px;padding:24px;overflow:visible}
.processing-card h2{margin:0 0 5px;font-size:1.15rem}
.processing-card p{margin:0;color:var(--muted);line-height:1.45}
.processing-spinner{width:42px;height:42px;flex:0 0 42px;border:4px solid #dbeafe;border-top-color:var(--accent);border-radius:50%;animation:erp-spin .8s linear infinite}
@keyframes erp-spin{to{transform:rotate(360deg)}}

/* v2.0 professional workspace — sidebar intentionally unchanged */
:root{--surface:#ffffff;--surface-subtle:#f8fafc;--surface-muted:#f1f5f9;--shadow-sm:0 1px 2px rgba(15,23,42,.04),0 4px 14px rgba(15,23,42,.045);--shadow-md:0 14px 38px rgba(15,23,42,.14);--radius:10px;--radius-sm:7px}
body{font-size:14px;line-height:1.42}.content{padding:16px 18px;max-width:1760px}.topbar{height:56px;padding:0 18px}.page-head{align-items:center;margin-bottom:12px}.page-head h1{font-size:1.38rem;letter-spacing:-.018em}.page-head p{margin-top:3px;font-size:.82rem}.actions{gap:6px}.btn{min-height:34px;border-radius:7px;padding:7px 11px;font-size:.83rem;box-shadow:none;transition:background .15s ease,border-color .15s ease,transform .1s ease}.btn:hover{filter:none;transform:translateY(-1px)}.btn.primary{background:#1d5fd1}.btn.primary:hover{background:#174fac}.btn.success{background:#167849}.btn.success:hover{background:#11633c}.btn.danger{background:#b4232c}.btn.ghost{background:#fff;border-color:#cbd5e1;color:#334155}.btn.ghost:hover{background:#f8fafc;border-color:#94a3b8}.btn.sm{min-height:29px;padding:5px 9px;font-size:.75rem}.panel{border-radius:var(--radius);margin-bottom:12px;box-shadow:var(--shadow-sm);border-color:#dbe3ec}.panel-head{min-height:48px;padding:10px 13px}.panel-head h2{font-size:.94rem}.panel-head p{font-size:.73rem}.panel-body{padding:12px 13px}.toolbar{padding:9px 12px;gap:7px;background:#fbfdff}.soft-toolbar{background:#f8fbff}.field{gap:4px;min-width:135px}.field label{font-size:.67rem;letter-spacing:.045em}.input{min-height:34px;padding:7px 9px;border-radius:7px;border-color:#cbd5e1}.input:focus{outline:3px solid rgba(37,99,235,.13);outline-offset:0}.form-grid{gap:9px}.locked,.compact-note{padding:8px 11px;margin-bottom:10px;font-size:.79rem}.metrics{gap:10px;margin-bottom:12px}.metric{border-radius:10px;padding:12px;box-shadow:var(--shadow-sm)}.metric .value{font-size:1.35rem}.data-table{min-width:720px}.data-table th{padding:8px 9px;font-size:.66rem;background:#eaf1f8;color:#2c4058}.data-table td{padding:7px 9px}.data-table[data-density='comfortable'] td{padding:11px 10px}.data-table[data-density='comfortable'] th{padding:10px}.data-table tbody tr:nth-child(even){background:#fbfcfe}.data-table tbody tr:hover{background:#eef5ff}.data-table th[hidden],.data-table td[hidden]{display:none!important}.table-wrap{scrollbar-width:thin}.table-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:7px 10px;border-bottom:1px solid var(--border);background:#fbfdff}.compact-search{display:flex;align-items:center;gap:6px;min-width:240px;max-width:430px;flex:1}.compact-search>span{color:#64748b;font-size:1rem}.compact-search .input{min-height:30px;padding:5px 8px}.table-tool-actions{display:flex;align-items:center;justify-content:flex-end;gap:5px}.table-live-summary{font-size:.7rem;white-space:nowrap}.table-live-toolbar{display:none!important}.column-modal{width:min(560px,96vw)}.column-modal-tools{display:flex;justify-content:flex-end;gap:6px;padding:8px 12px;border-bottom:1px solid var(--border)}.column-modal-list{padding:8px 12px;display:grid;gap:5px;max-height:55vh;overflow:auto}.column-modal-row{display:flex;align-items:center;justify-content:space-between;gap:10px;border:1px solid #dce4ed;border-radius:7px;padding:7px 8px;background:#fff}.column-modal-row label{display:flex;align-items:center;gap:7px;flex:1;font-size:.82rem}.column-order-actions{display:flex;gap:4px}.export-form-hidden{display:none!important}.export-column-modal{width:min(650px,96vw)}.compact-column-grid{grid-template-columns:repeat(3,minmax(0,1fr));padding:12px;margin:0}.compact-column-grid label{padding:7px 8px;font-size:.78rem}.document-actions{justify-content:flex-end}.document-summary-card .panel-body{padding-top:10px}.detail-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.compact-details>div{border:1px solid #e2e8f0;border-radius:7px;padding:8px 9px;background:#fbfdff;min-width:0}.compact-details span{display:block;color:#64748b;font-size:.65rem;text-transform:uppercase;letter-spacing:.04em;margin-bottom:3px}.compact-details strong{display:block;font-size:.82rem;overflow-wrap:anywhere}.compact-details .detail-span{grid-column:span 2}.compact-action-panel .panel-head{align-items:center}.document-totals{padding:10px 13px;gap:5px 16px;font-size:.82rem}.document-totals strong{font-size:.92rem}.modal-overlay{backdrop-filter:blur(2px);background:rgba(15,23,42,.58)}.modal-card{border-radius:12px;box-shadow:var(--shadow-md)}.modal-head{padding:12px 14px}.modal-actions{padding:9px 12px}.modal-filters{padding:9px 10px;gap:6px}.modal-summary{padding:8px 11px}.bulk-item-toolbar{background:#f8fbff}.bulk-item-toolbar .btn{min-height:30px}.bulk-item-toolbar a.btn{font-size:.73rem}.feature-banner{margin:8px 10px;padding:8px 10px}.export-options{display:none!important}.inline-form{padding:10px 12px}.alert{padding:9px 11px;font-size:.82rem}.file-row{padding:8px 0}.status{padding:3px 7px}.product-name{font-size:.83rem}.barcode{font-size:.7rem}.page-head+.locked{margin-top:-2px}

/* Professional retail barcode label */
.label-card{position:relative;border:.25mm dashed #8a8a8a;padding:1.5mm 2mm;display:grid;grid-template-rows:auto auto 1fr auto;align-items:center;justify-items:center;background:#fff;overflow:hidden;color:#111}.label-price{order:-2;font-family:Arial,Helvetica,sans-serif;font-size:18pt;font-weight:900;line-height:1;margin:0 0 .7mm;letter-spacing:-.4pt}.label-name{order:-1;font-family:Arial,Helvetica,sans-serif;font-size:7.8pt;font-weight:600;line-height:1.08;text-align:center;max-height:7mm;overflow:hidden;width:100%}.label-barcode-row{width:100%;align-self:end;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:1.5mm;align-items:end;margin-top:1mm}.label-code{font-family:Consolas,'Courier New',monospace;font-size:6.8pt;line-height:1;text-align:left;white-space:nowrap;overflow:hidden}.label-card img{display:block;width:100%;height:9mm;object-fit:fill}.label-foot{display:block;font-family:Arial,Helvetica,sans-serif;font-size:4.5pt;line-height:1;text-align:center;width:100%;white-space:nowrap;overflow:hidden;margin-top:.5mm;color:#333}.label-preview-area .label-card{box-shadow:0 2px 9px rgba(15,23,42,.09)}.barcode-layout-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;width:100%}.barcode-layout-summary div{border:1px solid #dbe3ec;border-radius:7px;padding:7px 8px;background:#fff}.barcode-layout-summary span{display:block;font-size:.64rem;color:#64748b;text-transform:uppercase}.barcode-layout-summary strong{font-size:.83rem}.barcode-preview-controls{background:#f8fafc}.barcode-preview-scroll{background:#e9eef5}.label-page{box-sizing:border-box}

/* Focus and accessibility */
.btn:focus-visible,.input:focus-visible,a:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid rgba(37,99,235,.35);outline-offset:2px}.icon-btn{min-width:32px;min-height:32px}.data-table th.sortable:after{right:6px}

@media(max-width:1200px){.detail-grid{grid-template-columns:repeat(3,1fr)}.compact-column-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:800px){.content{padding:10px}.page-head{align-items:flex-start}.page-head .actions{width:auto}.page-head .actions .btn{flex:0 0 auto}.document-actions{width:100%!important}.document-actions .btn{flex:1 1 auto!important}.table-tools{align-items:stretch;flex-direction:column}.compact-search{max-width:none;width:100%}.table-tool-actions{justify-content:space-between}.detail-grid{grid-template-columns:1fr 1fr}.compact-column-grid{grid-template-columns:1fr}.barcode-layout-summary{grid-template-columns:1fr 1fr}.bulk-item-toolbar{display:flex}.bulk-item-toolbar .field{width:100%}}
@media(max-width:480px){.detail-grid{grid-template-columns:1fr}.compact-details .detail-span{grid-column:auto}.btn{min-height:36px}.modal-card{border-radius:8px}.barcode-layout-summary{grid-template-columns:1fr}}
.export-form-compact{display:flex;align-items:center;justify-content:flex-end;padding:8px 11px!important}.export-form-compact>.actions{margin:0}.compact-export-panel>.panel-head{min-height:42px}.compact-export-panel>.panel-head p{display:none}.compact-export-panel>.panel-head h2{font-size:.86rem}.compact-export-panel .column-choice-grid[hidden]{display:none!important}
@media(max-width:800px){.export-form-compact{justify-content:stretch}.export-form-compact>.actions{width:100%;display:grid;grid-template-columns:repeat(2,1fr)}.export-form-compact>.actions .btn{width:100%}}
.compact-filter-bar{align-items:end}.compact-filter-bar .field.grow{min-width:300px}.compact-select{min-width:230px}.compact-document-toolbar{min-height:42px}.compact-modal-form{grid-template-columns:repeat(2,minmax(0,1fr))}.compact-modal-form .span-2{grid-column:span 2}
@media(max-width:800px){.compact-filter-bar .field.grow{min-width:0}.compact-select{min-width:0}.compact-modal-form{grid-template-columns:1fr}.compact-modal-form .span-2{grid-column:auto}}

/* v1.7: preserve the approved sidebar exactly while compacting the workspace */
.sidebar{font-size:15px;line-height:normal}

/* Compact bulk-item import modal */
.bulk-import-modal{width:min(480px,94vw)}
.bulk-import-drop{display:grid;justify-items:center;gap:6px;padding:22px 16px;border:1px dashed #9fb3c8;border-radius:10px;background:#f8fbff;text-align:center}
.bulk-import-drop strong{font-size:.86rem;max-width:100%;overflow-wrap:anywhere}
.bulk-import-drop small{color:var(--muted);font-size:.72rem}
.bulk-file-icon{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#e6efff;color:#1d5fd1;font-size:1.4rem;font-weight:900}
.bulk-import-help{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;padding:8px 10px;border-radius:8px;background:#f8fafc;font-size:.76rem;color:var(--muted)}
@media(max-width:480px){.bulk-import-help{align-items:stretch;flex-direction:column}.bulk-import-help .btn{width:100%}}

/* v1.8 operational reporting, readability and overview */
.product-overview-strip{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:8px 12px;border-bottom:1px solid var(--border);background:linear-gradient(90deg,#f8fbff,#fff)}
.product-overview-metric{display:flex;align-items:baseline;gap:6px;padding:6px 9px;border:1px solid #dbe5f0;border-radius:8px;background:#fff;min-width:145px}
.product-overview-metric span{font-size:.65rem;text-transform:uppercase;letter-spacing:.045em;color:#64748b;font-weight:750}
.product-overview-metric strong{font-size:1rem;color:#143b66}
.product-overview-note{font-size:.72rem;color:#64748b;margin-left:auto}
.barcode{font-size:.79rem;font-weight:650;color:#42546a;letter-spacing:.015em;line-height:1.25}
.data-table td.barcode{font-size:.8rem;color:#293b52}
.document-barcode,.bill-product-barcode{font-family:Consolas,'Courier New',monospace;font-size:.8rem;font-weight:700;letter-spacing:.02em;color:#24364d}
.status-paid{background:#dcfce7;color:#166534}.status-unpaid{background:#e2e8f0;color:#334155}.status-partially-paid{background:#ffedd5;color:#9a3412}.status-overdue{background:#fee2e2;color:#991b1b}.status-reversed{background:#f1f5f9;color:#475569}
.payment-summary{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.payment-summary>div{border:1px solid #dbe3ec;border-radius:8px;background:#fbfdff;padding:7px 10px;min-width:120px}.payment-summary span{display:block;font-size:.64rem;color:#64748b;text-transform:uppercase}.payment-summary strong{display:block;margin-top:2px}
@media(max-width:800px){.product-overview-note{width:100%;margin-left:0}.product-overview-metric{flex:1 1 140px}}
.report-summary-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;padding:9px 12px;border-bottom:1px solid var(--border);background:#f8fbff}
.report-summary-metric{padding:8px 10px;border:1px solid #dbe5ef;border-radius:8px;background:#fff;min-width:0}
.report-summary-metric span{display:block;font-size:.64rem;color:#64748b;text-transform:uppercase;letter-spacing:.045em;font-weight:750}
.report-summary-metric strong{display:block;margin-top:3px;font-size:1rem;color:#153b63;overflow-wrap:anywhere}
@media(max-width:800px){.report-summary-strip{grid-template-columns:1fr 1fr}}@media(max-width:480px){.report-summary-strip{grid-template-columns:1fr}}

/* v1.8.1 full-dataset search and barcode performance */
.server-search-loading{opacity:.72;pointer-events:none}.server-search-loading::after{content:'Searching all records…';font-size:.72rem;color:var(--muted);padding:0 6px}.barcode-preview-scroll .label-preview-area{contain:layout paint}.barcode-preview-modal .barcode-layout-summary{grid-template-columns:repeat(5,minmax(0,1fr))}

/* v1.9 product galleries, mobile PWA comfort, and workflow controls */
.product-thumb-button,.product-image-button,.mobile-product-thumb,.mobile-search-thumb,.picker-product-thumb,.mobile-line-thumb{border:0;background:transparent;padding:0;cursor:pointer;position:relative;display:inline-grid;place-items:center;border-radius:9px;overflow:hidden}
.product-thumb-button>span{position:absolute;right:3px;bottom:3px;min-width:18px;height:18px;padding:0 4px;border-radius:99px;background:rgba(15,23,42,.82);color:#fff;font-size:.65rem;display:grid;place-items:center}
.product-image-button{width:100%;background:#f8fafc;border:1px solid var(--border)}
.picture-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:12px}.picture-tile{display:grid;gap:7px;align-content:start;border:1px solid var(--border);border-radius:10px;padding:8px;background:#fbfdff}.picture-tile .product-image-preview{width:100%;height:130px;object-fit:contain;background:#fff}
.product-gallery-card{width:min(900px,96vw);max-height:94vh;overflow:hidden}.product-gallery-stage{display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:7px;padding:12px;background:#eef3f8}.product-gallery-viewport{height:min(62vh,620px);overflow:hidden;display:grid;place-items:center;background:#fff;border-radius:10px;border:1px solid var(--border);touch-action:pan-y}.product-gallery-viewport.zoom-active{overflow:auto;place-items:start center}.product-gallery-viewport img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;background:#fff;cursor:zoom-in;transition:transform .18s ease;transform-origin:center}.product-gallery-viewport img.zoomed{width:auto;height:auto;max-width:none;max-height:none;object-fit:unset;cursor:zoom-out}.gallery-nav{border:0;background:#fff;width:42px;height:56px;border-radius:10px;font-size:2rem;color:#173d66;box-shadow:0 4px 14px rgba(15,23,42,.12);cursor:pointer}.gallery-nav:disabled{opacity:.35}.product-gallery-caption{display:grid;gap:3px;text-align:center;padding:10px 14px}.product-gallery-caption strong{font-size:1rem}.product-gallery-caption .barcode{font-size:.92rem;font-weight:800}.product-gallery-thumbs{display:flex;gap:7px;overflow-x:auto;padding:0 14px 10px;justify-content:center}.product-gallery-thumbs button{border:2px solid transparent;border-radius:8px;background:#fff;padding:2px;min-width:58px;height:58px}.product-gallery-thumbs button.active{border-color:var(--accent)}.product-gallery-thumbs img{width:100%;height:100%;object-fit:contain}
.reason-card{width:min(500px,94vw)}
.mobile-product-result{display:grid!important;grid-template-columns:58px minmax(0,1fr);gap:9px;align-items:center;padding:8px}.mobile-result-main{border:0;background:transparent;text-align:left;padding:2px;min-width:0;cursor:pointer}.mobile-result-main strong{display:block}.mobile-search-thumb,.picker-product-thumb,.mobile-line-thumb{width:52px;height:52px;border:1px solid var(--border);background:#fff}.mobile-search-thumb img,.picker-product-thumb img,.mobile-line-thumb img{width:100%;height:100%;object-fit:contain}.mobile-product-thumb.placeholder,.mobile-search-thumb.placeholder,.picker-product-thumb.placeholder,.mobile-line-thumb.placeholder{font-size:.58rem;color:var(--muted);text-align:center;background:#f1f5f9}.mobile-line-head{display:grid!important;grid-template-columns:56px minmax(0,1fr) auto;gap:9px;align-items:start}.mobile-line-title{display:grid;gap:2px;min-width:0}.mobile-line-title strong{overflow-wrap:anywhere}.mobile-line-title small{display:block;color:var(--muted)}
.picker-product-thumb{width:46px;height:46px}.product-thumb-button:focus-visible,.product-image-button:focus-visible,.mobile-product-thumb:focus-visible,.mobile-search-thumb:focus-visible,.picker-product-thumb:focus-visible,.mobile-line-thumb:focus-visible{outline:3px solid rgba(37,99,235,.35);outline-offset:2px}

@media(max-width:800px){
  body{padding-bottom:env(safe-area-inset-bottom)}
  .topbar{height:56px;padding-top:env(safe-area-inset-top)}
  .content{padding-bottom:calc(76px + env(safe-area-inset-bottom))}
  .mobile-submit{position:sticky;bottom:calc(8px + env(safe-area-inset-bottom));z-index:25;width:100%;min-height:48px;box-shadow:0 8px 28px rgba(15,23,42,.24)}
  .mobile-item-list{display:grid;gap:10px;padding:10px}.mobile-line{border:1px solid var(--border);border-radius:11px;background:#fff;padding:10px;box-shadow:0 3px 12px rgba(15,23,42,.05)}
  .mobile-line-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:9px}.mobile-line-grid label{display:grid;gap:4px;font-size:.72rem;color:var(--muted)}
  .product-gallery-stage{grid-template-columns:34px minmax(0,1fr) 34px;padding:7px}.gallery-nav{width:34px;height:48px}.product-gallery-viewport{height:55vh}.product-gallery-thumbs{justify-content:flex-start}.product-gallery-card{width:100vw;max-height:100vh;border-radius:0}.product-gallery-overlay{align-items:stretch;padding:0}.picture-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:460px){.mobile-line-grid{grid-template-columns:1fr}.picture-grid{grid-template-columns:1fr}.product-gallery-stage{grid-template-columns:30px minmax(0,1fr) 30px}.gallery-nav{width:30px}}
.pwa-install-shortcut{display:none}
@media(max-width:800px){.pwa-install-shortcut{display:inline-flex;padding:6px 8px;min-height:34px}.topbar-title{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}}
.gallery-count-badge{position:absolute;right:3px;bottom:3px;min-width:18px;height:18px;padding:0 4px;border-radius:999px;background:rgba(15,23,42,.84);color:#fff;font-size:.62rem;font-weight:800;display:grid;place-items:center;line-height:1}

/* v1.9.2 export download progress */
.export-download-overlay{z-index:2200;background:rgba(10,25,42,.46);backdrop-filter:blur(2px)}
.export-download-card{max-width:430px;display:flex;align-items:center;gap:18px;padding:24px}
.export-download-card h2{margin:0 0 5px;color:#153b63;font-size:1.05rem}
.export-download-card p{margin:0;color:#5b6776;line-height:1.45}
.export-download-spinner{width:36px;height:36px;flex:0 0 36px;border:4px solid #dce8f7;border-top-color:#153b63;border-radius:50%;animation:erp-export-spin .8s linear infinite}
@keyframes erp-export-spin{to{transform:rotate(360deg)}}

/* v2.0 checkbox multi-select filters */
.multi-filter{position:relative;min-width:150px}.multi-filter-native{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important}.multi-filter-button{width:100%;min-height:36px;padding:7px 32px 7px 10px;border:1px solid #cbd5e1;border-radius:7px;background:#fff;color:#334155;text-align:left;font:inherit;position:relative;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.multi-filter-button::after{content:'▾';position:absolute;right:10px;top:50%;transform:translateY(-50%);color:#64748b}.multi-filter-button.has-selection{border-color:#6f9fdf;background:#f4f8ff;color:#174f9d;font-weight:700}.multi-filter-panel{position:absolute;z-index:900;top:calc(100% + 5px);left:0;width:max(230px,100%);max-width:min(360px,90vw);padding:8px;border:1px solid #cbd5e1;border-radius:9px;background:#fff;box-shadow:0 16px 38px rgba(15,23,42,.18)}.multi-filter-search{width:100%;min-height:34px;padding:6px 9px;border:1px solid #d5dee9;border-radius:7px;margin-bottom:7px}.multi-filter-tools{display:flex;justify-content:flex-end;gap:5px;padding-bottom:6px;border-bottom:1px solid #e5eaf0}.multi-filter-tools button{border:0;background:transparent;color:#1d5fd1;font-size:.72rem;font-weight:750;cursor:pointer;padding:3px 5px}.multi-filter-options{display:grid;gap:2px;max-height:260px;overflow:auto;padding-top:5px}.multi-filter-option{display:flex;align-items:flex-start;gap:8px;padding:6px 7px;border-radius:6px;cursor:pointer;font-size:.8rem;line-height:1.25}.multi-filter-option:hover{background:#f1f6fd}.multi-filter-option input{margin-top:1px;accent-color:#1d5fd1}.multi-filter-empty{padding:10px;color:#64748b;font-size:.78rem}.toolbar .multi-filter{max-width:230px}.compact-filter-bar .multi-filter{min-width:135px;max-width:190px}@media(max-width:800px){.toolbar .field:has(.multi-filter),.toolbar .multi-filter,.compact-filter-bar .multi-filter{width:100%;max-width:none}.multi-filter-panel{position:fixed;left:12px;right:12px;top:18%;width:auto;max-width:none;max-height:65vh}.multi-filter-options{max-height:48vh}}

/* v2.5.1 Purchase Return quantity feedback */
#returnItems tr.row-error td { background: rgba(180, 35, 24, .05); }
#returnItems tr.row-error .js-entry { border-color: #b42318; box-shadow: 0 0 0 2px rgba(180,35,24,.08); }

/* v2.6 numeric + searchable-select + compact responsive standards */
input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
input[type=number]{-moz-appearance:textfield;appearance:textfield}
.searchable-select{position:relative;min-width:0}.searchable-select-native{position:absolute!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}.searchable-select-menu{position:absolute;left:0;right:auto;top:calc(100% + 3px);z-index:1500;background:#fff;border:1px solid #cbd5e1;border-radius:8px;box-shadow:0 12px 30px rgba(15,23,42,.18);width:max(100%,min(560px,calc(100vw - 32px)));max-width:calc(100vw - 32px);max-height:340px;overflow:auto}.searchable-select-option{display:block;width:100%;border:0;background:#fff;text-align:left;padding:9px 10px;font:inherit;color:#1e293b;cursor:pointer;white-space:normal;line-height:1.35;overflow-wrap:anywhere}.searchable-select-option:hover,.searchable-select-option:focus{background:#eef5ff;outline:none}.searchable-select-empty{padding:9px 10px;color:#64748b;font-size:.8rem}.compact-number{min-width:100px;max-width:150px}.cost-concept-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px}.cost-concept{border:1px solid #dbe3ec;border-radius:9px;padding:11px;background:#f8fbff}.cost-concept>span{display:block;font-size:.66rem;text-transform:uppercase;letter-spacing:.04em;color:#64748b}.cost-concept>strong{display:block;font-size:1rem;margin:4px 0;color:#173b63}.cost-concept>small{display:block;color:#64748b;line-height:1.35}.mt-16{margin-top:16px}.qty-mode-group{display:grid;grid-template-columns:minmax(90px,1fr) minmax(78px,110px);gap:6px;align-items:center}.erp-modal[hidden]{display:none}.erp-modal-card{width:min(720px,96vw);max-height:92vh;background:#fff;border-radius:12px;overflow:auto;box-shadow:0 24px 70px rgba(0,0,0,.35)}.erp-modal-head,.erp-modal-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px 14px;border-bottom:1px solid #dbe3ec}.erp-modal-foot{border-top:1px solid #dbe3ec;border-bottom:0;justify-content:flex-end}.erp-modal-body{padding:13px}.column-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.column-grid label{border:1px solid #dbe3ec;border-radius:7px;padding:7px;background:#fff}
@media(max-width:900px){.cost-concept-grid{grid-template-columns:1fr 1fr}.qty-mode-group{grid-template-columns:1fr}.column-grid{grid-template-columns:1fr}}
@media(max-width:560px){.cost-concept-grid{grid-template-columns:1fr}.searchable-select-menu{position:fixed;left:8px;right:8px;top:auto;bottom:8px;max-height:45vh}}

/* v2.6 professional operations rebuild */
.choice-row{display:flex;gap:10px;flex-wrap:wrap;align-items:stretch}.choice-card{display:flex;gap:9px;align-items:flex-start;min-width:220px;flex:1;border:1px solid var(--border);border-radius:10px;padding:11px 12px;background:#fbfdff;cursor:pointer}.choice-card:has(input:checked){border-color:#6b9bd6;background:#eef6ff;box-shadow:0 0 0 1px rgba(29,78,216,.08)}.choice-card input{margin-top:3px}.choice-card span,.choice-card strong,.choice-card small{display:block}.choice-card small{margin-top:3px;color:var(--muted);line-height:1.35}.compact-form-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.number-entry{font-variant-numeric:tabular-nums;text-align:right}.readonly-display{min-height:38px;display:flex;align-items:center;background:#f8fafc;color:#334155;font-variant-numeric:tabular-nums}.mobile-search-actions{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;align-items:end}.mobile-form-stack{display:grid;gap:12px}.erp-modal-card.wide{width:min(1180px,96vw)}
@media(max-width:800px){.compact-form-grid{grid-template-columns:1fr}.choice-row{display:grid;grid-template-columns:1fr 1fr}.choice-card{min-width:0}.mobile-search-actions{grid-template-columns:1fr}.erp-modal-card.wide{width:98vw}}
@media(max-width:520px){.choice-row{grid-template-columns:1fr}.choice-card{width:100%}.qty-mode-group{grid-template-columns:minmax(0,1fr) 88px}.column-grid{grid-template-columns:1fr}}

/* v2.8.1 workflow, purchasing and filter usability fixes */
.filter-panel{overflow:visible}
.dense-filters{display:grid;grid-template-columns:minmax(260px,2.2fr) repeat(3,minmax(145px,1fr)) repeat(2,minmax(135px,.85fr)) auto auto;align-items:end;gap:8px}
.dense-filters .field,.dense-filters .field.grow{min-width:0;max-width:none}
.dense-filters .multi-filter,.dense-filters .searchable-select{width:100%;max-width:none;min-width:0}
.dense-filters .multi-filter-panel{min-width:260px;max-width:min(420px,90vw)}
.dense-filters>.btn{white-space:nowrap}
.workflow-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.workflow-toolbar form{margin:0}
.workflow-toolbar .btn{min-width:118px}
.po-cost-summary{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;padding:13px;background:#f8fafc;border-top:1px solid var(--border)}
.po-cost-card{min-width:0;border:1px solid #dbe3ec;border-radius:10px;background:#fff;padding:11px 12px}
.po-cost-card>span{display:block;color:#64748b;font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:.045em}
.po-cost-card>strong{display:block;margin-top:5px;color:#173b63;font-size:1.04rem;font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.po-cost-card>small{display:block;margin-top:5px;color:#64748b;line-height:1.35}
.po-cost-card.highlight{border-color:#a9c7ef;background:#f4f8ff}
.po-cost-card.internal{border-color:#b9dfc7;background:#f5fcf7}
.receive-modal-table{max-height:54vh;overflow:auto}
.receive-modal-table .data-table{min-width:1180px}
.receive-modal-table .receive-qty{min-width:120px}
.erp-modal-body .field textarea.input,.modal-card textarea.input{min-height:90px}
@media(max-width:1450px){.dense-filters{grid-template-columns:minmax(240px,2fr) repeat(3,minmax(140px,1fr));}.dense-filters>.field:nth-of-type(n+5){grid-row:auto}.po-cost-summary{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1050px){.dense-filters{grid-template-columns:repeat(2,minmax(0,1fr))}.dense-filters .field.grow{grid-column:1/-1}.dense-filters>.btn{width:100%}.workflow-toolbar .btn{min-width:0}}
@media(max-width:650px){.dense-filters{grid-template-columns:1fr}.dense-filters .field.grow{grid-column:auto}.po-cost-summary{grid-template-columns:1fr}.workflow-toolbar{display:grid;grid-template-columns:1fr 1fr}.workflow-toolbar form,.workflow-toolbar .btn{width:100%}}
@media(max-width:420px){.workflow-toolbar{grid-template-columns:1fr}}

/* v2.8.2 clean action surfaces ------------------------------------------------ */
.compact-page-head{align-items:flex-start;gap:14px;margin-bottom:12px}
.top-action-bar{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}
.top-action-bar .btn{min-height:34px;padding:7px 11px;border-radius:8px;font-size:.78rem;font-weight:800}
.action-create{background:#155eef!important;border-color:#155eef!important;color:#fff!important}
.action-import{background:#eef8f2!important;border:1px solid #a9d9bb!important;color:#17683b!important}
.action-export{background:#fff7e8!important;border:1px solid #f0cf8c!important;color:#8a5a00!important}
.action-more{background:#f5f7fa!important;border:1px solid #d7dee8!important;color:#334155!important}
.action-menu{position:relative}.action-menu>summary{list-style:none;cursor:pointer}.action-menu>summary::-webkit-details-marker{display:none}
.action-menu-pop{position:absolute;z-index:1800;right:0;top:calc(100% + 6px);min-width:205px;background:#fff;border:1px solid #d8e0ea;border-radius:10px;padding:6px;box-shadow:0 18px 45px rgba(15,23,42,.18);display:grid;gap:2px}
.action-menu-pop a,.action-menu-pop button{display:block;width:100%;border:0;background:transparent;color:#24364d;padding:9px 10px;text-align:left;border-radius:7px;font:inherit;font-size:.79rem;cursor:pointer;text-decoration:none}
.action-menu-pop a:hover,.action-menu-pop button:hover{background:#f0f5fb;color:#124f9c}
.compact-panel>.toolbar,.compact-filter-bar{padding:10px 12px;margin:0;border-bottom:1px solid var(--border);background:#fbfcfe}
.compact-modal-table{max-height:62vh;overflow:auto}.compact-modal-table .data-table{min-width:980px}
.row-actions{display:flex;gap:5px;justify-content:flex-end;align-items:center}.row-actions form{margin:0}
/* Convert old master import/export strips into compact, less dominant surfaces. */
[data-master-bulk-tools]{padding:7px 9px!important;margin:0 0 10px!important;border:1px solid #e0e7ef!important;border-radius:9px!important;background:#fbfcfe!important}
[data-master-bulk-tools]>.actions{justify-content:flex-end;gap:6px!important}
[data-master-bulk-tools] .btn{min-height:32px;padding:6px 9px;font-size:.75rem}
/* Make dense filter rows scroll/stack rather than overlap at intermediate widths. */
.toolbar,.dense-filters{min-width:0}.toolbar .field,.dense-filters .field{min-width:0}.toolbar .input,.dense-filters .input{max-width:100%}
@media(max-width:1180px){.page-head{align-items:flex-start}.top-action-bar{width:100%;justify-content:flex-start}.action-menu-pop{left:0;right:auto}.dense-filters{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important}.dense-filters .field.grow{grid-column:1/-1!important}}
@media(max-width:760px){.top-action-bar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.top-action-bar>.btn,.top-action-bar>.action-menu,.top-action-bar>.action-menu>summary{width:100%}.dense-filters{grid-template-columns:1fr!important}.action-menu-pop{position:fixed;left:12px;right:12px;top:auto;bottom:12px;min-width:0;max-height:55vh;overflow:auto}.page-head>div:first-child{min-width:0}.page-head h1{font-size:1.2rem}}
@media(max-width:440px){.top-action-bar{grid-template-columns:1fr}}

/* v2.8.3 PO planning table alignment + persistent picker selection */
.po-planning-wrap{overflow:auto;border-top:1px solid #e2e8f0}
.po-planning-table{table-layout:fixed;width:2200px;min-width:2200px}
.po-planning-table th,.po-planning-table td{vertical-align:middle}
.po-planning-table th{white-space:normal;line-height:1.2;overflow-wrap:normal;word-break:normal;text-align:left;z-index:2}
.po-planning-table td{overflow:hidden}
.po-planning-table .input{min-width:0;max-width:100%}
.po-planning-table .item-actions{justify-content:center;flex-wrap:nowrap}
.po-planning-table col.po-col-sn{width:52px}
.po-planning-table col.po-col-product{width:230px}
.po-planning-table col.po-col-ctn{width:76px}
.po-planning-table col.po-col-reorder{width:96px}
.po-planning-table col.po-col-maximum{width:104px}
.po-planning-table col.po-col-soh{width:100px}
.po-planning-table col.po-col-committed{width:120px}
.po-planning-table col.po-col-available{width:100px}
.po-planning-table col.po-col-incoming{width:132px}
.po-planning-table col.po-col-projected{width:104px}
.po-planning-table col.po-col-suggested{width:98px}
.po-planning-table col.po-col-order{width:108px}
.po-planning-table col.po-col-by{width:92px}
.po-planning-table col.po-col-unitqty{width:98px}
.po-planning-table col.po-col-lastprice{width:132px}
.po-planning-table col.po-col-suppliercost{width:132px}
.po-planning-table col.po-col-finalcost{width:142px}
.po-planning-table col.po-col-remarks{width:190px}
.po-planning-table col.po-col-actions{width:116px}
#erpProductPicker .modal-summary{background:#f8fbff;border-bottom:1px solid var(--border)}
#erpProductPicker [data-result-count]{font-weight:800;color:#334155;white-space:nowrap}
#erpProductPicker .picker-check{width:17px;height:17px;accent-color:#1d5fd1}
#erpProductPicker .picker-filter-field{display:grid;gap:4px;min-width:0}
#erpProductPicker .picker-filter-label{font-size:.72rem;font-weight:850;color:#55667a;text-transform:uppercase;letter-spacing:.02em}
#erpProductPicker .picker-filter-field>.input{width:100%}

@media(max-width:760px){.po-planning-table{width:2200px;min-width:2200px}}


/* v2.8.7 Staff Mobile touch-first UX --------------------------------------- */
[hidden]{display:none!important}
body.scanner-open{overflow:hidden;touch-action:none}
.scanner-overlay{position:fixed;inset:0;z-index:20000;background:#05080d;color:#fff;overflow:hidden}
.scanner-overlay .scanner-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000;border:0;border-radius:0}
.scanner-overlay:after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.36);pointer-events:none}
.scanner-topbar{position:absolute;z-index:4;left:0;right:0;top:0;display:grid;grid-template-columns:56px 1fr 56px;align-items:center;padding:calc(10px + env(safe-area-inset-top)) 14px 10px;text-align:center;background:linear-gradient(180deg,rgba(0,0,0,.66),transparent)}
.scanner-topbar strong{font-size:1.08rem;letter-spacing:.01em}.scanner-close{width:54px;height:54px;border:0;border-radius:999px;background:rgba(15,23,42,.82);color:#fff;font-size:2rem;line-height:1;display:grid;place-items:center;cursor:pointer}
.scanner-target{position:absolute;z-index:3;left:50%;top:50%;width:min(78vw,560px);height:min(34vh,260px);transform:translate(-50%,-50%);border-radius:24px;box-shadow:0 0 0 9999px rgba(0,0,0,.24)}
.scanner-target i{position:absolute;width:58px;height:58px;border-color:#fff;border-style:solid}.scanner-target i:nth-child(1){left:0;top:0;border-width:6px 0 0 6px;border-radius:24px 0 0 0}.scanner-target i:nth-child(2){right:0;top:0;border-width:6px 6px 0 0;border-radius:0 24px 0 0}.scanner-target i:nth-child(3){left:0;bottom:0;border-width:0 0 6px 6px;border-radius:0 0 0 24px}.scanner-target i:nth-child(4){right:0;bottom:0;border-width:0 6px 6px 0;border-radius:0 0 24px 0}
.scanner-instruction{position:absolute;z-index:4;left:14px;right:14px;bottom:calc(26px + env(safe-area-inset-bottom));padding:15px 18px;border-radius:16px;background:rgba(0,0,0,.68);text-align:center;font-size:1.05rem;font-weight:750}

.mobile-product-toolbar{padding:10px;background:#f8fbff;border-bottom:1px solid var(--border)}
.mobile-quick-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.mobile-touch-action{min-width:0;min-height:64px;border:1px solid #d4dfec;border-radius:14px;background:#fff;color:#21324a;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;padding:7px 5px;font-weight:800;cursor:pointer;-webkit-tap-highlight-color:transparent;box-shadow:0 2px 8px rgba(15,23,42,.04)}
.mobile-touch-action:active{transform:scale(.97);background:#eef5ff}.mobile-action-icon{display:grid;place-items:center;width:27px;height:27px}.mobile-action-icon svg,.mobile-search-icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.mobile-scan-action{background:#155eef;color:#fff;border-color:#155eef;box-shadow:0 6px 16px rgba(21,94,239,.22)}
.mobile-save-action{background:#178344;color:#fff;border-color:#178344;box-shadow:0 6px 16px rgba(23,131,68,.18)}
.mobile-unit-action{position:relative;gap:2px}.mobile-unit-action .mobile-unit-badge{font-size:.74rem;line-height:1;padding:5px 7px;border-radius:7px;background:#eaf1fb;color:#31577f}.mobile-unit-action select{width:100%;max-width:74px;border:0;background:transparent;color:inherit;font-size:.78rem;font-weight:850;text-align:center;text-align-last:center;outline:0;padding:0;cursor:pointer}
.mobile-search-box{display:grid;grid-template-columns:26px minmax(0,1fr);align-items:center;gap:8px;margin-top:9px;border:1px solid #cbd7e5;border-radius:14px;background:#fff;padding:0 12px;min-height:50px}.mobile-search-box:focus-within{border-color:#4f83df;box-shadow:0 0 0 3px rgba(37,99,235,.12)}.mobile-search-icon{display:grid;width:22px;height:22px;color:#63748c}.mobile-search-box .input{border:0;box-shadow:none!important;outline:0!important;padding:12px 0;min-height:48px;background:transparent}
.mobile-search-results{left:10px;right:10px;width:auto;top:100%;max-height:52vh;border-radius:14px;z-index:80}
.mobile-document-totals{border-top:1px solid var(--border);background:#fbfdff}

@media(max-width:800px){
  .mobile-workspace{margin:-4px -4px 0}.mobile-workspace .mobile-page-head{margin:0 4px 10px;align-items:center}.mobile-workspace .mobile-page-head h1{font-size:1.28rem}.mobile-workspace .mobile-page-head p{font-size:.82rem;line-height:1.4}.mobile-workspace .mobile-page-head>.btn{min-height:44px}
  .mobile-workspace .panel{border-radius:15px;margin-bottom:10px}.mobile-products-panel{overflow:visible}.mobile-product-toolbar{position:sticky;top:60px;z-index:30;border-radius:14px 14px 0 0;box-shadow:0 5px 18px rgba(15,23,42,.08)}
  .mobile-item-list{padding:8px;gap:8px}.mobile-line{border-radius:14px;padding:11px;box-shadow:0 2px 9px rgba(15,23,42,.05)}.mobile-line-head{grid-template-columns:66px minmax(0,1fr) 46px!important;gap:10px;align-items:center!important}.mobile-line-thumb{width:62px;height:62px;border-radius:12px}.mobile-line-title strong{font-size:.98rem;line-height:1.25}.mobile-line-title .barcode{font-size:.78rem}.mobile-line-head>.btn.danger{width:44px;height:44px;border-radius:12px;padding:0;font-size:1.15rem;align-self:start}
  .mobile-line-grid{grid-template-columns:1fr 1fr;gap:9px;margin-top:11px}.mobile-line-grid label{font-size:.72rem;font-weight:750}.mobile-line-grid .input,.mobile-line-grid select.input{min-height:48px;font-size:16px;border-radius:11px}.mobile-line-grid .readonly-display{min-height:48px}
  .mobile-product-result{grid-template-columns:64px minmax(0,1fr)!important;min-height:76px;padding:9px}.mobile-search-thumb{width:58px;height:58px}.mobile-result-main{min-height:58px}.mobile-result-main strong{font-size:.95rem;line-height:1.25}
  .mobile-home-screen .install-card{margin:0 4px 10px}.mobile-home-screen .mobile-cards{gap:10px}.mobile-home-screen .mobile-card{padding:17px;border-radius:15px;text-align:left;display:grid;grid-template-columns:52px 1fr auto;align-items:center;gap:10px}.mobile-home-screen .mobile-card .icon{grid-row:1/3;display:grid;place-items:center;width:50px;height:50px;border-radius:13px;background:#eef5ff}.mobile-home-screen .mobile-card h2{margin:0}.mobile-home-screen .mobile-card p{margin:2px 0 0;min-height:0}.mobile-home-screen .mobile-card .btn{grid-column:3;grid-row:1/3;min-height:44px}
}
@media(max-width:430px){.mobile-touch-action{min-height:61px;font-size:.78rem}.mobile-action-icon{width:25px;height:25px}.mobile-line-grid{grid-template-columns:1fr 1fr}.mobile-home-screen .mobile-card{grid-template-columns:46px 1fr}.mobile-home-screen .mobile-card .btn{grid-column:1/-1;grid-row:auto}.scanner-target{width:82vw;height:30vh}.scanner-instruction{font-size:.96rem}}

/* v2.8.8 Mobile compact transaction entry ---------------------------------- */
@media(max-width:800px){
  .mobile-compact-entry-page{margin-top:-8px}
  .mobile-context-strip{display:flex;align-items:center;gap:8px;margin:0 4px 8px;position:sticky;top:56px;z-index:32;background:var(--bg);padding:6px 0}
  .mobile-context-button{min-width:0;flex:1;border:1px solid #d8e2ee;background:#fff;border-radius:12px;min-height:46px;padding:6px 10px;display:flex;align-items:center;gap:9px;text-align:left;color:#23364e;box-shadow:0 2px 8px rgba(15,23,42,.04);cursor:pointer}
  .mobile-context-button>span:last-child{min-width:0;display:grid;gap:1px}.mobile-context-button strong{font-size:.83rem}.mobile-context-button small{color:#6a7a8f;font-size:.7rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .mobile-context-icon{width:28px;height:28px;border-radius:8px;background:#edf4ff;color:#225fc7;display:grid;place-items:center;font-weight:900}
  .mobile-back-button{min-height:46px;padding:7px 11px}
  .mobile-products-focus{border-radius:14px!important;margin:0 4px 8px!important;overflow:visible!important}
  .mobile-toolbar-compact{position:sticky!important;top:108px!important;padding:7px!important;border-radius:13px 13px 0 0!important;background:#fff!important}
  .mobile-primary-actions{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
  .mobile-primary-action{min-width:0;height:50px;border:1px solid #d6e0ec;border-radius:11px;background:#fff;color:#24364c;display:flex;align-items:center;justify-content:center;gap:5px;padding:4px 5px;font-size:.76rem;font-weight:850;cursor:pointer;-webkit-tap-highlight-color:transparent}
  .mobile-primary-action:active{transform:scale(.97)}.mobile-primary-action.scan{background:#155eef;border-color:#155eef;color:#fff}.mobile-primary-action.save{background:#178344;border-color:#178344;color:#fff}.mobile-primary-action.add{background:#eef5ff;border-color:#bed4f5;color:#174f9d}
  .mobile-primary-icon{display:grid;place-items:center;width:21px;height:21px;flex:0 0 21px}.mobile-primary-icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
  .mobile-item-list{padding:7px!important;gap:7px!important}.mobile-line.mobile-line-compact{padding:9px!important;border-radius:12px!important}
  .mobile-line-compact .mobile-line-head{grid-template-columns:52px minmax(0,1fr) 38px!important;gap:8px!important;align-items:start!important}.mobile-line-compact .mobile-line-thumb{width:48px!important;height:48px!important;border-radius:9px!important}.mobile-line-compact .mobile-line-head>.btn.danger{width:36px!important;height:36px!important;border-radius:9px!important;font-size:1rem!important}
  .mobile-line-compact .mobile-line-title{gap:1px!important}.mobile-line-compact .mobile-line-title strong{font-size:.9rem!important;line-height:1.17!important}.mobile-line-compact .mobile-line-title .barcode{font-size:.7rem!important;margin-top:1px!important}
  .mobile-product-meta{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:3px;color:#65758a;font-size:.7rem}.mobile-product-meta span{display:inline-flex;gap:3px;align-items:center}.mobile-product-meta b{color:#32465f;font-weight:800}
  .mobile-qty-unit-row{display:grid;grid-template-columns:minmax(90px,118px) minmax(86px,106px) minmax(0,1fr);gap:7px;align-items:end;margin-top:8px}.mobile-qty-unit-row>label{display:grid;gap:3px;font-size:.69rem;font-weight:750;color:#64748b}.mobile-qty-unit-row .input{min-height:40px!important;height:40px!important;padding:6px 8px!important;border-radius:9px!important;font-size:16px!important}.mobile-unit-select{padding-right:25px!important}
  .mobile-line-remarks{min-width:0;align-self:end}.mobile-line-remarks summary{list-style:none;cursor:pointer;height:40px;border:1px solid #d8e1ec;border-radius:9px;background:#f8fafc;color:#52647a;font-size:.72rem;font-weight:800;display:flex;align-items:center;justify-content:center;padding:0 9px}.mobile-line-remarks summary::-webkit-details-marker{display:none}.mobile-line-remarks[open]{grid-column:1/-1}.mobile-line-remarks[open] summary{height:34px;justify-content:flex-start;margin-bottom:5px}.mobile-line-remarks .input{width:100%;height:40px!important}
  .mobile-empty-products{padding:32px 16px;text-align:center;color:#708096;display:grid;gap:4px}.mobile-empty-products strong{color:#41536a}.mobile-empty-products[hidden]{display:none!important}
  .mobile-entry-modal,.mobile-search-modal{align-items:flex-end!important;padding:0!important}.mobile-sheet-card{width:100%!important;max-width:none!important;max-height:92vh!important;border-radius:18px 18px 0 0!important;overflow:auto!important;margin:0!important}.mobile-sheet-card .modal-head{position:sticky;top:0;background:#fff;z-index:3}.mobile-sheet-card .icon-btn{display:grid!important;place-items:center!important}.mobile-modal-form{display:grid;gap:10px}.mobile-modal-two-col{display:grid;grid-template-columns:1fr 1fr;gap:9px}
  .mobile-search-box-modal{margin:0!important}.mobile-search-results-modal{position:static!important;width:100%!important;max-height:58vh!important;margin-top:8px!important;box-shadow:none!important;border-radius:12px!important}
}
@media(max-width:380px){.mobile-primary-action{font-size:.7rem;gap:3px}.mobile-primary-icon{width:19px;height:19px;flex-basis:19px}.mobile-qty-unit-row{grid-template-columns:minmax(82px,1fr) minmax(78px,.9fr) minmax(80px,.9fr)}.mobile-modal-two-col{grid-template-columns:1fr}}

/* v2.8.9 Sidebar accordion ----------------------------------------------- */
.sidebar nav details[data-sidebar-section]>summary{display:flex;align-items:center;justify-content:space-between;gap:8px}
.sidebar nav details[data-sidebar-section]>summary::after{content:'›';font-size:1rem;line-height:1;opacity:.7;transition:transform .16s ease}
.sidebar nav details[data-sidebar-section][open]>summary::after{transform:rotate(90deg)}
.sidebar nav>a.active,.sidebar details div a.active{background:rgba(255,255,255,.14);color:#fff;font-weight:800}
.sidebar nav details[data-sidebar-section]:not([open])>div{display:none}

/* v2.9.2 report More Filters modal -----------------------------------------
   The shared multi-filter panel is absolutely positioned. This report-only
   card expands while a panel is open so the option list stays visible inside
   the dialog instead of being clipped by the modal scroll container. */
#reportFilterModal{
  align-items:start;
  justify-items:center;
  overflow-y:auto;
  padding:clamp(8px,3vh,22px) 12px;
}
#reportFilterModal .report-filter-modal-card{
  display:flex;
  flex-direction:column;
  width:min(760px,calc(100vw - 24px));
  max-height:none;
  overflow:visible;
  margin:0;
  transition:min-height .16s ease;
}
#reportFilterModal .report-filter-modal-card.filter-options-open{
  min-height:var(--report-filter-open-height,520px);
}
#reportFilterModal .report-filter-modal-body{
  flex:0 0 auto;
  align-content:start;
  overflow:visible;
}
#reportFilterModal .modal-actions{
  position:static;
  flex:0 0 auto;
  margin-top:auto;
  background:#fff;
  border-top:1px solid var(--border);
  border-radius:0 0 12px 12px;
}
#reportFilterModal .field,
#reportFilterModal .multi-filter{
  width:100%;
  min-width:0;
}
#reportFilterModal .report-filter-field>label{
  display:block!important;
  min-height:16px;
  margin:0 0 4px!important;
  font-size:.72rem;
  font-weight:750;
  color:#41536a;
}
#reportFilterModal .multi-filter-panel{
  position:absolute;
  z-index:1300;
  width:max(100%,min(380px,calc(100vw - 40px)));
  max-width:min(420px,calc(100vw - 40px));
  max-height:none;
}
#reportFilterModal .multi-filter-options{
  max-height:min(260px,calc(100dvh - 260px));
  overflow-y:auto;
  overscroll-behavior:contain;
}
@media(max-width:800px){
  #reportFilterModal{padding:8px}
  #reportFilterModal .report-filter-modal-card{width:100%}
  #reportFilterModal .compact-modal-form{grid-template-columns:1fr}
  #reportFilterModal .compact-modal-form .span-2{grid-column:auto}
  #reportFilterModal .multi-filter-panel{
    position:absolute;
    left:0;
    right:auto;
    top:calc(100% + 5px);
    width:100%;
    max-width:100%;
    max-height:none;
  }
  #reportFilterModal .multi-filter-options{max-height:min(250px,calc(100dvh - 270px))}
}
@media(max-height:520px){
  #reportFilterModal .multi-filter-options{max-height:calc(100dvh - 250px)}
}

/* v2.9.4 compact permission, valuation and scanner refinements */
.mobile-app-body .sidebar,.mobile-app-body .topbar{display:none!important}
.mobile-app-body .app-main{margin-left:0!important;min-height:100dvh}
.mobile-app-body .content{max-width:none;padding:8px 10px 14px}
.mobile-app-body .mobile-context-strip{top:0}
.mobile-app-body .mobile-product-toolbar,.mobile-app-body .mobile-sticky-entry-actions{top:58px}
.mobile-app-body{overscroll-behavior-y:contain}
.mobile-app-body .app-shell,.mobile-app-body .app-main{contain:layout style}

body.scanner-open{overflow:hidden;touch-action:none}
.scanner-overlay{position:fixed;inset:0;z-index:20000;background:rgba(2,6,23,.52);display:flex;justify-content:center;align-items:flex-start;padding:calc(10px + env(safe-area-inset-top)) 10px 10px;color:var(--text);overflow:auto}
.scanner-card{width:min(3.45in,94vw);background:#fff;border:1px solid #cbd5e1;border-radius:14px;box-shadow:0 18px 50px rgba(15,23,42,.28);padding:9px;display:grid;gap:8px}
.scanner-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.scanner-head strong{font-size:.88rem}.scanner-close{min-height:32px!important}
.scanner-camera{position:relative;width:min(3in,90vw);height:min(2in,60vw);max-height:42vh;margin:0 auto;overflow:hidden;border-radius:10px;background:#000}
.scanner-overlay .scanner-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000;border:0;border-radius:10px}
.scanner-overlay:after{display:none!important}
.scanner-target{position:absolute;z-index:2;left:8%;right:8%;top:22%;bottom:22%;border:1px solid rgba(255,255,255,.7);border-radius:8px;box-shadow:none;transform:none;width:auto;height:auto}
.scanner-target i{position:absolute;width:24px;height:24px;border-color:#fff;border-style:solid}.scanner-target i:nth-child(1){left:-1px;top:-1px;border-width:3px 0 0 3px;border-radius:7px 0 0 0}.scanner-target i:nth-child(2){right:-1px;top:-1px;border-width:3px 3px 0 0;border-radius:0 7px 0 0}.scanner-target i:nth-child(3){left:-1px;bottom:-1px;border-width:0 0 3px 3px;border-radius:0 0 0 7px}.scanner-target i:nth-child(4){right:-1px;bottom:-1px;border-width:0 3px 3px 0;border-radius:0 0 7px 0}
.scanner-status{min-height:30px;padding:4px 2px;text-align:center;color:#64748b;font-size:.72rem;line-height:1.3}.scanner-scan{width:100%;min-height:42px!important}

.stock-key{display:inline-flex;gap:8px;align-items:center;flex-wrap:wrap}.stock-key span{display:inline-flex;align-items:center;gap:5px;font-size:.72rem;color:#475569}.stock-key i{width:13px;height:13px;border-radius:3px;border:1px solid #cbd5e1}.stock-key .zero i{background:#fee2e2;border-color:#fca5a5}.stock-key .low i{background:#fef3c7;border-color:#fcd34d}
.stock-zero-row>td{background:#fff0f0!important}.stock-zero-row:hover>td{background:#ffe4e6!important}.stock-low-row>td{background:#fff0f0!important}.stock-low-row:hover>td{background:#ffe4e6!important}
.stock-zero-label{color:#b91c1c;font-weight:850}.stock-low-label{color:#b91c1c;font-weight:850}

.compact-permissions{display:grid;gap:10px}.permission-module{border:1px solid #dbe3ec;border-radius:10px;background:#fff;overflow:hidden}.permission-module-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 10px;background:#f8fafc;border-bottom:1px solid #e2e8f0}.permission-module-head h3{font-size:.86rem;margin:0}.permission-module-actions{display:flex;gap:5px}.permission-grid-head,.permission-row{display:grid;grid-template-columns:minmax(180px,1fr) 92px 92px;align-items:center;gap:6px}.permission-grid-head{padding:6px 10px;background:#f1f5f9;color:#64748b;font-size:.67rem;font-weight:800;text-transform:uppercase}.permission-row{padding:6px 10px;border-top:1px solid #eef2f7}.permission-row:first-of-type{border-top:0}.permission-row .permission-label{font-size:.78rem}.permission-check{display:flex;align-items:center;justify-content:center}.permission-check input{width:18px;height:18px;accent-color:#2563eb}.report-permission-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:9px}.report-permission-list label{display:flex;align-items:center;gap:7px;border:1px solid #e2e8f0;border-radius:7px;padding:6px 8px;font-size:.76rem}.report-permission-list input{width:17px;height:17px;accent-color:#2563eb}

.adjustment-form-pad .field{padding:2px 3px}.adjustment-form-pad .input{min-width:0}.adjustment-table td,.adjustment-table th{padding-left:8px!important;padding-right:8px!important}.adjustment-table .active-entry{background:#eff6ff}.adjustment-table input[type=number]{min-width:100px}
.visually-hidden{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
@media(max-width:760px){.permission-grid-head,.permission-row{grid-template-columns:minmax(130px,1fr) 72px 72px}.report-permission-list{grid-template-columns:1fr}}
/* v2.9.4 stock state legend and compact report permission rows */
.stock-colour-key{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:7px 10px;border:1px solid #e2e8f0;border-radius:8px;background:#fff}
.stock-colour-key .stock-key{display:inline-flex;align-items:center;gap:5px;font-size:.72rem;color:#475569}
.stock-colour-key .stock-key::before{content:"";width:13px;height:13px;border-radius:3px;border:1px solid #cbd5e1;display:inline-block;flex:0 0 13px}
.stock-colour-key .stock-key.zero::before{background:#fee2e2;border-color:#fca5a5}
.stock-colour-key .stock-key.low::before{background:#fef3c7;border-color:#fcd34d}
.permission-row.report-row{grid-template-columns:minmax(220px,1fr) 160px}
@media(max-width:760px){.permission-row.report-row{grid-template-columns:minmax(130px,1fr) 120px}}

/* v2.10.0 professional action system and high-visibility notices */
:root{
  --nav:#2d2932;
  --nav2:#1d1a21;
  --accent:#67506f;
  --accent2:#8d7594;
  --danger:#a13f49;
  --success:#62566d;
  --warning:#a66d2b;
}
.brand-mark{background:linear-gradient(135deg,#806889,#51435a)}
.btn{
  border-radius:8px;
  border:1px solid #d3d0d8;
  background:#f2f0f4;
  color:#302c35;
  box-shadow:0 1px 2px rgba(29,26,33,.06);
  transition:background .15s ease,border-color .15s ease,box-shadow .15s ease,transform .1s ease;
}
.btn:hover{background:#e9e6ec;border-color:#beb8c4;box-shadow:0 3px 9px rgba(29,26,33,.08);filter:none}
.btn:focus-visible{outline:3px solid rgba(103,80,111,.22);outline-offset:2px}
.btn.primary,.btn.success{background:#5e4c66;border-color:#5e4c66;color:#fff}
.btn.primary:hover,.btn.success:hover{background:#4c3e53;border-color:#4c3e53}
.btn.warning{background:#9a672c;border-color:#9a672c;color:#fff}.btn.warning:hover{background:#7f5424;border-color:#7f5424}
.btn.danger{background:#9b3f48;border-color:#9b3f48;color:#fff}.btn.danger:hover{background:#80353d;border-color:#80353d}
.btn.ghost{background:#fff;border-color:#d3d0d8;color:#403947}.btn.ghost:hover{background:#f7f5f8;border-color:#aaa3b0}
.input:focus,.searchable-select-input:focus{outline:2px solid rgba(103,80,111,.18);border-color:#806889}
.permission-check input,.report-permission-list input{accent-color:#67506f}

/* Flash messages: visually distinct but not oversized badges. */
.alert{
  position:relative;
  align-items:flex-start;
  gap:12px;
  min-height:48px;
  padding:11px 42px 11px 48px;
  border:1px solid #d8d3dc;
  border-left-width:5px;
  border-radius:10px;
  background:#fff;
  color:#332f37;
  box-shadow:0 6px 18px rgba(29,26,33,.08);
  line-height:1.4;
}
.alert::before{
  position:absolute;left:14px;top:10px;width:25px;height:25px;border-radius:50%;display:grid;place-items:center;
  font-weight:900;font-size:.82rem;background:#eeeaf0;color:#5e4c66;
}
.alert>span{font-weight:650;padding-top:2px;white-space:pre-line}.alert>button{position:absolute;right:8px;top:6px;width:30px;height:30px;border-radius:7px;color:inherit;opacity:.7;cursor:pointer}
.alert>button:hover{background:rgba(0,0,0,.05);opacity:1}
.alert.success{background:#f8f6f9;color:#44384a;border-color:#cfc5d3;border-left-color:#67506f}.alert.success::before{content:'✓';background:#e9e3ec;color:#5a4562}
.alert.info{background:#f7f6f8;color:#3e3943;border-color:#d8d4dc;border-left-color:#716979}.alert.info::before{content:'i';background:#ece9ee;color:#5d5664}
.alert.warning{background:#fff9ef;color:#6f4b21;border-color:#ead4b6;border-left-color:#a66d2b}.alert.warning::before{content:'!';background:#f5e6d1;color:#85551e}
.alert.danger{background:#fff5f5;color:#71343a;border-color:#e7c1c5;border-left-color:#a13f49}.alert.danger::before{content:'!';background:#f2dadd;color:#8b3740}

.notice-card{width:min(520px,94vw);overflow:hidden;border:1px solid #d4d0d8;box-shadow:0 24px 60px rgba(29,26,33,.24)}
.notice-card .modal-head{background:#faf9fb;border-bottom:1px solid #e3dfe6}.notice-card .modal-head h2{font-size:1.05rem}.notice-card .modal-head p{margin-top:3px}
.notice-body{display:grid;grid-template-columns:48px minmax(0,1fr);align-items:flex-start;gap:13px;padding:18px 18px 16px;font-size:.9rem;line-height:1.52;white-space:pre-line}
.notice-icon{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;font-weight:950;font-size:1.15rem;background:#ece8ee;color:#5e4c66;border:1px solid #d5cdd9}
#erpNoticeDialog[data-tone="success"] .notice-card{border-top:4px solid #67506f}
#erpNoticeDialog[data-tone="success"] .notice-icon{background:#ece6ef;color:#5a4562;border-color:#d5c7da}
#erpNoticeDialog[data-tone="info"] .notice-card{border-top:4px solid #716979}
#erpNoticeDialog[data-tone="info"] .notice-icon{background:#eeecef;color:#5e5863;border-color:#d9d5db}
#erpNoticeDialog[data-tone="warning"] .notice-card{border-top:4px solid #a66d2b}
#erpNoticeDialog[data-tone="warning"] .notice-icon{background:#f8ead8;color:#85551e;border-color:#ecd1ae}
#erpNoticeDialog[data-tone="danger"] .notice-card{border-top:4px solid #a13f49}
#erpNoticeDialog[data-tone="danger"] .notice-icon{background:#f5dfe1;color:#8b3740;border-color:#e8c3c7}
#erpNoticeDialog .modal-actions{background:#faf9fb;border-top:1px solid #e5e1e8}

.backend-switch,.invoice-camera-btn,.invoice-submit-btn,.share-action{background:#5e4c66!important;border-color:#5e4c66!important;color:#fff!important}
@media(max-width:600px){.alert{margin:7px 4px 11px;padding:10px 38px 10px 44px}.notice-body{grid-template-columns:40px minmax(0,1fr);padding:15px}.notice-icon{width:38px;height:38px;border-radius:10px}}

/* v2.10.0 Invoice Submission module */
.invoice-identity-grid{display:grid;grid-template-columns:minmax(130px,.65fr) minmax(180px,.85fr) minmax(260px,1.5fr);gap:12px;align-items:end}
.invoice-identity-grid>div{border:1px solid #e2dfe5;border-radius:10px;background:#faf9fb;padding:10px 12px;min-height:67px}.invoice-identity-grid>div span{display:block;color:#766e7a;font-size:.69rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.invoice-identity-grid>div strong{display:block;margin-top:5px;font-size:.9rem;color:#332d38}
.invoice-capture-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-bottom:12px}.invoice-page-count{font-size:.76rem;font-weight:850;color:#5d5561;background:#f0edf2;border:1px solid #ded7e1;border-radius:999px;padding:5px 9px}
.invoice-page-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}.invoice-page-card{position:relative;border:1px solid #ddd8e0;border-radius:11px;background:#fff;padding:7px;box-shadow:0 2px 8px rgba(29,26,33,.05);overflow:hidden}.invoice-page-check{display:flex;align-items:center;gap:5px;font-size:.68rem;font-weight:800;color:#5f5864;margin:1px 2px 6px}.invoice-page-check input{width:17px;height:17px;accent-color:#67506f}.invoice-page-image{border:0;padding:0;width:100%;height:170px;background:#f2f0f3;border-radius:8px;overflow:hidden;display:grid;place-items:center;cursor:zoom-in}.invoice-page-image img{width:100%;height:100%;object-fit:contain}.invoice-file-placeholder{cursor:default;align-content:center;gap:7px;padding:14px;text-align:center;color:#35506d}.invoice-file-placeholder strong{font-size:1.15rem;letter-spacing:.04em}.invoice-file-placeholder span{font-size:.72rem;line-height:1.35;color:#6c7b8c}.invoice-page-card>div:last-child{display:grid;gap:2px;padding:7px 2px 2px}.invoice-page-card strong{font-size:.78rem}.invoice-page-card small{color:#766f7b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.invoice-empty{display:grid;place-items:center;text-align:center;gap:4px;color:#77707c;padding:34px 16px}.invoice-empty strong{color:#4c4550}.invoice-empty[hidden]{display:none!important}
.invoice-submit-sticky{position:sticky;bottom:8px;z-index:25;display:flex;justify-content:flex-end;gap:8px;padding:9px;margin-top:10px;border:1px solid #ded9e2;border-radius:12px;background:rgba(255,255,255,.94);box-shadow:0 10px 26px rgba(29,26,33,.14);backdrop-filter:blur(8px)}.invoice-submit-btn{min-height:42px;padding-inline:18px}
.invoice-preview-card{width:min(820px,96vw);max-height:94dvh;overflow:hidden;display:flex;flex-direction:column}.invoice-preview-stage{height:min(72dvh,720px);display:grid;place-items:center;overflow:hidden;background:#fff;padding:10px}.invoice-preview-stage.zoom-active{overflow:auto;place-items:start center}.invoice-preview-stage img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;background:#fff;transform-origin:center;cursor:zoom-in}.invoice-preview-stage img.zoomed{width:auto;height:auto;max-width:none;max-height:none;object-fit:unset;cursor:zoom-out}
.invoice-recent-card{width:min(760px,96vw);max-height:90dvh;overflow:hidden;display:flex;flex-direction:column}.invoice-recent-list{overflow:auto;padding:8px 12px 14px}.invoice-recent-list article{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 4px;border-bottom:1px solid #ece9ef}.invoice-recent-list article>div:first-child{display:grid;gap:2px}.invoice-recent-list article span,.invoice-recent-list article small{font-size:.72rem;color:#726b76}.invoice-recent-status{display:flex;align-items:center;justify-content:flex-end;gap:5px;flex-wrap:wrap}
.invoice-state{display:inline-flex;align-items:center;border-radius:999px;padding:4px 7px;border:1px solid #d8d3dc;background:#f2eff3;color:#5b535f;font-size:.67rem;font-weight:850;white-space:nowrap}.invoice-state.ok{background:#f1edf3;border-color:#d9cfe0;color:#594861}.invoice-state.pending{background:#fff6e9;border-color:#ead3ae;color:#7d551e}.invoice-state.unclear{background:#fff0f1;border-color:#e6bec2;color:#83373f}
.invoice-metrics{grid-template-columns:repeat(4,minmax(0,1fr))}.invoice-outlet-summary{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:8px}.invoice-outlet-summary a{display:grid;grid-template-columns:42px minmax(0,1fr);align-items:center;gap:8px;border:1px solid #e0dce3;border-radius:9px;background:#faf9fb;padding:9px}.invoice-outlet-summary strong{display:grid;place-items:center;width:38px;height:32px;border-radius:8px;background:#eee9f0;color:#5b4863}.invoice-outlet-summary span{font-size:.78rem;font-weight:750}.invoice-finance-filters select[multiple]{min-height:84px}.invoice-bulk-toolbar{display:flex;gap:6px;align-items:center;flex-wrap:wrap;padding:9px 11px;background:#faf9fb;border-bottom:1px solid #e4e0e6}.invoice-bulk-toolbar #invoiceSelectedCount{margin-left:auto;color:#6a626e;font-size:.74rem;font-weight:800}.invoice-row-pending>td{background:#fffbf5!important}.invoice-row-unclear>td{background:#fff5f5!important}
.invoice-view-status{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:-5px 0 10px;color:#6a626e;font-size:.75rem}.invoice-document-viewer{overflow:hidden;background:#fff}.invoice-view-stage{height:min(72dvh,760px);display:grid;place-items:center;overflow:hidden;background:#fff;padding:8px}.invoice-view-stage.zoom-active{overflow:auto;place-items:start center}.invoice-view-stage img{display:block;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;background:#fff;cursor:zoom-in;transform-origin:center}.invoice-view-stage img.zoomed{width:auto;height:auto;max-width:none;max-height:none;object-fit:unset;cursor:zoom-out}.invoice-view-thumbs{display:flex;gap:8px;overflow-x:auto;padding:9px 10px;background:#fff;border-top:1px solid #e1dde4}.invoice-view-thumbs button{display:grid;grid-template-columns:52px auto;align-items:center;gap:7px;min-width:max-content;border:1px solid #ddd7e0;background:#fff;border-radius:8px;padding:4px 7px;color:#5d5662;cursor:pointer}.invoice-view-thumbs button.active{border-color:#806889;box-shadow:0 0 0 2px rgba(103,80,111,.12)}.invoice-view-thumbs img{width:48px;height:48px;object-fit:contain;background:#fff;border-radius:5px}.invoice-view-thumbs span{font-size:.7rem;font-weight:800}
@media(max-width:800px){.invoice-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.invoice-identity-grid{grid-template-columns:1fr 1fr}.invoice-identity-grid .field{grid-column:1/-1}.invoice-finance-filters .field{min-width:calc(50% - 8px)}}
@media(max-width:560px){.invoice-mobile-head{display:grid;gap:8px}.invoice-mobile-head .actions{width:100%}.invoice-mobile-head .actions .btn{flex:1}.invoice-identity-grid{grid-template-columns:1fr 1fr;gap:7px}.invoice-identity-grid>div{padding:8px 9px;min-height:58px}.invoice-capture-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.invoice-capture-actions .btn{width:100%;min-height:42px}.invoice-capture-actions .btn.danger{grid-column:1/-1}.invoice-page-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.invoice-page-image{height:150px}.invoice-submit-sticky{bottom:6px;display:grid;grid-template-columns:1.3fr .8fr}.invoice-submit-sticky .btn{width:100%;min-height:44px}.invoice-preview-stage,.invoice-view-stage{height:68dvh;padding:6px}.invoice-recent-list article{align-items:flex-start;flex-direction:column}.invoice-recent-status{width:100%;justify-content:flex-start}.invoice-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.invoice-bulk-toolbar #invoiceSelectedCount{width:100%;margin-left:0}.invoice-finance-filters .field{width:100%;min-width:100%}.invoice-view-thumbs button{grid-template-columns:42px auto}.invoice-view-thumbs img{width:38px;height:38px}}

/* v2.10.1 compact report centre + inline export menus */
.action-menu-group-label{padding:7px 10px 4px;margin-top:3px;border-top:1px solid #e5e7eb;color:#6b7280;font-size:.64rem;font-weight:850;text-transform:uppercase;letter-spacing:.055em}.action-menu-group-label:first-child{margin-top:0;border-top:0;padding-top:4px}
.report-centre-shell{display:grid;gap:10px}.report-centre-shell>.panel{margin-bottom:0}.report-launcher{overflow:visible}.report-launcher-title{padding:8px 12px 0;font-size:.8rem;font-weight:850;color:#334155}.report-launcher-form{display:grid;grid-template-columns:minmax(220px,.8fr) minmax(280px,1.2fr) auto;gap:9px;align-items:end;padding:8px 12px 11px}.report-launcher-form .field{min-width:0}.report-launcher-form .btn{min-width:112px}.report-results-panel{overflow:visible}.report-results-head{min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:7px 11px;border-bottom:1px solid var(--border);background:#fff}.report-results-head h2{margin:0;font-size:.96rem;letter-spacing:-.01em}.report-summary-inline{display:flex;align-items:center;justify-content:flex-end;gap:0;flex-wrap:wrap}.report-summary-inline>span{display:flex;align-items:baseline;gap:5px;padding:0 9px;border-left:1px solid #e2e8f0;white-space:nowrap}.report-summary-inline>span:first-child{border-left:0}.report-summary-inline small{font-size:.63rem;color:#64748b;font-weight:700}.report-summary-inline strong{font-size:.82rem;color:#26384f}.report-filter-form{padding:7px 10px!important;gap:6px!important;background:#fbfcfe}.report-filter-form .field{min-width:118px}.report-filter-form .field.grow{min-width:260px}.report-filter-form .input{min-height:32px;padding:6px 8px}.report-filter-form .btn{min-height:31px}.report-table-toolbar{min-height:38px;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:5px 10px;border-bottom:1px solid var(--border);background:#fff}.report-table-toolbar>strong{font-size:.73rem;color:#64748b}.report-table-wrap{max-height:calc(100vh - 285px);min-height:180px;overflow:auto}.report-table-wrap .data-table th{top:0;z-index:3}.report-results-panel .pager{padding:8px 10px}.report-results-panel .table-tools{padding:5px 9px}.report-filter-modal-card .modal-head{padding:9px 12px}.report-filter-modal-body{padding:10px!important}.report-filter-modal-card .modal-actions{padding:7px 10px}.report-results-panel .margin-badge{all:unset}
@media(max-width:980px){.report-launcher-form{grid-template-columns:1fr 1fr auto}.report-summary-inline{width:100%;justify-content:flex-start}.report-results-head{align-items:flex-start;flex-wrap:wrap}.report-table-wrap{max-height:65vh}}
@media(max-width:700px){.report-launcher-form{grid-template-columns:1fr}.report-launcher-form .btn{width:100%}.report-summary-inline>span{padding:2px 7px}.report-summary-inline>span:first-child{padding-left:0}.report-filter-form .field.grow{min-width:0}.report-table-wrap{max-height:68vh}.report-table-toolbar{position:sticky;top:56px;z-index:8}.report-results-head{padding:7px 9px}}

/* v2.10.3 Stock Adjustment desktop spacing / overlap protection */
.adjustment-editor .adjustment-form-pad{padding:13px 14px}.adjustment-header-grid{grid-template-columns:repeat(4,minmax(170px,1fr));gap:10px}.adjustment-header-grid .field{min-width:0}.adjustment-header-grid .span-2{grid-column:span 2}.adjustment-table-wrap{width:100%;max-width:100%;overflow-x:auto;overflow-y:visible;overscroll-behavior-inline:contain}.adjustment-table{min-width:1580px;table-layout:auto}.adjustment-table th,.adjustment-table td{white-space:nowrap;vertical-align:middle}.adjustment-table td:nth-child(2){min-width:210px;white-space:normal}.adjustment-table .input{min-width:0}.adjustment-table select.input{width:92px}.adjustment-table input[type=number]{width:118px;min-width:118px}.adjustment-table input[name=item_remarks]{width:170px;min-width:170px}.adjustment-table .product-name{overflow-wrap:anywhere}.adjustment-table-wrap::-webkit-scrollbar{height:10px}.adjustment-table-wrap::-webkit-scrollbar-thumb{background:#c4ceda;border-radius:999px}.adjustment-form-pad .choice-row{margin-bottom:10px}
@media(max-width:1200px){.adjustment-header-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.adjustment-header-grid .span-2{grid-column:span 2}}
@media(max-width:800px){.adjustment-header-grid{grid-template-columns:1fr}.adjustment-header-grid .span-2{grid-column:auto}.adjustment-editor .adjustment-form-pad{padding:10px}.adjustment-table{min-width:1500px}}

/* v2.10.4 Product Master + Purchase Order cost/price presentation cleanup */
.product-overview-line{
  display:flex;align-items:center;gap:0;flex-wrap:wrap;padding:7px 11px;
  border-bottom:1px solid var(--border);background:#fff;color:#536275;font-size:.72rem
}
.product-overview-line>span{padding:0 10px;border-left:1px solid #e2e8f0;white-space:nowrap}
.product-overview-line>span:first-child{padding-left:0;border-left:0}
.product-overview-line strong{color:#24364d;font-size:.82rem;font-variant-numeric:tabular-nums}
.product-table-controls{display:flex;align-items:center;justify-content:flex-end;padding:6px 10px;border-top:1px solid var(--border);background:#fbfcfe}
.product-cost-column-toggle{display:inline-flex;align-items:center;gap:6px;min-width:190px;justify-content:flex-start}.product-cost-column-toggle .toggle-arrow{width:12px;color:#64748b}.product-cost-column-toggle .toggle-state{margin-left:auto;font-size:.65rem;color:#64748b;font-weight:800}
#productTable.product-cost-columns-collapsed .product-cost-col{display:none!important}

.collapsible-cost-panel{overflow:visible}
.collapsible-cost-panel>summary{list-style:none}
.collapsible-cost-panel>summary::-webkit-details-marker{display:none}
.collapsible-panel-summary{display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:48px;padding:10px 13px;cursor:pointer;background:#fff;border-radius:inherit;user-select:none}
.collapsible-panel-summary>span:first-child{display:grid;gap:2px}
.collapsible-panel-summary strong{font-size:.9rem;color:#26384f}
.collapsible-panel-summary small{font-size:.7rem;color:#718096;font-weight:500}
.collapsible-panel-summary .collapse-state::before{content:'Show';display:inline-block;min-width:42px;text-align:center;font-size:.67rem;font-weight:850;color:#56667a}
.collapsible-cost-panel[open] .collapsible-panel-summary{border-bottom:1px solid var(--border);border-radius:10px 10px 0 0}
.collapsible-cost-panel[open] .collapsible-panel-summary .collapse-state::before{content:'Hide'}
.compact-cost-panel-body{padding:10px 12px 12px!important}
.cost-sequence{display:grid;border:1px solid #dfe6ee;border-radius:9px;overflow:hidden;background:#fff}
.cost-sequence-row{display:grid;grid-template-columns:28px minmax(220px,1fr) minmax(120px,auto);gap:9px;align-items:center;padding:8px 10px;border-top:1px solid #e7edf3}
.cost-sequence-row:first-child{border-top:0}
.cost-sequence-row>div{display:grid;gap:1px;min-width:0}
.cost-sequence-row>div>span{font-size:.73rem;font-weight:800;color:#334155}
.cost-sequence-row small{font-size:.65rem;color:#718096;line-height:1.3}
.cost-sequence-row>strong{text-align:right;font-size:.82rem;color:#26384f;font-variant-numeric:tabular-nums;white-space:nowrap}
.cost-step{display:block;width:22px;font-size:.66rem;font-weight:900;color:#7a8797;text-align:center;font-variant-numeric:tabular-nums}
.compact-price-fields{margin-top:10px;gap:9px!important}
.plain-value-field{display:flex;align-items:center;background:#f8fafc;color:#26384f;font-weight:750}

.po-cost-sequence{margin:0;border-top:1px solid var(--border);background:#fff}
.po-cost-sequence-title{padding:7px 11px 5px;font-size:.7rem;font-weight:850;text-transform:uppercase;letter-spacing:.055em;color:#64748b;background:#fbfcfe}
.po-cost-sequence-row{display:grid;grid-template-columns:28px minmax(220px,1fr) minmax(150px,auto);align-items:center;gap:8px;padding:7px 11px;border-top:1px solid #e8edf2}
.po-cost-sequence-row .po-cost-label{display:grid;gap:1px;min-width:0;font-size:.73rem;font-weight:800;color:#334155}
.po-cost-sequence-row .po-cost-label small{font-size:.64rem;font-weight:500;color:#718096}
.po-cost-sequence-row>strong{text-align:right;font-size:.84rem;color:#26384f;font-variant-numeric:tabular-nums;white-space:nowrap}
.po-cost-sequence-row.po-cost-final{background:#fafbfd;border-top:1px solid #ccd7e3}
.po-cost-sequence-row.po-cost-final .po-cost-label,.po-cost-sequence-row.po-cost-final>strong{font-weight:900;color:#1f3044}
/* Retire the old PO card/badge summary if a cached template leaves one behind. */
.po-cost-summary{display:none!important}

@media(max-width:800px){
  .product-overview-line{align-items:flex-start;gap:4px;padding:7px 9px}.product-overview-line>span{white-space:normal;border-left:0;padding:0 8px 0 0}
  .product-table-controls{justify-content:stretch}.product-cost-column-toggle{width:100%}
  .collapsible-panel-summary{padding:10px}.collapsible-panel-summary small{display:none}
  .cost-sequence-row,.po-cost-sequence-row{grid-template-columns:24px minmax(0,1fr) auto;padding:8px;gap:7px}
  .cost-sequence-row small,.po-cost-sequence-row .po-cost-label small{display:none}
  .cost-sequence-row>strong,.po-cost-sequence-row>strong{font-size:.76rem;white-space:normal;text-align:right}
}

/* v2.10.5 true Fit-to-Window image viewers --------------------------------
   Normal viewer mode must always show the complete picture, regardless of the
   original pixel dimensions. Scrolling is enabled only after explicit zoom. */
.product-gallery-stage,
.product-gallery-viewport,
.invoice-preview-stage,
.invoice-view-stage{min-width:0;min-height:0}
.product-gallery-viewport{width:100%;max-width:100%}
.product-gallery-viewport img:not(.zoomed),
.invoice-preview-stage img:not(.zoomed),
.invoice-view-stage img:not(.zoomed){
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  margin:auto!important;
  background:#fff!important;
}
.product-gallery-viewport:not(.zoom-active),
.invoice-preview-stage:not(.zoom-active),
.invoice-view-stage:not(.zoom-active){overflow:hidden!important;place-items:center!important;background:#fff!important}
.product-gallery-viewport.zoom-active img.zoomed,
.invoice-preview-stage.zoom-active img.zoomed,
.invoice-view-stage.zoom-active img.zoomed{margin:0 auto!important}

/* v1.6.29: cross-document root transitions disabled to keep the ERP shell visually stable. */

/* v2.10.6 measured image fitting -----------------------------------------
   The viewer itself owns a definite height; JS then computes the exact scale
   from natural image dimensions to the live content box. */
.product-gallery-card{width:min(1100px,96vw)!important;height:min(94dvh,900px)!important;max-height:94dvh!important;overflow:hidden!important;display:flex!important;flex-direction:column!important}
.product-gallery-card>.modal-head,.product-gallery-card>.product-gallery-caption,.product-gallery-card>.product-gallery-thumbs,.product-gallery-card>.modal-actions{flex:0 0 auto}
.product-gallery-stage{flex:1 1 auto!important;min-height:0!important;overflow:hidden!important}
.product-gallery-viewport{height:100%!important;min-height:0!important;overflow:hidden!important}
.invoice-preview-card{height:min(94dvh,900px)!important;max-height:94dvh!important}
.invoice-preview-card>.modal-head,.invoice-preview-card>.modal-actions{flex:0 0 auto}
.invoice-preview-stage{flex:1 1 auto!important;height:auto!important;min-height:0!important;overflow:hidden!important}
.invoice-view-stage{height:clamp(280px,calc(100dvh - 280px),760px)!important;min-height:0!important;overflow:hidden!important}
/* viewer hotfix: CSS is the first safety layer. A non-zoomed image
   must fit even before app.js loads or if JavaScript is delayed. */
.product-gallery-viewport img:not(.zoomed),
.invoice-preview-stage img:not(.zoomed),
.invoice-view-stage img:not(.zoomed){
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  margin:auto!important;
  background:#fff!important;
}
@media(max-width:560px){
  .product-gallery-card{height:98dvh!important;max-height:98dvh!important;width:100%!important}
  .product-gallery-stage{padding:5px!important;grid-template-columns:36px minmax(0,1fr) 36px!important}
  .invoice-preview-card{height:98dvh!important;max-height:98dvh!important}
  .invoice-view-stage{height:clamp(240px,calc(100dvh - 230px),680px)!important}
}

/* v2.10.7 compact document-files modal ----------------------------------- */
.document-files-modal{width:min(760px,92vw)!important;max-height:88vh}
@media(max-width:800px){.document-files-modal{width:100%!important;max-height:96vh}}


/* black manual sidebar + light professional buttons ---------------- */
:root{
  --nav:#111214;
  --nav2:#050506;
  --accent:#6b7280;
  --accent2:#9ca3af;
  --danger:#9b4d55;
  --success:#4f725d;
  --warning:#8a672f;
}
.sidebar{
  background:linear-gradient(180deg,#151618 0%,#050506 100%);
  color:#f8fafc;
  border-right:1px solid #000;
}
.brand-mark{
  background:#e5e7eb;
  border:1px solid #d1d5db;
  color:#202225;
  box-shadow:none;
}
.brand small{color:#e5e7eb;opacity:.82}
.sidebar nav>a,.sidebar summary,.sidebar details div a{color:#f3f4f6}
.sidebar details div a{color:#e2e5e9}
.sidebar nav>a:hover,.sidebar summary:hover,.sidebar details div a:hover{background:rgba(255,255,255,.10);color:#fff}
.sidebar nav>a.active,.sidebar details div a.active{background:rgba(255,255,255,.18);color:#fff;font-weight:800}
.sidebar nav details[data-sidebar-section]>summary::after{opacity:.88}

/* One light action language across backend. Danger/warning remain clearly
   distinguishable but use light fills rather than heavy solid buttons. */
.btn,
.icon-btn{
  background:#f7f8fa;
  border-color:#d8dde4;
  color:#3f4854;
  box-shadow:0 1px 2px rgba(31,41,55,.04);
}
.btn:hover,.icon-btn:hover{background:#eef1f4;border-color:#c7cdd6;color:#303843;box-shadow:0 2px 6px rgba(31,41,55,.06);filter:none}
.btn:focus-visible,.icon-btn:focus-visible{outline:3px solid rgba(107,114,128,.18);outline-offset:2px}
.btn.primary{
  background:#eef0f4;
  border-color:#cbd1da;
  color:#46505d;
}
.btn.primary:hover{background:#e3e7ec;border-color:#b8c0cb;color:#343d48}
.btn.success{
  background:#edf6f0;
  border-color:#c8dfd0;
  color:#356047;
}
.btn.success:hover{background:#e3f0e7;border-color:#b5d2bf;color:#294d39}
.btn.warning{
  background:#fff7e8;
  border-color:#ead6ad;
  color:#765523;
}
.btn.warning:hover{background:#fbeecf;border-color:#dcc38f;color:#65471c}
.btn.danger{
  background:#fff0f1;
  border-color:#e4bdc1;
  color:#8a3f48;
}
.btn.danger:hover{background:#f9e3e5;border-color:#d7a6ab;color:#73343c}
.btn.ghost{background:#fff;border-color:#d8dde4;color:#46505d}.btn.ghost:hover{background:#f4f6f8;border-color:#c6ccd4}

.action-create{
  background:#eef1f5!important;
  border-color:#cbd2dc!important;
  color:#3f4b59!important;
}
.action-create:hover{background:#e3e7ed!important;border-color:#b8c1cd!important}
.action-import{
  background:#eef7f1!important;
  border-color:#c9e0d1!important;
  color:#356247!important;
}
.action-import:hover{background:#e3f0e7!important;border-color:#b7d3c0!important}
.action-export{
  background:#fff8ea!important;
  border-color:#ead9b6!important;
  color:#765824!important;
}
.action-export:hover{background:#fbefd4!important;border-color:#dcc798!important}
.action-more{background:#f6f7f9!important;border-color:#d8dde4!important;color:#46505d!important}

/* Special action classes that previously forced dark purple/blue/green. */
.backend-switch,.invoice-camera-btn,.invoice-submit-btn,.share-action,
.mobile-scan-action,.mobile-save-action{
  background:#eef1f5!important;
  border-color:#cbd2dc!important;
  color:#3f4b59!important;
  box-shadow:none!important;
}
.backend-switch:hover,.invoice-camera-btn:hover,.invoice-submit-btn:hover,.share-action:hover,
.mobile-scan-action:hover,.mobile-save-action:hover{background:#e3e7ed!important;border-color:#b8c1cd!important}
.permission-check input,.report-permission-list input{accent-color:#6b7280}
.input:focus,.searchable-select-input:focus{outline:2px solid rgba(107,114,128,.16);border-color:#9ca3af}
.scanner-close{
  background:rgba(255,255,255,.94)!important;
  border:1px solid rgba(209,213,219,.95)!important;
  color:#374151!important;
  box-shadow:0 2px 8px rgba(0,0,0,.12)!important;
}
.scanner-close:hover{background:#fff!important;border-color:#c5cad1!important}


/* definitive Product + Invoice fit-to-window fix --------------------
   These two viewers use the stage itself as the image box. In normal mode the
   image fills that box geometrically but object-fit:contain guarantees that the
   entire source image is visible. No JavaScript pixel sizing is involved. */
.product-gallery-viewport,
.invoice-view-stage{
  position:relative!important;
  overflow:hidden!important;
  background:#fff!important;
}
.product-gallery-viewport img:not(.zoomed),
.invoice-view-stage img:not(.zoomed){
  position:absolute!important;
  inset:0!important;
  display:block!important;
  width:100%!important;
  height:100%!important;
  min-width:0!important;
  min-height:0!important;
  max-width:none!important;
  max-height:none!important;
  margin:0!important;
  padding:0!important;
  object-fit:contain!important;
  object-position:center center!important;
  transform:none!important;
  background:#fff!important;
}
.product-gallery-viewport.zoom-active,
.invoice-view-stage.zoom-active{
  overflow:auto!important;
}
.product-gallery-viewport.zoom-active img.zoomed,
.invoice-view-stage.zoom-active img.zoomed{
  position:static!important;
  inset:auto!important;
  width:auto!important;
  height:auto!important;
  max-width:none!important;
  max-height:none!important;
  object-fit:unset!important;
  margin:0 auto!important;
}

/* branding, transient media notices, and SMTP readiness ----------- */
.brand-logo-wrap{
  width:38px;height:38px;border-radius:9px;background:#fff;border:1px solid rgba(255,255,255,.28);
  display:grid;place-items:center;overflow:hidden;flex:0 0 38px;
}
.brand-logo{display:block;width:100%;height:100%;object-fit:contain;object-position:center;background:#fff}
.login-brand-logo{width:50px;height:50px;flex-basis:50px;border-color:#d8dde4}
.organization-logo-preview{margin-top:8px;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.organization-logo-preview img{width:84px;height:60px;object-fit:contain;background:#fff;border:1px solid #d8dde4;border-radius:8px;padding:4px}
.smtp-status{border:1px solid #d8dde4;border-left-width:4px;border-radius:8px;padding:10px 12px;background:#fbfcfd;display:grid;gap:4px}
.smtp-status strong{font-size:.86rem}.smtp-status span,.smtp-status small{color:#667085;font-size:.76rem}.smtp-status.ready{border-left-color:#6f927b;background:#f5faf6}.smtp-status.missing{border-left-color:#b48643;background:#fffaf1}.smtp-status code{font-size:.72rem}
.erp-toast-stack{position:fixed;top:70px;right:16px;z-index:2500;width:min(380px,calc(100vw - 24px));display:grid;gap:7px;pointer-events:none}
.erp-toast{margin:0!important;box-shadow:0 10px 30px rgba(15,23,42,.16);pointer-events:auto}
@media(max-width:800px){.erp-toast-stack{top:10px;right:8px;left:8px;width:auto}.organization-logo-preview{align-items:flex-start}}

/* GST accounting summary */
.tax-rule-summary{
  display:grid;
  gap:.38rem;
  padding:.75rem .9rem;
  border:1px solid var(--line,#d8dee8);
  border-radius:10px;
  background:#fafbfc;
  color:var(--text,#1f2937);
}
.tax-rule-summary strong{font-size:.9rem}
.tax-rule-summary span{font-size:.82rem;color:var(--muted,#667085);line-height:1.35}

/* branded error/status pages */
.erp-status-panel{max-width:780px;margin:32px auto}.erp-status-alert{display:block;padding:20px 22px}.erp-status-alert strong{display:block;font-size:1.1rem;margin-bottom:6px}.erp-status-alert p{margin:6px 0 0}

/* idle-session warning */
.idle-session-card{max-width:560px}.idle-session-card .notice-body p{margin:8px 0 0}.idle-session-card [data-idle-countdown]{font-variant-numeric:tabular-nums;font-weight:800}

/* report matrix totals */
.report-results-panel .report-total-row td{font-weight:700;background:#f3f6fa;border-top:2px solid #9aa9ba;}
.report-results-panel .report-total-row td:last-child{font-weight:800;}

/* protected document viewer: same fit/zoom behavior as Invoice/Product picture viewers. */
.document-inline-viewer-page{min-height:calc(100vh - 120px)}.erp-document-viewer{height:calc(100vh - 190px);min-height:520px;overflow:hidden;background:#fff}.erp-document-stage{height:100%;min-height:0;display:flex;align-items:center;justify-content:center;overflow:auto;background:#fff;padding:12px}.erp-document-stage img{display:block;max-width:none;max-height:none;object-fit:contain;background:#fff}.erp-document-stage iframe{width:100%;height:100%;min-height:500px;border:0;background:#fff}.unsupported-document{max-width:620px;text-align:center;padding:30px}.document-inline-viewer-page .page-head{margin-bottom:10px}@media(max-width:700px){.erp-document-viewer{height:calc(100dvh - 155px);min-height:420px}.erp-document-stage{padding:0}.erp-document-stage iframe{min-height:420px}.document-inline-viewer-page .page-head{gap:8px}.document-inline-viewer-page .page-head h1{font-size:1.05rem}.document-inline-viewer-page .page-head p{max-width:60vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}

/* form breathing room */
.bill-filter-bar{gap:12px;padding:14px 16px}.bill-filter-bar .field{min-width:160px}.bill-filter-bar .field.grow{min-width:260px}.product-import-map-grid{margin-bottom:16px}.product-import-map-grid .field{padding-bottom:2px}
@media(max-width:800px){.bill-filter-bar{gap:10px;padding:12px}.bill-filter-bar .field,.bill-filter-bar .field.grow{min-width:0}}

/* compact universal picture/document viewer -----------------------
   Desktop standard: 4in x 3in viewing surface (384 x 288 CSS px at 96dpi).
   Fit mode always shows the complete image without cropping. Zoom mode keeps
   both horizontal and vertical scrolling so every part of a natural-size
   image remains reachable. Mobile scales the same viewer to the screen. */
:root{
  --erp-viewer-width:4in;
  --erp-viewer-height:3in;
  --erp-viewer-frame-width:4.3in;
}

/* Shared fitted-image rule. Never crop in normal/Fit mode. */
.product-gallery-viewport img:not(.zoomed),
.invoice-preview-stage img:not(.zoomed),
.invoice-view-stage img:not(.zoomed),
.erp-document-stage img:not(.zoomed){
  display:block!important;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center center!important;
  margin:auto!important;
  background:#fff!important;
}

/* Product Picture viewer: compact modal around the 4in x 3in image card. */
.product-gallery-card{
  width:min(5.35in,calc(100vw - 24px))!important;
  height:auto!important;
  max-height:calc(100dvh - 20px)!important;
  overflow:auto!important;
}
.product-gallery-stage{
  flex:0 0 auto!important;
  grid-template-columns:40px minmax(0,var(--erp-viewer-width)) 40px!important;
  justify-content:center!important;
  align-items:center!important;
  overflow:visible!important;
  padding:10px!important;
}
.product-gallery-viewport{
  width:var(--erp-viewer-width)!important;
  height:var(--erp-viewer-height)!important;
  max-width:100%!important;
  max-height:var(--erp-viewer-height)!important;
  min-height:0!important;
  overflow:hidden!important;
  touch-action:auto!important;
}

/* Mobile Invoice pre-submit picture preview. */
.invoice-preview-card{
  width:min(4.6in,calc(100vw - 20px))!important;
  height:auto!important;
  max-height:calc(100dvh - 20px)!important;
  overflow:auto!important;
}
.invoice-preview-stage{
  flex:0 0 auto!important;
  width:min(var(--erp-viewer-width),calc(100vw - 40px))!important;
  height:min(var(--erp-viewer-height),calc((100vw - 40px) * .75))!important;
  max-width:var(--erp-viewer-width)!important;
  max-height:var(--erp-viewer-height)!important;
  min-height:0!important;
  margin:0 auto!important;
  padding:6px!important;
  overflow:hidden!important;
}

/* Finance Invoice Submission viewer. */
.invoice-document-viewer{
  width:min(var(--erp-viewer-frame-width),100%)!important;
  max-width:100%!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.invoice-view-stage{
  width:min(var(--erp-viewer-width),calc(100vw - 40px))!important;
  height:min(var(--erp-viewer-height),calc((100vw - 40px) * .75))!important;
  max-width:var(--erp-viewer-width)!important;
  max-height:var(--erp-viewer-height)!important;
  min-height:0!important;
  margin:0 auto!important;
  padding:6px!important;
  overflow:hidden!important;
}
.invoice-view-thumbs{
  max-width:var(--erp-viewer-frame-width)!important;
  overflow-x:auto!important;
}

/* Protected Document viewer used by PO/Bill/etc. Image and PDF previews use
   the same compact card; PDFs retain their browser-native zoom/scroll tools. */
.document-inline-viewer-page{min-height:0!important}
.erp-document-viewer{
  width:min(var(--erp-viewer-frame-width),100%)!important;
  height:auto!important;
  min-height:0!important;
  margin-left:auto!important;
  margin-right:auto!important;
  overflow:hidden!important;
  background:#fff!important;
}
.erp-document-stage{
  width:min(var(--erp-viewer-width),calc(100vw - 40px))!important;
  height:min(var(--erp-viewer-height),calc((100vw - 40px) * .75))!important;
  max-width:var(--erp-viewer-width)!important;
  max-height:var(--erp-viewer-height)!important;
  min-height:0!important;
  margin:0 auto!important;
  padding:6px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  overflow:hidden!important;
  background:#fff!important;
}
.erp-document-stage iframe{
  width:100%!important;
  height:100%!important;
  min-height:0!important;
  border:0!important;
  background:#fff!important;
}

/* Explicit Zoom mode: show natural image size and allow full left/right +
   up/down scrolling. Start at the top-left so neither edge is unreachable. */
.product-gallery-viewport.zoom-active,
.invoice-preview-stage.zoom-active,
.invoice-view-stage.zoom-active,
.erp-document-stage.zoom-active{
  overflow:auto!important;
  place-items:start!important;
  align-items:flex-start!important;
  justify-content:flex-start!important;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-gutter:stable both-edges;
  touch-action:pan-x pan-y!important;
}
.product-gallery-viewport.zoom-active img.zoomed,
.invoice-preview-stage.zoom-active img.zoomed,
.invoice-view-stage.zoom-active img.zoomed,
.erp-document-stage.zoom-active img.zoomed{
  display:block!important;
  width:auto;
  height:auto;
  max-width:none!important;
  max-height:none!important;
  object-fit:unset!important;
  margin:0!important;
}

@media(max-width:700px){
  :root{--erp-viewer-frame-width:100%}
  .product-gallery-card{
    width:100%!important;
    max-width:100%!important;
    max-height:100dvh!important;
    border-radius:0!important;
  }
  .product-gallery-overlay{padding:0!important;align-items:stretch!important}
  .product-gallery-stage{
    grid-template-columns:34px minmax(0,1fr) 34px!important;
    padding:6px!important;
  }
  .product-gallery-viewport{
    width:100%!important;
    height:min(calc((100vw - 92px) * .75),calc(100dvh - 250px))!important;
    max-height:calc(100dvh - 250px)!important;
  }
  .invoice-preview-card{width:calc(100vw - 12px)!important;max-height:calc(100dvh - 12px)!important}
  .invoice-preview-stage,
  .invoice-view-stage,
  .erp-document-stage{
    width:calc(100vw - 32px)!important;
    height:min(calc((100vw - 32px) * .75),calc(100dvh - 220px))!important;
    max-width:100%!important;
    max-height:calc(100dvh - 220px)!important;
  }
  .invoice-document-viewer,.erp-document-viewer{width:100%!important}
}

/* large universal carousel viewer ---------------------------------
   Desktop standard uses an 8in x 6in presentation. All major
   ERP image/document viewers now use arrows + a thumbnail strip, while Fit
   preserves the complete image and Zoom keeps pan/scroll in both axes. */
:root{
  --erp-viewer-width:8in;
  --erp-viewer-height:6in;
  --erp-viewer-frame-width:9.2in;
}
.viewer-counter{display:inline-flex;align-items:center;justify-content:center;min-width:54px;font-weight:800;color:#5f5962;font-size:.78rem}
.viewer-nav{width:46px;height:54px;border:1px solid #d7d2d9;border-radius:10px;background:#fff;color:#4f4852;font-size:2rem;line-height:1;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:0 2px 8px rgba(30,24,34,.06);flex:0 0 auto}
.viewer-nav:hover{background:#f7f5f8}.viewer-nav:disabled{opacity:.35;cursor:not-allowed}
.product-gallery-card,.invoice-preview-card{width:min(9.45in,calc(100vw - 24px))!important;max-width:100%!important}
.product-gallery-stage,.invoice-preview-carousel,.invoice-view-carousel,.erp-viewer-carousel{display:grid!important;grid-template-columns:46px minmax(0,var(--erp-viewer-width)) 46px!important;gap:10px!important;align-items:center!important;justify-content:center!important;width:100%!important;padding:10px!important;box-sizing:border-box}
.product-gallery-viewport,.invoice-preview-stage,.invoice-view-stage,.erp-document-stage{width:min(var(--erp-viewer-width),calc(100vw - 150px))!important;height:min(var(--erp-viewer-height),calc(100dvh - 285px))!important;max-width:var(--erp-viewer-width)!important;max-height:var(--erp-viewer-height)!important;min-height:320px!important;margin:0 auto!important;background:#fff!important;border:1px solid #e2dde5!important;border-radius:10px!important;box-sizing:border-box}
.product-gallery-viewport,.invoice-preview-stage,.invoice-view-stage,.erp-document-stage{display:flex!important;align-items:center!important;justify-content:center!important;overflow:hidden!important;padding:8px!important}
.invoice-view-stage iframe,.erp-document-stage iframe{width:100%!important;height:100%!important;min-height:0!important;border:0!important;background:#fff!important;border-radius:6px}
.invoice-document-viewer,.erp-document-viewer{width:min(var(--erp-viewer-frame-width),100%)!important;max-width:100%!important;margin-left:auto!important;margin-right:auto!important;overflow:hidden!important;background:#fff!important}
.universal-viewer-thumbs,.invoice-view-thumbs,.product-gallery-thumbs{display:flex!important;gap:8px!important;overflow-x:auto!important;overflow-y:hidden!important;max-width:var(--erp-viewer-frame-width)!important;margin:0 auto!important;padding:10px!important;background:#fff!important;border-top:1px solid #e5e0e7!important;scrollbar-gutter:stable!important;box-sizing:border-box}
.universal-viewer-thumb,.invoice-view-thumbs .universal-viewer-thumb,.product-gallery-thumbs button{display:grid!important;grid-template-columns:58px minmax(70px,150px)!important;align-items:center!important;gap:7px!important;min-width:max-content!important;max-width:230px!important;border:1px solid #dcd6df!important;background:#fff!important;border-radius:9px!important;padding:5px 7px!important;color:#5b5460!important;cursor:pointer!important;box-sizing:border-box!important}
.universal-viewer-thumb.active,.invoice-view-thumbs .universal-viewer-thumb.active,.product-gallery-thumbs button.active{border-color:#806889!important;box-shadow:0 0 0 2px rgba(103,80,111,.14)!important;background:#fbf9fc!important}
.universal-viewer-thumb img,.invoice-view-thumbs .universal-viewer-thumb img,.product-gallery-thumbs img{width:54px!important;height:54px!important;object-fit:contain!important;background:#fff!important;border-radius:5px!important}
.universal-viewer-thumb>span:last-child{font-size:.72rem!important;font-weight:800!important;line-height:1.2!important;overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;text-align:left!important}
.viewer-file-badge{width:54px;height:54px;border-radius:6px;display:flex!important;align-items:center;justify-content:center;font-size:.68rem!important;font-weight:900!important;letter-spacing:.04em;background:#f0edf2;color:#655d69}.viewer-file-badge.pdf{background:#f7eded;color:#8a4343}.viewer-file-badge.text{background:#eef2f7;color:#475b75}
.unsupported-document{max-width:520px!important;padding:24px!important;text-align:center!important}
/* Fit mode: always show the complete picture without cropping. */
.product-gallery-viewport img:not(.zoomed),.invoice-preview-stage img:not(.zoomed),.invoice-view-stage img:not(.zoomed),.erp-document-stage img:not(.zoomed){display:block!important;width:auto!important;height:auto!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;object-position:center!important;margin:auto!important;background:#fff!important}
/* Zoom keeps both horizontal and vertical scrolling. */
.product-gallery-viewport.zoom-active,.invoice-preview-stage.zoom-active,.invoice-view-stage.zoom-active,.erp-document-stage.zoom-active{overflow:auto!important;align-items:flex-start!important;justify-content:flex-start!important;overscroll-behavior:contain!important;-webkit-overflow-scrolling:touch!important;touch-action:pan-x pan-y!important;scrollbar-gutter:stable both-edges!important}
.product-gallery-viewport.zoom-active img.zoomed,.invoice-preview-stage.zoom-active img.zoomed,.invoice-view-stage.zoom-active img.zoomed,.erp-document-stage.zoom-active img.zoomed{display:block!important;width:auto!important;height:auto!important;max-width:none!important;max-height:none!important;object-fit:unset!important;margin:0!important}
@media(max-width:900px){
  :root{--erp-viewer-frame-width:100%}
  .product-gallery-stage,.invoice-preview-carousel,.invoice-view-carousel,.erp-viewer-carousel{grid-template-columns:40px minmax(0,1fr) 40px!important;gap:6px!important;padding:6px!important}
  .viewer-nav{width:40px;height:48px;font-size:1.7rem}
  .product-gallery-viewport,.invoice-preview-stage,.invoice-view-stage,.erp-document-stage{width:100%!important;height:min(calc((100vw - 112px) * .75),calc(100dvh - 250px))!important;min-height:240px!important;max-height:calc(100dvh - 250px)!important}
  .product-gallery-card,.invoice-preview-card{width:100%!important;max-width:100%!important;max-height:100dvh!important;border-radius:0!important}
  .product-gallery-overlay,#invoicePreviewModal{padding:0!important;align-items:stretch!important}
  .invoice-document-viewer,.erp-document-viewer{width:100%!important}
  .universal-viewer-thumb,.invoice-view-thumbs .universal-viewer-thumb,.product-gallery-thumbs button{grid-template-columns:48px minmax(60px,110px)!important;max-width:175px!important}
  .universal-viewer-thumb img,.invoice-view-thumbs .universal-viewer-thumb img,.product-gallery-thumbs img,.viewer-file-badge{width:44px!important;height:44px!important}
}
@media(max-width:520px){
  .product-gallery-stage,.invoice-preview-carousel,.invoice-view-carousel,.erp-viewer-carousel{grid-template-columns:36px minmax(0,1fr) 36px!important;gap:4px!important;padding:4px!important}
  .viewer-nav{width:36px;height:44px;border-radius:8px}
  .product-gallery-viewport,.invoice-preview-stage,.invoice-view-stage,.erp-document-stage{height:min(calc((100vw - 88px) * .75),calc(100dvh - 235px))!important;min-height:210px!important;padding:4px!important}
  .universal-viewer-thumbs,.invoice-view-thumbs,.product-gallery-thumbs{padding:7px!important}
}
.invoice-view-stage>[hidden],.erp-document-stage>[hidden]{display:none!important}
@media(min-width:901px){
  .product-gallery-viewport,.invoice-preview-stage,.invoice-view-stage,.erp-document-stage{
    width:var(--erp-viewer-width)!important;
    height:var(--erp-viewer-height)!important;
    max-width:var(--erp-viewer-width)!important;
    max-height:var(--erp-viewer-height)!important;
    min-height:var(--erp-viewer-height)!important;
  }
}

/* viewer simplification + mobile touch viewer ----------------------
   Desktop keeps the large 8in x 6in viewer and arrow/Zoom controls. Viewer
   thumbnail strips are removed everywhere. On touch/mobile screens the stage
   fills the available phone area, arrows/Zoom buttons disappear, horizontal
   swipe changes images and two-finger pinch zooms/pans images. */
.desktop-viewer-help{display:inline}
.mobile-viewer-help,.mobile-swipe-strip{display:none}
.universal-viewer-thumbs,.invoice-view-thumbs,.product-gallery-thumbs{display:none!important}
.product-gallery-viewport img.touch-zoomed,.invoice-preview-stage img.touch-zoomed,.invoice-view-stage img.touch-zoomed,.erp-document-stage img.touch-zoomed{
  transition:none!important;will-change:transform!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important
}
@media(max-width:900px){
  .desktop-viewer-help{display:none!important}
  .mobile-viewer-help{display:inline!important}
  .viewer-nav,.gallery-nav{display:none!important}
  .desktop-zoom-control,#documentZoomToggle,#invoiceViewZoomToggle,#invoicePreviewZoom,[data-gallery-zoom]{display:none!important}
  .product-gallery-stage,.invoice-preview-carousel,.invoice-view-carousel,.erp-viewer-carousel{
    grid-template-columns:minmax(0,1fr)!important;gap:0!important;padding:4px!important;width:100%!important
  }
  .product-gallery-card,.invoice-preview-card{
    width:100%!important;max-width:100%!important;height:100dvh!important;max-height:100dvh!important;border-radius:0!important;
    display:flex!important;flex-direction:column!important;overflow:hidden!important
  }
  .product-gallery-card .modal-head,.invoice-preview-card .modal-head{flex:0 0 auto!important;padding:8px 10px!important}
  .product-gallery-card .modal-head p,.invoice-preview-card .modal-head p{font-size:.78rem!important;line-height:1.25!important}
  .product-gallery-stage,.invoice-preview-carousel{flex:1 1 auto!important;min-height:0!important}
  .product-gallery-viewport,.invoice-preview-stage{
    width:calc(100vw - 8px)!important;height:calc(100dvh - 156px)!important;min-height:0!important;max-width:none!important;max-height:none!important;
    border-radius:6px!important;padding:2px!important;margin:0 auto!important;touch-action:none!important
  }
  .product-gallery-caption{padding:5px 8px!important;flex:0 0 auto!important}
  .product-gallery-card .modal-actions,.invoice-preview-card .modal-actions{padding:6px 8px max(6px,env(safe-area-inset-bottom))!important;flex:0 0 auto!important}
  .invoice-view-stage,.erp-document-stage{
    width:calc(100vw - 12px)!important;height:calc(100dvh - 205px)!important;min-height:420px!important;max-width:none!important;max-height:none!important;
    border-radius:6px!important;padding:2px!important;margin:0 auto!important
  }
  .invoice-view-stage.viewer-image-mode,.erp-document-stage.viewer-image-mode{touch-action:none!important}
  .invoice-view-stage.viewer-pdf-mode,.erp-document-stage.viewer-pdf-mode{touch-action:auto!important}
  .invoice-document-viewer,.erp-document-viewer{width:100%!important;max-width:100%!important;margin:0!important;border-radius:0!important}
  .mobile-swipe-strip{
    display:block!important;width:calc(100% - 12px)!important;margin:4px auto 6px!important;padding:8px 10px!important;text-align:center!important;
    font-size:.78rem!important;font-weight:700!important;color:#6b6470!important;background:#f7f5f8!important;border:1px solid #e2dde5!important;border-radius:8px!important;
    touch-action:pan-y!important;user-select:none!important;-webkit-user-select:none!important
  }
}
@media(max-width:520px){
  .product-gallery-viewport,.invoice-preview-stage{height:calc(100dvh - 148px)!important;min-height:0!important}
  .invoice-view-stage,.erp-document-stage{height:calc(100dvh - 190px)!important;min-height:360px!important;padding:1px!important}
}

/* Finance file cards + optional Supplier search --------------------
   Finance works on individual invoice pages while submission-level filters
   remain intact. Mobile supplier free text never mutates Supplier Master. */
.invoice-supplier-field{position:relative;grid-column:1/-1!important}
.invoice-supplier-field>span em{font-style:normal;font-size:.68rem;font-weight:700;color:#7b7380;text-transform:none;letter-spacing:0}
.invoice-supplier-results{position:absolute;left:0;right:0;top:calc(100% - 28px);z-index:80;max-height:240px;overflow:auto;border:1px solid #d9d4dc;border-radius:9px;background:#fff;box-shadow:0 14px 30px rgba(33,27,38,.16);padding:5px}
.invoice-supplier-results[hidden]{display:none!important}
.invoice-supplier-results button{display:flex;width:100%;align-items:center;justify-content:space-between;gap:10px;border:0;border-bottom:1px solid #eeeaf0;background:#fff;padding:10px 9px;text-align:left;cursor:pointer;color:#3f3943}
.invoice-supplier-results button:last-child{border-bottom:0}.invoice-supplier-results button:hover{background:#f8f6f9}.invoice-supplier-results button strong{font-size:.82rem}.invoice-supplier-results button small{font-size:.68rem;color:#786f7c}
.invoice-supplier-empty{padding:10px 9px;font-size:.76rem;color:#756d79;background:#faf9fb;border-radius:6px}

.invoice-finance-search{min-width:220px!important}.invoice-file-toolbar{position:sticky;top:0;z-index:28;box-shadow:0 4px 12px rgba(30,24,34,.05)}
.invoice-finance-groups{display:grid;gap:14px;padding:12px;background:#f7f6f8}
.invoice-finance-group{border:1px solid #ddd9e0;border-radius:12px;background:#fff;overflow:hidden;box-shadow:0 2px 8px rgba(31,26,35,.04)}
.invoice-finance-group-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:11px 13px;border-bottom:1px solid #e8e4ea;background:#fbfafc}
.invoice-group-title{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}.invoice-group-title strong{font-size:.94rem;color:#37313b}.invoice-group-title span{font-size:.72rem;color:#726b76}
.invoice-group-meta{display:flex;gap:10px 16px;flex-wrap:wrap;margin-top:5px;font-size:.72rem;color:#615a65}.invoice-group-meta b{color:#443d48}.invoice-group-meta em{font-style:normal;font-size:.62rem;font-weight:850;padding:2px 5px;border-radius:999px;background:#f0edf2;color:#655d69}
.invoice-group-status{display:flex;align-items:center;justify-content:flex-end;gap:6px;flex-wrap:wrap}
.invoice-finance-card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:11px;padding:12px}
.invoice-finance-file-card{position:relative;min-width:0;border:1px solid #ddd8e0;border-radius:11px;background:#fff;padding:7px;box-shadow:0 2px 8px rgba(29,26,33,.05);overflow:hidden}.invoice-finance-file-card.pending{border-color:#e6d3b5;background:#fffcf8}.invoice-finance-file-card.unclear{border-color:#e6bec2;background:#fffafa}
.invoice-finance-card-check{display:flex;align-items:center;gap:6px;font-size:.71rem;font-weight:800;color:#5f5864;margin:1px 2px 6px;cursor:pointer}.invoice-finance-card-check input{width:18px;height:18px;accent-color:#67506f}
.invoice-finance-card-image{position:relative;border:0;padding:0;width:100%;height:240px;background:#f1eff2;border-radius:8px;overflow:hidden;display:grid;place-items:center;cursor:zoom-in}.invoice-finance-card-image img{width:100%;height:100%;object-fit:contain;background:#fff}.invoice-card-zoom-hint{position:absolute;right:7px;bottom:7px;border-radius:999px;background:rgba(35,30,39,.76);color:#fff;padding:4px 7px;font-size:.63rem;font-weight:800;pointer-events:none}
.invoice-finance-card-body{display:grid;gap:7px;padding:8px 2px 2px}.invoice-card-title{display:grid;gap:2px;min-width:0}.invoice-card-title strong{font-size:.82rem}.invoice-card-title span{font-size:.68rem;color:#756e79;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.invoice-card-statuses,.invoice-card-actions{display:flex;gap:5px;align-items:center;flex-wrap:wrap}.invoice-card-actions{padding-top:2px;border-top:1px solid #eeeaf0}
.invoice-finance-viewer-card{width:min(9.45in,calc(100vw - 24px))!important;max-width:100%!important;max-height:96dvh!important;overflow:hidden!important;display:flex!important;flex-direction:column!important}.finance-card-viewer-carousel{flex:1 1 auto;min-height:0}.finance-card-viewer-stage{width:var(--erp-viewer-width)!important;height:var(--erp-viewer-height)!important;min-height:var(--erp-viewer-height)!important}

@media(max-width:900px){
  .invoice-finance-group-head{flex-direction:column}.invoice-group-status{justify-content:flex-start}
  .invoice-finance-card-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:8px}.invoice-finance-card-image{height:210px}
  .invoice-finance-viewer-card{width:100%!important;height:100dvh!important;max-height:100dvh!important;border-radius:0!important}.finance-card-viewer-carousel{grid-template-columns:minmax(0,1fr)!important;padding:4px!important}.finance-card-viewer-stage{width:calc(100vw - 8px)!important;height:calc(100dvh - 156px)!important;min-height:0!important;max-width:none!important;max-height:none!important;touch-action:none!important}
}
@media(max-width:560px){
  .invoice-finance-groups{padding:6px;gap:9px}.invoice-finance-group-head{padding:9px}.invoice-finance-card-grid{grid-template-columns:1fr 1fr;gap:6px;padding:6px}.invoice-finance-file-card{padding:5px}.invoice-finance-card-image{height:185px}.invoice-card-zoom-hint{font-size:.58rem}.invoice-finance-card-body{gap:5px}.invoice-file-toolbar{position:static}
  .invoice-supplier-results{top:calc(100% - 30px)}
}
@media(max-width:380px){.invoice-finance-card-grid{grid-template-columns:1fr}.invoice-finance-card-image{height:250px}}

/* Finance selected-PDF + grouped bulk dropdowns (preserved in ) ---- */
.invoice-action-dropdown{display:flex;align-items:center;gap:6px;font-size:.7rem;font-weight:800;color:#655d69}
.invoice-action-dropdown>span{white-space:nowrap}
.invoice-action-dropdown select.input{width:auto;min-width:185px;min-height:34px;padding:5px 32px 5px 9px;font-size:.72rem;font-weight:700}
@media(max-width:700px){
  .invoice-action-dropdown{width:100%;display:grid;grid-template-columns:52px minmax(0,1fr)}
  .invoice-action-dropdown select.input{width:100%;min-width:0}
}

.import-required,.import-required-text{color:var(--danger)!important;font-weight:800}.import-required select{border-color:var(--danger)}


.btn.with-icon,
a.btn.with-icon,
summary.btn.with-icon,
.backend-switch.with-icon,
.invoice-camera-btn.with-icon,
.invoice-submit-btn.with-icon,
.share-action.with-icon,
.mobile-touch-action.with-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}
.erp-btn-icon{
  display:inline-grid;
  place-items:center;
  width:1.05em;
  height:1.05em;
  flex:0 0 1.05em;
}
.erp-btn-icon svg{
  width:100%;
  height:100%;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.invoice-capture-actions .btn.with-icon,
.invoice-submit-sticky .btn.with-icon,
.top-action-bar .btn.with-icon,
.actions .btn.with-icon{
  justify-content:center;
}

/* compact right-side financial summaries -------------------------
   Keep labels beside their values on wide screens instead of stretching a
   summary row across the full document width. Mobile remains full width. */
@media(min-width:801px){
  .po-cost-sequence{width:min(720px,100%);margin-left:auto!important;border-left:1px solid var(--border);}
  .po-cost-sequence-title{padding-left:12px;}
  .po-cost-sequence-row{grid-template-columns:28px minmax(280px,390px) minmax(150px,190px);justify-content:end;}
  .cost-sequence{width:min(720px,100%);margin-left:auto;}
  .cost-sequence-row{grid-template-columns:28px minmax(280px,390px) minmax(150px,190px);justify-content:end;}
  .document-totals{margin-left:auto;}
}
@media(max-width:800px){
  .po-cost-sequence,.cost-sequence{width:100%;margin-left:0!important;}
}


/* modern light action palette + universal search icon ------------- */
:root{
  --ui-blue-bg:#eef6ff;--ui-blue-border:#bfd8f5;--ui-blue-text:#235b96;
  --ui-green-bg:#edf8f1;--ui-green-border:#bfdcc8;--ui-green-text:#2f6645;
  --ui-mint-bg:#edf9f5;--ui-mint-border:#bfe1d4;--ui-mint-text:#2f6b59;
  --ui-amber-bg:#fff8e8;--ui-amber-border:#ead4a3;--ui-amber-text:#75551e;
  --ui-purple-bg:#f6f0fa;--ui-purple-border:#d9c7e5;--ui-purple-text:#65477b;
  --ui-neutral-bg:#f7f8fa;--ui-neutral-border:#d8dde4;--ui-neutral-text:#46505d;
}
.btn,.icon-btn,.mobile-primary-action,.mobile-list-tool,.mobile-workflow-btn,.mobile-context-button,.mobile-icon-back,.mobile-fab-new{
  transition:background .16s ease,border-color .16s ease,color .16s ease,box-shadow .16s ease,transform .1s ease;
}
.btn.erp-action-blue,.erp-action-blue{
  background:var(--ui-blue-bg)!important;border-color:var(--ui-blue-border)!important;color:var(--ui-blue-text)!important;
}
.btn.erp-action-blue:hover,.erp-action-blue:hover{background:#e1efff!important;border-color:#9fc8ef!important;color:#194d83!important}
.btn.erp-action-success,.erp-action-success{
  background:var(--ui-green-bg)!important;border-color:var(--ui-green-border)!important;color:var(--ui-green-text)!important;
}
.btn.erp-action-success:hover,.erp-action-success:hover{background:#e1f3e7!important;border-color:#a4cfb1!important;color:#25563a!important}
.btn.erp-action-import,.erp-action-import{
  background:var(--ui-mint-bg)!important;border-color:var(--ui-mint-border)!important;color:var(--ui-mint-text)!important;
}
.btn.erp-action-import:hover,.erp-action-import:hover{background:#dff4ec!important;border-color:#9fd3c1!important;color:#275a4b!important}
.btn.erp-action-export,.erp-action-export{
  background:var(--ui-amber-bg)!important;border-color:var(--ui-amber-border)!important;color:var(--ui-amber-text)!important;
}
.btn.erp-action-export:hover,.erp-action-export:hover{background:#fff0cc!important;border-color:#dcbc7d!important;color:#624616!important}
.btn.erp-action-purple,.erp-action-purple{
  background:var(--ui-purple-bg)!important;border-color:var(--ui-purple-border)!important;color:var(--ui-purple-text)!important;
}
.btn.erp-action-purple:hover,.erp-action-purple:hover{background:#eee3f5!important;border-color:#c8add9!important;color:#55386c!important}
.btn.erp-action-neutral,.erp-action-neutral{
  background:var(--ui-neutral-bg)!important;border-color:var(--ui-neutral-border)!important;color:var(--ui-neutral-text)!important;
}
.btn.erp-action-neutral:hover,.erp-action-neutral:hover{background:#eef1f4!important;border-color:#c7cdd6!important;color:#343d48!important}
/* Existing explicit semantic classes remain authoritative and light. */
.btn.primary{background:var(--ui-blue-bg);border-color:var(--ui-blue-border);color:var(--ui-blue-text)}
.btn.primary:hover{background:#e1efff;border-color:#9fc8ef;color:#194d83}
.btn.success{background:var(--ui-green-bg);border-color:var(--ui-green-border);color:var(--ui-green-text)}
.btn.success:hover{background:#e1f3e7;border-color:#a4cfb1;color:#25563a}
.btn.warning{background:#fff6e5;border-color:#e7cf9c;color:#76531b}.btn.warning:hover{background:#ffedc4;border-color:#d9b873;color:#654414}
.btn.danger{background:#fff0f1;border-color:#e4bdc1;color:#8a3f48}.btn.danger:hover{background:#f9e3e5;border-color:#d7a6ab;color:#73343c}
.action-create{background:var(--ui-blue-bg)!important;border-color:var(--ui-blue-border)!important;color:var(--ui-blue-text)!important}
.action-import{background:var(--ui-mint-bg)!important;border-color:var(--ui-mint-border)!important;color:var(--ui-mint-text)!important}
.action-export{background:var(--ui-amber-bg)!important;border-color:var(--ui-amber-border)!important;color:var(--ui-amber-text)!important}
.action-more{background:var(--ui-purple-bg)!important;border-color:var(--ui-purple-border)!important;color:var(--ui-purple-text)!important}
.panel{box-shadow:0 5px 18px rgba(31,41,55,.045)}
.panel-head{background:linear-gradient(180deg,#fff 0%,#fcfdff 100%)}
.input{transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}
.input:hover{border-color:#b9c5d3}.input:focus{border-color:#8cb7df;box-shadow:0 0 0 3px rgba(77,139,199,.10);outline:none}
.erp-search-input{
  background-color:#fff!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2370849a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E")!important;
  background-repeat:no-repeat!important;
  background-position:10px center!important;
  background-size:18px 18px!important;
  padding-left:36px!important;
}
.erp-search-input:focus{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%233b82b8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-4-4'/%3E%3C/svg%3E")!important;
}
@media(max-width:800px){.erp-search-input{background-position:11px center!important;padding-left:38px!important}}

/* product-picture clean white card presentation ------------------ */
.product-gallery-viewport,.product-image-card,.product-thumb,.mobile-line-thumb{background:#fff!important}
.product-gallery-viewport img,.product-image-card img,.product-thumb img,.mobile-line-thumb img{object-fit:contain!important;background:#fff!important}

/* fast product-picture card presentation ------------------------
   Product photos stay colour photographs, but every presentation surface is
   a clean white card with contain-fit so no product edge is visually cropped. */
.product-thumb-button,.product-image-button,.mobile-product-thumb,.mobile-search-thumb,.picker-product-thumb,.mobile-line-thumb{
  background:#fff!important;border:1px solid #dbe3ec!important;box-shadow:0 1px 3px rgba(15,23,42,.08);padding:4px!important
}
.product-thumb,.product-image-preview,.mobile-search-thumb img,.picker-product-thumb img,.mobile-line-thumb img,
.product-gallery-viewport img,.product-image-card img{
  object-fit:contain!important;background:#fff!important
}
.product-gallery-viewport{background:#f4f6f8!important;padding:14px!important}
.product-gallery-viewport img{border-radius:12px;box-shadow:0 4px 18px rgba(15,23,42,.10)}
.picture-tile{background:#fff!important;border-color:#dbe3ec!important;box-shadow:0 2px 8px rgba(15,23,42,.06)}

/* Compact secondary-information pattern: keeps forms spacious without hiding required fields. */
.erp-info-icon{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;min-width:22px;padding:0;border:1px solid #b9cbe0;background:#edf4fc;color:#315b8f;border-radius:50%;font:800 .72rem/1 system-ui;cursor:pointer;vertical-align:middle}
.erp-info-icon:hover,.erp-info-icon:focus{background:#dceaff;border-color:#8eadd0;outline:none;box-shadow:0 0 0 3px rgba(37,99,235,.10)}
.erp-info-icon.inline-info{width:19px;height:19px;min-width:19px;font-size:.66rem;margin-left:4px}
.erp-info-popover{position:fixed;z-index:10050;max-width:min(340px,calc(100vw - 24px));padding:10px 12px;border:1px solid #cbd9e8;border-radius:10px;background:#fff;color:var(--text);box-shadow:0 12px 34px rgba(15,23,42,.18);font-size:.82rem;line-height:1.42}
.po-notes-compact{min-height:58px!important;height:58px!important;resize:vertical}
.bill-payment-layout{display:grid;gap:15px}
.bill-payment-entry .panel-body{padding:16px}
.bill-payment-entry .form-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.bill-payment-entry .input{min-height:44px;padding:10px 11px;font-size:.96rem}
.bill-payment-entry textarea.input{min-height:74px;height:auto}
.bill-payment-entry .payment-sgd-preview{min-height:44px;display:flex;align-items:center;padding:10px 11px;font-size:1rem}
.bill-payment-entry .payment-notes-wide{grid-column:span 3}
.bill-payment-entry .modal-actions{padding:13px 16px}
@media(max-width:900px){.bill-payment-entry .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.bill-payment-entry .payment-notes-wide{grid-column:span 2}}
@media(max-width:620px){.bill-payment-entry .form-grid{grid-template-columns:1fr}.bill-payment-entry .payment-notes-wide{grid-column:span 1}.bill-payment-entry .input{font-size:16px}}

/* Supplier Bill summary: compact, aligned and finance-first. */
.bill-overview-card{overflow:hidden}
.bill-overview-head{align-items:center;background:linear-gradient(180deg,#fbfdff 0%,#f7faff 100%)}
.bill-overview-status{display:flex;align-items:center;justify-content:flex-end}
.bill-finance-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:9px;margin-bottom:10px}
.bill-finance-kpi{position:relative;min-width:0;border:1px solid #dce6f1;border-radius:10px;background:#fff;padding:11px 12px;overflow:hidden}
.bill-finance-kpi:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#2563eb}
.bill-finance-kpi.paid:before{background:#16a34a}.bill-finance-kpi.outstanding:before{background:#dc7a16}.bill-finance-kpi.fx:before{background:#7c3aed}
.bill-finance-kpi>span{display:block;color:#64748b;font-size:.66rem;font-weight:800;text-transform:uppercase;letter-spacing:.045em}
.bill-finance-kpi>strong{display:block;margin:4px 0 2px;font-size:1.04rem;line-height:1.2;overflow-wrap:anywhere}
.bill-finance-kpi>small{display:block;color:#64748b;font-size:.67rem;line-height:1.25}
.bill-meta-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px}
.bill-meta-grid>div{min-width:0;border:1px solid #e1e8f0;border-radius:8px;background:#fbfdff;padding:8px 9px}
.bill-meta-grid span{display:block;color:#64748b;font-size:.63rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em;margin-bottom:3px}
.bill-meta-grid strong{display:block;font-size:.79rem;line-height:1.3;overflow-wrap:anywhere}
.bill-meta-span-2{grid-column:span 2}
@media(max-width:1180px){.bill-finance-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.bill-meta-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:680px){.bill-finance-kpis{grid-template-columns:1fr}.bill-meta-grid{grid-template-columns:1fr 1fr}.bill-meta-span-2{grid-column:span 2}}
@media(max-width:460px){.bill-meta-grid{grid-template-columns:1fr}.bill-meta-span-2{grid-column:auto}}


/* ERP universal compact table controls */
.erp-table-pager,.pager.erp-table-pager,.ci-pager.erp-table-pager{display:flex;align-items:center;justify-content:flex-end;gap:8px;min-height:30px;margin:4px 12px 7px;padding:2px 0;border:0;background:transparent;font-size:.72rem;color:#64748b;flex-wrap:wrap}
.erp-table-pager .erp-pager-range{margin-right:auto;font-weight:700;color:#475569}
.erp-pager-size{display:inline-flex;align-items:center;gap:4px;white-space:nowrap;font-size:.7rem;font-weight:700;color:#64748b}
.erp-pager-size .input,.erp-page-size{width:auto!important;min-width:54px;height:26px!important;padding:2px 20px 2px 7px!important;font-size:.7rem!important;border-radius:6px!important}
.erp-pager-nav{display:inline-flex;align-items:center;gap:5px;white-space:nowrap}
.erp-pager-arrow{display:inline-grid;place-items:center;width:25px;height:25px;border:1px solid #d7e1ec;border-radius:6px;background:#fff;text-decoration:none!important;color:#334155;font-size:1rem;font-weight:800;line-height:1}
.erp-pager-arrow:hover{background:#f8fafc}.erp-pager-arrow.disabled{opacity:.35;cursor:default}
.erp-table-selection{display:flex;align-items:center;gap:7px;min-height:28px;margin:3px 0 5px;font-size:.7rem;flex-wrap:wrap}
.erp-table-selection .btn{min-height:25px!important;padding:3px 7px!important;font-size:.68rem!important;border-radius:6px!important}
.erp-table-selection .muted{font-size:.68rem}
@media(max-width:720px){.erp-table-pager{justify-content:flex-start}.erp-table-pager .erp-pager-range{width:100%;margin-right:0}.erp-pager-size{margin-left:auto}}
/* Commercial Sales/Matrix upgrade compatibility */
#transferItems th.transfer-order-by-col,#transferItems td.transfer-order-by-col{min-width:104px;width:104px}
#transferItems td.transfer-order-by-col .js-mode{min-width:88px;padding-left:9px;padding-right:26px}


/* unfinished-work protection runs without a permanent header label. */
@media(max-width:900px){#erpRefreshData{padding-inline:.55rem}}


/* branded unsaved-changes warning for in-app navigation */
.erp-unsaved-modal{position:fixed;inset:0;z-index:12000;background:rgba(15,23,42,.48);display:grid;place-items:center;padding:18px}
.erp-unsaved-modal[hidden]{display:none!important}
.erp-unsaved-card{width:min(470px,calc(100vw - 36px));background:#fff;border:1px solid #d9e2ec;border-radius:16px;box-shadow:0 24px 70px rgba(15,23,42,.28);padding:20px;display:grid;grid-template-columns:44px 1fr;gap:14px}
.erp-unsaved-icon{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#fff4d8;border:1px solid #f0d59d;color:#8a5a12;font-size:1.25rem;font-weight:900}
.erp-unsaved-copy h3{margin:1px 0 6px;color:#1f3349;font-size:1.05rem}.erp-unsaved-copy p{margin:0;color:#5f6f82;line-height:1.45}
.erp-unsaved-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:8px;margin-top:4px}.erp-modal-open{overflow:hidden}

/* -------------------------------------------------------------------------
   Toko ERP UI Refresh — presentation only
   Progressive disclosure, sticky table commands, compact dashboards/imports.
   No workflow, route, permission or data-rule changes are defined here.
   ------------------------------------------------------------------------- */
.erp-page-head-modern{align-items:center;gap:14px}.erp-page-head-modern h1{letter-spacing:-.025em}.erp-page-head-modern .actions{justify-content:flex-end}
.erp-table-workspace{overflow:visible}.erp-table-commandbar,.erp-sticky-table-toolbar{position:sticky;top:55px;z-index:38;background:rgba(255,255,255,.97);backdrop-filter:blur(10px);box-shadow:0 7px 16px rgba(31,51,73,.06)}
.erp-table-commandbar{border:1px solid var(--border);border-radius:12px 12px 0 0}.erp-command-actions{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap}.erp-search-box{position:relative;min-width:260px;flex:1 1 280px;max-width:440px}.erp-search-box input{width:100%;padding:8px 34px 8px 11px;border:1px solid #cbd7e5;border-radius:9px;background:#fff}.erp-search-box>span{position:absolute;right:11px;top:50%;transform:translateY(-50%);color:#7a8798;pointer-events:none}
.erp-collapsible-region[hidden]{display:none!important}

/* Right-side working drawer. Existing forms submit normally; the drawer only
   changes presentation and never intercepts the server request. */
.erp-drawer-backdrop{position:fixed;inset:0;z-index:4200;background:rgba(15,23,42,.28);display:flex;justify-content:flex-end;align-items:stretch}.erp-drawer-backdrop[hidden]{display:none!important}.erp-side-drawer{width:min(480px,94vw);height:100%;background:#f8fafc;box-shadow:-18px 0 48px rgba(15,23,42,.18);display:flex;flex-direction:column;overflow:auto;animation:erpDrawerIn .16s ease-out}.erp-drawer-head{position:sticky;top:0;z-index:4;background:#fff;border-bottom:1px solid var(--border);padding:16px 18px;display:flex;align-items:flex-start;justify-content:space-between;gap:12px}.erp-drawer-head h2{margin:0;font-size:1.05rem}.erp-drawer-head p{margin:3px 0 0;color:var(--muted);font-size:.78rem}.erp-drawer-form{padding:14px!important;background:transparent!important;border:0!important;box-shadow:none!important;margin:0!important;display:grid!important;grid-template-columns:1fr!important;gap:10px!important}.erp-drawer-form>.ci-filter-group{grid-template-columns:1fr!important}.erp-drawer-form .ci-filter-actions{position:sticky;bottom:0;background:#f8fafc;padding:10px 0 2px!important;z-index:3}.erp-drawer-form .ci-multi-pop{position:static!important;width:100%!important;max-width:none!important;box-shadow:none!important;margin-top:5px!important}.erp-drawer-form .ci-multi-list{max-height:220px!important}@keyframes erpDrawerIn{from{transform:translateX(24px);opacity:.75}to{transform:none;opacity:1}}
body.erp-drawer-open{overflow:hidden}

/* Compact dashboard KPIs with restrained traffic-light semantics. */
.erp-kpi-strip{display:grid;grid-template-columns:repeat(6,minmax(145px,1fr));gap:10px;margin:0 0 14px}.erp-kpi-card,.erp-result-card{position:relative;background:#fff;border:1px solid var(--border);border-radius:12px;padding:12px 13px;box-shadow:0 4px 14px rgba(30,51,76,.04);text-decoration:none;color:var(--text);overflow:hidden}.erp-kpi-card:before,.erp-result-card:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:#7f8c9d}.erp-kpi-card>span,.erp-result-card>span{display:block;color:var(--muted);font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.03em}.erp-kpi-card>strong,.erp-result-card>strong{display:block;font-size:1.45rem;line-height:1.15;margin:5px 0 2px}.erp-kpi-card>small{display:block;color:var(--muted);font-size:.7rem;line-height:1.25}.erp-kpi-card:hover{transform:translateY(-1px);box-shadow:0 7px 18px rgba(30,51,76,.08)}
.erp-kpi-card.traffic-green:before,.erp-result-card.traffic-green:before{background:#16a34a!important}.erp-kpi-card.traffic-amber:before,.erp-result-card.traffic-amber:before{background:#d97706!important}.erp-kpi-card.traffic-red:before,.erp-result-card.traffic-red:before{background:#dc2626!important}.erp-kpi-card.traffic-blue:before,.erp-result-card.traffic-blue:before{background:#2563eb!important}
.erp-dashboard-grid{align-items:start}.erp-health-list{display:grid;gap:0}.erp-health-row{display:grid;grid-template-columns:12px minmax(0,1fr) auto;gap:10px;align-items:center;padding:11px 2px;border-bottom:1px solid #edf1f5}.erp-health-row:last-child{border-bottom:0}.erp-health-dot{width:9px;height:9px;border-radius:50%;background:#94a3b8}.erp-health-row.good .erp-health-dot{background:#16a34a;box-shadow:0 0 0 4px #dcfce7}.erp-health-row.warn .erp-health-dot{background:#d97706;box-shadow:0 0 0 4px #ffedd5}.erp-health-row.bad .erp-health-dot{background:#dc2626;box-shadow:0 0 0 4px #fee2e2}.erp-health-row strong,.erp-health-row small{display:block}.erp-health-row small{color:var(--muted);margin-top:2px}.erp-health-row>b{font-size:.76rem}.erp-health-row.good>b{color:#15803d}.erp-health-row.warn>b{color:#b45309}.erp-health-row.bad>b{color:#b91c1c}

/* Import wizard: same forms/inputs/actions, fewer visible instructions. */
.erp-import-stepper{display:grid;grid-template-columns:repeat(3,1fr);max-width:720px;margin:0 auto 14px;gap:0}.erp-import-stepper>div{display:flex;align-items:center;gap:7px;color:#94a3b8;font-size:.78rem;font-weight:800;position:relative}.erp-import-stepper>div:not(:last-child):after{content:"";height:2px;background:#dce3eb;flex:1;margin:0 8px}.erp-import-stepper span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;border:2px solid #cbd5e1;background:#fff}.erp-import-stepper .active{color:#1d4ed8}.erp-import-stepper .active span{border-color:#2563eb;background:#eff6ff}.erp-import-stepper .done{color:#15803d}.erp-import-stepper .done span{border-color:#22c55e;background:#dcfce7}.erp-import-stepper .done:not(:last-child):after{background:#86efac}
.erp-help-disclosure{background:#f8fafc;border:1px solid var(--border);border-radius:11px;margin:0 0 13px}.erp-help-disclosure>summary{cursor:pointer;padding:10px 13px;font-weight:800;font-size:.8rem;color:#475569}.erp-help-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:0 13px 13px}.erp-help-grid>div{background:#fff;border:1px solid #e7edf4;border-radius:9px;padding:10px}.erp-help-grid strong{font-size:.78rem}.erp-help-grid p{margin:4px 0 0;color:var(--muted);font-size:.75rem;line-height:1.45}
.erp-import-panel{overflow:visible}.erp-upload-zone{display:grid;grid-template-columns:auto minmax(180px,1fr) minmax(220px,1.1fr) auto;align-items:center;gap:13px;border:1.5px dashed #aebed0;background:#f8fbff;border-radius:13px;padding:18px}.erp-upload-icon{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#e8f1ff;color:#245da8;font-size:1.4rem;font-weight:900}.erp-upload-zone strong,.erp-upload-zone p{display:block;margin:0}.erp-upload-zone p{color:var(--muted);font-size:.74rem;margin-top:3px}.erp-stage-banner{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:11px 12px;margin-bottom:13px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:10px}.erp-stage-banner p{margin:3px 0 0;color:#526176;font-size:.76rem}.erp-mapping-grid{padding:2px}.erp-preview-panel{margin-top:14px;border:1px solid var(--border);border-radius:10px;overflow:hidden}.erp-preview-panel>summary{cursor:pointer;padding:10px 12px;background:#f8fafc;font-weight:800;font-size:.8rem}.erp-result-kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:16px 0 12px}.erp-sticky-form-actions{position:sticky;bottom:0;z-index:32;display:flex;align-items:center;gap:9px;flex-wrap:wrap;padding:10px 12px;margin-top:12px;background:rgba(255,255,255,.96);backdrop-filter:blur(8px);border:1px solid var(--border);border-radius:10px;box-shadow:0 -6px 18px rgba(15,23,42,.05)}

/* PO header stays fully functional but no longer consumes the screen after the
   user has entered it. Native <details> preserves all form values/names. */
.erp-collapsible-panel{overflow:visible}.erp-collapsible-panel>summary{cursor:pointer;list-style:none}.erp-collapsible-panel>summary::-webkit-details-marker{display:none}.erp-summary-head{border-bottom:0}.erp-collapsible-panel[open]>.erp-summary-head{border-bottom:1px solid var(--border)}.erp-summary-chevron{font-size:1rem;color:#718096;transition:transform .16s ease}.erp-collapsible-panel[open] .erp-summary-chevron{transform:rotate(180deg)}.po-header-panel #poHeaderSummary{max-width:min(70vw,780px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.po-item-commandbar{top:55px!important;margin:0;border-bottom:1px solid var(--border)}.po-items-workspace>.panel-head{position:relative;z-index:2}.po-items-workspace .po-cost-sequence{margin-bottom:0}

/* Existing action menus become the single home for low-frequency exports. */
details.action-menu{position:relative}details.action-menu>summary{list-style:none}details.action-menu>summary::-webkit-details-marker{display:none}.action-menu-pop{min-width:150px}.action-menu-pop a,.action-menu-pop button{width:100%;text-align:left}

@media(max-width:1250px){.erp-kpi-strip{grid-template-columns:repeat(3,minmax(145px,1fr))}.erp-upload-zone{grid-template-columns:auto 1fr}.erp-upload-zone input,.erp-upload-zone button{grid-column:2}}
@media(max-width:760px){.erp-table-commandbar,.erp-sticky-table-toolbar{top:51px}.erp-command-actions{width:100%;justify-content:flex-start}.erp-search-box{min-width:0;max-width:none;flex-basis:100%}.erp-kpi-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.erp-help-grid{grid-template-columns:1fr}.erp-result-kpis{grid-template-columns:repeat(2,1fr)}.erp-upload-zone{grid-template-columns:1fr;text-align:left}.erp-upload-zone input,.erp-upload-zone button{grid-column:1}.erp-upload-icon{display:none}.erp-import-stepper b{display:none}.erp-side-drawer{width:100vw}.po-header-panel #poHeaderSummary{max-width:72vw}.erp-sticky-form-actions{bottom:6px}.erp-page-head-modern{align-items:flex-start}.erp-page-head-modern>.actions{width:100%;justify-content:flex-start}}

.erp-kpi-card.is-disabled{pointer-events:none;opacity:.68}

/* -------------------------------------------------------------------------
   Toko ERP Unified Workspace UI — presentation only
   One compact pattern for list pages, transaction editors and report tables.
   No business-rule, route, permission or form-field behavior is defined here.
   ------------------------------------------------------------------------- */
html,body{max-width:100%;overflow-x:hidden}
.app-shell,.app-main,.content,.ci-shell,.panel,.panel-head,.page-head,.page-heading{min-width:0;max-width:100%}
.content{width:100%;max-width:none;padding:14px 16px 22px;overflow-x:hidden}

/* Compact universal page heading. Long explanatory copy is converted to the
   shared info popover by app.js, leaving the working surface clear. */
.page-head,.ci-page-head,.page-heading{margin:0 0 9px!important;gap:9px!important;align-items:center!important}
.page-head h1,.ci-page-head h1,.page-heading h1{font-size:1.26rem!important;line-height:1.18;margin:0!important;letter-spacing:-.02em}
.page-head>.top-action-bar,.page-head>.actions,.ci-page-head>.actions,.page-heading>.actions{margin-left:auto}
.erp-title-line{display:flex;align-items:center;gap:7px;min-width:0}
.erp-title-info{flex:0 0 auto}
.erp-auto-help-source{display:none!important}
.erp-info-popover{z-index:18000!important}

/* The page itself never scrolls horizontally. Wide ERP data stays inside its
   table scroller. This prevents reports/KPIs from extending under the viewport. */
.table-wrap,.po-planning-wrap,.adjustment-table-wrap{max-width:100%;overflow-x:auto!important;overflow-y:auto;-webkit-overflow-scrolling:touch}
.data-table{max-width:none}
.panel{overflow:visible!important}
.panel>.table-wrap:last-child{border-radius:0 0 12px 12px}
.panel-head{overflow:visible!important}

/* Global layer system. Dropdowns must always float over panels and tables. */
.topbar{z-index:300!important}
.erp-table-commandbar,.erp-sticky-table-toolbar,.erp-unified-filterbar{z-index:260!important}
details.action-menu{position:relative!important;z-index:500!important}
details.action-menu[open]{z-index:16000!important}
.action-menu-pop{position:absolute!important;top:calc(100% + 6px)!important;right:0!important;left:auto!important;z-index:16010!important;min-width:190px!important;max-width:min(300px,calc(100vw - 24px));padding:6px!important;border:1px solid #d8e1eb!important;border-radius:10px!important;background:#fff!important;box-shadow:0 18px 40px rgba(15,23,42,.18)!important;overflow:visible!important}
.action-menu-pop a,.action-menu-pop button{display:flex!important;align-items:center!important;min-height:34px!important;padding:7px 9px!important;border:0!important;border-radius:7px!important;background:#fff!important;color:#334155!important;white-space:nowrap!important}
.action-menu-pop a:hover,.action-menu-pop button:hover{background:#f2f6fb!important}

/* Unified list toolbar. Search stays on-screen; secondary filters live in the
   same reusable right drawer for Products, PO, GRN, Transfer, Adjustment, etc. */
.erp-unified-filterbar{position:sticky;top:60px;display:flex!important;align-items:center!important;gap:8px!important;flex-wrap:wrap!important;padding:8px 10px!important;background:rgba(255,255,255,.97)!important;backdrop-filter:blur(10px);border-bottom:1px solid var(--border)!important;box-shadow:0 5px 14px rgba(31,51,73,.05)}
.erp-unified-filterbar>.erp-unified-search{flex:1 1 320px!important;min-width:220px!important;max-width:620px!important;display:block!important}
.erp-unified-filterbar>.erp-unified-search label{display:none!important}
.erp-unified-filterbar>.erp-unified-search .input{height:36px!important;padding-top:7px!important;padding-bottom:7px!important}
.erp-filterbar-actions{display:flex;align-items:center;gap:6px;margin-left:auto;flex-wrap:wrap}
.erp-filter-button{min-height:34px!important;padding:6px 10px!important}
.erp-filter-count{display:inline-grid;place-items:center;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:#dbeafe;color:#1d4ed8;font-size:.66rem;font-weight:900}
.erp-active-filter-chips{display:flex;align-items:center;gap:5px;flex-wrap:wrap;padding:5px 10px 7px;background:#fff;border-bottom:1px solid #edf1f5}
.erp-active-filter-chips:empty{display:none}
.erp-filter-chip{display:inline-flex;align-items:center;gap:5px;max-width:260px;border:1px solid #d8e3ef;border-radius:999px;background:#f8fafc;color:#475569;padding:4px 8px;font-size:.68rem;font-weight:700}
.erp-filter-chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.erp-filter-chip button{border:0;background:transparent;color:#64748b;padding:0;cursor:pointer;font-size:.82rem;line-height:1}
.erp-filter-drawer-body{padding:13px 15px!important;display:grid!important;grid-template-columns:1fr!important;gap:10px!important}
.erp-filter-drawer-body>.field{display:flex!important;min-width:0!important;width:100%!important}
.erp-filter-drawer-actions{position:sticky;bottom:0;display:flex;gap:8px;justify-content:flex-end;padding:11px 0 2px;background:#f8fafc}
.erp-filter-drawer-actions .btn{min-width:92px}

/* Search-only item toolbars use the same visual shell without creating a
   drawer. Their instructional sentence is moved behind the info button. */
.toolbar.erp-search-only-toolbar{position:sticky;top:60px;z-index:250;display:flex!important;align-items:center!important;padding:7px 10px!important;background:rgba(255,255,255,.97)!important;backdrop-filter:blur(10px);border-bottom:1px solid var(--border)!important}
.toolbar.erp-search-only-toolbar>.field{width:min(620px,100%)!important;min-width:220px!important;flex:1!important}
.toolbar.erp-search-only-toolbar>.field>label{display:none!important}
.toolbar.erp-search-only-toolbar .input{height:36px!important}
.erp-toolbar-info-wrap{display:flex;align-items:center;gap:6px}

/* Contextual selection bars should not consume a permanent row. */
.erp-table-selection.erp-selection-empty{display:none!important}
.erp-context-selection{background:#eef6ff;border:1px solid #cfe0f5;border-radius:8px;padding:5px 7px!important;margin:5px 10px!important}

/* One transaction-editor rhythm for PO, Transfer, GRN, Adjustment, Disposal,
   Returns and Bills. Existing fields and workflows stay where the backend
   expects them; this only standardizes spacing and visibility. */
form.erp-transaction-workspace{display:grid;gap:9px}
form.erp-transaction-workspace>.panel,form.erp-transaction-workspace>details.panel{margin:0!important;border-radius:11px!important}
form.erp-transaction-workspace .panel-head{padding:10px 12px!important;min-height:43px}
form.erp-transaction-workspace .panel-head h2{font-size:.94rem!important}
form.erp-transaction-workspace .panel-body{padding:11px 12px!important}
form.erp-transaction-workspace .form-grid{gap:9px!important}
form.erp-transaction-workspace .field{gap:4px!important}
form.erp-transaction-workspace .field label{font-size:.68rem!important}
form.erp-transaction-workspace .input{padding:7px 9px!important;min-height:36px}
form.erp-transaction-workspace textarea.input{min-height:58px}
form.erp-transaction-workspace .table-wrap{max-height:66vh}
.erp-panel-help-source{display:none!important}
.erp-panel-title-line{display:flex;align-items:center;gap:6px}

/* Commercial Intelligence uses the same compact workspace and never expands
   beyond the main viewport. */
.ci-shell{width:100%!important;min-width:0!important;overflow:visible!important;padding:0 0 20px!important;gap:9px!important}
.commercial-subnav{margin-bottom:2px!important;padding:7px 8px!important;gap:6px!important;overflow-x:auto!important;flex-wrap:nowrap!important;scrollbar-width:thin}
.commercial-subnav .btn{min-height:30px!important;padding:6px 9px!important;font-size:.76rem!important;white-space:nowrap}
.ci-kpis,.ci-kpis.compact,.ci-product-sales-kpis{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))!important;gap:7px!important;width:100%!important;min-width:0!important}
.ci-kpi{min-width:0!important;padding:9px 11px!important;border-radius:10px!important}
.ci-kpi strong{font-size:1.18rem!important;margin:3px 0!important;overflow-wrap:anywhere}
.ci-kpi span{font-size:.69rem!important}.ci-kpi small{font-size:.67rem!important;margin-top:4px!important;line-height:1.25!important}
.ci-active-period{padding:6px 9px!important;min-height:30px!important;font-size:.74rem!important}
.erp-table-commandbar{position:sticky!important;top:60px!important;display:flex!important;align-items:center!important;gap:8px!important;flex-wrap:wrap!important;padding:8px 10px!important;border-radius:10px 10px 0 0!important;max-width:100%!important}
.erp-table-commandbar>div:first-child{flex:0 1 auto;min-width:140px;max-width:320px}
.erp-table-commandbar>div:first-child h2{font-size:.9rem!important;margin:0!important}
.erp-table-commandbar>div:first-child p{font-size:.68rem!important;white-space:normal}
.erp-command-actions{display:flex!important;align-items:center!important;gap:5px!important;flex:1 1 560px!important;min-width:0!important;justify-content:flex-end!important;flex-wrap:wrap!important}
.erp-command-actions .erp-search-box,.erp-command-actions>.ci-table-search{order:-20;flex:1 1 240px!important;min-width:190px!important;max-width:420px!important;height:34px!important}
.erp-command-actions>.ci-table-search{padding:6px 10px!important}
.erp-command-actions .btn{min-height:32px!important;padding:5px 8px!important;font-size:.72rem!important}
.ci-export-count{font-size:.66rem!important;color:#64748b;white-space:nowrap}
.ci-content-panel,.ci-content-panel .table-wrap{max-width:100%!important;min-width:0!important}
.ci-content-panel .table-wrap{max-height:68vh!important}

/* Campaign list gets the same sticky search-first working bar. */
.ci-campaign-listbar{position:sticky;top:60px;z-index:250;display:flex;align-items:center;gap:7px;padding:8px 10px;background:rgba(255,255,255,.97);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.ci-campaign-listbar .erp-search-box{max-width:520px}

/* Product page overview becomes a small status strip rather than another
   full-height toolbar. */
.product-overview-line{min-height:30px!important;padding:5px 9px!important;margin:0 0 6px!important;gap:7px 12px!important;font-size:.68rem!important;flex-wrap:wrap!important;border-radius:8px!important}
.product-overview-line .muted{font-size:.66rem!important}

/* General compactness without changing form semantics. */
.panel{margin-bottom:9px!important;border-radius:11px!important}
.panel-head{padding:10px 12px!important}
.panel-body{padding:11px 12px!important}
.pager.erp-table-pager,.erp-table-pager{margin:3px 9px 5px!important}

@media(max-width:1200px){
  .erp-table-commandbar>div:first-child{max-width:220px}
  .ci-export-count{display:none!important}
}
@media(max-width:900px){
  .content{padding:10px 10px 18px}
  .erp-unified-filterbar,.toolbar.erp-search-only-toolbar,.erp-table-commandbar,.ci-campaign-listbar{top:60px}
  .erp-unified-filterbar>.erp-unified-search{flex-basis:100%!important;max-width:none!important}
  .erp-filterbar-actions{margin-left:0;width:100%;justify-content:flex-start}
  .erp-table-commandbar>div:first-child{max-width:none;flex:1 1 100%}
  .erp-command-actions{flex:1 1 100%!important;justify-content:flex-start!important}
  .erp-command-actions .erp-search-box,.erp-command-actions>.ci-table-search{max-width:none!important;flex-basis:100%!important}
}
@media(max-width:760px){
  .content{padding:8px}
  .page-head,.ci-page-head,.page-heading{align-items:flex-start!important}
  .page-head>.top-action-bar,.page-head>.actions,.ci-page-head>.actions,.page-heading>.actions{width:100%;margin-left:0;justify-content:flex-start}
  .ci-kpis,.ci-kpis.compact,.ci-product-sales-kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .action-menu-pop{right:auto!important;left:0!important}
  .erp-filter-drawer-actions{display:grid;grid-template-columns:1fr 1fr}
  form.erp-transaction-workspace .form-grid{grid-template-columns:1fr!important}
}
.erp-drawer-head .icon-btn{display:grid!important;place-items:center!important;flex:0 0 auto}


/* V-91 approved unified one-page Report Centre. Backend report logic is unchanged. */
.report-centre-v91{display:grid;grid-template-columns:285px minmax(0,1fr);gap:9px;align-items:start}
.report-centre-v91>.panel{margin-bottom:0}.report-centre-nav{position:sticky;top:62px;max-height:calc(100vh - 76px);overflow:auto;padding:0;background:#fff}
.report-centre-nav-head{padding:12px 13px 10px;border-bottom:1px solid var(--border);background:#fbfcfe}.report-centre-nav-head h1{margin:0;font-size:1rem;color:#24364d}.report-centre-nav-head p{margin:4px 0 0;color:#718096;font-size:.7rem;line-height:1.35}
.report-section-list{display:grid;padding:6px}.report-section{border-bottom:1px solid #edf1f5}.report-section:last-child{border-bottom:0}.report-section>summary{display:flex;align-items:center;justify-content:space-between;gap:8px;cursor:pointer;list-style:none;padding:9px 8px;color:#34465c;font-size:.76rem;font-weight:850}.report-section>summary::-webkit-details-marker{display:none}.report-section>summary:before{content:'›';width:13px;color:#7a899b;font-size:1rem;transform:rotate(0);transition:transform .15s}.report-section[open]>summary:before{transform:rotate(90deg)}.report-section>summary span{flex:1}.report-section>summary small{display:grid;place-items:center;min-width:20px;height:20px;border-radius:999px;background:#eef3f8;color:#637287;font-size:.62rem}
.report-section-links{display:grid;gap:3px;padding:0 5px 8px 20px}.report-family-block{display:grid;gap:3px;padding:5px 0}.report-family-name{font-size:.69rem;font-weight:800;color:#53657a;padding:0 5px}.report-mode-links{display:grid;gap:2px}.report-nav-link{display:block;padding:6px 7px;border-radius:7px;color:#526477;text-decoration:none;font-size:.69rem;line-height:1.25;border:1px solid transparent}.report-nav-link:hover{background:#f5f8fb;color:#24364d}.report-nav-link.active{background:#eaf2fb;border-color:#cbdced;color:#1f4c78;font-weight:850}.report-nav-family{font-weight:750}
.report-centre-main{min-width:0}.report-centre-welcome{min-height:360px;display:grid;place-items:center}.report-centre-welcome-inner{max-width:520px;text-align:center;padding:30px}.report-centre-welcome-icon{display:grid;place-items:center;width:52px;height:52px;margin:0 auto 10px;border-radius:14px;background:#eef4fa;color:#315a82;font-size:1.5rem}.report-centre-welcome h2{margin:0;color:#26384f}.report-centre-welcome p{margin:8px 0 0;color:#65758a;line-height:1.45}.report-centre-v91 .report-results-panel{margin:0!important}.report-centre-v91 .report-table-wrap{max-height:calc(100vh - 230px)}
@media(max-width:980px){.report-centre-v91{grid-template-columns:235px minmax(0,1fr)}.report-centre-nav{top:58px}.report-section-links{padding-left:12px}}
@media(max-width:760px){.report-centre-v91{grid-template-columns:1fr}.report-centre-nav{position:static;max-height:none}.report-centre-nav-head{padding:10px 11px}.report-section-list{padding:4px}.report-section-links{padding-left:12px}.report-centre-v91 .report-table-wrap{max-height:68vh}.report-centre-welcome{min-height:210px}}

/* V-91 Accounting/GST workspace — Purchase-Order-style working UI. */
.accounting-launch-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.accounting-launch-card{display:grid;gap:5px;min-height:104px;padding:15px;border:1px solid #dbe4ee;border-radius:12px;background:linear-gradient(180deg,#fff,#f8fbfe);color:#33465c;text-decoration:none;box-shadow:0 2px 8px rgba(31,57,82,.05);transition:border-color .16s,box-shadow .16s,transform .16s}
.accounting-launch-card:hover{border-color:#a9c5e0;box-shadow:0 7px 20px rgba(35,79,119,.12);transform:translateY(-1px)}
.accounting-launch-card strong{font-size:.92rem;color:#214d76}.accounting-launch-card span{font-size:.75rem;line-height:1.42;color:#6c7d90}
.accounting-inline-search{display:flex;align-items:end;gap:8px;flex-wrap:wrap;margin:8px 0}.accounting-inline-search .field{flex:1 1 240px}
.accounting-return-form{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;align-items:end}.accounting-return-form .actions{align-self:end}
.accounting-period-actions{display:flex;align-items:center;gap:5px;flex-wrap:wrap;min-width:280px}.accounting-period-actions .input{min-width:130px;max-width:190px}
.accounting-rate-editor>summary.panel-head{cursor:pointer;list-style:none}.accounting-rate-editor>summary.panel-head::-webkit-details-marker{display:none}.accounting-rate-editor>summary.panel-head:after{content:'›';font-size:1.2rem;color:#6f8398;transition:transform .15s}.accounting-rate-editor[open]>summary.panel-head:after{transform:rotate(90deg)}
.compact-accounting-form{grid-template-columns:repeat(auto-fit,minmax(165px,1fr));align-items:end}.compact-accounting-form .actions{align-self:end}
.accounting-launch-panel .panel-head{background:linear-gradient(180deg,#fbfdff,#f7fafc)}
@media(max-width:980px){.accounting-launch-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.accounting-return-form{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){.accounting-launch-grid{grid-template-columns:1fr}.accounting-launch-card{min-height:86px}.accounting-return-form{grid-template-columns:1fr}.accounting-period-actions{min-width:220px}.accounting-period-actions .input{max-width:none;flex:1 1 100%}}

/* V91 UI pass: print-safe barcode labels and full-width Report Centre */
.label-card{grid-template-rows:auto auto minmax(0,1fr) auto!important}
.label-name{font-size:10pt!important;font-weight:750!important;line-height:1.08!important;max-height:9mm!important}
.label-barcode-row{width:100%!important;align-self:stretch!important;display:flex!important;flex-direction:column!important;justify-content:flex-end!important;align-items:center!important;gap:.45mm!important;margin-top:.65mm!important;min-height:0!important}
.label-barcode-image,.label-card img.label-barcode-image{display:block!important;width:96%!important;max-width:96%!important;height:10.5mm;object-fit:fill!important;image-rendering:auto}
.label-code{width:100%!important;text-align:center!important;font-size:7.2pt!important;line-height:1!important;letter-spacing:.15pt!important;overflow:visible!important}
.report-centre-v91{display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:9px!important;align-items:start!important}
.report-centre-selector{position:static!important;max-height:none!important;overflow:visible!important;padding:0!important}
.report-centre-selector .report-centre-nav-head{display:flex!important;align-items:end!important;justify-content:space-between!important;gap:18px!important;padding:10px 12px!important}
.report-selector-field{display:grid!important;grid-template-columns:auto minmax(320px,620px)!important;align-items:center!important;gap:9px!important;min-width:min(680px,65vw)!important}
.report-selector-field label{font-size:.72rem!important;font-weight:800!important;color:#53657a!important;white-space:nowrap!important}
.report-selector-field .input{width:100%!important;min-height:34px!important}
.report-centre-v91 .report-table-wrap{max-height:calc(100vh - 250px)!important}
@media(max-width:760px){.report-centre-selector .report-centre-nav-head{align-items:stretch!important;flex-direction:column!important}.report-selector-field{grid-template-columns:1fr!important;min-width:0!important;width:100%!important}.report-centre-v91 .report-table-wrap{max-height:68vh!important}}

/* Activity Log - detailed forensic history */
.audit-log-table{min-width:1120px}.audit-log-table td{vertical-align:top}.audit-date{white-space:nowrap}.audit-action{font-weight:800;color:#243b57}.audit-details-cell{min-width:118px}.audit-details>summary{list-style:none;cursor:pointer;white-space:nowrap}.audit-details>summary::-webkit-details-marker{display:none}.audit-details[open]{min-width:min(760px,72vw)}.audit-detail-card{margin-top:8px;border:1px solid #d9e3ed;border-radius:10px;background:#fbfdff;padding:11px;box-shadow:0 6px 20px rgba(15,23,42,.08);color:#27384c}.audit-detail-title{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;padding-bottom:8px;border-bottom:1px solid #e3e9ef}.audit-detail-title span{font-size:.72rem;color:#6b7d91;text-align:right;overflow-wrap:anywhere}.audit-detail-section{margin-top:10px}.audit-detail-section h3{font-size:.76rem;margin:0 0 6px;color:#314a67;text-transform:uppercase;letter-spacing:.035em}.audit-detail-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.audit-detail-grid>div{border:1px solid #e2e8f0;border-radius:7px;background:#fff;padding:7px 8px;min-width:0}.audit-detail-grid span{display:block;font-size:.61rem;color:#718096;text-transform:uppercase;letter-spacing:.035em;margin-bottom:2px}.audit-detail-grid strong{display:block;font-size:.75rem;font-weight:700;overflow-wrap:anywhere}.audit-change-table{border:1px solid #dfe7ef;border-radius:8px;overflow:hidden;background:#fff}.audit-change-head,.audit-change-row{display:grid;grid-template-columns:minmax(150px,1fr) minmax(140px,1fr) minmax(140px,1fr);gap:0}.audit-change-head{background:#eef4fa;color:#445970;font-size:.64rem;font-weight:850;text-transform:uppercase}.audit-change-head span,.audit-change-row>*{padding:6px 8px;border-right:1px solid #e4eaf0}.audit-change-head span:last-child,.audit-change-row>*:last-child{border-right:0}.audit-change-row{border-top:1px solid #e4eaf0;font-size:.73rem}.audit-change-row strong{color:#30465f}.audit-change-row span{overflow-wrap:anywhere}.audit-raw-details{margin-top:10px;border-top:1px solid #e3e9ef;padding-top:8px}.audit-raw-details>summary{cursor:pointer;color:#4f657e;font-size:.72rem;font-weight:750}.audit-raw-details pre{max-height:280px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;background:#0f172a;color:#e2e8f0;border-radius:7px;padding:9px;font-size:.68rem;line-height:1.38}@media(max-width:800px){.audit-details[open]{min-width:78vw}.audit-detail-grid{grid-template-columns:1fr 1fr}.audit-change-head,.audit-change-row{grid-template-columns:1fr}.audit-change-head span:nth-child(n+2){display:none}.audit-change-row>*{border-right:0;border-bottom:1px solid #edf1f5}.audit-change-row>*:last-child{border-bottom:0}.audit-change-row span:nth-child(2)::before{content:'Before: ';font-weight:800;color:#718096}.audit-change-row span:nth-child(3)::before{content:'After: ';font-weight:800;color:#718096}}@media(max-width:480px){.audit-detail-grid{grid-template-columns:1fr}}

/* Named-column freeze for explicitly approved ERP tables (not global).
   Product identity is chosen from the actual current header, not an index. */
table.erp-identity-freeze [data-erp-pin="select"],
table.erp-identity-freeze [data-erp-pin="serial"]{
 position:sticky!important;left:var(--erp-pin-left,0px)!important;z-index:12!important;
 background:#fff!important;box-shadow:1px 0 0 #d9e2ec;
}
table.erp-identity-freeze [data-erp-pin="identity"]{
 position:sticky!important;left:var(--erp-pin-identity-left,0px)!important;z-index:13!important;
 background:#fff!important;box-shadow:3px 0 8px rgba(31,51,73,.14);
 min-width:185px;max-width:min(330px,52vw);overflow-wrap:anywhere;
}
table.erp-identity-freeze thead [data-erp-pin]{z-index:36!important;background:#eaf1f8!important;top:0}
table.erp-identity-freeze tfoot [data-erp-pin]{z-index:17!important;background:#f5f8fc!important}
table.erp-identity-freeze tbody tr:hover [data-erp-pin]{background:#f7fbff!important}
table.erp-identity-freeze [data-erp-pin="identity"] .product-name{overflow-wrap:anywhere}
@media(max-width:700px){table.erp-identity-freeze [data-erp-pin="identity"]{min-width:150px;max-width:53vw}}
@media print{table.erp-identity-freeze [data-erp-pin]{position:static!important;box-shadow:none!important}}

/* V91 preloaded UI: table readability */
.table-wrap .erp-baten-table :is(th,td).erp-ui-product-col{min-width:52ch!important;width:52ch!important;max-width:56ch!important;white-space:normal!important;overflow-wrap:break-word!important}
.table-wrap .erp-baten-table :is(th,td).erp-ui-index-col{min-width:5ch!important;width:5ch!important;max-width:6ch!important;white-space:normal!important;overflow-wrap:anywhere!important;word-break:break-word!important;padding-inline:3px!important}
.table-wrap .erp-baten-table td[data-baten-pin="identity"].erp-ui-product-col{min-width:52ch!important;max-width:56ch!important}
.table-wrap .erp-baten-table .product-name,.table-wrap .erp-baten-table .barcode,.table-wrap .erp-baten-table .erp-baten-selectable-barcode,.po-planning-table .product-name,.po-planning-table .barcode,.modal-table .product-name,.modal-table .barcode{user-select:text!important;-webkit-user-select:text!important;cursor:text!important;pointer-events:auto!important}
.table-wrap .erp-baten-table .erp-baten-selectable-barcode{display:block;margin-top:3px;color:#64748b;font:500 .72rem/1.35 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:normal;overflow-wrap:anywhere}
.table-wrap .erp-baten-table td.erp-baten-combined-product::after{display:none!important}
.toko-module-commercial .erp-table-commandbar .erp-command-actions,.ci-shell .erp-table-commandbar .erp-command-actions{display:flex!important;flex-wrap:wrap!important;column-gap:10px!important;row-gap:12px!important;margin-top:12px!important;min-width:0!important}
.toko-module-commercial .erp-table-commandbar .erp-search-box,.ci-shell .erp-table-commandbar .erp-search-box{flex:1 1 330px!important;min-width:min(100%,280px)!important;max-width:none!important}
.toko-module-commercial .erp-table-commandbar .ci-table-search,.ci-shell .erp-table-commandbar .ci-table-search{flex:1 1 320px!important;min-width:min(100%,280px)!important;max-width:none!important;width:auto!important}
.erp-sticky-table-toolbar .field.grow,.compact-filter-bar .field.grow{flex:1 1 350px!important;min-width:min(100%,270px)!important;max-width:none!important}
.modal-filters input[data-filter="q"]{min-width:0!important;width:100%!important}
.ci-shell .erp-drawer-form .ci-filter-group{display:grid;gap:10px;margin-bottom:16px;padding:12px;border:1px solid #e1e7ef;border-radius:10px}
.ci-shell .erp-drawer-form .ci-filter-group h3{font-size:.82rem;margin:0 0 4px;color:#334155}

/* v1.4: reserve enough room for S/N and Rank/RANKING plus sort icons. */
table.data-table thead th.erp-index-header{min-width:94px!important;width:94px;box-sizing:border-box!important;white-space:nowrap!important;overflow:visible!important;text-overflow:clip!important}
table.data-table thead th.erp-index-header[data-erp-index-kind="rank"]{min-width:105px!important;width:105px}
table.data-table thead th.erp-index-header .ci-sort-link{min-width:94px!important;box-sizing:border-box!important;white-space:nowrap!important;justify-content:space-between!important;padding-inline:9px!important}
table.data-table thead th.erp-index-header[data-erp-index-kind="rank"] .ci-sort-link{min-width:105px!important}

/* Global stock-level attention formatting. Approved rule: <=0 red; positive and strictly below Reorder Point amber. */
.stock-level-value{display:inline-block;border-radius:6px;padding:2px 6px;font-weight:700;line-height:1.35}
.stock-level-value.stock-zero{color:#b42318!important;background:#fee4e2!important;border:1px solid #fda29b!important}
.stock-level-value.stock-low{color:#b42318!important;background:#fee4e2!important;border:1px solid #fda29b!important}
.stock-level-value.stock-normal{color:inherit;background:transparent;border-color:transparent}
.stock-level-value.stock-unknown{color:inherit;background:transparent;border-color:transparent}
td.stock-level-value.stock-zero{background:#fee4e2!important}
td.stock-level-value.stock-low{background:#fee4e2!important}
.mobile-product-master-meta .stock-level-value{min-width:58px;text-align:center}
/* Stock-level highlighting must not change native table geometry. */
td.stock-level-value{display:table-cell;border-radius:0}
/* v1.6.10 Invoice Submission audit: Finance unclear-note feedback. */
.invoice-action-dropdown input.input{width:260px;max-width:36vw;min-height:34px;padding:5px 9px;font-size:.72rem;font-weight:700}
.invoice-unclear-reason{display:block;color:#8b3f49;font-size:.68rem;line-height:1.3;white-space:normal}
.invoice-recent-status .invoice-unclear-reason{flex-basis:100%;width:100%}
@media(max-width:800px){.invoice-action-dropdown input.input{width:100%;max-width:none;min-width:0}}

/* Shared product picker mobile-only metadata is revealed by mobile.css inside Staff PWA. */
.picker-mobile-product-meta{display:none}

/* v1.6.48 duplicate-item edit target */
.erp-existing-item-focus{outline:3px solid rgba(37,99,235,.34);outline-offset:-2px;box-shadow:0 0 0 4px rgba(37,99,235,.10)!important;transition:box-shadow .2s ease,outline-color .2s ease}.data-table tr.erp-existing-item-focus>td{background:#eef6ff!important}.mobile-line.erp-existing-item-focus,.mobile-adjustment-card.erp-existing-item-focus{background:#eef6ff!important}

/* v1.6.50 backend suggestion-first scattered search. Mobile/PWA is intentionally excluded. */
body:not(.mobile-app-body) .erp-table-search-suggestions{
  position:absolute;left:0;right:0;top:calc(100% + 4px);z-index:180;
  max-height:280px;overflow:auto;background:#fff;border:1px solid #cbd7e5;
  border-radius:9px;box-shadow:0 10px 28px rgba(15,23,42,.16);padding:4px;
}
body:not(.mobile-app-body) .erp-table-search-suggestion{
  width:100%;display:block;border:0;background:#fff;text-align:left;padding:8px 10px;
  border-radius:7px;color:var(--text);cursor:pointer;font-size:.82rem;line-height:1.25;
}
body:not(.mobile-app-body) .erp-table-search-suggestion:hover,
body:not(.mobile-app-body) .erp-table-search-suggestion:focus{background:#eef5ff;outline:none}
body:not(.mobile-app-body) .erp-table-search-suggestion-empty{padding:9px 10px;color:var(--muted);font-size:.78rem}
body:not(.mobile-app-body) .erp-table-search-apply{align-self:end;white-space:nowrap}