/* styles.css — old-software look, adapted to the web.
 * Teal table headers (like the screenshot prints), lavender editable
 * cells (like the old grids), cyan account-name bar, raised buttons. */
* { box-sizing: border-box; }
body {
  margin: 0; background: #c9c5bd; color: #111;
  font-family: Tahoma, Verdana, Geneva, sans-serif; font-size: 14px;
}
button {
  background: #e8e6e1; border: 2px outset #d0cdc5; padding: 3px 10px;
  font-family: inherit; font-size: 13px; cursor: pointer; white-space: nowrap;
}
button:active { border-style: inset; }
button.primary { background: #0f7a7a; color: #fff; border-color: #0f7a7a; }
button:disabled { opacity: 0.5; cursor: default; }
input, select {
  font-family: inherit; font-size: 13px; padding: 3px;
  border: 1px solid #888; background: #fff;
}
/* No number spinners anywhere (owner's order). */
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; }

.menubar {
  background: #e8e6e1; border-bottom: 2px solid #888; padding: 6px 8px;
  display: flex; flex-wrap: wrap; gap: 4px; align-items: center;
}
.menubar .brand { font-weight: bold; font-size: 17px; color: #0f4d4d; margin-right: 10px; }
.menubar button.active { background: #0f7a7a; color: #fff; }
.menubar .working-date { margin-left: auto; }
.statusbar { min-height: 20px; padding: 2px 10px; color: #0f4d4d; font-weight: bold; }
main { padding: 8px 10px 20px; }
.page-head h2 { margin: 6px 0; color: #0f4d4d; }
.page-head .station-head { font-size: 15px; }
.red { color: #c00; }
.blue { color: #1a4d8f; }
.ok { color: #0a7a0a; font-weight: bold; }
.error { color: #c00; font-weight: bold; }
.hint { color: #555; font-size: 12px; }
.status { margin-left: 10px; font-weight: bold; }

.navibar, .funcbar {
  background: #e8e6e1; border: 1px solid #999; padding: 6px 8px;
  margin: 6px 0; display: flex; flex-wrap: wrap; gap: 6px; align-items: center;
}
.tabs { display: flex; gap: 0; margin: 6px 0 0; }
.tabs .tab {
  border: 1px solid #888; border-bottom: none; background: #d8d5ce;
  padding: 5px 14px; border-radius: 6px 6px 0 0;
}
.tabs .tab.active { background: #0f7a7a; color: #fff; }

.panel { background: #fff; border: 1px solid #888; margin: 10px 0; padding: 8px; }
.panel-title { color: #1a4d8f; font-weight: bold; border-bottom: 1px solid #1a4d8f; padding-bottom: 3px; margin-bottom: 6px; }
.scrollx { overflow-x: auto; }

table.grid { border-collapse: collapse; width: 100%; background: #fff; }
table.grid th {
  background: #0f7a7a; color: #fff; border: 1px solid #0a5a5a;
  padding: 4px 6px; text-align: left; font-size: 13px;
}
table.grid td { border: 1px solid #aaa; padding: 3px 5px; }
table.grid td.num { text-align: right; }
table.grid tr.total-row td { background: #ffe0a8; font-weight: bold; }
table.grid td.rowlabel { font-weight: bold; background: #eee; white-space: nowrap; }
table.grid input.in, table.grid input.rate {
  background: #e9e4f5; width: 100%; min-width: 70px;
}
table.grid input[type=text] { background: #e9e4f5; width: 100%; min-width: 70px; }
.cell-val { display: inline-block; min-width: 60px; text-align: right; }
.cell-val.total { font-weight: bold; }
.auto-tag { font-size: 11px; color: #888; }
.accountbar { background: #a5e8f0; border: 1px solid #5fb9c4; padding: 6px 8px; margin: 8px 0; }
table.form td { padding: 4px 6px; }
.addform { margin-top: 8px; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.addform label { font-size: 12px; }
.chart { background: #fff; border: 1px solid #888; margin: 10px 0; max-width: 100%; }

/* Print formats (Balance Sheet, P&L, bills). */
.print-head { display: flex; gap: 16px; align-items: flex-start; margin: 10px 0; }
.pso-logo { height: 64px; }
.pso-badge {
  display: none; background: #0a7a2e; color: #fff; font-weight: bold;
  border-radius: 50%; width: 58px; height: 58px; line-height: 58px;
  text-align: center; font-size: 18px; flex-shrink: 0;
}
.print-title { font-size: 20px; font-weight: bold; font-style: italic; color: #1a4d8f; }
.print-station { font-size: 17px; font-weight: bold; color: #1a4d8f; }
.print-period { background: #0f7a7a; color: #fff; display: inline-block; padding: 2px 8px; margin: 4px 0; }
.bill-label { color: #1a4d8f; text-decoration: underline; font-weight: bold; }
.sig { margin-top: 30px; font-weight: bold; }

@media print {
  body { background: #fff; }
  .menubar, .navibar, .funcbar, .tabs, footer.detailbar, .statusbar, .hint, button { display: none !important; }
  .panel, table.grid { border-color: #000; }
  main { padding: 0; }
}