:root {
  --primary: #0f4c81; --primary-2: #1565c0; --accent: #f59e0b; --bg: #f4f6fa; --card: #fff;
  --text: #1f2937; --muted: #6b7280; --border: #e3e8ef; --ok: #15803d; --warn: #b45309; --err: #b91c1c;
  --radius: 10px; --nav-w: 210px;
}
* { box-sizing: border-box; }
html, body { margin: 0; }
body { font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans", Arial, sans-serif; background: var(--bg); color: var(--text); font-size: 15px; }
a { color: var(--primary-2); }
h1, h2, h3 { margin: 0 0 .6rem; } h2 { font-size: 1.25rem; } h3 { font-size: 1.05rem; }

/* Layout */
.topbar { position: sticky; top: 0; z-index: 20; height: 54px; display: flex; align-items: center; gap: .6rem; padding: 0 1rem; background: var(--primary); color: #fff; }
.brand { color: #fff; text-decoration: none; font-weight: 700; font-size: 1.15rem; display: flex; align-items: center; gap: .5rem; }
.brand img { width: 30px; height: 30px; } .brand span { color: var(--accent); }
.spacer { flex: 1; }
.icon-btn { background: none; border: 0; color: inherit; font-size: 1.4rem; cursor: pointer; display: none; }
.sidebar { position: fixed; top: 54px; left: 0; bottom: 0; width: var(--nav-w); background: #fff; border-right: 1px solid var(--border); padding: .6rem; display: flex; flex-direction: column; gap: 2px; z-index: 15; }
.sidebar a { display: flex; align-items: center; gap: .55rem; padding: .44rem .7rem; border-radius: 8px; color: var(--text); text-decoration: none; font-weight: 500; font-size: .92rem; line-height: 1.25; min-height: 34px; }
.sidebar a > span { flex: 1; min-width: 0; }
.sidebar a i { font-style: normal; flex: 0 0 1.4rem; width: 1.4rem; text-align: center; font-size: 1rem; line-height: 1; }
.sidebar a kbd { margin-left: auto; font-size: .7rem; color: var(--muted); border: 1px solid var(--border); border-radius: 4px; padding: 0 4px; }
.sidebar a:hover { background: #eef3fa; } .sidebar a.active { background: var(--primary); color: #fff; }
.sidebar a.active kbd { color: #dbe7f5; border-color: #5d86b0; }
.nav-foot { margin-top: auto; font-size: .78rem; color: var(--muted); padding: .6rem; }
.nav-shade { display: none; }
main { margin-left: var(--nav-w); padding: 1.2rem; max-width: 1400px; }

/* Components */
.card { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 1rem 1.1rem; margin-bottom: 1rem; box-shadow: 0 1px 2px rgba(16,24,40,.04); }
.card.error { border-color: #fecaca; background: #fef2f2; color: var(--err); }
.row { display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; }
.row.between { justify-content: space-between; }
.grid { display: grid; gap: .8rem; }
.grid.cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.grid.cols-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.grid.cols-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: .8rem; margin-bottom: 1rem; }
.stat { background: #fff; border: 1px solid var(--border); border-radius: var(--radius); padding: .9rem 1rem; }
.stat .label { color: var(--muted); font-size: .82rem; text-transform: uppercase; letter-spacing: .03em; }
.stat .value { font-size: 1.5rem; font-weight: 700; margin-top: .25rem; }
.stat.primary { background: var(--primary); color: #fff; border-color: var(--primary); } .stat.primary .label { color: #cfe0f3; }
.stat.warn .value { color: var(--warn); }
label { display: block; font-size: .82rem; color: var(--muted); margin-bottom: .2rem; font-weight: 500; }
input, select, textarea { width: 100%; padding: .55rem .65rem; border: 1px solid #cfd6e0; border-radius: 8px; font: inherit; background: #fff; color: var(--text); }
input:focus, select:focus, textarea:focus { outline: 2px solid #9cc3ee; border-color: var(--primary-2); }
input[type=checkbox], input[type=radio] { width: auto; }
.check { display: flex; gap: .45rem; align-items: center; color: var(--text); font-size: .9rem; cursor: pointer; }
.btn { display: inline-flex; align-items: center; gap: .35rem; padding: .55rem .95rem; border-radius: 8px; border: 1px solid var(--primary); background: var(--primary); color: #fff; font: inherit; font-weight: 600; cursor: pointer; text-decoration: none; white-space: nowrap; }
.btn:hover { filter: brightness(1.08); } .btn:disabled { opacity: .5; cursor: not-allowed; }
.btn.light { background: #fff; color: var(--primary); } .btn.ghost { background: transparent; color: var(--primary); border-color: var(--border); }
.btn.danger { background: var(--err); border-color: var(--err); } .btn.ok { background: var(--ok); border-color: var(--ok); }
.btn.accent { background: var(--accent); border-color: var(--accent); color: #111; }
.btn.small { padding: .3rem .6rem; font-size: .85rem; } .btn.big { padding: .8rem 1.2rem; font-size: 1.05rem; }
.link-btn { background: none; border: 0; color: var(--primary-2); cursor: pointer; padding: .15rem .3rem; font: inherit; font-size: .88rem; }
.link-btn.danger { color: var(--err); }
.badge { display: inline-block; padding: .12rem .5rem; border-radius: 99px; font-size: .75rem; font-weight: 600; background: #e5e7eb; color: #374151; }
.badge.ok { background: #dcfce7; color: var(--ok); } .badge.warn { background: #fef3c7; color: var(--warn); } .badge.err { background: #fee2e2; color: var(--err); }
.badge.sample { background: #ede9fe; color: #6d28d9; } .badge.info { background: #dbeafe; color: #1e40af; }
.topbar .badge { background: rgba(255,255,255,.15); color: #fff; } .topbar .badge.off { background: var(--accent); color: #111; }
.muted { color: var(--muted); } .small { font-size: .85rem; } .right { text-align: right; } .center { text-align: center; }
.nowrap { white-space: nowrap; } .mono { font-family: ui-monospace, Consolas, monospace; }
.banner { background: #f5f3ff; border: 1px solid #ddd6fe; color: #4c1d95; padding: .7rem 1rem; border-radius: var(--radius); margin-bottom: 1rem; display: flex; gap: .8rem; align-items: center; flex-wrap: wrap; }
.banner.warn { background: #fffbeb; border-color: #fde68a; color: #78350f; }

/* Tables */
.table-wrap { overflow-x: auto; }
table.table { width: 100%; border-collapse: collapse; font-size: .9rem; }
.table th, .table td { padding: .5rem .55rem; border-bottom: 1px solid var(--border); text-align: left; vertical-align: middle; }
.table th { background: #f8fafc; color: #475569; font-weight: 600; font-size: .8rem; text-transform: uppercase; letter-spacing: .02em; white-space: nowrap; }
.table td.num, .table th.num { text-align: right; white-space: nowrap; }
.table tr.low td { background: #fffbeb; } .table tr.cancelled td { color: #9ca3af; text-decoration: line-through; }
.table tfoot td { font-weight: 700; background: #f8fafc; }
.table input { padding: .35rem .45rem; min-width: 60px; }
.empty { text-align: center; color: var(--muted); padding: 1.4rem !important; }

/* Search dropdown */
.search-wrap { position: relative; }
.results { position: absolute; left: 0; right: 0; top: 100%; z-index: 30; background: #fff; border: 1px solid var(--border); border-radius: 8px; box-shadow: 0 10px 25px rgba(0,0,0,.12); max-height: 360px; overflow: auto; display: none; }
.results.show { display: block; }
.results .r { padding: .55rem .75rem; cursor: pointer; display: flex; justify-content: space-between; gap: .6rem; border-bottom: 1px solid #f1f5f9; }
.results .r.active, .results .r:hover { background: #eef3fa; }
.results .r .meta { font-size: .78rem; color: var(--muted); }
.results .r.out { opacity: .55; }

/* POS */
.pos { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 1rem; align-items: start; }
.pos-side { position: sticky; top: 70px; }
#posSearch { font-size: 1.05rem; padding: .75rem .85rem; }
.totals { width: 100%; border-collapse: collapse; margin: .6rem 0; }
.totals td { padding: .28rem 0; } .totals td:last-child { text-align: right; font-variant-numeric: tabular-nums; }
.totals tr.grand td { font-size: 1.45rem; font-weight: 800; color: var(--primary); border-top: 2px solid var(--border); padding-top: .5rem; }
.pay-modes { display: grid; grid-template-columns: repeat(4, 1fr); gap: .35rem; }
.pay-modes label { margin: 0; }
.pay-modes input { display: none; }
.pay-modes span { display: block; text-align: center; padding: .5rem .2rem; border: 1px solid #cfd6e0; border-radius: 8px; cursor: pointer; color: var(--text); font-weight: 600; font-size: .88rem; }
.pay-modes input:checked + span { background: var(--primary); color: #fff; border-color: var(--primary); }
.hint { font-size: .78rem; color: var(--muted); }

/* Dialog */
dialog { border: 0; border-radius: 12px; padding: 0; width: min(720px, 95vw); box-shadow: 0 25px 60px rgba(0,0,0,.25); }
dialog::backdrop { background: rgba(15, 23, 42, .45); }
#modalBody { padding: 1.2rem; max-height: 85vh; overflow: auto; }
.modal-actions { display: flex; justify-content: flex-end; gap: .5rem; margin-top: 1rem; }

/* Toast */
.toast { pointer-events: none; position: fixed; bottom: 1.2rem; left: 50%; transform: translateX(-50%) translateY(200%); opacity: 0; visibility: hidden; background: #111827; color: #fff; padding: .7rem 1.1rem; border-radius: 10px; z-index: 100; transition: transform .25s, opacity .25s, visibility .25s; max-width: 90vw; }
.toast.show { transform: translateX(-50%) translateY(0); opacity: 1; visibility: visible; } .toast.err { background: var(--err); } .toast.ok { background: #14532d; }

/* Invoice (screen preview + print) */
.inv-toolbar { position: sticky; top: 54px; z-index: 5; background: var(--bg); padding: .5rem 0; }
.inv-preview { background: #e5e7eb; padding: 1rem; border-radius: var(--radius); overflow: auto; }
.inv { background: #fff; color: #000; margin: 0 auto; box-shadow: 0 2px 10px rgba(0,0,0,.12); position: relative; }
.inv.a4 { width: 210mm; min-height: 280mm; padding: 10mm; font-size: 12px; }
.inv.a4 .inv-head { display: flex; justify-content: space-between; gap: 1rem; border-bottom: 2px solid #0f4c81; padding-bottom: 8px; }
.inv.a4 .inv-head h1 { font-size: 24px; color: #0f4c81; margin: 0 0 4px; }
.inv.a4 .inv-title { text-align: right; } .inv.a4 .inv-title h2 { font-size: 18px; letter-spacing: .08em; margin: 0 0 6px; }
.inv.a4 .kv td { padding: 1px 0 1px 10px; } .inv.a4 .kv td:first-child { color: #555; }
.inv.a4 .inv-party { display: flex; justify-content: space-between; gap: 1rem; padding: 8px 0; border-bottom: 1px solid #ccc; }
.inv table.items { width: 100%; border-collapse: collapse; margin-top: 8px; }
.inv.a4 table.items th { background: #0f4c81; color: #fff; padding: 5px; font-size: 11px; text-align: left; }
.inv.a4 table.items td { padding: 5px; border-bottom: 1px solid #ddd; vertical-align: top; }
.inv .n { text-align: right; white-space: nowrap; }
.inv.a4 .inv-bottom { display: flex; justify-content: space-between; gap: 1rem; margin-top: 10px; }
.inv.a4 table.tax { border-collapse: collapse; font-size: 11px; } .inv.a4 table.tax th, .inv.a4 table.tax td { border: 1px solid #bbb; padding: 3px 6px; }
.inv.a4 table.tax th { background: #f1f5f9; }
.inv.a4 table.tot { border-collapse: collapse; min-width: 250px; } .inv.a4 table.tot td { padding: 3px 4px; }
.inv.a4 table.tot tr.grand td { font-size: 16px; font-weight: 800; border-top: 2px solid #0f4c81; color: #0f4c81; }
.inv.a4 .words { margin-top: 10px; padding: 6px 8px; background: #f8fafc; border: 1px solid #e2e8f0; }
.inv.a4 .inv-foot { display: flex; justify-content: space-between; gap: 1rem; margin-top: 18px; font-size: 11px; }
.inv.a4 .sign { text-align: right; min-width: 200px; } .inv.a4 .sign .line { margin-top: 40px; border-top: 1px solid #333; padding-top: 3px; }
.inv .stamp { position: absolute; top: 40%; left: 50%; transform: translate(-50%, -50%) rotate(-20deg); font-size: 60px; font-weight: 900; color: rgba(185, 28, 28, .25); border: 6px solid rgba(185, 28, 28, .25); padding: 4px 20px; pointer-events: none; }
.inv.a4 .bank { margin-bottom: 6px; } .inv.a4 .kv0 { border-collapse: collapse; } .inv.a4 .kv0 td { padding: 0 8px 0 0; } .inv.a4 .kv0 td:first-child { color: #555; }
.inv.a4.a5 { width: 148mm; min-height: 200mm; padding: 6mm; font-size: 9.5px; }
.inv.a4.a5 .inv-head h1 { font-size: 17px; } .inv.a4.a5 .inv-title h2 { font-size: 13px; }
.inv.a4.a5 table.items th { font-size: 8.5px; padding: 3px; } .inv.a4.a5 table.items td { padding: 3px; }
.inv.a4.a5 table.tax { font-size: 8.5px; } .inv.a4.a5 table.tax th, .inv.a4.a5 table.tax td { padding: 2px 3px; }
.inv.a4.a5 table.tot { min-width: 170px; } .inv.a4.a5 table.tot tr.grand td { font-size: 12px; }
.inv.a4.a5 .inv-foot { font-size: 8.5px; margin-top: 10px; } .inv.a4.a5 .sign { min-width: 130px; } .inv.a4.a5 .sign .line { margin-top: 26px; }
.inv.a4.a5 .inv-bottom { flex-wrap: wrap; }
.inv.thermal .bank-t { font-size: 10.5px; text-align: center; }
.inv.thermal { width: 80mm; padding: 3mm; font-family: ui-monospace, "Courier New", monospace; font-size: 11.5px; line-height: 1.35; }
.inv.thermal .c { text-align: center; } .inv.thermal .big { font-size: 16px; font-weight: 800; }
.inv.thermal hr { border: 0; border-top: 1px dashed #000; margin: 4px 0; }
.inv.thermal table { width: 100%; border-collapse: collapse; } .inv.thermal td, .inv.thermal th { padding: 1px 0; vertical-align: top; }
.inv.thermal th { text-align: left; border-bottom: 1px dashed #000; font-weight: 700; }
.inv.thermal td.n, .inv.thermal th.n { text-align: right; padding-left: 4px; }
.inv.thermal .grand td { font-size: 14px; font-weight: 800; }
.inv.thermal .stamp { font-size: 28px; border-width: 3px; }


/* ---- v2 additions ---- */
.sidebar { overflow-y: auto; overscroll-behavior: contain; padding-bottom: 1rem; scrollbar-width: thin; }
.nav-group { display: flex; flex-direction: column; gap: 2px; margin-top: .25rem; padding-top: .25rem; border-top: 1px solid #f1f5f9; }
.nav-h { all: unset; box-sizing: border-box; display: flex; align-items: center; justify-content: space-between; width: 100%; cursor: pointer; font-size: .7rem; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); padding: .45rem .7rem .25rem; font-weight: 700; border-radius: 6px; }
.nav-h::after { content: '▾'; font-size: .8rem; transition: transform .15s; }
.nav-h:hover { color: var(--primary); } .nav-h:focus-visible { outline: 2px solid var(--primary); outline-offset: 1px; }
.nav-group.collapsed .nav-h::after { transform: rotate(-90deg); }
.nav-group.collapsed a:not(.active) { display: none; }
.sidebar [hidden] { display: none !important; } /* role-hidden entries/sections (the display:flex rules above would otherwise win) */
.sidebar a:focus-visible { outline: 2px solid var(--primary); outline-offset: -2px; }
.user-chip { display: flex; align-items: center; gap: .35rem; font-size: .88rem; white-space: nowrap; }
.user-chip .badge { background: rgba(255,255,255,.2); color: #fff; }
.topbanner { margin: 0 0 0 var(--nav-w); padding: .55rem 1.2rem; background: #fffbeb; border-bottom: 1px solid #fde68a; color: #78350f; display: flex; gap: .8rem; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.topbanner[hidden] { display: none; }
.tabs { display: flex; gap: .3rem; margin-bottom: 1rem; border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.tab { border: 0; background: none; padding: .55rem .9rem; font: inherit; font-weight: 600; color: var(--muted); cursor: pointer; border-bottom: 3px solid transparent; }
.tab.active { color: var(--primary); border-bottom-color: var(--primary); }
.badge.combo { background: #ffedd5; color: #9a3412; }
.danger-t, .err-t { color: var(--err); } .warn-t { color: var(--warn); } .ok-t { color: var(--ok); }
.btn.warn-btn { background: #fef3c7; color: var(--warn); border-color: #fcd34d; }
.btn.block { width: 100%; justify-content: center; }
.btn.ghost.danger-t { color: var(--err); }
.cost { color: #7c3aed; }
.owner-only td { color: #7c3aed; font-weight: 600; }
.big-total { font-size: 1.6rem; font-weight: 800; color: var(--primary); }
.small-v { font-size: .8rem; color: var(--muted); }
.ask-msg { line-height: 1.5; }
dialog.ask { width: min(460px, 94vw); }
dialog.ask form { padding: 1.2rem; }
dialog.wide { width: min(1000px, 96vw); }
.layout-sel { display: inline-grid; width: auto; }
.layout-sel span { padding: .35rem .7rem; }
.search-box { position: relative; }
.sn-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: .3rem; max-height: 300px; overflow: auto; padding: .4rem; border: 1px solid var(--border); border-radius: 8px; margin: .5rem 0; }
.sn-list .sn { padding: .25rem .4rem; border-radius: 6px; } .sn-list .sn:hover { background: #f1f5f9; }
.sn-inline { font-size: .8rem; color: var(--muted); }
.sn-card { border: 1px solid var(--border); border-radius: 8px; padding: .8rem; margin-top: .7rem; background: #f8fafc; }
.cart-table td { vertical-align: top; }
.cart-table tr.combo-head td { background: #fff7ed; border-bottom: 0; }
.cart-table tr.combo-comp td { background: #fffbf5; padding-top: .3rem; padding-bottom: .3rem; }
.cart-table tr.combo-comp td:nth-child(2) { padding-left: 1.4rem; }
.batch-sel { width: auto; padding: .2rem .4rem; font-size: .8rem; }
.table tr.combo-head td { background: #fff7ed; }
.recovery { font-family: ui-monospace, Consolas, monospace; font-size: 1.6rem; font-weight: 800; letter-spacing: .08em; text-align: center; padding: .8rem; background: #f1f5f9; border: 2px dashed #94a3b8; border-radius: 10px; margin: .8rem 0; }
/* auth */
.auth-screen[hidden] { display: none; }
.auth-screen { position: fixed; inset: 0; z-index: 50; background: linear-gradient(135deg, #0f4c81, #1565c0); display: flex; align-items: center; justify-content: center; padding: 1rem; overflow: auto; }
.auth-card { background: #fff; border-radius: 14px; padding: 1.6rem; width: min(420px, 100%); box-shadow: 0 25px 60px rgba(0,0,0,.3); }
.auth-card h2 { margin-top: 1rem; }
.auth-card label { margin-top: .6rem; }
.auth-brand { display: flex; align-items: center; justify-content: center; gap: .5rem; font-weight: 800; font-size: 1.3rem; color: var(--primary); }
.auth-brand img { width: 36px; height: 36px; } .auth-brand span { color: var(--accent); }
#pinInput { font-size: 1.6rem; text-align: center; letter-spacing: .4em; }
.user-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: .6rem; margin-top: .6rem; }
.user-btn { border: 1px solid var(--border); background: #f8fafc; border-radius: 10px; padding: 1rem .6rem; cursor: pointer; font: inherit; display: flex; flex-direction: column; gap: .2rem; align-items: center; }
.user-btn:hover { border-color: var(--primary); background: #eef3fa; } .user-btn span { font-size: .8rem; color: var(--muted); }
body.locked .topbar, body.locked .sidebar, body.locked main, body.locked .topbanner { visibility: hidden; }
/* invoice extras */
.inv .sub { font-size: .85em; color: #444; margin-top: 1px; }
.inv .muted-p { color: #555; font-size: .9em; }
.inv tr.combo-row td { background: #f1f5f9; border-bottom: 1px solid #cbd5e1; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.inv .combo-price { display: block; font-size: .88em; color: #333; font-weight: 400; }
.inv tr.comp td:nth-child(2) { padding-left: 14px; }
.inv.a4 .tax-wrap { min-width: 0; flex: 1; overflow: hidden; }
.inv.a4 .foot-left { flex: 1; min-width: 0; }
.inv.a4 table.items td:nth-child(2) { word-break: break-word; }
.inv.thermal .small-t { font-size: 10px; color: #222; }
.inv.thermal tr.combo-row td { padding-top: 3px; }
.inv.a4.a5 table.items th, .inv.a4.a5 table.items td { word-break: normal; }
.inv.a4.a5 table.items td:nth-child(2) { word-break: break-word; }
.dayend-doc { min-height: 0 !important; max-width: 150mm; }
.de-table { width: 100%; border-collapse: collapse; }
.de-table th { text-align: left; padding: 6px 0 2px; border-bottom: 1px solid #999; }
.de-table td { padding: 2px 0; } .de-table td.n { text-align: right; } .de-table tr.b td { font-weight: 800; border-top: 1px solid #ccc; }
.inv.thermal .de-table th { border-bottom: 1px dashed #000; }
/* labels: 35 x 25 mm, 3 per row */
.label-sheet { background: #e5e7eb; padding: 1rem; border-radius: var(--radius); overflow: auto; }
.label-row { display: flex; gap: 2mm; width: 109mm; margin: 0 auto 2mm; }
.label-sheet .label { width: 35mm; height: 25mm; background: #fff; color: #000; padding: 1mm 1.5mm; overflow: hidden; display: flex; flex-direction: column; font-family: Arial, sans-serif; border-radius: 1.5mm; }
.label-sheet .label.blank { background: transparent; border: 1px dashed #9ca3af; }
.l-shop { font-size: 5.5pt; font-weight: 700; text-align: center; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 1.1; }
.l-name { font-size: 6.5pt; line-height: 1.1; max-height: 2.2em; overflow: hidden; text-align: center; }
.l-bar { flex: 1; min-height: 7mm; display: flex; align-items: stretch; padding: .5mm 0; }
.l-bar svg { width: 100%; height: 100%; }
.l-foot { display: flex; justify-content: space-between; align-items: baseline; gap: 1mm; font-size: 6pt; line-height: 1.1; }
.l-code { font-family: ui-monospace, Consolas, monospace; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.l-foot b { font-size: 7.5pt; white-space: nowrap; }
.label-sheet.sheet .label-row { margin-left: 0; }
@media (max-width: 860px) { .topbanner { margin-left: 0; } .user-chip .user-name { display: none; } }
@media (max-width: 520px) { .user-chip { display: none; } }
@media print {
  .grid { display: block !important; }
  .label-sheet { background: none; padding: 0; border-radius: 0; overflow: visible; }
  .label-sheet .label { border-radius: 0; }
  .label-sheet.roll3 .label-row { margin: 0; break-after: page; page-break-after: always; height: 25mm; }
  .label-sheet.roll3 .label-row:last-child { break-after: auto; page-break-after: auto; }
  .label-sheet.sheet .label-row { break-inside: avoid; page-break-inside: avoid; margin: 0 0 2mm 0; }
  .label-sheet .label.blank { border: 0; }
  .topbanner, #authScreen { display: none !important; }
}

/* Responsive */
@media (max-width: 1100px) { .pos { grid-template-columns: minmax(0, 1fr); } .pos-side { position: static; } }
@media (max-width: 860px) {
  .icon-btn { display: block; }
  .sidebar { transform: translateX(-100%); transition: transform .2s; box-shadow: 4px 0 20px rgba(0,0,0,.15); }
  body.nav-open .sidebar { transform: none; }
  body.nav-open .nav-shade { display: block; position: fixed; inset: 54px 0 0 0; background: rgba(0,0,0,.3); z-index: 14; }
  main { margin-left: 0; padding: .8rem; }
  .grid.cols-3, .grid.cols-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .hide-sm { display: none; }
  .inv-preview { padding: .4rem; }
}
@media (max-width: 520px) { .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; } .stat { padding: .7rem; } .grid.cols-2, .grid.cols-3, .grid.cols-4 { grid-template-columns: minmax(0, 1fr); } .stat .value { font-size: 1.25rem; } #installBtn { display: none; } }

/* Print: only the invoice */
@media print {
  body { background: #fff; }
  .no-print, .topbar, .sidebar, .nav-shade, .toast, .inv-toolbar { display: none !important; }
  main { margin: 0; padding: 0; max-width: none; }
  .inv-preview { background: none; padding: 0; overflow: visible; }
  .inv { box-shadow: none; margin: 0; }
  .inv.a4 { width: auto; min-height: 0; padding: 0; }
  .inv.thermal { width: 100%; padding: 0; }
  .inv.a4 table.items th, .inv.a4 table.items th * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
  /* multi-page bills: repeat the column header, never split a row or the totals / bank / signature blocks */
  .inv table.items thead { display: table-header-group; }
  .inv table.items tr, .inv .inv-bottom, .inv .words, .inv .inv-foot, .inv table.tax, .inv table.tot { break-inside: avoid; page-break-inside: avoid; }
  .inv.a4 table.items td { padding: 3px 5px; }
  .inv.a4 table.items tr.comp td { padding-top: 2px; padding-bottom: 2px; }
  .inv.a4 .inv-foot { margin-top: 10px; } .inv.a4 .sign .line { margin-top: 30px; }
}
.grid > *, .pos > * { min-width: 0; }
/* quick "New Item" in purchase entry */
.results .r.create { background: #f0fdf4; color: var(--ok); border-top: 1px dashed #bbf7d0; }
.results .r.create.active, .results .r.create:hover { background: #dcfce7; }
.dup-box { margin-top: .7rem; border: 1px solid #fcd34d; background: #fffbeb; border-radius: 8px; padding: .55rem .7rem; }
.dup-box.strong { border-width: 2px; border-color: var(--warn); }
.dup-box .dup-title { font-weight: 600; color: var(--warn); margin-bottom: .35rem; font-size: .9rem; }
.dup-box .dup-row { display: flex; justify-content: space-between; align-items: center; gap: .6rem; padding: .3rem 0; border-top: 1px solid #fde68a; }
.dup-box .dup-row:first-of-type { border-top: 0; }
.si-search-row { display: flex; gap: .5rem; align-items: stretch; margin-top: .8rem; }
.si-search-row .search-wrap { flex: 1; min-width: 0; }
.si-search-row .btn { white-space: nowrap; }
/* ---- online sync (v2.3.0) */
.sync-chip { display: inline-flex; align-items: center; gap: .3rem; font-size: .75rem; font-weight: 600; padding: .18rem .55rem; border-radius: 999px; text-decoration: none; white-space: nowrap; background: rgba(255,255,255,.15); color: #fff; border: 1px solid rgba(255,255,255,.35); }
.sync-chip.ok { background: #dcfce7; color: #166534; border-color: #86efac; }
.sync-chip.warn { background: #fef3c7; color: #92400e; border-color: #fcd34d; }
.sync-chip.err { background: #fee2e2; color: #991b1b; border-color: #fca5a5; }
.sync-chip.off { background: #e5e7eb; color: #374151; border-color: #d1d5db; }
.sync-chip.busy { background: #dbeafe; color: #1e40af; border-color: #93c5fd; }
.sync-chip[hidden] { display: none; }
.sync-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: .8rem; margin-bottom: .6rem; }
.sync-stats .label { font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); margin-bottom: .15rem; }
.sync-dot { display: inline-block; width: .6rem; height: .6rem; border-radius: 50%; background: #9ca3af; vertical-align: middle; }
.sync-dot.ok { background: #16a34a; } .sync-dot.warn { background: #d97706; } .sync-dot.err { background: #dc2626; } .sync-dot.off { background: #6b7280; }
@media (max-width: 700px) { .sync-chip { font-size: .68rem; padding: .12rem .4rem; max-width: 9.5rem; overflow: hidden; text-overflow: ellipsis; } }
#netStatus { white-space: nowrap; }
@media (max-width: 700px) { body.sync-on #netStatus { display: none; } }

/* ---- item photos (v2.4.0) */
.thumb { width: 2.6rem; height: 2.6rem; border-radius: .4rem; object-fit: cover; background: #f1f5f9; border: 1px solid #e2e8f0; flex: none; display: inline-block; vertical-align: middle; }
.thumb.sm { width: 2.2rem; height: 2.2rem; }
.thumb.ph { background: #f1f5f9 center/55% no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='1.6'%3E%3Crect x='3' y='5' width='18' height='14' rx='2'/%3E%3Ccircle cx='9' cy='10' r='2'/%3E%3Cpath d='m21 16-5-5-8 8'/%3E%3C/svg%3E"); }
img.thumb.missing { opacity: .4; }
img.thumb[data-state=loading] { background: #e2e8f0; }
.results .r { align-items: center; }
.results .r .grow { flex: 1; min-width: 0; }
.item-cell { display: flex; align-items: center; gap: .55rem; }
.item-cell img.thumb { cursor: zoom-in; }
.img-grid { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; margin-top: .3rem; }
.img-tile { position: relative; }
.img-tile .thumb { width: 4.5rem; height: 4.5rem; }
.img-tile .x { position: absolute; top: -.4rem; right: -.4rem; width: 1.4rem; height: 1.4rem; border-radius: 50%; border: 0; background: #dc2626; color: #fff; font-size: .8rem; line-height: 1.4rem; padding: 0; cursor: pointer; }
.img-tile .tag { position: absolute; left: .2rem; bottom: .2rem; font-size: .6rem; background: rgba(15,23,42,.7); color: #fff; border-radius: .25rem; padding: 0 .25rem; }
.img-add { display: inline-flex; gap: .4rem; flex-wrap: wrap; }
.img-add label.btn { margin: 0; cursor: pointer; }
.img-add input[type=file] { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
dialog.img-viewer { border: 0; border-radius: .8rem; padding: .8rem; max-width: min(96vw, 1100px); width: 100%; }
dialog.img-viewer::backdrop { background: rgba(15,23,42,.75); }
.iv-head { display: flex; gap: .6rem; align-items: center; justify-content: space-between; margin-bottom: .5rem; }
.iv-body { display: flex; align-items: center; justify-content: center; gap: .4rem; min-height: 40vh; }
.iv-body img { max-width: 100%; max-height: 72vh; object-fit: contain; border-radius: .5rem; }
.iv-nav { font-size: 1.6rem; padding: .2rem .7rem; }
.iv-strip { display: flex; gap: .4rem; justify-content: center; margin-top: .5rem; flex-wrap: wrap; }
.iv-strip .thumb { cursor: pointer; }
.iv-strip .thumb.sel { outline: 2px solid var(--primary, #1d4ed8); }
.iv-missing { padding: 2rem; text-align: center; }
/* sync checklist + join from first run */
.checklist { list-style: none; padding: 0; margin: .4rem 0; }
.checklist li { display: flex; align-items: center; gap: .6rem; padding: .45rem 0; border-bottom: 1px solid #f1f5f9; flex-wrap: wrap; }
.checklist li .ck { width: 1.4rem; height: 1.4rem; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: .8rem; flex: none; border: 2px solid #cbd5e1; }
.checklist li.done .ck { background: #16a34a; border-color: #16a34a; color: #fff; }
.checklist li .grow { flex: 1; min-width: 10rem; }
.auth-alt { margin-top: 1rem; padding-top: .9rem; border-top: 1px solid #e2e8f0; text-align: center; }
.auth-steps { display: flex; gap: .3rem; justify-content: center; margin: .4rem 0 .8rem; }
.auth-steps span { font-size: .72rem; padding: .1rem .5rem; border-radius: 1rem; background: #f1f5f9; color: #64748b; }
.auth-steps span.on { background: var(--primary); color: #fff; }
.img-add label.disabled { opacity: .45; pointer-events: none; }

/* v2.4.1 purchase entry: incl/excl GST toggles, next-item row */
.si-modes { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .7rem; margin-top: .7rem; }
.pay-modes.seg { grid-template-columns: repeat(2, auto); gap: .25rem; }
.pay-modes.seg span { padding: .3rem .7rem; font-size: .82rem; }
.mode-btn { font-size: .75rem; padding: 0 .15rem; border: 1px dashed #b9c3d0; border-radius: 4px; }
.si-newrow { margin-top: .35rem; padding: .35rem; border: 1px dashed #b9c3d0; border-radius: 8px; background: #fafcff; }
.si-newrow input { width: 100%; }
.price-other { display: block; margin-top: .15rem; }
/* v2.5 import + service jobs */
.progress { height: 12px; background: #e5e7eb; border-radius: 6px; overflow: hidden; margin: .4rem 0; }
.progress-bar { height: 100%; background: var(--ok, #16a34a); transition: width .2s; }
.imp-stats .stat .value { font-size: 1.3rem; }
.imp-table tr.imp-error td { background: #fef2f2; }
.imp-table tr.imp-skip td { color: var(--muted); }
.job-status { display: inline-block; padding: .1rem .5rem; border-radius: 999px; font-size: .78rem; font-weight: 600; background: #e5e7eb; color: #374151; white-space: nowrap; }
.job-status.received { background: #dbeafe; color: #1e40af; } .job-status.diagnosing { background: #ede9fe; color: #5b21b6; }
.job-status.waiting_parts { background: #fef3c7; color: #92400e; } .job-status.ready { background: #dcfce7; color: #166534; }
.job-status.delivered { background: #f3f4f6; color: #374151; } .job-status.returned { background: #fee2e2; color: #991b1b; }
.job-steps { display: flex; gap: .3rem; flex-wrap: wrap; margin: .4rem 0; }
.warranty-box { padding: .5rem .7rem; border-radius: var(--radius); border: 1px solid var(--border); margin-top: .4rem; font-size: .9rem; }
.warranty-box.in { background: #f0fdf4; border-color: #bbf7d0; } .warranty-box.out { background: #fffbeb; border-color: #fde68a; }
.inv.jobcard h2 { margin: 0; }
.inv.jobcard .jc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 14px; margin: 8px 0; }
.inv.jobcard .jc-box { border: 1px solid #999; padding: 6px 8px; margin: 6px 0; }
.inv.jobcard .jc-terms { font-size: 9.5px; color: #333; margin-top: 8px; }
.inv.jobcard .jc-sign { display: flex; justify-content: space-between; margin-top: 26px; font-size: 10.5px; }
.inv.jobcard .jc-sign div { border-top: 1px solid #555; padding-top: 3px; min-width: 40%; text-align: center; }
.inv.jobcard .jc-cut { border-top: 1px dashed #777; margin: 10px 0 6px; text-align: center; font-size: 9px; color: #666; }
a.stat { color: inherit; text-decoration: none; display: block; } a.stat:hover { border-color: var(--primary); }
/* ---------- AMC contracts (v2.6) ---------- */
.amc-status { display: inline-block; padding: .1rem .5rem; border-radius: 999px; font-size: .78rem; font-weight: 600; background: #e5e7eb; color: #374151; white-space: nowrap; }
.amc-status.active { background: #dcfce7; color: #166534; } .amc-status.upcoming { background: #dbeafe; color: #1e40af; }
.amc-status.expiring { background: #fef3c7; color: #92400e; } .amc-status.expiring.d7 { background: #fee2e2; color: #991b1b; }
.amc-status.expired { background: #fee2e2; color: #991b1b; } .amc-status.renewed { background: #ede9fe; color: #5b21b6; } .amc-status.cancelled { background: #e5e7eb; color: #6b7280; text-decoration: line-through; }
.amc-buckets { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: .5rem; margin-top: .4rem; }
.amc-bucket { display: flex; flex-direction: column; align-items: center; padding: .5rem .3rem; border-radius: var(--radius); border: 1px solid #e5e7eb; text-decoration: none; color: inherit; background: #fff; }
.amc-bucket b { font-size: 1.4rem; line-height: 1.1; } .amc-bucket span { font-size: .75rem; color: #6b7280; text-align: center; }
.amc-bucket.d7 { border-color: #fca5a5; background: #fef2f2; } .amc-bucket.d15 { border-color: #fdba74; background: #fff7ed; } .amc-bucket.d30 { border-color: #fde68a; background: #fffbeb; } .amc-bucket.exp { border-color: #d1d5db; background: #f9fafb; }
.inv .amc-period { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .4rem 1rem; margin: 8px 0; padding: 6px 8px; background: #f0f9ff; border: 1px solid #bae6fd; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.inv .amc-h { font-size: 1.05em; margin: 10px 0 0; }
.inv.amc-cert .jc-terms { margin-top: 10px; padding: 6px 8px; border: 1px solid #ddd; white-space: normal; }
.inv.a4.a5.amc-cert .amc-period { font-size: 9.5px; }
/* ---------- e-way bill export ---------- */
.ewb-doc { border-left: 4px solid #0f4c81; }
.ewb-err, .ewb-warn { margin: .4rem 0 0; padding-left: 1.1rem; font-size: .85rem; } .ewb-err { color: #b91c1c; } .ewb-warn { color: #92400e; }
.ewb-ok { color: #166534; font-weight: 600; margin-top: .4rem; font-size: .9rem; }
.sel-col { width: 2rem; text-align: center; }
@media (max-width: 520px) { .amc-buckets { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media print { .ewb-doc { display: none; } }
/* WhatsApp (v2.7) */
.wa-preview { background: #e7f8ee; border: 1px solid #b7e4c7; border-radius: 10px; padding: .6rem .8rem; margin: .5rem 0; white-space: pre-wrap; font-size: .92rem; }
.wa-purpose { border-top: 1px solid var(--line, #e5e7eb); padding: .6rem 0; }
.wa-purpose .table input:not([type=checkbox]) { padding: .25rem .4rem; font-size: .85rem; }
.table.compact td, .table.compact th { padding: .25rem .4rem; }
.wa-btn { white-space: nowrap; }
.cust-code { font-family: ui-monospace, monospace; }
.wa-purpose select { width: auto; display: inline-block; padding: .2rem .4rem; }
.wa-purpose .table input:not([type=checkbox]) { line-height: 1.5; min-height: 1.9rem; }
