/* The table view of the panel's lists: dense keyboard grids the way desktop accounting programs have them. Everything hangs off .erp so the rest of the panel is untouched. */

.erp{
  --ground:#E9EDE7;--surface:#FFFFFF;--raised:#F6F8F4;--ink:#1D2620;--muted:#5D6960;--faint:#8A958C;
  --line:#D3DAD0;--line-soft:#E4E9E1;--accent:#4F725A;--accent-ink:#FFFFFF;--accent-soft:#E2ECDF;--accent-strong:#3E5B47;
  --sel:#D7E6D2;--cursor:#4F725A;--posted:#2F7D4F;--draft:#A86B12;--draft-soft:#FBF1DF;--danger:#A6402F;--danger-soft:#F7E4E0;
  --head:#F1F4EF;--shadow:0 1px 2px rgba(30,40,32,.08);
  --sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Consolas,monospace;
}
@media (prefers-color-scheme:dark){.erp{color-scheme:dark;
  --ground:#121714;--surface:#1A211C;--raised:#202822;--ink:#E2E8E1;--muted:#A3AFA5;--faint:#78847A;
  --line:#2E3931;--line-soft:#263029;--accent:#7FAE8B;--accent-ink:#0F1511;--accent-soft:#223329;--accent-strong:#9CC4A6;
  --sel:#27402F;--cursor:#8DBB98;--posted:#6CC08C;--draft:#E0A94A;--draft-soft:#3A2F1C;--danger:#E07A66;--danger-soft:#3C231F;
  --head:#1F2721;--shadow:none}}
.erp[data-theme="dark"]{color-scheme:dark;
  --ground:#121714;--surface:#1A211C;--raised:#202822;--ink:#E2E8E1;--muted:#A3AFA5;--faint:#78847A;
  --line:#2E3931;--line-soft:#263029;--accent:#7FAE8B;--accent-ink:#0F1511;--accent-soft:#223329;--accent-strong:#9CC4A6;
  --sel:#27402F;--cursor:#8DBB98;--posted:#6CC08C;--draft:#E0A94A;--draft-soft:#3A2F1C;--danger:#E07A66;--danger-soft:#3C231F;
  --head:#1F2721;--shadow:none}
.erp{color:var(--ink);font-size:13px;line-height:1.4;background:var(--surface);border:1px solid var(--line);border-radius:6px;overflow:hidden}
.erp button,.erp input,.erp select,.erp textarea{font:inherit;color:inherit}
.erp-app{display:grid;grid-template-columns:236px 1fr;grid-template-rows:44px 1fr 24px;height:100%}
/* top bar */
.erp-top{grid-column:1/-1;display:flex;align-items:center;gap:14px;padding:0 14px;background:var(--accent-strong);color:#fff}
.erp-brand{font-weight:600;letter-spacing:.06em;white-space:nowrap}
.erp-brand small{font-weight:400;opacity:.75;letter-spacing:0;margin-left:6px}
.erp-find{flex:1;max-width:420px;min-width:0;padding:5px 10px;border:0;border-radius:4px;background:rgba(255,255,255,.14);color:#fff}
.erp-find::placeholder{color:rgba(255,255,255,.7)}
.erp-user{margin-left:auto;white-space:nowrap;opacity:.9}
.erp-burger{display:none;background:none;border:0;color:#fff;font-size:18px;cursor:pointer}
/* nav */
.erp-nav{background:var(--surface);border-right:1px solid var(--line);overflow:auto;padding:8px 0}
.erp-navgroup{margin:4px 0 10px}
.erp-navgroup h3{margin:0;padding:6px 16px;font-size:11px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--faint)}
.erp-navitem{display:flex;align-items:center;gap:8px;width:100%;padding:5px 16px 5px 20px;border:0;background:none;text-align:left;cursor:pointer;color:var(--ink)}
.erp-navitem:hover{background:var(--raised)}
.erp-navitem.on{background:var(--accent-soft);color:var(--accent-strong);font-weight:500}
.erp-navitem i{font-style:normal;width:16px;color:var(--faint);text-align:center}
/* workspace */
.erp-main{display:flex;flex-direction:column;min-width:0;min-height:0}
.erp-tabs{display:flex;gap:2px;padding:6px 8px 0;background:var(--ground);overflow-x:auto;border-bottom:1px solid var(--line)}
.erp-tab{display:flex;align-items:center;gap:8px;padding:6px 10px;border:1px solid var(--line);border-bottom:0;border-radius:5px 5px 0 0;background:var(--raised);cursor:pointer;white-space:nowrap;color:var(--muted)}
.erp-tab.on{background:var(--surface);color:var(--ink);font-weight:500;position:relative;top:1px}
.erp-tab .x{border:0;background:none;cursor:pointer;color:var(--faint);padding:0 2px}
.erp-tab .x:hover{color:var(--danger)}
.erp-view{flex:1;min-height:0;display:flex;flex-direction:column;background:var(--surface);overflow:hidden}
.erp .viewhead{display:flex;align-items:baseline;gap:12px;padding:12px 16px 8px;flex-wrap:wrap}
.erp .viewhead h1{margin:0;font-size:17px;font-weight:600;text-wrap:balance}
.erp .viewhead .sub{color:var(--muted)}
.erp .bar{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:0 16px 10px}
.erp .btn{display:inline-flex;align-items:center;gap:6px;padding:5px 11px;border:1px solid var(--line);border-radius:4px;background:var(--surface);cursor:pointer;white-space:nowrap}
.erp .btn:hover{background:var(--raised)}
.erp .btn.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);font-weight:500}
.erp .btn.primary:hover{filter:brightness(1.06)}
.erp .btn:disabled{opacity:.45;cursor:default}
.erp .btn:focus-visible,.erp .erp-navitem:focus-visible,.erp .erp-tab:focus-visible,.erp .grid:focus-visible{outline:2px solid var(--cursor);outline-offset:1px}
.erp .sep{width:1px;height:20px;background:var(--line);margin:0 4px}
.erp .bar .grow{flex:1}
.erp .period{display:flex;align-items:center;gap:6px;color:var(--muted)}
.erp .period input{width:112px;padding:4px 6px;border:1px solid var(--line);border-radius:4px;background:var(--surface)}
/* split: folders + list */
.erp .split{flex:1;min-height:0;display:grid;grid-template-columns:210px 1fr}
.erp .folders{border-right:1px solid var(--line-soft);overflow:auto;padding:6px 0;background:var(--raised)}
.erp .folder{display:block;width:100%;padding:4px 12px;border:0;background:none;text-align:left;cursor:pointer;color:var(--ink)}
.erp .folder:hover{background:var(--accent-soft)}
.erp .folder.on{background:var(--sel);font-weight:500}
.erp .folder .n{float:right;color:var(--faint);font-size:12px}
/* grid */
.erp .gridwrap{flex:1;min-height:0;overflow:auto;border-top:1px solid var(--line)}
.erp .grid{border-collapse:separate;border-spacing:0;min-width:100%;outline:none}
.erp .grid th,.erp .grid td{border-right:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);padding:0 8px;height:27px;white-space:nowrap;text-align:left}
.erp .grid thead th{position:sticky;top:0;z-index:2;background:var(--head);font-weight:500;color:var(--muted);height:30px;cursor:pointer;user-select:none}
.erp .grid thead tr.erp-filters th{top:30px;height:28px;padding:0 3px;cursor:default;background:var(--surface)}
.erp .grid thead tr.erp-filters input{width:100%;min-width:60px;box-sizing:border-box;padding:2px 5px;border:1px solid var(--line-soft);border-radius:3px;background:var(--raised);font-size:12px}
.erp .grid tbody tr{cursor:default}
.erp .grid tbody tr:hover td{background:var(--raised)}
.erp .grid tbody tr.sel td{background:var(--sel)}
.erp .grid td.cur{box-shadow:inset 0 0 0 2px var(--cursor)}
.erp .grid td.num,.erp .grid th.num{text-align:right;font-variant-numeric:tabular-nums}
.erp .grid .mono{font-family:var(--mono);font-size:12.5px}
.erp .grid td.edit{background:var(--surface)!important;padding:0}
.erp .grid td.edit input{width:100%;height:26px;box-sizing:border-box;border:0;outline:2px solid var(--cursor);padding:0 7px;background:var(--surface);text-align:inherit}
.erp .grid tfoot td{position:sticky;bottom:0;background:var(--head);font-weight:600;height:28px}
.erp .st{display:inline-block;width:18px;text-align:center;font-weight:700}
.erp .st.posted{color:var(--posted)}.st.draft{color:var(--draft)}.st.del{color:var(--danger)}
.erp .sw{display:inline-block;width:12px;height:12px;border-radius:2px;vertical-align:-2px;margin-right:6px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.15)}
.erp .muted{color:var(--muted)}
.erp .chip{display:inline-block;padding:0 7px;border-radius:999px;font-size:11.5px;line-height:18px;background:var(--accent-soft);color:var(--accent-strong)}
.erp .chip.off{background:var(--raised);color:var(--faint)}
.erp .chip.draft{background:var(--draft-soft);color:var(--draft)}
/* document form */
.erp .doc{flex:1;min-height:0;display:flex;flex-direction:column;overflow:auto}
.erp .state{margin:0 16px 10px;padding:7px 12px;border-radius:4px;background:var(--draft-soft);color:var(--draft)}
.erp .state.posted{background:var(--accent-soft);color:var(--posted)}
.erp .fields{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px 18px;padding:0 16px 12px}
.erp .field{display:flex;flex-direction:column;gap:3px}
.erp .field label{font-size:11.5px;color:var(--muted)}
.erp .field input,.erp .field select{padding:5px 8px;border:1px solid var(--line);border-radius:4px;background:var(--surface)}
.erp .field input:disabled,.erp .field select:disabled{background:var(--raised);color:var(--muted)}
.erp .subtabs{display:flex;gap:0;padding:0 16px;border-bottom:1px solid var(--line)}
.erp .subtab{padding:7px 12px;border:0;border-bottom:2px solid transparent;background:none;cursor:pointer;color:var(--muted)}
.erp .subtab.on{border-color:var(--accent);color:var(--ink);font-weight:500}
.erp .lines{display:flex;flex-direction:column;min-height:260px}
.erp .lines .bar{padding-top:10px}
.erp .totals{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:22px;padding:10px 16px;border-top:1px solid var(--line);font-variant-numeric:tabular-nums}
.erp .totals b{font-size:15px}
.erp .hint{padding:6px 16px;color:var(--faint);font-size:12px}
/* picker */
.erp .picker{position:fixed;inset:0;background:rgba(18,24,20,.35);display:flex;align-items:center;justify-content:center;z-index:20;padding:16px}
.erp .pickbox{background:var(--surface);border-radius:6px;box-shadow:0 12px 40px rgba(0,0,0,.25);width:min(760px,100%);max-height:80vh;display:flex;flex-direction:column}
.erp .pickbox header{display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--line)}
.erp .pickbox header input{flex:1;padding:6px 9px;border:1px solid var(--line);border-radius:4px;background:var(--raised)}
.erp .pickbox .gridwrap{max-height:56vh}
.erp .toast{position:fixed;right:16px;bottom:36px;z-index:30;padding:9px 14px;border-radius:5px;background:var(--ink);color:var(--surface);box-shadow:var(--shadow)}
.erp-status{grid-column:1/-1;display:flex;gap:18px;align-items:center;padding:0 12px;background:var(--head);border-top:1px solid var(--line);color:var(--muted);font-size:12px;white-space:nowrap;overflow:hidden}
.erp-status-right{margin-left:auto;color:var(--draft)}
.erp .card{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px 18px;padding:0 16px 14px}
@media (max-width:820px){
  .erp-app{grid-template-columns:1fr}
  .erp-nav{position:fixed;top:44px;bottom:24px;left:0;width:260px;z-index:15;box-shadow:0 8px 24px rgba(0,0,0,.2);transform:translateX(-102%);transition:transform .2s}
  .erp-nav.open{transform:none}
  .erp-burger{display:block}
  .erp .split{grid-template-columns:1fr}
  .erp .folders{display:flex;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line-soft);padding:4px}
  .erp .folder{width:auto;white-space:nowrap}
  .erp .folder .n{float:none;margin-left:6px}
  .erp-user{display:none}
}
@media (prefers-reduced-motion:reduce){.erp-nav{transition:none}}
/* additions for the live version */
.erp-view[hidden]{display:none}
.erp-switch{color:#fff;opacity:.9;white-space:nowrap;text-decoration:none;border:1px solid rgba(255,255,255,.35);border-radius:4px;padding:3px 9px}
.erp-switch:hover{opacity:1;background:rgba(255,255,255,.12)}
.erp-user{white-space:nowrap;opacity:.9}
.erp-empty{padding:32px;color:var(--muted)}
.erp-empty h1{font-size:17px;color:var(--ink);margin:0 0 6px}
.erp-status span:first-child{overflow:hidden;text-overflow:ellipsis}
.erp .gridwrap:focus-within .grid td.cur{box-shadow:inset 0 0 0 2px var(--cursor)}
.erp .grid td.cur{box-shadow:inset 0 0 0 1px var(--faint)}
.erp .grid td.can-edit{cursor:cell}
.erp .grid tbody tr.off td{color:var(--faint)}
.erp .grid .empty td{color:var(--faint);text-align:center;height:60px}
.erp .grid thead th .dir{color:var(--accent);margin-left:4px}
.erp .loading{padding:24px 16px;color:var(--muted)}
.erp .kv{display:flex;flex-direction:column;gap:2px}
.erp .kv span{font-size:11.5px;color:var(--muted)}
.erp .kv b{font-weight:500}
.erp .btn.link{text-decoration:none;color:inherit}
.erp .warn{color:var(--draft)}
.erp .bad{color:var(--danger)}
.erp .good{color:var(--posted)}
.erp .gridwrap{position:relative}

.erp .gridwrap{max-height:calc(100dvh - 260px);min-height:240px;border-top:0}
.erp .bar{padding:10px 12px;border-bottom:1px solid var(--line-soft);margin:0}
.erp-help{margin:8px 2px 0;color:#8A958C;font-size:12px}
.erp-help kbd{font:11px var(--mono,monospace);border:1px solid #D3DAD0;border-bottom-width:2px;border-radius:3px;padding:0 4px;background:#F6F8F4}
.erp .grid tbody tr.overdue td { color: #A6402F; }