/* A task-first shell shared by both Koja software editions. */
:root { --kx-radius:12px; }
body { line-height:1.45; }
header { padding:12px 20px; gap:10px 16px; }
header button { min-height:38px; }
main { max-width:1540px; margin:0 auto; padding:26px; }
#tabbar { display:block; padding:0; }
.kx-primary,.kx-secondary { display:flex; flex-wrap:wrap; gap:4px; padding:5px 20px; }
#tabbar .kx-primary .tab { min-height:46px; padding:10px 18px; font-size:14px; border-radius:6px 6px 0 0; }
.kx-secondary { background:#e4ece7; border-bottom:1px solid #bdcec4; }
#tabbar .kx-secondary .tab { color:#25493f; padding:9px 14px; min-height:42px; }
#tabbar .kx-secondary .tab.active { background:#fff; color:#173d33; border-bottom:3px solid #ad7b25; }
.kx-welcome { max-width:760px; margin:6px 0 22px; }
.kx-welcome h2 { font:400 clamp(26px,3vw,38px)/1.2 var(--serif); color:var(--bar); margin:6px 0 12px; }
.kx-welcome p { margin:0; font-size:15px; color:var(--muted); }
.kx-welcome .kx-eyebrow { font-size:11px; letter-spacing:.13em; font-weight:700; color:#775722; }
.kx-page-title { font:400 27px/1.25 var(--serif); color:var(--bar); margin:0 0 20px; }
.kx-shortcuts { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:24px; }
.kx-shortcuts button,.kx-shortcuts a { min-height:44px; padding:10px 17px; text-decoration:none; border-radius:7px; }
.kx-metrics { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; margin-bottom:22px; }
.kx-metric { text-align:left; padding:20px; background:white; border:1px solid #c3d3cc; border-top:3px solid #b78837; border-radius:var(--kx-radius); cursor:pointer; color:var(--text); font-family:inherit; }
.kx-metric span { display:block; font-size:13px; color:var(--muted); margin-bottom:12px; }
.kx-metric strong { display:block; font-size:clamp(22px,2.2vw,31px); font-weight:600; overflow-wrap:anywhere; }
.kx-columns { display:grid; grid-template-columns:1.25fr 1fr; gap:20px; align-items:start; }
.kx-columns .card { padding:22px; border-radius:var(--kx-radius); }
.kx-columns .card h3 { font-size:21px; padding-bottom:14px; }
.kx-task-list { list-style:none; padding:0; margin:0 0 18px; }
.kx-task { display:flex; justify-content:space-between; align-items:center; gap:14px; width:100%; background:transparent; border:0; border-bottom:1px solid #dce5df; padding:16px 0; text-align:left; font:inherit; color:var(--text); cursor:pointer; }
.kx-task small { display:block; color:var(--muted); font-size:12px; margin-top:4px; }
.kx-count { display:grid; place-items:center; flex:0 0 36px; height:36px; border-radius:50%; background:#e9f0eb; font-size:16px; }
.kx-steps { padding-left:25px; }
.kx-steps li { margin:0 0 13px; padding-left:4px; }
.kx-steps button { text-align:left; min-height:40px; }
.kx-complete { display:inline-block; font-size:12px; color:#24634c; padding-left:10px; }
.kx-footnote { font-size:12px; margin-top:20px; }
.kx-sort { background:transparent; border:0; color:inherit; font:inherit; font-weight:600; text-align:inherit; padding:6px 0; cursor:pointer; }
button:focus-visible,a:focus-visible,tr[tabindex]:focus-visible,td[tabindex]:focus-visible { outline:3px solid #b58327; outline-offset:2px; }
tr[aria-selected=true] { box-shadow:inset 4px 0 #2f6f64; }
.kx-destructive { color:#982f24!important; border-color:#c9a39b!important; margin-left:12px; }
.card { border-radius:9px; }
.kx-skip { position:absolute; top:-100px; left:16px; z-index:10001; background:white; color:#163b32; padding:12px 20px; }
.kx-skip:focus { top:12px; }
.tablewrap { max-width:100%; }
.row { row-gap:14px; }
input,select,textarea { min-height:38px; }
input[type=checkbox],input[type=radio] { min-height:0; }
.act,.sec { min-height:38px; }
a.act,a.sec { display:inline-flex; align-items:center; text-decoration:none; }
.kx-mobile-only,.kx-header-toggle { display:none; }
.kx-header-tools { display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; }
.kx-table-note { margin:8px 0; color:var(--muted); font-size:13px; }
.kx-table-sort { gap:8px; align-items:center; margin-bottom:10px; }
.kx-table-sort select { flex:1; min-width:0; }
.kx-form-jumps { gap:8px; margin-bottom:14px; }
.kx-form-jumps button { flex:1; }
.kx-rent-month { align-items:center; gap:10px; margin:14px 0; }
.kx-rent-month select { flex:1; }
.kx-rent-error { color:#982f24; }
.kx-modal-open { overflow:hidden; }
#app_modal { overscroll-behavior:contain; }
#app_modal > div { min-width:0; }
#app_modal > div > div:last-child { min-width:0; }
.tablewrap:focus-visible { outline:3px solid #b58327; outline-offset:2px; }
@media(max-width:900px) { .kx-columns { grid-template-columns:1fr; } .kx-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:600px) {
  header { position:static; padding:12px; padding-top:max(12px,env(safe-area-inset-top)); }
  header h1 { white-space:normal; font-size:18px; }
  header .koja-links { flex-wrap:wrap; }
  main { padding:16px 12px; padding-bottom:max(24px,env(safe-area-inset-bottom)); min-width:0; }
  .kx-primary,.kx-secondary { gap:2px; padding:5px 8px; }
  #tabbar .kx-primary .tab { flex:1 1 30%; padding:8px; font-size:13px; min-height:44px; white-space:normal; }
  #tabbar .kx-secondary .tab { padding:7px 9px; white-space:normal; }
  .kx-shortcuts button,.kx-shortcuts a { flex:1 1 44%; justify-content:center; }
  .kx-metrics { gap:10px; }
  .kx-metric { padding:15px; }
  .kx-metric strong { font-size:23px; }
  .kx-columns .card { padding:16px; }
  .formgrid { grid-template-columns:1fr!important; gap:5px!important; }
  .formgrid>input,.formgrid>select,.formgrid>textarea { grid-column:1!important; margin-bottom:12px; width:100%; min-width:0; }
  .formgrid>label { text-align:left!important; }
  .kx-destructive { margin-left:0; }
  /* Every child needs the reset: section headings and calculated-field wrappers
     also carry desktop grid spans, which otherwise create a hidden second column. */
  .formgrid>* { grid-column:1!important; min-width:0; max-width:100%; }
  .formgrid>.sectiontitle { margin:18px 0 8px; }
  .formgrid>div:not(.sectiontitle) { margin-bottom:10px; }
  .split { flex-direction:column; align-items:stretch; }
  .split>.left,.split>.right { flex:1 1 auto!important; width:100%!important; max-width:100%!important; min-width:0!important; }
  .card { min-width:0; max-width:100%; overflow:visible; }
  .row>div { flex:1 1 140px; max-width:100%; }
  .row>div[style*="flex:1"] { flex:1 1 100%!important; }
  .row>div.inline { flex-wrap:wrap; flex-direction:row; }
  .row input,.row select { max-width:100%; min-width:0!important; }
  input,select,textarea { font-size:16px; min-height:44px; max-width:100%; scroll-margin:20px; }
  input[type=checkbox],input[type=radio] { width:22px; height:22px; min-height:22px; flex:none; }
  label.inline { min-height:44px; }
  button,.act,.sec,header button,.kx-sort { min-height:44px; }
  button { max-width:100%; white-space:normal; overflow-wrap:anywhere; touch-action:manipulation; }
  a.act,a.sec { min-height:44px; }
  .koja-links a { display:inline-flex; align-items:center; min-height:44px; }
  .kx-mobile-only { display:flex; }
  .kx-header-toggle { display:inline-flex; align-items:center; justify-content:center; }
  .kx-header-tools { display:none; width:100%; }
  .kx-header-tools.is-open { display:flex; }
  .kx-header-tools>button { flex:1 1 140px; }
  .kx-header-tools>.koja-links { width:100%; }
  header .spacer { display:none; }
  header h1 { flex:1 1 100%; }
  header #dbinfo { max-width:100%; overflow-wrap:anywhere; }
  header #koja-status { white-space:normal; }
  .kpis { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  .kpi,.stat { min-width:0; }
  .kpi .v,.stat .v { overflow-wrap:anywhere; }
  .statgrid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .sections { grid-template-columns:minmax(0,1fr); }
  .tablewrap { -webkit-overflow-scrolling:touch; max-height:65dvh; }
  .tablewrap td { height:44px; }
  .kx-records { max-height:none; overflow:visible; border:0; }
  .kx-records table,.kx-rent-cards table { display:block; }
  .kx-records thead,.kx-rent-cards thead { display:none; }
  .kx-records tbody,.kx-rent-cards tbody { display:grid; gap:12px; }
  .kx-records tr,.kx-rent-cards tr { display:block; border:1px solid var(--line); border-radius:8px; background:#fff; overflow:hidden; }
  .kx-records tr[tabindex] { cursor:pointer; }
  .kx-records td,.kx-rent-cards td { display:grid; grid-template-columns:minmax(88px,.8fr) minmax(0,1.2fr); align-items:center; gap:10px; border:0; border-bottom:1px solid #e6ede8; padding:9px 11px; min-height:42px; height:auto; white-space:normal; text-align:left; overflow-wrap:anywhere; }
  .kx-records td::before,.kx-rent-cards td::before { content:attr(data-label); color:#50675e; font-size:12px; font-weight:600; }
  .kx-records td:last-child,.kx-rent-cards td:last-child { border-bottom:0; }
  .kx-records tr[aria-selected=true] { outline:2px solid #2f6f64; outline-offset:0; }
  .kx-rent-cards { max-height:none; overflow:visible; border:0; }
  .kx-rent-cards td.kx-other-month { display:none; }
  .kx-rent-cards td[data-koja-editor] { background:#e9f2ed; border-top:2px solid #b78837; min-height:52px; cursor:pointer; }
  .kx-rent-cards .totalrow td:empty { display:none; }
  #rent_summary { gap:10px!important; }
  #rent_summary .stat { flex:1 1 120px; }
  #app_modal { padding:8px!important; padding-top:max(8px,env(safe-area-inset-top))!important; padding-bottom:max(8px,env(safe-area-inset-bottom))!important; height:100dvh; align-items:stretch!important; overflow:hidden!important; }
  #app_modal>div { display:flex; flex-direction:column; max-height:100%; }
  #app_modal>div>div:first-child { flex:none; padding:10px 12px!important; }
  #app_modal>div>div:first-child>div { min-width:0; overflow-wrap:anywhere; }
  #app_modal>div>div:last-child { flex:1; min-height:0; overflow:auto; overscroll-behavior:contain; padding:14px 12px!important; }
  .kx-timeline-head { display:none!important; }
  .kx-timeline-row { grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important; padding:12px 0; border-bottom:1px solid var(--line); }
  .kx-timeline-row input,.kx-timeline-row select { width:100%; min-width:0; }
  .kx-timeline-row button { justify-self:end; min-width:44px; }
  .kx-wrap-actions { flex-wrap:wrap; }
  .kx-calendar { grid-template-columns:minmax(0,1fr)!important; }
  .kx-calendar>.kx-calendar-weekday,.kx-calendar>.kx-calendar-empty { display:none; }
  .kx-calendar>.kx-calendar-day { min-height:0!important; padding:9px!important; }
  .kx-calendar-event { min-height:44px; display:flex; align-items:center; white-space:normal!important; font-size:14px!important; }
  .toast { left:12px; right:12px; bottom:max(12px,env(safe-area-inset-bottom)); max-width:none; overflow-wrap:anywhere; }
  .koja-list li { align-items:flex-start; flex-wrap:wrap; }
  .koja-list li>button { width:100%; }
  .chartbox { min-height:280px; height:55dvh; }
  #map { height:55dvh; min-height:280px; }
  .leaflet-control-zoom a { width:44px!important; height:44px!important; line-height:44px!important; }
  .kb-panel { padding:18px 14px; }
  #koja-reminder p { min-width:0; flex-basis:100%; }
}