// Patient prescriptions — saved after the dentist closes a consultation.

function PatientPrescriptions() {
  const consults = useConsults();
  const completed = consults.filter(prescriptionConsultIsCompleted);
  const prescriptionIds = completed.filter((c) => c?.prescription || c?.prescribed).map((c) => c.id).filter(Boolean);
  const groups = React.useMemo(() => prescriptionDoctorGroups(completed), [consults]);
  const [previewConsult, setPreviewConsult] = React.useState(null);

  React.useEffect(() => {
    if (prescriptionIds.length && window.markPrescriptionsRead) window.markPrescriptionsRead(prescriptionIds);
  }, [prescriptionIds.join('|')]);

  return (
    <PortalShell active="prescriptions" title="Prescriptions" subtitle="Medicines and advice saved by your dentist">
      <div style={{ padding: '24px 32px', maxWidth: 1040 }}>
        {groups.length === 0 ? (
          <div className="ml-card" style={{ padding: 48, textAlign: 'center' }}>
            <div style={{ width: 56, height: 56, borderRadius: 14, background: 'var(--blue-soft)', color: 'var(--blue-deep)', display: 'grid', placeItems: 'center', margin: '0 auto 16px' }}>
              <I.doc size={24}/>
            </div>
            <h2 style={{ fontSize: 24, marginBottom: 8 }}>No prescription yet.</h2>
            <p className="ml-muted" style={{ margin: '0 auto 20px', maxWidth: 460, fontSize: 14, lineHeight: 1.55 }}>
              Once your dentist ends the consultation and writes your Rx, it will appear here.
            </p>
            <button onClick={() => window.navigate && window.navigate('/appointments')} className="ml-btn ml-btn--primary" style={{ margin: '0 auto' }}>
              View appointments <I.arrowR size={13}/>
            </button>
          </div>
        ) : (
          <div style={{ display: 'grid', gap: 16 }}>
            {groups.map((group) => <PrescriptionDoctorGroup key={group.doc.id} group={group} onPreview={setPreviewConsult}/>)}
          </div>
        )}
      </div>
      {previewConsult && <PrescriptionPreview consult={previewConsult} onClose={() => setPreviewConsult(null)}/>}
    </PortalShell>
  );
}

function prescriptionHasRx(c) {
  return !!(c?.prescription || c?.prescribed);
}

function prescriptionCreatedMs(c) {
  return new Date(c?.createdAt || c?.paidAt || c?.completedAt || c?.closedAt || 0).getTime() || 0;
}

function prescriptionRootId(c, byId) {
  let rootId = c?.followUpFor || c?.id || null;
  const seen = new Set();
  for (let i = 0; i < 8 && rootId && !seen.has(String(rootId)); i += 1) {
    seen.add(String(rootId));
    const parent = byId.get(String(rootId));
    if (!parent?.followUpFor) break;
    rootId = parent.followUpFor;
  }
  return String(rootId || c?.id || '');
}

function prescriptionFlowCompare(rootId) {
  return (a, b) => {
    const aRoot = String(a.id) === String(rootId) || !a.followUp ? 0 : 1;
    const bRoot = String(b.id) === String(rootId) || !b.followUp ? 0 : 1;
    if (aRoot !== bRoot) return aRoot - bRoot;
    return prescriptionCreatedMs(a) - prescriptionCreatedMs(b);
  };
}

function prescriptionDoctorGroups(completed) {
  const byId = new Map((completed || []).map((c) => [String(c.id), c]));
  const chains = new Map();
  (completed || []).forEach((c) => {
    const rootId = prescriptionRootId(c, byId);
    const doc = DOC_BY_ID(c.docId);
    const key = `${doc.id}:${rootId}`;
    if (!chains.has(key)) chains.set(key, { rootId, doc, items: [] });
    chains.get(key).items.push(c);
  });

  const doctors = new Map();
  chains.forEach((chain) => {
    chain.items.sort(prescriptionFlowCompare(chain.rootId));
    chain.hasRx = chain.items.some(prescriptionHasRx);
    if (!chain.hasRx) return;
    chain.latestMs = Math.max(...chain.items.map(prescriptionCreatedMs), 0);
    if (!doctors.has(chain.doc.id)) doctors.set(chain.doc.id, { doc: chain.doc, chains: [] });
    doctors.get(chain.doc.id).chains.push(chain);
  });

  return Array.from(doctors.values())
    .map((group) => ({ ...group, chains: group.chains.sort((a, b) => b.latestMs - a.latestMs) }))
    .sort((a, b) => b.chains[0].latestMs - a.chains[0].latestMs);
}

function PrescriptionDoctorGroup({ group, onPreview }) {
  const rxCount = group.chains.reduce((sum, chain) => sum + chain.items.filter(prescriptionHasRx).length, 0);
  return (
    <div className="ml-card" style={{ padding: 22, display: 'grid', gap: 16 }}>
      <div style={{ display: 'flex', alignItems: 'center', gap: 14 }}>
        <div className="ml-avatar" style={{ width: 54, height: 54, borderRadius: 14, fontSize: 17,
          background: TONE_BG[group.doc.tone], color: TONE_FG[group.doc.tone] }}>{group.doc.avatar}</div>
        <div style={{ flex: 1, minWidth: 0 }}>
          <div style={{ fontSize: 18, fontWeight: 600 }}>{group.doc.n}</div>
          <div style={{ fontSize: 12.5, color: 'var(--ink-3)', marginTop: 2 }}>
            {rxCount} prescription{rxCount === 1 ? '' : 's'} · {group.chains.length} treatment flow{group.chains.length === 1 ? '' : 's'}
          </div>
        </div>
      </div>

      {group.chains.map((chain) => <PrescriptionTreatmentFlow key={chain.rootId} chain={chain} onPreview={onPreview}/>)}
    </div>
  );
}

function PrescriptionTreatmentFlow({ chain, onPreview }) {
  const first = chain.items.find((c) => !c.followUp) || chain.items[0];
  const care = first?.careType || first?.reason || 'Dental consultation';
  const rxCount = chain.items.filter(prescriptionHasRx).length;

  return (
    <div style={{
      border: '1.5px solid oklch(72% 0.055 165)',
      borderRadius: 12,
      padding: 16,
      background: 'oklch(99% 0.01 165)',
      boxShadow: '0 3px 10px rgba(15, 45, 35, 0.04)',
    }}>
      <div style={{ display: 'flex', alignItems: 'center', gap: 10, flexWrap: 'wrap', marginBottom: 12 }}>
        <div className="ml-label" style={{ margin: 0, color: 'oklch(31% 0.08 165)' }}>Prescription flow</div>
        <span style={{ fontSize: 13.5, color: 'var(--ink)', fontWeight: 600 }}>{care}</span>
        <span className="ml-pill ml-pill--ghost" style={{ fontSize: 10.5 }}>{chain.items.length} consult{chain.items.length === 1 ? '' : 's'}</span>
        <span className="ml-pill" style={{ background: 'oklch(90% 0.08 165)', color: 'oklch(25% 0.09 165)', fontSize: 10.5, fontWeight: 700 }}>
          {rxCount} Rx
        </span>
      </div>

      <div style={{ display: 'grid', gap: 8 }}>
        {chain.items.map((consult, index) => {
          const followCount = chain.items.slice(0, index + 1).filter((c) => c.followUp).length;
          const stepLabel = consult.followUp ? `Follow-up ${followCount}` : 'Original consult';
          return (
            <React.Fragment key={consult.id}>
              <PrescriptionFlowNode consult={consult} stepLabel={stepLabel} onPreview={onPreview}/>
              {index < chain.items.length - 1 && <PrescriptionFlowArrow/>}
            </React.Fragment>
          );
        })}
      </div>
    </div>
  );
}

function PrescriptionFlowArrow() {
  return (
    <div style={{
      display: 'flex', alignItems: 'center', gap: 10, width: 'fit-content',
      color: 'oklch(22% 0.09 165)', background: 'oklch(90% 0.075 165)',
      border: '1.5px solid oklch(70% 0.08 165)', borderRadius: 999,
      padding: '8px 14px', marginLeft: 22,
      boxShadow: '0 2px 8px rgba(20, 80, 55, 0.08)',
    }}>
      <I.arrowR size={15} style={{ transform: 'rotate(90deg)' }}/>
      <span style={{ fontSize: 11.5, fontFamily: 'var(--mono)', fontWeight: 800, letterSpacing: 0.06 + 'em' }}>FOLLOW-UP RX</span>
    </div>
  );
}

function PrescriptionFlowNode({ consult, stepLabel, onPreview }) {
  const rxReady = prescriptionHasRx(consult);
  const modeLabel = window.bookingModeLabel ? window.bookingModeLabel(consult.mode) : 'WhatsApp';
  const modeKey = window.bookingModeKey ? window.bookingModeKey(consult.mode) : String(consult.mode || '').toLowerCase();
  const ModeIcon = modeKey === 'video' ? I.video : modeKey === 'audio' ? I.mic : I.chat;
  const paidFee = prescriptionPaidFee(consult);
  return (
    <div style={{
      display: 'grid',
      gridTemplateColumns: '38px 1fr auto',
      gap: 14,
      alignItems: 'center',
      padding: 14,
      borderRadius: 10,
      background: '#fff',
      border: '1px solid oklch(82% 0.035 165)',
    }}>
      <div style={{
        width: 34, height: 34, borderRadius: 17,
        background: rxReady ? 'var(--blue-soft)' : 'var(--paper-2)',
        color: rxReady ? 'var(--blue-deep)' : 'var(--ink-3)',
        display: 'grid', placeItems: 'center',
      }}>
        {rxReady ? <I.doc size={14}/> : <I.clock size={14}/>}
      </div>
      <div style={{ minWidth: 0 }}>
        <div style={{ display: 'flex', alignItems: 'center', gap: 8, flexWrap: 'wrap', marginBottom: 4 }}>
          <span style={{ fontSize: 14.5, fontWeight: 700 }}>{stepLabel}</span>
          <span className="ml-pill" style={{ background: 'var(--paper-2)', color: 'var(--ink-2)', fontSize: 10.5 }}>Completed</span>
          {consult.followUp && <span className="ml-pill" style={{ background: 'oklch(88% 0.08 165)', color: 'oklch(26% 0.08 165)', fontSize: 10.5, fontWeight: 600 }}>Follow-up</span>}
          {rxReady && <span className="ml-pill" style={{ background: 'oklch(90% 0.08 165)', color: 'oklch(25% 0.09 165)', fontSize: 10.5, fontWeight: 700 }}>Prescription ready</span>}
          {paidFee !== null && <span className="ml-pill" style={{ background: 'oklch(95% 0.06 165)', color: 'oklch(38% 0.10 165)', fontSize: 10.5 }}>Paid ₹{paidFee}</span>}
        </div>
        <div style={{ fontSize: 12.5, color: 'var(--ink-2)', marginBottom: 3 }}>{consult.reason || 'Consultation'}</div>
        <div style={{ display: 'flex', alignItems: 'center', gap: 9, flexWrap: 'wrap', fontSize: 11.5, color: 'var(--ink-3)', fontFamily: 'var(--mono)' }}>
          <span>{consult.id}</span>
          <span>·</span>
          <span>{consult.date || 'Consultation'}</span>
          <span>·</span>
          <span>{consult.time || ''}</span>
          <span>·</span>
	          <span style={{ display: 'inline-flex', alignItems: 'center', gap: 5, textTransform: 'uppercase' }}><ModeIcon size={12}/> {modeLabel}</span>
        </div>
      </div>
      <div style={{ display: 'flex', gap: 8, alignItems: 'center', justifyContent: 'flex-end', flexWrap: 'wrap' }}>
        {rxReady ? (
          <button onClick={() => onPreview(consult)} className="ml-btn ml-btn--primary" style={{ padding: '7px 12px', fontSize: 12 }}>
            <I.doc size={12}/> Prescription
          </button>
        ) : (
          <span style={{ fontSize: 11.5, color: 'var(--ink-4)', textAlign: 'right' }}>Prescription pending</span>
        )}
      </div>
    </div>
  );
}

function prescriptionPaidFee(consult) {
  if (consult?.paymentStatus !== 'paid') return null;
  const freeFollowup = consult.paidMethod === 'free-followup' || (consult.followUp && consult.paidAmount != null && Number(consult.paidAmount) === 0);
  if (freeFollowup) return 0;
  const doc = DOC_BY_ID(consult.docId);
  return consult.paidAmount ?? consult.fee ?? doc.fee ?? 0;
}

function PrescriptionPreview({ consult, onClose }) {
  const doc = DOC_BY_ID(consult.docId);
  const rx = consult.prescription || {};
  const followupLabel = consult.followUpFreeUntil
    ? new Date(consult.followUpFreeUntil).toLocaleDateString(undefined, { month: 'short', day: 'numeric', year: 'numeric' })
    : null;

  return (
    <div onClick={onClose} style={{ position: 'fixed', inset: 0, background: 'rgba(15, 22, 36, 0.42)', zIndex: 90, display: 'grid', placeItems: 'center', padding: 18, backdropFilter: 'blur(2px)' }}>
      <div onClick={(e) => e.stopPropagation()} className="ml-card" style={{ width: 'min(820px, 100%)', maxHeight: 'min(760px, 92vh)', overflowY: 'auto', padding: 24 }}>
        <div style={{ display: 'flex', alignItems: 'flex-start', justifyContent: 'space-between', gap: 18, marginBottom: 18 }}>
          <div>
            <div className="ml-label" style={{ marginBottom: 8 }}>Prescription</div>
            <h2 style={{ fontSize: 24, marginBottom: 5 }}>{doc.n}</h2>
            <div className="ml-muted" style={{ fontSize: 13 }}>
              {consult.date || 'Consultation'} · {consult.time || ''} · Visit #{consult.id}
            </div>
          </div>
          <button onClick={onClose} className="ml-btn ml-btn--ghost" style={{ padding: '8px 12px', fontSize: 12 }}>Close</button>
        </div>

        <div style={{ display: 'grid', gridTemplateColumns: '1fr 1fr', gap: 12 }}>
          <RxBlock label="Medicine / prescription" value={rx.medicines || consult.prescribed || 'Prescription not added yet.'}/>
          <RxBlock label="Diagnosis" value={rx.diagnosis || 'Not added'}/>
          <RxBlock label="Instructions" value={rx.instructions || 'Not added'}/>
          <RxBlock label="Follow-up plan" value={rx.followup || (consult.followupRecommended ? 'Follow-up recommended' : 'Not added')}/>
          {rx.referral && <RxBlock label="Referral / tests" value={rx.referral}/>}
        </div>

        <div style={{ display: 'flex', justifyContent: 'space-between', gap: 12, alignItems: 'center', marginTop: 20, paddingTop: 16, borderTop: '1px solid var(--line)', flexWrap: 'wrap' }}>
          <div className="ml-muted" style={{ fontSize: 12.5 }}>
            {followupLabel ? `Follow-up is free until ${followupLabel}.` : 'Follow-up starts a fresh appointment.'}
          </div>
          <div style={{ display: 'flex', gap: 8, flexWrap: 'wrap' }}>
            <button onClick={() => downloadPrescriptionPdf(consult)} className="ml-btn ml-btn--primary" style={{ fontSize: 12.5 }}>
              <I.doc size={13}/> Download PDF
            </button>
            <button onClick={() => window.navigate && window.navigate('/visit/summary?consult=' + encodeURIComponent(consult.id))} className="ml-btn ml-btn--ghost" style={{ fontSize: 12.5 }}>
              View booking
            </button>
          </div>
        </div>
      </div>
    </div>
  );
}

function downloadPrescriptionPdf(consult) {
  const doc = DOC_BY_ID(consult.docId);
  const rx = consult.prescription || {};
  const patientName = consult.patientName || 'Patient';
  const patientDetails = [
    consult.patientAge ? `${consult.patientAge} years` : '',
    consult.patientGender || consult.gender || '',
  ].filter(Boolean).join(', ');
  const html = prescriptionPdfHtml({
    doctor: doc,
    patientName,
    patientDetails,
    visitId: consult.id,
    prescriptionId: `RX-${String(consult.id || '').replace(/^MLR-/, '')}`,
    date: consult.date || 'Consultation',
    time: consult.time || '',
    chiefComplaint: consult.reason || 'Dental consultation',
    pain: consult.severity ? `${consult.severity} / 10` : '',
    note: consult.note || '',
    diagnosis: rx.diagnosis || 'Not added',
    assessment: rx.assessment || '',
    medicines: rx.medicines || consult.prescribed || 'Prescription not added yet.',
    instructions: rx.instructions || 'Not added',
    followup: rx.followup || (consult.followupRecommended ? 'Follow-up recommended' : 'Not added'),
    referral: rx.referral || '',
    logoUrl: new URL('images.jpg', window.location.href).href,
  });
  const win = window.open('', '_blank');
  if (!win) {
    alert('Please allow pop-ups to download the prescription PDF.');
    return;
  }
  win.document.open();
  win.document.write(html);
  win.document.close();
  win.focus();
  setTimeout(() => win.print(), 700);
}

window.downloadPrescriptionPdf = downloadPrescriptionPdf;

function prescriptionPdfHtml(data) {
  const safe = (value) => escapeHtml(value).replace(/\n/g, '<br/>');
  const safeAttr = (value) => escapeHtml(value);
  const today = new Date().toLocaleDateString('en-IN', { day: 'numeric', month: 'short', year: 'numeric' });
  const complaint = [
    data.chiefComplaint,
    data.pain ? `Pain level: ${data.pain}` : '',
    data.note ? `Patient note: ${data.note}` : '',
  ].filter(Boolean).join('\n');
  return `<!doctype html>
<html>
<head>
  <meta charset="utf-8"/>
  <title>Molara prescription ${safe(data.visitId)}</title>
  <style>
    @page { size: A4; margin: 0; }
    * { box-sizing: border-box; }
    body { font-family: Arial, Helvetica, sans-serif; color: #1d2b27; margin: 0; background: #f2f5f3; }
    .sheet { width: 210mm; min-height: 297mm; margin: 0 auto; background: #fff; box-shadow: 0 10px 35px rgba(0,0,0,.12); }
    .top { background: #103b36; color: #fff; min-height: 64mm; padding: 20mm 18mm; display: flex; justify-content: space-between; gap: 24px; align-items: flex-start; }
    .brand-row { display: flex; align-items: center; gap: 13px; }
    .logo-mark { width: 42px; height: 42px; border-radius: 11px; background: #fff url("${safeAttr(data.logoUrl)}") no-repeat 50% 8% / 236% auto; display: inline-block; box-shadow: 0 8px 24px rgba(0,0,0,.18); }
    .brand { font-size: 36px; line-height: .9; font-weight: 800; letter-spacing: .01em; text-transform: lowercase; }
    .tag { margin-top: 9px; color: rgba(230,255,250,.78); font-size: 11px; text-transform: uppercase; letter-spacing: .18em; }
    .doctor { text-align: right; max-width: 92mm; }
    .doctor-name { font-size: 25px; font-weight: 700; line-height: 1.2; margin-bottom: 8px; }
    .doctor-meta { color: rgba(255,255,255,.78); font-size: 13px; line-height: 1.45; }
    .patient-bar { padding: 13mm 18mm 11mm; display: flex; justify-content: space-between; gap: 24px; border-bottom: 6px solid #f1f3f4; }
    .patient-name { font-size: 21px; font-weight: 700; margin-bottom: 6px; }
    .muted { color: #77847f; }
    .right { text-align: right; }
    .date { font-size: 19px; font-weight: 700; margin-bottom: 5px; }
    .content { padding: 13mm 18mm 8mm; }
    .section { padding: 0 0 12mm; margin: 0 0 12mm; border-bottom: 6px solid #f1f3f4; }
    .label { font-size: 12px; font-weight: 700; color: #77847f; text-transform: uppercase; letter-spacing: .05em; margin-bottom: 7px; }
    .text { font-size: 18px; line-height: 1.45; white-space: pre-wrap; }
    .small-text { font-size: 15px; line-height: 1.55; white-space: pre-wrap; }
    .rx-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 11mm; }
    .rx-box { break-inside: avoid; }
    .checkline { display: grid; grid-template-columns: 20px 1fr; gap: 10px; align-items: start; }
    .tick { color: #103b36; font-size: 18px; line-height: 1.2; font-weight: 800; }
    .signature-wrap { min-height: 35mm; display: flex; justify-content: flex-end; align-items: flex-end; padding: 2mm 18mm 12mm; }
    .signature { text-align: right; min-width: 82mm; }
    .sign-line { height: 30px; font-family: "Brush Script MT", cursive; font-size: 20px; color: #51615c; transform: rotate(-7deg); margin-bottom: 8px; }
    .sign-name { font-size: 18px; font-weight: 700; }
    .sign-meta { color: #626f6a; font-size: 13px; margin-top: 4px; line-height: 1.4; }
    .disclaimer { background: #f2f4f5; color: #8a9691; text-align: center; padding: 10mm 20mm; font-size: 13px; line-height: 1.45; }
    @media print {
      body { background: #fff; }
      .sheet { box-shadow: none; width: 210mm; min-height: 297mm; }
      button { display: none; }
    }
  </style>
</head>
<body>
  <div class="sheet">
    <div class="top">
      <div class="brand-wrap">
        <div class="brand-row">
          <span class="logo-mark"></span>
          <div>
            <div class="brand">molara</div>
            <div class="tag">Dentistry, elevated</div>
          </div>
        </div>
      </div>
      <div class="doctor">
        <div class="doctor-name">${safe(data.doctor.n)}</div>
        <div class="doctor-meta">
          ${safe(data.doctor.creds)} - ${safe(data.doctor.spec)}<br/>
          ${safe(data.doctor.loc || 'Molara online dental consultation')}<br/>
          Molara Dentist ID: MLR-DOC-${safe(data.doctor.id)}
        </div>
      </div>
    </div>
    <div class="patient-bar">
      <div>
        <div class="patient-name">${safe(data.patientName)}</div>
        <div class="muted">${safe(data.patientDetails || 'Patient details not added')}</div>
      </div>
      <div class="right">
        <div class="date">${safe(today)}</div>
        <div class="muted">Prescription ID: ${safe(data.prescriptionId)}</div>
        <div class="muted">Visit ID: ${safe(data.visitId)}</div>
      </div>
    </div>
    <div class="content">
      <div class="section">
        <div class="label">Chief complaints</div>
        <div class="text">${safe(complaint || 'Not added')}</div>
      </div>
      <div class="section">
        <div class="label">Provisional diagnosis</div>
        <div class="text">${safe(data.diagnosis)}</div>
      </div>
      <div class="section">
        <div class="label">Medicine / prescription</div>
        <div class="text">${safe(data.medicines)}</div>
      </div>
      <div class="section">
        <div class="label">General advice / notes</div>
        <div class="checkline">
          <div class="tick">✓</div>
          <div class="small-text">${safe(data.instructions)}</div>
        </div>
      </div>
      <div class="rx-grid">
        <div class="rx-box">
          <div class="label">Clinical assessment</div>
          <div class="small-text">${safe(data.assessment || 'Not added')}</div>
        </div>
        <div class="rx-box">
          <div class="label">Follow-up plan</div>
          <div class="small-text">${safe(data.followup)}</div>
        </div>
        <div class="rx-box">
          <div class="label">Referral / tests</div>
          <div class="small-text">${safe(data.referral || 'Not added')}</div>
        </div>
        <div class="rx-box">
          <div class="label">Consultation</div>
          <div class="small-text">${safe(data.date)} ${safe(data.time)}</div>
        </div>
      </div>
    </div>
    <div class="signature-wrap">
      <div class="signature">
        <div class="sign-line">${safe(data.doctor.n.replace(/^Dr\.\s*/i, ''))}</div>
        <div class="sign-name">${safe(data.doctor.n)}</div>
        <div class="sign-meta">${safe(data.doctor.creds)} - ${safe(data.doctor.spec)}<br/>Molara tele-consultation</div>
      </div>
    </div>
    <div class="disclaimer">
      Disclaimer: This prescription is based on the information provided during an online dental consultation and not on physical verification. Visit a dentist or emergency medical facility immediately if pain, swelling, bleeding, breathing difficulty, trauma, fever, or any urgent symptom worsens. This prescription is valid in India only.
    </div>
  </div>
</body>
</html>`;
}

function escapeHtml(value) {
  return String(value || '')
    .replace(/&/g, '&amp;')
    .replace(/</g, '&lt;')
    .replace(/>/g, '&gt;')
    .replace(/"/g, '&quot;')
    .replace(/'/g, '&#39;');
}

function RxBlock({ label, value }) {
  return (
    <div style={{ padding: 14, border: '1px solid var(--line)', borderRadius: 10, background: '#fff' }}>
      <div className="ml-label" style={{ marginBottom: 7 }}>{label}</div>
      <div style={{ whiteSpace: 'pre-wrap', lineHeight: 1.55, fontSize: 13.5, color: 'var(--ink-2)' }}>{value}</div>
    </div>
  );
}

function prescriptionConsultIsCompleted(c) {
  return !!(c?.status === 'completed' || c?.status === 'awaiting-prescription' || c?.prescription || c?.prescribed || c?.closedAt || c?.completedAt || c?.endedAt);
}

window.PatientPrescriptions = PatientPrescriptions;