/* =====================================================================
   GS Ledger — design carried over from the original mockup.
   Palette, type scale and table treatment are deliberately unchanged so
   the app looks like the thing that was signed off on.
   ===================================================================== */

@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500;600;700&family=IBM+Plex+Sans:wght@400;500;600&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root{
  --bg:#F2EDE1; --panel:#FFFFFF; --ink:#23262B; --ink-soft:#5B5F66; --steel:#55606B;
  --line:#DEDACB; --accent:#C15A24; --accent-dark:#9A461B;
  --good:#2E7D5B; --good-bg:#E4F1EA; --warn:#C15A24; --warn-bg:#FBEBDF;
  --bad:#AE2E22; --bad-bg:#F8E4E0; --info-bg:#E8EEF3; --info:#35566E;
  --radius:3px;
  --sans:'IBM Plex Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,'SFMono-Regular',Menlo,monospace;
  --display:'Oswald',var(--sans);
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:14px;-webkit-font-smoothing:antialiased;}
a{color:var(--accent-dark);}
hr{border:none;border-top:1px solid var(--line);margin:22px 0;}

.app{max-width:1220px;margin:0 auto;padding:0 20px 60px;}

/* ------------------------------------------------------------ header --- */
.header{padding:22px 0 0;border-bottom:3px solid var(--ink);}
.header-top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;}
.header .eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-dark);display:flex;align-items:center;gap:8px;}
.header .eyebrow::before{content:'';width:8px;height:8px;background:var(--accent);display:inline-block;}
.header h1{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.02em;font-size:32px;margin:6px 0 14px;}
.header h1 a{color:inherit;text-decoration:none;}

.whoami{text-align:right;font-size:12px;color:var(--ink-soft);padding-top:4px;}
.whoami strong{display:block;font-family:var(--display);text-transform:uppercase;font-size:14px;letter-spacing:.03em;color:var(--ink);}
.whoami .role{font-family:var(--mono);font-size:10px;text-transform:uppercase;letter-spacing:.08em;background:var(--ink);color:#fff;padding:2px 8px;border-radius:20px;display:inline-block;margin-top:3px;}
.whoami .role.staff{background:var(--steel);}
.whoami form{display:inline;}
.linkbtn{background:none;border:none;padding:0;font:inherit;color:var(--accent-dark);cursor:pointer;text-decoration:underline;}
.linkbtn:hover{color:var(--bad);}

.tabs{display:flex;gap:2px;flex-wrap:wrap;}
.tab{font-family:var(--display);text-transform:uppercase;letter-spacing:.04em;font-size:13px;font-weight:600;padding:11px 20px;background:transparent;border:none;border-top:1px solid var(--line);border-left:1px solid var(--line);border-right:1px solid var(--line);border-radius:4px 4px 0 0;cursor:pointer;color:var(--ink-soft);position:relative;top:1px;text-decoration:none;display:inline-block;}
.tab.active{background:var(--panel);color:var(--ink);border-bottom:1px solid var(--panel);}
.tab:not(.active):hover{color:var(--ink);background:#EAE4D5;}

.panel{background:var(--panel);border:1px solid var(--line);border-top:none;padding:24px;}

/* ---------------------------------------------------------- headings --- */
h2.section-title,h3.section-title{font-family:var(--display);text-transform:uppercase;font-size:16px;letter-spacing:.03em;margin:0 0 14px;color:var(--ink);display:flex;align-items:center;gap:10px;}
h3.section-title{font-size:13px;}
.section-title .n{font-family:var(--mono);font-size:12px;color:var(--accent-dark);border:1px solid var(--accent-dark);border-radius:50%;width:20px;height:20px;display:flex;align-items:center;justify-content:center;flex:none;}
.sub{color:var(--ink-soft);font-size:12.5px;margin:-8px 0 20px;line-height:1.5;}
.hint{font-size:11.5px;color:var(--ink-soft);margin:8px 0 0;}
.row-between{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;}

/* ------------------------------------------------------------- forms --- */
.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px;margin-bottom:16px;align-items:end;}
.form-grid.tight{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));}
.form-grid .wide{grid-column:1/-1;}
label{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);margin-bottom:5px;font-weight:600;}
label .opt{text-transform:none;letter-spacing:0;font-weight:400;font-size:10.5px;color:#9A958A;}
input,select,textarea{width:100%;padding:8px 9px;border:1px solid #CFC8B4;border-radius:var(--radius);background:#FCFAF4;font-family:var(--mono);font-size:13px;color:var(--ink);}
select{font-family:var(--sans);}
textarea{font-family:var(--sans);min-height:64px;resize:vertical;}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(193,90,36,.15);}
input[type=file]{font-family:var(--sans);font-size:12px;padding:6px;background:#fff;}
input.has-error,select.has-error,textarea.has-error{border-color:var(--bad);background:var(--bad-bg);}
.field-error{color:var(--bad);font-size:11px;margin-top:4px;font-family:var(--sans);}

.btn{font-family:var(--display);text-transform:uppercase;letter-spacing:.03em;font-size:13px;font-weight:600;background:var(--ink);color:#fff;border:none;padding:10px 22px;border-radius:var(--radius);cursor:pointer;text-decoration:none;display:inline-block;text-align:center;line-height:1.3;}
.btn:hover{background:var(--accent-dark);}
.btn.ghost{background:transparent;border:1px solid var(--ink);color:var(--ink);}
.btn.ghost:hover{background:var(--ink);color:#fff;}
.btn.small{padding:7px 14px;font-size:11.5px;}
.btn.tiny{padding:4px 9px;font-size:10.5px;}
.btn.pay{background:var(--good);} .btn.pay:hover{background:#22694A;}
.btn.buy{background:var(--accent);} .btn.buy:hover{background:var(--accent-dark);}
.btn.danger{background:var(--bad);} .btn.danger:hover{background:#8E241A;}
.btn:disabled{opacity:.5;cursor:not-allowed;}
.btn-row{display:flex;gap:8px;flex-wrap:wrap;align-items:center;}

.stockhead-form{border:1px dashed var(--line);border-radius:var(--radius);padding:16px;margin-top:22px;background:#FCFAF4;}
.stockhead-form h4{margin:0 0 12px;font-family:var(--display);text-transform:uppercase;font-size:12.5px;letter-spacing:.03em;color:var(--accent-dark);}
.entry-form{border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:var(--radius);padding:16px 18px;margin-bottom:8px;background:#FCFAF4;}
.entry-form.payment{border-left-color:var(--good);}

/* ------------------------------------------------------------ tables --- */
table{width:100%;border-collapse:collapse;font-family:var(--mono);font-size:12px;}
thead th{text-align:right;background:var(--ink);color:#fff;font-family:var(--display);text-transform:uppercase;font-size:10.5px;letter-spacing:.03em;padding:9px 8px;font-weight:500;white-space:nowrap;}
thead th.l{text-align:left;}
tbody td{padding:8px;border-bottom:1px solid var(--line);text-align:right;white-space:nowrap;vertical-align:top;}
tbody td.l{text-align:left;font-family:var(--sans);white-space:normal;}
tbody tr:hover{background:#FAF7EF;}
tbody tr.is-payment{background:rgba(46,125,91,.035);}
tfoot td{padding:10px 8px;border-top:2px solid var(--ink);font-weight:600;text-align:right;background:#FAF7EF;}
tfoot td.l{text-align:left;font-family:var(--display);text-transform:uppercase;letter-spacing:.03em;font-size:11px;}
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--radius);}
.empty-row td{text-align:center;color:var(--ink-soft);padding:26px;font-family:var(--sans);}
.del-btn{background:none;border:none;color:var(--ink-soft);cursor:pointer;font-size:14px;padding:0 4px;line-height:1;}
.del-btn:hover{color:var(--bad);}
.rowlink{color:var(--ink);text-decoration:none;border-bottom:1px solid var(--line);}
.rowlink:hover{color:var(--accent-dark);border-bottom-color:var(--accent);}

/* ------------------------------------------------------------- cards --- */
.card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px;margin-bottom:26px;}
.mcard{border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;}
.mcard .mname{font-family:var(--display);text-transform:uppercase;font-size:12px;letter-spacing:.02em;color:var(--ink-soft);font-weight:600;}
.mcard .mbal{font-family:var(--mono);font-size:24px;font-weight:600;margin:6px 0 2px;}
.mcard .mnote{font-size:11px;color:var(--ink-soft);font-family:var(--sans);}
.pay-cr{color:var(--good);} .buy-dr{color:var(--accent-dark);} .bal-due{color:var(--bad);}
.muted{color:var(--ink-soft);}
.num{font-family:var(--mono);}

.factsheet-card{border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px;margin-bottom:22px;background:#FCFAF4;position:relative;}
.factsheet-card .ftitle{font-family:var(--display);text-transform:uppercase;font-size:20px;letter-spacing:.02em;margin:0 0 4px;}
.factsheet-card .fcat{font-family:var(--mono);font-size:11px;color:var(--accent-dark);text-transform:uppercase;letter-spacing:.05em;}
.finfo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px 20px;margin-top:16px;font-size:12.5px;}
.finfo-grid div span.lbl{display:block;font-size:10.5px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);margin-bottom:2px;}
.finfo-grid div span.val{font-family:var(--mono);word-break:break-word;}
.balance-strip{display:flex;gap:14px;margin-top:18px;flex-wrap:wrap;}
.balance-chip{border:1px solid var(--line);border-radius:var(--radius);padding:10px 16px;background:#fff;min-width:130px;}
.balance-chip .l{font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:var(--ink-soft);}
.balance-chip .v{font-family:var(--mono);font-size:19px;font-weight:600;}

.progress-bar{height:8px;background:#EFEAE0;border-radius:4px;overflow:hidden;margin-top:8px;}
.progress-bar>div{height:100%;background:var(--accent);}

.badge{font-family:var(--mono);font-size:10px;padding:2px 7px;border-radius:20px;border:1px solid var(--steel);color:var(--steel);display:inline-block;white-space:nowrap;}
.badge.good{border-color:var(--good);color:var(--good);background:var(--good-bg);}
.badge.warn{border-color:var(--accent);color:var(--accent-dark);background:var(--warn-bg);}
.badge.bad{border-color:var(--bad);color:var(--bad);background:var(--bad-bg);}
.tag-purchase{color:var(--accent-dark);font-weight:600;}
.tag-payment{color:var(--good);font-weight:600;}

/* ------------------------------------------------------------- flash --- */
.flash{margin:16px 0 0;display:flex;flex-direction:column;gap:8px;}
.flash div{padding:11px 14px;border-radius:var(--radius);font-size:13px;border-left:3px solid;}
.flash .success{background:var(--good-bg);border-color:var(--good);color:#1E5941;}
.flash .error{background:var(--bad-bg);border-color:var(--bad);color:#7E1F17;}
.flash .info{background:var(--info-bg);border-color:var(--info);color:var(--info);}

/* ------------------------------------------------------------ filter --- */
.filterbar{display:flex;gap:10px;align-items:end;flex-wrap:wrap;padding:14px 16px;background:#FCFAF4;border:1px solid var(--line);border-radius:var(--radius);margin-bottom:16px;}
.filterbar > div{min-width:130px;}
.filterbar label{margin-bottom:4px;}
.filterbar .grow{flex:1;min-width:180px;}
.filterbar .actions{display:flex;gap:8px;align-items:center;}

/* ------------------------------------------------------- attachments --- */
.clip{display:inline-flex;align-items:center;gap:3px;font-family:var(--mono);font-size:11px;color:var(--accent-dark);text-decoration:none;border:1px solid var(--line);border-radius:20px;padding:1px 8px;background:#fff;}
.clip:hover{border-color:var(--accent);background:var(--warn-bg);}
.att-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px;}
.att{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:var(--radius);padding:6px 8px;background:#fff;font-size:12px;font-family:var(--sans);max-width:260px;}
.att img{width:34px;height:34px;object-fit:cover;border-radius:2px;border:1px solid var(--line);flex:none;}
.att .fileicon{width:34px;height:34px;display:flex;align-items:center;justify-content:center;background:var(--bad-bg);color:var(--bad);font-family:var(--mono);font-size:9px;font-weight:600;border-radius:2px;flex:none;}
.att .meta{min-width:0;}
.att .meta a{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink);text-decoration:none;font-weight:500;}
.att .meta a:hover{color:var(--accent-dark);}
.att .meta small{color:var(--ink-soft);font-family:var(--mono);font-size:10px;}
.dropzone{border:1px dashed #CFC8B4;border-radius:var(--radius);padding:10px;background:#fff;}
.dropzone.dragover{border-color:var(--accent);background:var(--warn-bg);}
.filenames{font-size:11.5px;color:var(--ink-soft);margin-top:6px;font-family:var(--mono);}

/* -------------------------------------------------------------- misc --- */
.pagination{display:flex;gap:6px;justify-content:center;margin-top:18px;flex-wrap:wrap;}
.pagination a,.pagination span{padding:6px 11px;border:1px solid var(--line);border-radius:var(--radius);font-family:var(--mono);font-size:12px;text-decoration:none;color:var(--ink);}
.pagination .current{background:var(--ink);color:#fff;border-color:var(--ink);}
.pagination a:hover{background:#EAE4D5;}

.no-project{border:1px dashed var(--line);border-radius:var(--radius);padding:26px;text-align:center;color:var(--ink-soft);}
details.inline-edit{margin-bottom:18px;}
details.inline-edit > summary{cursor:pointer;font-family:var(--display);text-transform:uppercase;font-size:12px;letter-spacing:.04em;color:var(--accent-dark);list-style:none;display:inline-block;border:1px solid var(--ink);border-radius:var(--radius);padding:7px 14px;}
details.inline-edit > summary::-webkit-details-marker{display:none;}
details.inline-edit > summary:hover{background:var(--ink);color:#fff;}
details.inline-edit[open] > summary{background:var(--ink);color:#fff;margin-bottom:12px;}

.report-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;}
.report-card{border:1px solid var(--line);border-radius:var(--radius);padding:18px;background:#FCFAF4;display:flex;flex-direction:column;}
.report-card h4{font-family:var(--display);text-transform:uppercase;font-size:14px;letter-spacing:.03em;margin:0 0 6px;}
.report-card p{font-size:12.5px;color:var(--ink-soft);margin:0 0 14px;line-height:1.5;flex:1;}
.report-card .form-grid{margin-bottom:12px;}

/* ------------------------------------------------------------- login --- */
.login-page{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:24px;}
.login-box{width:100%;max-width:380px;}
.login-box .brand{text-align:center;margin-bottom:20px;}
.login-box .brand .eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-dark);}
.login-box .brand h1{font-family:var(--display);font-weight:700;text-transform:uppercase;letter-spacing:.02em;font-size:26px;margin:6px 0 0;}
.login-card{background:var(--panel);border:1px solid var(--line);border-top:3px solid var(--ink);border-radius:var(--radius);padding:26px;}
.login-card .btn{width:100%;margin-top:6px;}
.login-foot{text-align:center;font-size:11px;color:var(--ink-soft);margin-top:16px;font-family:var(--mono);}

/* ------------------------------------------------------- voucher view -- */
.voucher-sheet{max-width:560px;margin:0 auto;border:2px solid var(--ink);padding:28px;background:#fff;}
.voucher-sheet h2{font-family:var(--display);text-transform:uppercase;text-align:center;margin:0 0 2px;letter-spacing:.04em;}
.voucher-sheet .vsub{text-align:center;font-size:11px;color:var(--ink-soft);margin-bottom:18px;letter-spacing:.1em;text-transform:uppercase;font-family:var(--mono);}
.voucher-sheet .vrow{display:flex;justify-content:space-between;gap:14px;padding:7px 0;border-bottom:1px solid var(--line);font-family:var(--mono);font-size:13px;}
.voucher-sheet .vrow span:first-child{color:var(--ink-soft);}
.voucher-sheet .vrow span:last-child{text-align:right;font-weight:600;}
.voucher-sheet .vamount{font-size:24px;font-weight:700;text-align:center;margin:20px 0 4px;font-family:var(--mono);}
.voucher-sheet .vwords{text-align:center;font-size:11.5px;color:var(--ink-soft);font-style:italic;margin-bottom:16px;}
.voucher-sheet .vsign{display:flex;justify-content:space-between;margin-top:56px;font-size:12px;}
.voucher-sheet .vsign div{border-top:1px solid var(--ink);padding-top:6px;width:150px;text-align:center;}

@media print{
  .no-print{display:none !important;}
  body{background:#fff;}
  .app{max-width:none;padding:0;}
  .panel{border:none;padding:0;}
  .voucher-sheet{max-width:none;}
}

@media (max-width:640px){
  .header h1{font-size:24px;}
  .panel{padding:16px;}
  .tab{padding:9px 13px;font-size:12px;}
  .whoami{text-align:left;}
}