/* Folio-only styles. Frame and widgets come from /shared/site.css and /shared/ui.css. */
.privacy-bar{background:var(--ok-bg);color:var(--ok);font-size:12px;padding:10px 5%;text-align:center}
.privacy-bar a{color:inherit;text-decoration:underline;font-weight:600}
.privacy-bar .due{color:var(--warn);font-weight:600}
.stat-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;margin-bottom:24px}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:16px}
.stat b{display:block;font-size:28px;font-weight:400;letter-spacing:-1px}
.stat small{color:var(--muted)}
.board{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.board .col{background:var(--cream);border-radius:8px;padding:12px;min-height:160px;display:flex;flex-direction:column;gap:8px;transition:background .2s}
.board .col h4{margin:0 0 4px;font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);display:flex;justify-content:space-between}
@media(max-width:900px){.board{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:560px){.board{grid-template-columns:1fr}}
.paid-burst{animation:paid .6s ease}
@keyframes paid{0%{transform:scale(1)}40%{transform:scale(1.06)}100%{transform:scale(1)}}
#print-area{display:none}
/* Room to scroll the invoice Total and the Jobs buttons above the floating Ask button. */
#main{padding-bottom:96px}
/* Expenses: keep whole words (courthouse, SAMPLE). On a phone, each row is a card. */
#view-expenses,
#view-expenses .exp-log,
#view-expenses .exp-log td,
#view-expenses .exp-log th,
#view-expenses .rws-badge{overflow-wrap:normal;word-break:normal}
#view-expenses .exp-amount{white-space:nowrap}
#view-expenses .exp-actions .rws-btn{min-height:44px}
@media(max-width:640px){
  #view-expenses .exp-scroll{overflow:visible;max-width:100%}
  #view-expenses .exp-log,
  #view-expenses .exp-log tbody,
  #view-expenses .exp-log tfoot{display:block;width:100%;max-width:100%}
  #view-expenses .exp-log thead{display:none}
  #view-expenses .exp-log tr{
    display:block;width:100%;max-width:100%;box-sizing:border-box;margin:0 0 12px;padding:12px;
    border:1px solid var(--line);border-radius:8px;background:var(--surface)
  }
  #view-expenses .exp-log td{
    display:block;width:100%;max-width:100%;box-sizing:border-box;padding:0;border:0;
    overflow-wrap:normal;word-break:normal
  }
  #view-expenses .exp-log .exp-date,
  #view-expenses .exp-log .exp-kind{
    display:inline-block;width:auto;max-width:100%;margin:0 12px 8px 0;vertical-align:baseline
  }
  #view-expenses .exp-log .exp-details,
  #view-expenses .exp-log .exp-amount{display:block;width:100%;margin:0 0 8px}
  #view-expenses .exp-log .exp-amount{white-space:normal}
  #view-expenses .exp-log .exp-actions{display:block;width:100%;margin:0}
  #view-expenses .exp-log .exp-actions .rws-row{margin:0;width:100%}
  #view-expenses .exp-log .exp-actions .rws-btn{min-height:44px;flex:1 1 8rem}
  #view-expenses .exp-log tfoot tr{border:0;background:transparent;padding:12px 0 0}
  #view-expenses .exp-log tfoot td{display:block;width:100%;max-width:100%}
}
/* Print: only the invoice. "Print / save as PDF" fills #print-area and calls window.print(). */
@media print{
  body>*:not(#print-area){display:none!important}
  #print-area{display:block!important;color:#000;background:#fff;font:12pt/1.45 "Segoe UI",Arial,sans-serif}
  @page{margin:18mm}
}