/* ── Shared fax detail (two-column redesign, Henry Aug 7 2026) ──
   Single source of truth for the fax detail UI. Used by:
     - V3 front-desk fax drawer (preview/app.html) — the only fax UI
   (legacy front_desk.html Fax Hub drawer deleted Aug 11 2026)
   All classes are mnfd- prefixed and scoped under .mn-faxd so the module can
   embed inside any host page without style collisions. */

.mn-faxd { --mnfd-primary:#0d9488; --mnfd-primary-light:#e8f5f3; --mnfd-border:#e5e7eb;
  --mnfd-text:#111827; --mnfd-body:#374151; --mnfd-muted:#6b7280; --mnfd-bg:#f3f4f6;
  --mnfd-grad:linear-gradient(180deg,rgba(156,208,197,1),rgba(118,185,173,1));
  --mnfd-red:#dc2626; --mnfd-amber:#d97706;
  font-family:Inter,-apple-system,sans-serif; color:var(--mnfd-text);
  display:flex; flex-direction:column; min-height:0; height:100%; background:#fff; }

/* Header */
.mn-faxd .mnfd-header { padding:16px 20px; border-bottom:1px solid var(--mnfd-border);
  display:flex; align-items:flex-start; gap:14px; flex-shrink:0; }
.mn-faxd .mnfd-header-info { flex:1; min-width:0; }
.mn-faxd .mnfd-subject { font-size:16px; font-weight:700; margin-bottom:4px; }
.mn-faxd .mnfd-meta { font-size:13px; color:var(--mnfd-muted); display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.mn-faxd .mnfd-hdr-actions { display:flex; gap:8px; flex-shrink:0; flex-wrap:wrap; }
.mn-faxd .mnfd-navcol { display:flex; flex-direction:column; gap:4px; flex-shrink:0; margin-right:2px; }
.mn-faxd .mnfd-nav-btn { width:30px; height:30px; border-radius:8px; border:1px solid var(--mnfd-border);
  background:#fff; color:var(--mnfd-body); cursor:pointer; display:inline-flex; align-items:center; justify-content:center; }
.mn-faxd .mnfd-nav-btn:hover { border-color:var(--mnfd-primary); color:var(--mnfd-primary); }
.mn-faxd .mnfd-nav-btn:disabled { opacity:.35; cursor:default; }

/* Body: two-column grid — PDF left, facts/suggestions right */
.mn-faxd .mnfd-body { flex:1; overflow-y:auto; padding:20px; display:flex; flex-direction:column; gap:16px; min-height:0; }
.mn-faxd .mnfd-grid { display:grid; grid-template-columns:minmax(0,7fr) minmax(0,5fr); gap:16px; align-items:start; }
.mn-faxd .mnfd-pdf-col { position:sticky; top:0; }
.mn-faxd .mnfd-right-col { display:flex; flex-direction:column; gap:14px; min-width:0; }
.mn-faxd .mnfd-pdf-wrap { border:1px solid var(--mnfd-border); border-radius:10px; overflow:hidden; background:#fff; }
/* Paint-safe PDF slot: the iframe is mounted into .mnfd-pdf-frame by JS after
   layout flushes (black-preview fix, Aug 15 2026). color-scheme:light pins the
   iframe's default canvas to white — in dark theme Chromium otherwise gives
   embedded frames a BLACK backdrop while the PDF viewer loads. */
.mn-faxd .mnfd-pdf-frame { position:relative; background:#fff; color-scheme:light; min-height:480px; display:flex; flex-direction:column; }
.mn-faxd .mnfd-pdf-loading { position:absolute; inset:0; display:grid; place-items:center; font-size:12.5px; color:var(--mnfd-muted); background:var(--mnfd-bg); }
.mn-faxd .mnfd-pdf-frame.mnfd-pdf-ready .mnfd-pdf-loading { display:none; }
.mn-faxd .mnfd-pdf-wrap iframe { width:100%; border:none; display:block; height:calc(100vh - 320px); min-height:480px; background:#fff; color-scheme:light; position:relative; z-index:1; }
.mn-faxd .mnfd-pdf-head { padding:8px 12px; background:var(--mnfd-bg); border-bottom:1px solid var(--mnfd-border);
  display:flex; align-items:center; gap:8px; font-size:12px; color:var(--mnfd-muted); }
.mn-faxd .mnfd-nodoc { border:1px dashed var(--mnfd-border); border-radius:10px; padding:26px 20px;
  text-align:center; color:var(--mnfd-muted); font-size:13px; background:var(--mnfd-bg); }
@media (max-width:1080px) {
  .mn-faxd .mnfd-grid { grid-template-columns:1fr; }
  .mn-faxd .mnfd-pdf-col { position:static; }
  .mn-faxd .mnfd-pdf-frame { min-height:420px; }
  .mn-faxd .mnfd-pdf-wrap iframe { height:420px; min-height:0; }
}

/* Extracted facts */
.mn-faxd .mnfd-facts-card { border:1px solid #b2dfdb; border-radius:10px; overflow:hidden; background:#fff; }
.mn-faxd .mnfd-facts-head { padding:9px 14px; background:var(--mnfd-primary-light); display:flex; align-items:center; gap:7px;
  font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--mnfd-primary); }
.mn-faxd .mnfd-facts-sub { font-weight:500; text-transform:none; letter-spacing:0; color:var(--mnfd-muted); margin-left:auto; font-size:11px; }
.mn-faxd .mnfd-facts-body { padding:6px 14px 10px; }
.mn-faxd .mnfd-fact-row { display:flex; gap:10px; padding:6px 0; border-bottom:1px solid #f5f5f5; font-size:13px; }
.mn-faxd .mnfd-fact-row:last-child { border-bottom:none; }
.mn-faxd .mnfd-fact-k { width:120px; flex-shrink:0; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.04em; color:var(--mnfd-muted); padding-top:2px; }
.mn-faxd .mnfd-fact-v { flex:1; color:var(--mnfd-text); font-weight:500; overflow-wrap:anywhere; }
.mn-faxd .mnfd-fact-v .mnfd-muted { color:var(--mnfd-muted); font-weight:400; }

/* Summary / recommended cards */
.mn-faxd .mnfd-summary-card { background:var(--mnfd-primary-light); border:1px solid #b2dfdb; border-radius:10px; padding:14px 16px; }
.mn-faxd .mnfd-card-label { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em;
  color:var(--mnfd-primary); margin-bottom:6px; display:flex; align-items:center; gap:5px; }
.mn-faxd .mnfd-card-label.mnfd-amber { color:var(--mnfd-amber); }
.mn-faxd .mnfd-card-text { font-size:13px; color:var(--mnfd-body); line-height:1.6; }
.mn-faxd .mnfd-actions-card { background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(243,246,255,.95));
  border:1px solid var(--mnfd-border); border-radius:12px; padding:14px 16px; }
.mn-faxd .mnfd-action-item { display:flex; align-items:flex-start; gap:9px; padding:7px 0; border-bottom:1px solid #f5f5f5; font-size:13px; color:var(--mnfd-body); }
.mn-faxd .mnfd-action-item:last-child { border-bottom:none; }
.mn-faxd .mnfd-action-cb { width:15px; height:15px; flex-shrink:0; accent-color:var(--mnfd-primary); margin-top:2px; cursor:pointer; }

/* Role suggestion cards (Front Desk vs Doctor) */
.mn-faxd .mnfd-role-card { border:1px solid var(--mnfd-border); border-radius:10px; overflow:hidden; background:#fff; }
.mn-faxd .mnfd-role-head { padding:9px 14px; background:var(--mnfd-bg); border-bottom:1px solid var(--mnfd-border);
  display:flex; align-items:center; gap:7px; font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:var(--mnfd-muted); }
.mn-faxd .mnfd-role-head.mnfd-doctor { color:var(--mnfd-primary); background:var(--mnfd-primary-light); }
.mn-faxd .mnfd-role-item { display:flex; align-items:flex-start; gap:9px; padding:8px 14px; border-bottom:1px solid #f5f5f5; font-size:13px; color:var(--mnfd-body); }
.mn-faxd .mnfd-role-item:last-child { border-bottom:none; }
.mn-faxd .mnfd-role-empty { padding:10px 14px; font-size:13px; color:var(--mnfd-muted); }
.mn-faxd .mnfd-why { padding:6px 14px 0; font-size:11.5px; color:var(--mnfd-muted); }
.mn-faxd .mnfd-owner { margin-left:auto; font-size:11px; font-weight:600; text-transform:none; letter-spacing:0;
  color:var(--mnfd-body); background:#fff; border:1px solid var(--mnfd-border); border-radius:10px; padding:2px 9px; }

/* Badges & chips */
.mn-faxd .mnfd-urg { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; padding:3px 10px; border-radius:10px; }
.mn-faxd .mnfd-urg-urgent { background:#fef2f2; color:var(--mnfd-red); }
.mn-faxd .mnfd-urg-routine { background:var(--mnfd-primary-light); color:var(--mnfd-primary); }
.mn-faxd .mnfd-urg-info { background:#f3f4f6; color:var(--mnfd-muted); }
.mn-faxd .mnfd-urg-high { background:#fffbeb; color:var(--mnfd-amber); }
.mn-faxd .mnfd-wf { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.05em; padding:3px 10px; border-radius:10px; }
.mn-faxd .mnfd-wf-pending { background:#fffbeb; color:var(--mnfd-amber); }
.mn-faxd .mnfd-wf-approved { background:var(--mnfd-primary-light); color:var(--mnfd-primary); }
.mn-faxd .mnfd-wf-revision { background:#fef2f2; color:var(--mnfd-red); }
.mn-faxd .mnfd-wf-completed { background:#f3f4f6; color:var(--mnfd-muted); }
.mn-faxd .mnfd-chip { font-size:10px; font-weight:700; padding:1px 7px; border-radius:8px; background:#f3f4f6; color:var(--mnfd-body); }
.mn-faxd .mnfd-chip-urgent { background:#fef2f2; color:var(--mnfd-red); }
.mn-faxd .mnfd-chip-queued { background:#fffbeb; color:var(--mnfd-amber); }
.mn-faxd .mnfd-chip-sending { background:#eff6ff; color:#1d4ed8; }
.mn-faxd .mnfd-chip-failed { background:#fef2f2; color:var(--mnfd-red); }
.mn-faxd .mnfd-chip-sent { background:var(--mnfd-primary-light); color:var(--mnfd-primary); }

/* Buttons */
.mn-faxd .mnfd-btn { padding:8px 14px; border-radius:8px; font-size:12px; font-weight:600; cursor:pointer;
  font-family:inherit; border:none; display:inline-flex; align-items:center; gap:5px; transition:opacity .15s; text-decoration:none; }
.mn-faxd .mnfd-btn-primary { background:var(--mnfd-grad); color:#fff; border:1px solid rgba(0,0,0,.06); }
.mn-faxd .mnfd-btn-primary:hover { opacity:.9; }
.mn-faxd .mnfd-btn-ghost { background:#fff; border:1px solid var(--mnfd-border); color:var(--mnfd-body); }
.mn-faxd .mnfd-btn-ghost:hover { border-color:var(--mnfd-primary); color:var(--mnfd-primary); }
.mn-faxd .mnfd-btn-openpdf { padding:9px 18px; border-radius:8px; background:var(--mnfd-grad); color:#fff;
  border:1px solid rgba(0,0,0,.06); font-size:13px; font-weight:700; cursor:pointer; font-family:inherit;
  display:inline-flex; align-items:center; gap:7px; transition:opacity .15s; text-decoration:none; }
.mn-faxd .mnfd-btn-openpdf:hover { opacity:.9; }

/* Workflow bar */
.mn-faxd .mnfd-workflow { padding:12px 20px; border-top:1px solid var(--mnfd-border); background:#fff;
  display:flex; align-items:center; gap:10px; flex-shrink:0; flex-wrap:wrap; }
.mn-faxd .mnfd-btn-approve { padding:9px 18px; border-radius:8px; background:var(--mnfd-grad); color:#fff;
  border:1px solid rgba(0,0,0,.06); font-size:13px; font-weight:600; cursor:pointer; font-family:inherit;
  display:inline-flex; align-items:center; gap:6px; transition:opacity .15s; }
.mn-faxd .mnfd-btn-approve:hover { opacity:.9; }
.mn-faxd .mnfd-btn-approve:disabled { opacity:.5; cursor:default; }
.mn-faxd .mnfd-btn-revision { padding:9px 16px; border-radius:8px; background:#fff; border:1px solid var(--mnfd-border);
  color:var(--mnfd-body); font-size:13px; font-weight:600; cursor:pointer; font-family:inherit;
  display:inline-flex; align-items:center; gap:6px; transition:all .15s; }
.mn-faxd .mnfd-btn-revision:hover { border-color:var(--mnfd-red); color:var(--mnfd-red); }
.mn-faxd .mnfd-btn-revision:disabled { opacity:.5; cursor:default; }
.mn-faxd .mnfd-revision-row { display:none; gap:8px; align-items:center; flex:1; min-width:200px; }
.mn-faxd .mnfd-revision-input { flex:1; padding:7px 11px; border:1px solid var(--mnfd-border); border-radius:7px;
  font-size:12px; font-family:inherit; outline:none; }
.mn-faxd .mnfd-revision-input:focus { border-color:var(--mnfd-red); }
.mn-faxd .mnfd-approve-ok { font-size:12px; color:var(--mnfd-primary); padding:4px 10px; background:var(--mnfd-primary-light); border-radius:7px; }
.mn-faxd .mnfd-revision-note { font-size:12px; color:var(--mnfd-red); }
.mn-faxd .mnfd-wf-right { margin-left:auto; display:flex; gap:8px; align-items:center; flex-wrap:wrap; }

/* ── Compose slide-in (New Fax / Reply) ── */
.mnfd-compose-overlay { display:none; position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:1000;
  align-items:flex-end; justify-content:flex-end; }
.mnfd-compose-overlay.mnfd-open { display:flex; }
.mnfd-compose-panel { width:100%; max-width:520px; background:#fff; border-radius:12px 0 0 14px; height:100%;
  display:flex; flex-direction:column; box-shadow:-8px 0 40px rgba(0,0,0,.18); animation:mnfdSlide .2s ease;
  font-family:Inter,-apple-system,sans-serif; }
@keyframes mnfdSlide { from { transform:translateX(60px); opacity:0; } to { transform:none; opacity:1; } }
.mnfd-compose-head { padding:20px 24px; border-bottom:1px solid #e5e7eb; display:flex; align-items:center; justify-content:space-between; }
.mnfd-compose-head h2 { font-size:16px; font-weight:700; margin:0; }
.mnfd-compose-close { background:none; border:none; cursor:pointer; font-size:22px; color:#6b7280; line-height:1; }
.mnfd-compose-body { flex:1; overflow-y:auto; padding:20px 24px; display:flex; flex-direction:column; gap:14px; }
.mnfd-compose-field label { font-size:11px; font-weight:700; color:#6b7280; display:block; margin-bottom:4px;
  text-transform:uppercase; letter-spacing:.05em; }
.mnfd-compose-field input, .mnfd-compose-field textarea { width:100%; padding:9px 12px; border:1px solid #e5e7eb;
  border-radius:8px; font-family:inherit; font-size:13px; color:#111827; background:#fff; outline:none; box-sizing:border-box; }
.mnfd-compose-field input:focus, .mnfd-compose-field textarea:focus { border-color:#0d9488; }
.mnfd-compose-foot { padding:16px 24px; border-top:1px solid #e5e7eb; display:flex; justify-content:flex-end; gap:10px; }
.mnfd-compose-foot .mnfd-btn { padding:8px 14px; border-radius:8px; font-size:12px; font-weight:600; cursor:pointer;
  font-family:inherit; border:none; display:inline-flex; align-items:center; gap:5px; }
.mnfd-compose-foot .mnfd-btn-primary { background:linear-gradient(180deg,rgba(156,208,197,1),rgba(118,185,173,1)); color:#fff; border:1px solid rgba(0,0,0,.06); }
.mnfd-compose-foot .mnfd-btn-ghost { background:#fff; border:1px solid #e5e7eb; color:#374151; }