
/* ════════════════════════════════════════════════════════════
   INBOX PAGE · review-queue redesign (Phase A walkthrough)
   Ported from the redesign (ib-* namespace): rounded search + flat
   list rows + reading-pane surfaces. Keeps our header, filters,
   buttons and detail logic. Fixed-height pane: only the list
   scrolls, the rest stays put. Remove this block to revert.
   ════════════════════════════════════════════════════════════ */
body:has(#page-inbox.active) .main{ height:100vh; overflow:hidden; padding-top:28px; padding-bottom:18px; }
#page-inbox.active{ display:flex; flex-direction:column; min-height:0; height:100%; }
/* renderInbox fills #inbox-content, so the flex chain must run THROUGH it,
   otherwise the grid has no flex parent and grows to content height. */
#page-inbox.active #inbox-content{ display:flex; flex-direction:column; min-height:0; flex:1; }
#page-inbox .page-hd{ flex-shrink:0; }
#page-inbox .ib-grid{ display:grid; grid-template-columns:394px 1fr; grid-template-rows:minmax(0,1fr); gap:22px; align-items:stretch; flex:1; min-height:0; }
#page-inbox .ib-listcol{ display:flex; flex-direction:column; min-height:0; height:100%; }
#page-inbox .ib-search{ display:flex; align-items:center; gap:10px; padding:11px 14px; border:1px solid var(--line);
  border-radius:12px; background:var(--paper-1); margin-bottom:8px; flex-shrink:0; }
#page-inbox .ib-search input{ border:0; background:transparent; outline:none; font-family:'Geist',sans-serif;
  font-size:13px; color:var(--ink-0); width:100%; }
#page-inbox .ib-search input::placeholder{ color:var(--ink-3); }
#page-inbox .ib-search svg{ width:15px; height:15px; color:var(--ink-3); flex-shrink:0; }
#page-inbox .ib-list{ display:flex; flex-direction:column; gap:2px; flex:1; min-height:0; overflow-y:auto; padding-right:4px; }
#page-inbox .ib-row{ display:grid; grid-template-columns:1fr auto; gap:12px; align-items:start;
  padding:13px 12px; border-radius:12px; cursor:pointer; position:relative; }
#page-inbox .ib-row:hover{ background:var(--paper-2); }
#page-inbox .ib-row.active{ background:var(--accent-soft); }
#page-inbox .ib-row.active::before{ content:''; position:absolute; left:0; top:11px; bottom:11px; width:2.5px; border-radius:2px; background:var(--accent); }
#page-inbox .ib-av{ width:34px; height:34px; border-radius:10px; color:#fff; font-size:13px; font-weight:600; display:grid; place-items:center; }
#page-inbox .ib-name{ font-size:13.5px; font-weight:500; color:var(--ink-0); }
#page-inbox .ib-org{ font-weight:400; color:var(--ink-3); }
#page-inbox .ib-subj{ font-size:12.5px; color:var(--ink-1); margin-top:3px; line-height:1.35; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; }
#page-inbox .ib-snip{ font-size:11.5px; color:var(--ink-3); margin-top:3px; line-height:1.35; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden; }
#page-inbox .ib-rt{ display:flex; flex-direction:column; align-items:flex-end; gap:7px; }
#page-inbox .ib-time{ font-family:'Geist Mono',monospace; font-size:10px; color:var(--ink-4); white-space:nowrap; }
#page-inbox .ib-pill{ font-family:'Geist Mono',monospace; font-size:8.5px; letter-spacing:0.06em; text-transform:uppercase; padding:3px 8px; border-radius:999px; white-space:nowrap; }
#page-inbox .ib-pill.ready{ color:var(--accent); background:var(--accent-soft); }
#page-inbox .ib-pill.draft{ color:var(--ink-2); background:var(--paper-2); border:1px solid var(--line); }
#page-inbox .ib-pill.wait{ color:var(--warn); background:color-mix(in oklch,var(--warn) 16%,transparent); }
#page-inbox .ib-pill.sent{ color:var(--good); background:color-mix(in oklch,var(--good) 16%,transparent); }
/* reading pane → restyle the existing detail structure to the new look */
#page-inbox #emailDetail{ min-height:0; height:100%; overflow-y:auto; }
#page-inbox .thread-detail{ box-shadow:var(--shadow-sm); border-radius:18px; }
#page-inbox .td-subj{ font-weight:600; letter-spacing:-0.025em; }
#page-inbox .td-msg{ padding:15px 17px; background:var(--paper-2); border:1px solid var(--line); border-radius:13px; }
#page-inbox .td-msg.collapsed::after{ background:linear-gradient(to bottom, transparent, var(--paper-2) 90%); }
#page-inbox .td-draft{ border-radius:14px; background:linear-gradient(180deg, var(--accent-soft), transparent 55%); }
@media (max-width:1100px){
  body:has(#page-inbox.active) .main{ height:auto; overflow:visible; padding-top:66px; }
  #page-inbox.active{ height:auto; }
  #page-inbox.active #inbox-content{ display:block; }
  #page-inbox .ib-grid{ grid-template-columns:1fr; grid-template-rows:auto; }
  #page-inbox .ib-listcol{ height:auto; }
  #page-inbox .ib-list{ overflow:visible; }
  #page-inbox #emailDetail{ height:auto; max-height:none; overflow:visible; }
}
