/* ── Print + Report + Manager + Toast ── */
/* REPORT PAGE */
.rpt-wrap{display:grid;grid-template-columns:300px 1fr;gap:16px;align-items:start;}
@media(max-width:700px){.rpt-wrap{grid-template-columns:1fr;}}
.dsearch{position:relative;}
.dsearch input{width:100%;padding:8px 10px;background:var(--s2);border:1px solid var(--border);border-radius:7px;font-size:13px;font-family:var(--sans);color:var(--text);outline:none;}
.dsearch input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(37,99,235,.1);}
.dsdrop{position:absolute;top:100%;left:0;right:0;background:#fff;border:1px solid var(--border);border-radius:7px;box-shadow:var(--sh-md);max-height:240px;overflow-y:auto;z-index:100;margin-top:2px;display:none;}
.dsdrop.on{display:block;}
.dsopt{padding:7px 11px;font-size:12px;cursor:pointer;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px;}
.dsopt:hover{background:var(--alt);color:var(--accent);}
.dsopt span{font-family:var(--mono);font-size:11px;color:var(--muted);margin-left:auto;}

/* PRINT REPORT CARD */
#rpt-card{font-family:var(--sans);}
#rpt-card .rrow{display:flex;justify-content:space-between;align-items:baseline;padding:4px 12px;font-size:13px;border-bottom:1px solid #eee;}
#rpt-card .rrow .rv{font-family:var(--mono);min-width:100px;text-align:right;}
#rpt-card .rsec{font-size:13px;font-weight:700;text-align:center;padding:5px 0;background:#f8fafc;letter-spacing:.02em;}
#rpt-card .rnet{display:flex;justify-content:space-between;padding:6px 12px;font-size:13px;font-weight:700;color:#c00;background:#fff5f5;border-top:1px solid #fecaca;}
#rpt-card .rnet .rv{font-family:var(--mono);}
#rpt-card .rgrand{display:flex;justify-content:space-between;padding:10px 12px;font-size:18px;font-weight:700;color:#1e40af;background:#eff6ff;border-top:2px solid #bfdbfe;border-bottom:2px solid #bfdbfe;}
#rpt-card .rgrand .rv{font-family:var(--mono);}
#rpt-card .rmisc{display:flex;justify-content:space-between;padding:5px 12px;font-size:12px;color:#334155;border-bottom:1px solid #eee;}
#rpt-card .rmisc .rv{font-family:var(--mono);}
#rpt-card .rheader{font-size:14px;font-weight:700;text-align:center;padding:8px;background:#000;color:#fff;letter-spacing:.04em;}
#rpt-card .rdate-row{display:flex;justify-content:space-between;padding:5px 12px;font-size:13px;font-weight:600;border-bottom:1px solid #eee;}

/* PRINT */
@page { size: letter portrait; margin: 12mm 10mm; }
@page pr-landscape { size: letter landscape; margin: 10mm 8mm; }

/* Default (screen) state: #print-area is empty and hidden until
   btPrint() populates it. Kept directly next to the @media print block
   below (which forces it back to display:block!important) so the two
   rules that govern this element's visibility are readable together,
   instead of relying on !important alone to make the relationship
   correct from two different, disconnected places in the file. */
#print-area{display:none;}

@media print{
  /* Without this, browsers omit background colors/gradients from print
     output by default (to save ink) — but this report's header and
     table column headers use WHITE TEXT ON COLORED BACKGROUNDS
     (.pr-header, .pr-tbl th). Without forcing backgrounds to print,
     that text is literally invisible (white on the page's white
     background) even though the content genuinely rendered and
     paginated correctly — which matches the "blank-looking page, but
     correct page count" symptom exactly. */
  *{
    -webkit-print-color-adjust:exact!important;
    print-color-adjust:exact!important;
    color-adjust:exact!important;
  }
  /* Hide everything except the print area by removing it from layout
     entirely (display:none), instead of visibility:hidden. The old
     visibility-based approach kept hidden elements occupying space and
     combined with #print-area's position:absolute, mobile print engines
     (Android/Chrome "Save as PDF") miscalculated pagination and silently
     clipped content after the first page instead of flowing onto a
     second page. display:none removes that ambiguity entirely. */
  body > *:not(#print-area){display:none!important;}
  #print-area{
    display:block!important;position:static;width:auto;
    background:#fff;overflow:visible;margin:0;padding:0;
    font-family:'Inter',system-ui,sans-serif;
  }
  #print-area *{visibility:visible;}
  .no-print{display:none!important;}
  .pr-page-break{page-break-before:always;break-before:page;}
  /* Page 2 (daily breakdown) renders on a landscape page so wide,
     many-column tables fit without shrinking text unreadably. */
  .pr-landscape{
    page:pr-landscape;
    page-break-before:always;break-before:page;
  }
  .pr-tbl tr{page-break-inside:avoid;break-inside:avoid;}

  /* Defensive fallback for Android's print pipeline: window.print() on
     Android hands off to the SYSTEM print framework (see the Print
     Spooler in the screenshot that surfaced this), not Chrome's own
     on-screen rendering — a genuinely different code path with its own
     history of CSS Grid content silently failing to paint at all. Force
     a flex-based fallback for print specifically, since flexbox has
     more consistently reliable print support across Android print
     pipelines than grid does. */
  .pr-kpis{display:flex!important;flex-wrap:wrap!important;}
  .pr-kpis .pr-kpi{flex:1 1 30%!important;min-width:0!important;}
}
.pr-tbl{width:100%;border-collapse:collapse;font-size:12px;margin-bottom:12px;}
.pr-tbl th{background:#1e3a5f;color:#fff;padding:6px 10px;text-align:left;font-size:11px;letter-spacing:.05em;}
.pr-tbl th.r{text-align:right;}
.pr-tbl td{padding:5px 10px;border-bottom:1px solid #e2e8f0;font-family:monospace;}
.pr-tbl td.l{font-family:'Inter',system-ui,sans-serif;font-weight:500;}
.pr-tbl td.r{text-align:right;}
.pr-tbl tr.tot td{font-weight:700;background:#eff6ff;border-top:2px solid #bfdbfe;color:#1e40af;}
.pr-tbl tr.sub td{font-weight:700;background:#fef2f2;color:var(--red);border-top:1px solid #fecaca;}
.pr-tbl tr.grp td{background:#f8fafc;font-weight:600;color:#334155;font-size:11px;text-transform:uppercase;letter-spacing:.07em;}
.pr-header{background:linear-gradient(135deg,#0f172a,#1e3a5f);color:#fff;padding:14px 20px;border-radius:8px;margin-bottom:14px;display:flex;align-items:center;justify-content:space-between;}
.pr-header h1{font-size:16px;font-weight:700;letter-spacing:-.01em;}
.pr-header p{font-size:11px;opacity:.7;margin-top:2px;}
.pr-header .pr-meta{text-align:right;font-size:11px;opacity:.8;}
.pr-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:12px;}
.pr-kpi{background:#f8fafc;border:1px solid #e2e8f0;border-radius:7px;padding:10px 14px;}
.pr-kpi-l{font-size:9px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;color:#64748b;margin-bottom:4px;}
.pr-kpi-v{font-size:16px;font-weight:700;color:#0f172a;font-family:monospace;}
/* Page 2 — landscape daily breakdown: more columns, tighter spacing */
.pr-landscape{font-family:'Inter',system-ui,sans-serif;}
.pr-landscape .pr-tbl{font-size:10px;}
.pr-landscape .pr-tbl th,.pr-landscape .pr-tbl td{padding:4px 6px;white-space:nowrap;}
.pr-landscape .pr-tbl td.l{white-space:normal;}
.pr-land-title{font-size:11px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:#64748b;margin:0 0 6px;}
/* Manager Work */
.inc-sec-hd{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--accent);margin:10px 0 6px;padding-bottom:4px;border-bottom:1px solid var(--border);}
.inc-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:5px 0;border-bottom:1px solid rgba(0,0,0,.04);font-size:12px;}
.inc-row span:first-child{color:var(--muted);flex:1;}
.inc-row input{width:120px;flex-shrink:0;}
.inc-row.calc{background:var(--s2);border-radius:5px;padding:5px 8px;border-bottom:none;margin-bottom:2px;}
.inc-row.total{font-weight:700;}
.inc-row.grand{background:var(--accent);color:#fff;border-radius:7px;padding:7px 10px;font-weight:700;font-size:13px;}
.inc-row.grand span{color:#fff!important;}
.inc-calc{font-family:var(--mono);font-size:12px;font-weight:600;color:var(--text);white-space:nowrap;}
.inc-calc.red{color:var(--red);}
.petty-group{border:1px solid var(--border);border-radius:10px;margin-bottom:14px;overflow:hidden;}
.petty-group-hd{background:var(--s2);padding:10px 14px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--border);}
.petty-group-body{padding:10px 14px 0;}
.petty-group-foot{padding:8px 14px;background:var(--s2);border-top:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;}
.mgr-section{animation:fadein .2s;}

/* ── Manager tab groups — soft cards housing a row of pill tabs.
   Replaces the old ad-hoc inline background colors (var(--green),
   var(--purple), etc.) that painted whole buttons solid and made the
   toolbar read as a random rainbow of blocks. Now every tab shares the
   same quiet resting style; the two "special" destinations (Staff
   Registry, Misc Sections) get a subtle colored left edge + icon chip
   instead of a full-saturation fill, so they stay distinguishable
   without breaking the row's visual rhythm. */
/* #mgr-tabs (the CREDIT DETAIL / WORKING pill-button clusters) is
   retired from view (Aug 2026) — its 9 destinations now live in the
   persistent sub-tab strip instead (js/subtab-strip.js, pinned above
   .bnav on mobile / already in the rail's own accordion on desktop).
   Kept in the DOM, not deleted: js/nav-sections.js's '.mgr-tab[href]'
   scraper (_SUB_GROUPS.manager) is what the strip's data ultimately
   comes from, so this is still the one real source of those 9 rows. */
#mgr-tabs{display:none;}

.mgr-tabgroup{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);padding:14px 16px;margin-bottom:12px;box-shadow:var(--sh);}

/* Wide-table horizontal scroll with a right-edge fade, so a table that
   runs off the screen (salary table etc.) reads as "scroll for more"
   instead of looking like its last column got cut off. */
.mgr-table-scroll{position:relative;overflow-x:auto;}
.mgr-table-scroll::after{
  content:'';position:absolute;top:0;right:0;bottom:0;width:24px;
  background:linear-gradient(90deg,transparent,var(--surface));
  pointer-events:none;
}
.mgr-tabgroup-label{font-size:10px;font-weight:700;color:var(--muted);letter-spacing:.09em;text-transform:uppercase;margin-bottom:10px;display:flex;align-items:center;gap:9px;}
.mgr-tabgroup-label::after{content:'';flex:1;height:1px;background:var(--border);opacity:.7;}
.mgr-tabrow{display:flex;gap:7px;flex-wrap:wrap;}

.mgr-tab{background:var(--s2);color:var(--t2);border:1px solid var(--border);font-size:12.5px;font-weight:600;padding:8px 15px;border-radius:var(--r-pill);box-shadow:none;}
.mgr-tab.active{background:var(--mgrblue);color:#fff;border-color:var(--mgrblue);box-shadow:0 4px 12px -3px rgba(3,105,161,.45);}
.mgr-tab:hover:not(.active){border-color:var(--mgrblue);color:var(--mgrblue);background:var(--mgrblue-lt);}
/* .mgr-tab-em / .em-green / .em-purple removed (Aug 2026 design pass) —
   those left-border colors carried no real meaning (arbitrary green on
   Staff Registry, purple on Misc Sections), so they were dropped rather
   than kept as decoration. */

.mgr-inp{background:var(--surface);border:1px solid var(--border);color:var(--text);border-radius:var(--r-xs);padding:7px 9px;font-size:12.5px;font-family:var(--sans);outline:none;width:100%;transition:border-color .15s,box-shadow .15s;}
.mgr-inp:focus{border-color:var(--accent);box-shadow:var(--focus-ring);}
.mgr-inp.calc{background:var(--glt);border-color:#bbf0d5;font-weight:700;font-family:var(--mono);color:var(--green);}
.mgr-td{padding:5px 6px;border:1px solid var(--grid);vertical-align:middle;}
.sal-c{text-align:center;}
.sal-num{text-align:center!important;}
.mgr-inp.sal-num{text-align:center;font-weight:600;}
/* Days column (salary table) — widened so the value is easy to read,
   and native number-input spin buttons removed since they sit right
   under the cursor and are easy to mis-click, bumping the day count by
   accident. Typing/selecting the value still works exactly as before —
   only the +/- stepper UI is gone. */
.sal-c input[type="number"]::-webkit-outer-spin-button,
.sal-c input[type="number"]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
.sal-c input[type="number"]{-moz-appearance:textfield;}
#sal-table,#gen-table{border:2px solid var(--grid);}
#sal-table th,#gen-table th{border:1px solid var(--grid)!important;}
.mgr-tr:hover td{background:var(--s2);}
.mgr-tr.sal-row-skip{opacity:.55;}
.mgr-del{background:none;border:none;color:var(--red);cursor:pointer;font-size:14px;padding:2px 6px;border-radius:4px;}
.mgr-del:hover{background:var(--rlt,#fee2e2);}
.mgr-tfoot td{font-weight:700;color:var(--accent);font-family:var(--mono);padding:7px 10px;border-top:2px solid var(--border);background:var(--s2);}
/* ── Generalized Ledger view (Jazz Cash / Expense / custom sections) ──
   Rendered by js/ledger-page.js's renderLedgerView(); the markup only
   carries stable classnames (.ledger-header, .ledger-add-form, etc.),
   so all the visual work happens here — no JS changes needed. */
.ledger-header{background:linear-gradient(135deg,#141b3d,#2543c9 65%,#3a61f7);color:#fff;border-radius:var(--r-md);padding:16px 20px!important;margin-bottom:14px!important;box-shadow:var(--sh-md);}
.ledger-header strong{font-size:14px;font-weight:700;letter-spacing:-.01em;}
.ledger-header > div:last-child{font-size:12px;opacity:.85;}
.ledger-header > div:last-child > div{font-size:22px!important;font-weight:700;font-family:var(--mono);opacity:1;letter-spacing:-.01em;}
.ledger-opening-btn{background:rgba(255,255,255,.14)!important;color:#fff!important;border:1px solid rgba(255,255,255,.28)!important;font-weight:600!important;border-radius:var(--r-pill)!important;}
.ledger-opening-btn:hover{background:rgba(255,255,255,.24)!important;}

.ledger-add-form{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-md);padding:12px 14px!important;box-shadow:var(--sh);align-items:center;}
.ledger-add-form .btn{background:var(--accent);color:#fff;box-shadow:0 2px 8px -2px rgba(58,97,247,.5);margin-left:auto;}
.ledger-add-form .btn:hover{background:var(--accent-dk);}

.ledger-filter-bar{background:var(--s2)!important;border:1px solid var(--border);border-radius:var(--r-sm)!important;}
.ledger-filter-bar .btn{background:var(--surface);border:1px solid var(--border);color:var(--t2);}
.ledger-filter-bar .btn:hover{border-color:var(--accent);color:var(--accent);}

.ledger-table-wrap{border:1px solid var(--border);border-radius:var(--r-md);overflow:hidden;box-shadow:var(--sh);}
.ledger-table{border-collapse:collapse;font-size:12.5px;}
.ledger-table thead tr{background:var(--s2);}
.ledger-table th{padding:10px 12px;text-align:right;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);border-bottom:2px solid var(--border);white-space:nowrap;}
.ledger-table th:first-child,.ledger-table th:nth-child(2),.ledger-table th:nth-child(3){text-align:left;}
.ledger-table td{padding:9px 12px;text-align:right;border-bottom:1px solid var(--border);font-family:var(--mono);color:var(--t2);vertical-align:middle;}
.ledger-table td:first-child,.ledger-table td:nth-child(2),.ledger-table td:nth-child(3){text-align:left;font-family:var(--sans);}
.ledger-table td:nth-child(4){font-family:var(--sans);color:var(--text);}
.ledger-table tbody tr:last-child td{border-bottom:none;}
.ledger-row-clickable:hover td{background:var(--alt);}
.ledger-group-header td{background:var(--s2)!important;}
.ledger-edit-row td{background:var(--alt2);}

/* ── Staff Credits — modern Sr#-ordered table (mirrors Staff Registry) ── */
.crd-table-wrap{overflow-x:auto;border:1px solid var(--border);border-radius:12px;box-shadow:var(--sh);}
.crd-table{width:100%;border-collapse:collapse;font-size:12.5px;min-width:640px;border:2px solid var(--grid);}
.crd-table thead tr{background:linear-gradient(135deg,var(--accent),#1e40af);color:#fff;}
.crd-table th{padding:10px 12px;text-align:center;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;white-space:nowrap;border:1px solid rgba(255,255,255,.3);}
.crd-th-sr{text-align:center;width:44px;}
.crd-th-name{text-align:left;}
.crd-row{transition:background .12s;}
.crd-row:nth-child(4n+1){background:var(--s2);} /* every other visual row, accounting for the hidden detail row between */
.crd-row:hover{background:var(--alt);}
.crd-td-sr{padding:9px 12px;text-align:center;font-weight:700;color:var(--muted);border:1px solid var(--grid);}
.crd-td-name{padding:9px 12px;text-align:left;border:1px solid var(--grid);white-space:nowrap;}
.crd-sid-pill{background:var(--accent);color:#fff;border:none;border-radius:6px;padding:3px 9px;cursor:pointer;font-size:10px;font-weight:700;font-family:var(--mono);letter-spacing:.02em;margin-right:8px;}
.crd-name-link{cursor:pointer;font-weight:600;color:var(--text);}
.crd-name-link:hover{color:var(--accent);text-decoration:underline dotted;text-underline-offset:3px;}
.crd-entry-badge{font-size:10px;font-weight:700;color:var(--accent);background:var(--alt);border:1px solid var(--accent);border-radius:20px;padding:1px 8px;white-space:nowrap;margin-left:8px;}
.crd-td-num{padding:9px 12px;text-align:center;border:1px solid var(--grid);font-family:var(--mono);color:var(--t2);white-space:nowrap;}
.crd-td-net{font-weight:700;}
.crd-td-action{padding:9px 10px;text-align:center;border:1px solid var(--grid);}
.crd-expand-btn{background:var(--s2);border:1px solid var(--border);border-radius:7px;width:28px;height:28px;font-size:13px;color:var(--accent);cursor:pointer;transition:transform .18s,background .15s;}
.crd-expand-btn:hover{background:var(--alt);}
.crd-th-print{text-align:center;width:36px;}
.crd-print-toggle{background:var(--s2);border:1px solid var(--border);border-radius:7px;width:28px;height:28px;font-size:12px;cursor:pointer;transition:background .15s,opacity .15s;opacity:.9;}
.crd-print-toggle:hover{background:var(--alt);}
.crd-print-toggle.is-off{background:#fee2e2;border-color:#fca5a5;opacity:.65;}
.crd-row-skip{opacity:.55;}
.crd-row-skip .crd-name-link{text-decoration:line-through;text-decoration-color:var(--red);}
.crd-skip-badge{font-size:9px;font-weight:700;color:#fff;background:var(--red);border-radius:20px;padding:1px 7px;white-space:nowrap;margin-left:8px;text-transform:uppercase;letter-spacing:.03em;}
.crd-body-row td{padding:0;background:var(--s2);border-bottom:1px solid var(--border);}
.crd-emp-fields{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:14px;}
.crd-body-row table tbody tr:nth-child(even) td{background:var(--surface);}
@media (max-width:560px){
  .crd-table{font-size:11px;}
  .crd-emp-fields{grid-template-columns:1fr 1fr;}
}

/* ── Staff Card — This Month credit quick-editor ── */
.sccc-card{
  border:1px solid var(--border);border-radius:13px;overflow:hidden;margin-bottom:16px;
  box-shadow:var(--sh);background:var(--surface);
}
.sccc-hdr{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:12px 16px;background:linear-gradient(135deg,var(--accent),#1e40af);color:#fff;
  font-size:13px;font-weight:700;
}
.sccc-net{font-family:var(--mono);font-size:13.5px;background:rgba(255,255,255,.16);padding:4px 12px;border-radius:8px;}
.sccc-fields{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:14px 16px;background:var(--s2);border-bottom:1px solid var(--border);}
.sccc-entries{padding:12px 16px 4px;display:flex;flex-direction:column;gap:8px;}
.sccc-entry-row{display:grid;grid-template-columns:100px 1fr 110px 30px;gap:8px;align-items:center;}
.sccc-empty{text-align:center;color:var(--muted);font-size:12px;padding:14px 0;}
.sccc-card>.btn{margin:6px 16px 16px;}
.sccc-history-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:4px 0 10px;}
@media (max-width:560px){
  .sccc-fields{grid-template-columns:1fr 1fr;}
  .sccc-entry-row{grid-template-columns:1fr;gap:6px;}
}
/* Staff Card Popup */
.sc-bg{position:fixed;inset:0;background:rgba(0,0,0,.55);z-index:900;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity .2s;}
.sc-bg.on{opacity:1;pointer-events:auto;}
.sc-box{background:var(--surface,#fff);border-radius:14px;width:min(740px,96vw);max-height:92vh;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 24px 64px rgba(0,0,0,.28);}
.sc-hdr{background:var(--accent);color:#fff;padding:16px 20px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0;gap:12px;}
.sc-hdr-info{flex:1;min-width:0;}
.sc-hdr-id{font-family:monospace;font-size:12px;opacity:.8;margin-bottom:2px;}
.sc-hdr-name{font-size:18px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sc-tabs{display:flex;border-bottom:2px solid var(--border);flex-shrink:0;background:var(--s2,#f8fafc);}
.sc-tab{background:none;border:none;padding:11px 22px;font-size:13px;font-weight:600;cursor:pointer;color:var(--muted);border-bottom:3px solid transparent;margin-bottom:-2px;transition:all .15s;}
.sc-tab.active{color:var(--accent);border-bottom-color:var(--accent);background:var(--surface,#fff);}
.sc-tab:hover:not(.active){color:var(--accent);background:var(--surface,#fff);}
.sc-body{flex:1;overflow-y:auto;padding:20px;}
.sc-foot{padding:12px 20px;border-top:1px solid var(--border);display:flex;gap:8px;justify-content:flex-end;flex-shrink:0;background:var(--s2,#f8fafc);}
.sc-fg{display:flex;flex-direction:column;gap:4px;margin-bottom:14px;}
.sc-fg label{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;}
.sc-fg input,.sc-fg select{width:100%;}

/* ── Cover Dashboard tiles: see css/cover-dashboard.css ── */