:root { --bg:#f3f5f9; --card:#fff; --ink:#1d2433; --muted:#667085; --pri:#1f4fa8; --line:#dfe3ea; --err:#c0392b; --ok:#1e8e3e; }
@media (prefers-color-scheme: dark) { :root { --bg:#12151c; --card:#1b2029; --ink:#e7eaf0; --muted:#98a2b3; --pri:#5b8def; --line:#2c3340; } }
* { box-sizing:border-box; }
body { margin:0; font:15px/1.45 system-ui, "Segoe UI", sans-serif; background:var(--bg); color:var(--ink); }
.top { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:12px 16px; background:var(--pri); color:#fff; flex-wrap:wrap; }
.brand { font-weight:800; letter-spacing:.5px; font-size:18px; }
.tag { font-size:11px; opacity:.85; }
.who { font-size:13px; display:flex; gap:8px; align-items:center; }
.who button { background:rgba(255,255,255,.15); color:#fff; border:0; }
main { max-width:1100px; margin:0 auto; padding:16px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:16px; margin-bottom:14px; }
.narrow { max-width:380px; margin:40px auto; }
.hidden { display:none !important; }
h2, h3 { margin:0 0 10px; }
label { display:block; margin:8px 0; font-size:13px; color:var(--muted); }
input, select, textarea { width:100%; padding:8px; border:1px solid var(--line); border-radius:6px; font:inherit; background:var(--card); color:var(--ink); margin-top:3px; }
button { padding:8px 14px; border:1px solid var(--line); border-radius:6px; background:var(--card); color:var(--ink); cursor:pointer; font:inherit; }
button.pri { background:var(--pri); color:#fff; border-color:var(--pri); }
.row { display:flex; gap:10px; align-items:center; margin-top:10px; flex-wrap:wrap; }
.err { color:var(--err); margin-top:8px; }
.msg { font-size:13px; }
.msg.ok { color:var(--ok); } .msg.bad { color:var(--err); }
.muted { color:var(--muted); font-size:13px; }
.tabs { display:flex; gap:6px; flex-wrap:wrap; margin-bottom:10px; }
.tabs button.on { background:var(--pri); color:#fff; border-color:var(--pri); }
.grid4 { display:grid; grid-template-columns:repeat(4, 1fr); gap:0 12px; }
.span2 { grid-column:span 2; } .span4 { grid-column:span 4; }
table { width:100%; border-collapse:collapse; margin:8px 0; font-size:13px; }
th, td { border-bottom:1px solid var(--line); padding:5px; text-align:left; }
.lines input { margin:0; padding:5px; }
.lines td:nth-child(1) { min-width:180px; }
.tot { text-align:right; font-weight:600; margin:6px 0; }
.st { padding:2px 8px; border-radius:10px; font-size:12px; background:#eef; color:#334; }
.st.posted, .st.done { background:#e3f6e8; color:#1e6b34; } .st.rejected { background:#fde8e6; color:#9b2a1e; } .st.approved { background:#e6effd; color:#1f4fa8; }
.tok { font-family:monospace; word-break:break-all; background:#fff7d6; color:#333; padding:8px; border-radius:6px; }
.scroll { overflow-x:auto; }
#printArea { display:none; }
@media (max-width:700px) { .grid4 { grid-template-columns:1fr 1fr; } .span4 { grid-column:span 2; } }
@media print {
  body { background:#fff; color:#000; }
  .top, main { display:none !important; }
  #printArea { display:block; padding:10px; font-size:12px; }
  #printArea table th, #printArea table td { border:1px solid #999; }
  .pbill h2 { text-align:center; margin:0; } .pbill .c { text-align:center; } .pbill .r { text-align:right; }
}
.btnlike { display:inline-block; padding:8px 14px; border:1px solid var(--line); border-radius:6px; background:var(--card); cursor:pointer; margin:0; font-size:15px; color:var(--ink); }
.st.draft { background:#fff3cd; color:#7a5b00; }
#sEditTag:empty { display:none; }
.notice { border-left: 5px solid #e0a100; background: #fffbea; color: #333; }
/* ---- Tally "Classic" Tax Invoice ---- */
@media print { @page { size: A4; margin: 10mm; } }
.tinv { font: 11px/1.35 Arial, sans-serif; color: #000; max-width: 190mm; margin: 0 auto; }
.tinv .tt { text-align: center; font-weight: bold; font-size: 15px; margin-bottom: 3px; }
.tinv table.tb { width: 100%; border-collapse: collapse; margin: 0; }
.tinv table.tb td, .tinv table.tb th { border: 1px solid #000; padding: 3px 5px; vertical-align: top; }
.tinv table.tb + table.tb { margin-top: -1px; }
.tinv .w50 { width: 50%; }
.tinv .seller { display: flex; gap: 8px; align-items: flex-start; }
.tinv .seller img { width: 62px; height: 62px; object-fit: contain; }
.tinv .big { font-size: 14px; }
.tinv .lbl { font-size: 10px; }
.tinv .it th { font-weight: bold; text-align: center; font-size: 10.5px; }
.tinv .it td { border-top: 0; border-bottom: 0; }
.tinv .it tr.fill td { height: 70px; }
.tinv .it tr.tot td { border-top: 1px solid #000; border-bottom: 1px solid #000; }
.tinv .it thead + tbody tr:last-child td { border-bottom: 1px solid #000; }
.tinv .it .desc { width: 38%; }
.tinv .r { text-align: right; } .tinv .c { text-align: center; }
.tinv .sign { text-align: right; margin-top: 8px; }
.tinv .foot { margin-top: 4px; font-size: 10px; }
.bulkbar { margin: 0 0 8px; padding: 6px 10px; border: 1px dashed var(--line); border-radius: 8px; }
.bulkprev { border-left: 4px solid var(--pri); }
tr.bad td { background: #fde8e6; color: #333; }
.err { color: var(--err); }
/* ---- Tally jaisa voucher ---- */
.vch { border:1px solid var(--line); border-radius:8px; padding:0 12px 10px; }
.vhead { display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin:0 -12px 8px; padding:8px 12px; background:var(--pri); color:#fff; border-radius:8px 8px 0 0; }
.vhead .vtype { font-weight:800; font-size:17px; letter-spacing:.5px; }
.vhead label { color:#fff; display:flex; align-items:center; gap:6px; margin:0; font-size:13px; }
.vhead input { width:auto; margin:0; padding:5px 8px; }
.vhead .vno { margin-left:auto; } .vhead .vno input { width:130px; font-weight:700; }
.nochk { font-size:12px; min-width:18px; } .nochk.ok { color:#bff5c9; } .nochk.bad { color:#ffd2cc; font-weight:700; }
.vgrid { display:grid; grid-template-columns:repeat(4, 1fr); gap:0 12px; }
.vgrid .span3 { grid-column:span 3; } .vgrid .span2 { grid-column:span 2; } .vgrid .span4 { grid-column:span 4; }
.inl { display:flex; gap:6px; align-items:stretch; } .inl input { flex:1; } .inl button { margin-top:3px; padding:4px 10px; }
.pinfo { font-size:12.5px; color:var(--muted); background:var(--bg); border-radius:6px; padding:5px 9px; margin:2px 0 4px; min-height:24px; }
.pinfo b { color:var(--ink); } .pinfo .warn { color:var(--err); }
.vmore { margin:4px 0 6px; } .vmore summary { cursor:pointer; color:var(--pri); font-size:13px; }
.lines th { background:var(--bg); font-size:12px; white-space:nowrap; }
.lines th.r, .lines td.r, .lines .amt { text-align:right; }
.row.tight { margin-top:2px; }
.vfoot { display:flex; gap:16px; align-items:flex-start; flex-wrap:wrap; margin-top:8px; }
.vch-ch { flex:1 1 340px; } .vch-ch table { margin:4px 0; }
.vtot { flex:0 0 300px; width:300px; margin:0; } .vtot td { padding:3px 6px; } .vtot td:last-child { text-align:right; font-variant-numeric:tabular-nums; }
.vtot tr.g td { font-weight:800; font-size:15px; border-top:2px solid var(--ink); }
/* ---- master popup ---- */
.dlg { border:0; border-radius:12px; padding:0; width:min(980px, 96vw); max-height:92vh; background:var(--card); color:var(--ink); box-shadow:0 10px 40px rgba(0,0,0,.35); }
.dlg::backdrop { background:rgba(10,15,30,.45); }
.dlg .dh { display:flex; align-items:center; gap:8px; padding:10px 14px; background:var(--pri); color:#fff; position:sticky; top:0; z-index:2; }
.dlg .dh b { font-size:16px; margin-right:auto; } .dlg .dh button { background:rgba(255,255,255,.15); color:#fff; border:0; }
.dlg .dh button.on { background:#fff; color:var(--pri); font-weight:700; }
.dlg .db { padding:12px 14px; overflow:auto; max-height:calc(92vh - 52px); }
.mgrid { display:grid; grid-template-columns:repeat(4, 1fr); gap:0 12px; }
.mgrid .span2 { grid-column:span 2; } .mgrid .span4 { grid-column:span 4; }
.mgrid h4 { grid-column:span 4; margin:10px 0 0; font-size:13px; color:var(--pri); border-bottom:1px solid var(--line); padding-bottom:3px; }
.mlist { max-height:52vh; overflow:auto; border:1px solid var(--line); border-radius:6px; }
.mlist table { margin:0; } .mlist th { position:sticky; top:0; background:var(--bg); }
.mlist tr:hover td { background:var(--bg); }
.tag2 { font-size:11px; padding:1px 6px; border-radius:8px; background:#fff3cd; color:#7a5b00; }
.errs { color:var(--err); font-size:13px; margin:6px 0; padding-left:18px; }
.ask { text-align:center; padding:10px 0; } .ask .big { font-size:17px; font-weight:700; margin-bottom:10px; }
.ask button { min-width:110px; margin:4px; }
.gst-st { font-size:11px; padding:1px 6px; border-radius:8px; background:#e6effd; color:#1f4fa8; white-space:nowrap; }
@media (max-width:700px) { .vgrid, .mgrid { grid-template-columns:1fr 1fr; } .vgrid .span3, .vgrid .span4, .mgrid .span4, .mgrid h4 { grid-column:span 2; } .vtot { flex:1 1 100%; width:100%; } }
.toastm { position:fixed; bottom:20px; left:50%; transform:translateX(-50%); background:#1e8e3e; color:#fff; padding:9px 16px; border-radius:8px; z-index:9999; box-shadow:0 4px 14px rgba(0,0,0,.25); }
.lines input.r, .lines input.q { min-width:78px; } .lines input.u { min-width:56px; } .lines input.hsn { min-width:72px; } .lines input.g, .lines input.d { min-width:56px; }