/* Financials Online - mobile / PWA layout. Everything is inside the max-width query, so the desktop look is unchanged. */
#navtoggle, .quickbar, #pwabar, .pwainstall { display: none; }
[hidden] { display: none !important; }
.pwaios { position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 400; display: flex; align-items: flex-end; justify-content: center; }
.pwaios > div { background: #fff; color: #000; max-width: 420px; width: 100%; margin: 12px; padding: 16px; border-radius: 10px; font: 15px Tahoma, "Segoe UI", sans-serif; }
.pwaios ol { padding-left: 20px; } .pwaios li { margin: 6px 0; }
@media (max-width: 760px) {
  html { -webkit-text-size-adjust: 100%; }
  body { font-size: 14px; padding-bottom: calc(62px + env(safe-area-inset-bottom)); }
  .titlebar { flex-wrap: wrap; align-items: center; gap: 4px; padding: 6px 8px; position: sticky; top: 0; z-index: 60; }
  .titlebar > span { flex: 1 1 auto; min-width: 0; font-size: 14px; }
  .titlebar small { width: 100%; display: none; }
  body.navopen .titlebar small { display: block; padding: 4px 0; }
  .themepick { margin-top: 4px; }
  #navtoggle { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 40px; font-size: 22px; line-height: 1; background: rgba(255,255,255,.15); color: #fff; border: 1px solid rgba(255,255,255,.5); border-radius: 4px; padding: 0; order: 2; }
  .pwainstall:not([hidden]) { display: inline-block; order: 1; font-size: 13px; padding: 6px 10px; min-height: 36px; }
  .menubar, .toolbar { display: none; }
  body.navopen .menubar { display: block; max-height: 70vh; overflow-y: auto; position: sticky; top: 52px; }
  body.navopen .toolbar { display: flex; flex-wrap: wrap; }
  .menubar .menu { border-bottom: 1px solid #808080; }
  .menu > .mtitle { padding: 12px 12px; font-size: 15px; }
  .menu:hover .drop { display: none; }
  .menu.open .drop { display: block; position: static; box-shadow: none; min-width: 0; border: 0; }
  .drop a, .drop span.dis { padding: 11px 22px; font-size: 15px; white-space: normal; }
  .pendbadge, .retbadge { display: block; padding: 12px; font-size: 15px; }
  .toolbar a { padding: 10px 12px; font-size: 14px; flex: 1 1 30%; text-align: center; }
  .desk { padding: 8px 6px; min-height: 0; }
  .win { margin: 0 0 10px; max-width: none !important; }
  .win.narrow { margin-top: 20px !important; }
  .win > .wb { padding: 8px; }
  .statusbar { display: none; }
  /* 16px inputs stop iOS focus zoom; touch-sized controls */
  input, select, textarea { font-size: 16px !important; min-height: 40px; max-width: 100%; }
  input[type=checkbox], input[type=radio] { min-height: 0; width: 20px; height: 20px; }
  button, .btn { font-size: 15px; min-height: 44px; padding: 8px 14px; }
  .row { flex-direction: column; align-items: stretch; gap: 6px; }
  .row > * { max-width: 100%; }
  .row input:not([type=checkbox]):not([type=radio]), .row select, .row textarea { width: 100% !important; }
  .row label:has(> input[type=checkbox]), .row label:has(> input[type=radio]) { display: flex; align-items: center; gap: 8px; min-height: 40px; }
  fieldset .row label.w, fieldset.cb .row label.w { width: auto !important; }
  table.form, table.form > tbody, table.form > tbody > tr, table.form > tbody > tr > th, table.form > tbody > tr > td { display: block; width: 100% !important; }
  table.form > tbody > tr > th { text-align: left; padding: 6px 0 2px; white-space: normal; }
  table.form td input:not([type=checkbox]):not([type=radio]), table.form td select, table.form td textarea { width: 100% !important; }
  fieldset, .win, .wb, .desk { min-width: 0; }
  .desk { max-width: 100vw; box-sizing: border-box; }
  .tscroll { overflow-x: auto; -webkit-overflow-scrolling: touch; max-width: 100%; margin-bottom: 6px; }
  .tscroll > table.form { min-width: 0; }
  .scroll { max-height: none; overflow: auto; }
  .tscroll table.grid td, .tscroll table.grid th { white-space: nowrap; }
  .tscroll table.grid td input { min-width: 90px; }
  table.grid.stick1 tr > :first-child { position: sticky; left: 0; z-index: 2; background: #fff; box-shadow: 1px 0 0 #bbb; }
  table.grid.stick1 tr > th:first-child { background: #d4d0c8; z-index: 3; }
  table.grid.stick1 tr.tot > :first-child { background: #d4d0c8; }
  html[data-theme]:not([data-theme="default"]) table.grid.stick1 tr > td:first-child { background: var(--grid); }
  html[data-theme]:not([data-theme="default"]) table.grid.stick1 tr > th:first-child { background: var(--face); }
  .grid td, .grid th { padding: 6px 6px; }
  .ac { min-width: 0; left: 0 !important; right: 0; max-width: 100vw; }
  .ac div { padding: 10px 8px; white-space: normal; }
  .modal > div, .modal .win { max-width: 96vw !important; }
  /* bottom quick bar */
  .quickbar { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 90; background: #d4d0c8; border-top: 2px solid #fff; box-shadow: 0 -1px 0 #808080, 0 -2px 8px rgba(0,0,0,.2); padding-bottom: env(safe-area-inset-bottom); }
  .quickbar a { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; min-height: 56px; color: #000; text-decoration: none; font-size: 11px; gap: 2px; position: relative; }
  .quickbar a .qi { font-size: 20px; line-height: 1; }
  .quickbar a.on { background: #0a246a; color: #fff; }
  .quickbar .qbadge { position: absolute; top: 4px; right: calc(50% - 22px); background: #c00; color: #fff; border-radius: 9px; font-size: 10px; padding: 1px 5px; font-weight: bold; }
  .quickbar .qbadge.zero { background: #888; }
  #qbnewmenu { position: fixed; left: 8px; right: 8px; bottom: calc(64px + env(safe-area-inset-bottom)); z-index: 95; background: #d4d0c8; border: 2px solid; border-color: #fff #404040 #404040 #fff; display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 6px; box-shadow: 0 4px 12px rgba(0,0,0,.35); }
  #qbnewmenu a { padding: 12px; text-align: center; background: #fff; color: #000; text-decoration: none; font-size: 15px; border: 1px solid #808080; }
  html[data-theme]:not([data-theme="default"]) .quickbar, html[data-theme]:not([data-theme="default"]) #qbnewmenu { background: var(--face); }
  html[data-theme]:not([data-theme="default"]) .quickbar a { color: var(--face-fg); }
  html[data-theme]:not([data-theme="default"]) .quickbar a.on { background: var(--hi); color: var(--hi-fg); }
  #pwabar:not([hidden]) { display: flex; align-items: center; gap: 8px; position: fixed; left: 8px; right: 8px; bottom: calc(66px + env(safe-area-inset-bottom)); z-index: 92; background: #0a246a; color: #fff; padding: 8px 10px; border-radius: 8px; box-shadow: 0 4px 12px rgba(0,0,0,.35); font-size: 14px; }
  #pwabar img { width: 32px; height: 32px; border-radius: 6px; }
  #pwabar span { flex: 1; }
  #pwabar .pwago { min-height: 36px; padding: 4px 12px; }
  #pwabar .pwax { background: none; border: 0; color: #fff; font-size: 22px; min-height: 36px; padding: 0 6px; }
}