/* ============================================================
   IVF Pulse OS — Hospital-OS chrome (worklist + patient profile)
   Adapted from the Leap Health OS kit. Builds on design-system
   tokens + app.css (shell). Used by the Doctor worklist (L1) and
   the patient profile (L2).
   ============================================================ */

/* AI summary bar */
.aibar { display: flex; align-items: center; gap: 10px; background: var(--ai-banner);
  box-shadow: var(--ring); border-radius: var(--radius-md); padding: 11px 15px; margin-bottom: 20px;
  font: var(--fw-medium) 13px/1.5 var(--font-sans); color: var(--primary); }
.aibar i.lead { font-size: 17px; flex: none; }
.aibar--block { display: block; padding: 13px 16px; cursor: default; }
.aibar--block ul { margin: 8px 0 0; padding-left: 18px; display: flex; flex-direction: column; gap: 5px; }
.aibar--block li { font: 400 12.5px/1.5 var(--font-sans); color: var(--primary); }
.aibar__head { display: flex; align-items: center; gap: 8px; font-weight: var(--fw-semibold); }

/* dashboard KPIs */
.kpis { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 8px; }

/* Consultations header row */
.conshead { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; gap: 16px; flex-wrap: wrap; }
.conshead__l { display: flex; align-items: center; gap: 14px; }
.conshead__l h1 { font: var(--fw-semibold) 24px/1.25 var(--font-sans); color: var(--text-primary); margin: 0; }

/* Ivy task chip (worklist column) */
.ivychip { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap;
  font: var(--fw-medium) 12px/1 var(--font-sans); color: var(--primary);
  background: var(--primary-tint-12); padding: 5px 9px; border-radius: var(--radius-pill); }
.ivychip i { font-size: 13px; }

/* worklist toolbar */
.toolbar { display: flex; align-items: center; justify-content: space-between; margin: 0 0 16px; gap: 16px; flex-wrap: wrap; }
.toolbar__r { display: flex; gap: 10px; align-items: center; }

/* worklist table helpers */
.cell-sub { font: 400 12px/1.3 var(--font-sans); color: var(--text-tertiary); }
.go { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px;
  border-radius: var(--radius-md); background: var(--primary-tint-12); color: var(--primary); border: 0;
  cursor: pointer; font-size: 18px; transition: var(--transition-base); }
.go:hover { background: var(--primary); color: #fff; }
.pager { display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding: 12px 4px 0;
  font: 400 12px/1.4 var(--font-sans); color: var(--text-tertiary); }
.muted { color: var(--text-tertiary); }
.rowsplit { display: flex; align-items: center; justify-content: space-between; }

/* inline status dots */
.idot { display: inline-flex; align-items: center; gap: 6px; font: var(--fw-medium) 13px/1.3 var(--font-sans); }
.idot::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: currentColor; }
.idot--prog { color: var(--info-dark); }
.idot--pend { color: var(--warning-dark); }
.idot--done { color: var(--success-dark); }

/* patient cell (avatar + name + sub) */
.pcell { display: flex; align-items: center; gap: 10px; }
.pcell b { font: var(--fw-medium) 14px/1.3 var(--font-sans); color: var(--text-primary); display: block; }

/* ---------------- L2 Patient profile ---------------- */
.phead { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.phead__name { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.phead__name b { font: var(--fw-semibold) 18px/1.3 var(--font-sans); color: var(--text-primary); }

.detail-tabs { display: flex; gap: 4px; border-bottom: var(--hairline); margin-bottom: 18px; }
.dtab { border: 0; background: transparent; cursor: pointer; padding: 10px 14px; margin-bottom: -1px;
  display: inline-flex; align-items: center; gap: 6px;
  font: var(--fw-medium) 13.5px/1.3 var(--font-sans); color: var(--text-tertiary); border-bottom: 2px solid transparent; }
.dtab--active { color: var(--primary); border-bottom-color: var(--primary); }
.dtab:hover { color: var(--text-secondary); }
.dtab__chip { font: 600 10px/1 var(--font-sans); background: var(--primary); color: #fff; border-radius: 100px; padding: 2px 6px; }

/* patient details grid */
.pdetails { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px 24px; }
.pdetails .f { display: flex; flex-direction: column; gap: 2px; }
.pdetails .f label { font: 400 11px/1.4 var(--font-sans); color: var(--text-tertiary); text-transform: uppercase; letter-spacing: .04em; }
.pdetails .f span { font: var(--fw-medium) 13px/1.4 var(--font-sans); color: var(--text-primary); }

/* profile two-column body */
.profilegrid { display: grid; grid-template-columns: 1fr 340px; gap: 22px; align-items: start; }
@media (max-width: 1100px) { .profilegrid { grid-template-columns: 1fr; } }

/* "needs your approval" callout on Overview */
.needcard { display: flex; align-items: center; gap: 14px; background: var(--surface-card); box-shadow: var(--ring-primary);
  border-radius: var(--radius-lg); padding: 16px 18px; }
.needcard__ic { width: 42px; height: 42px; border-radius: var(--radius-md); flex: none; display: flex; align-items: center;
  justify-content: center; font-size: 22px; background: var(--primary-tint-12); color: var(--primary); }
.needcard__m { flex: 1; }
.needcard__m b { font: var(--fw-semibold) 14px/1.3 var(--font-sans); color: var(--text-primary); display: block; }
.needcard__m small { font: 400 12.5px/1.4 var(--font-sans); color: var(--text-tertiary); }

/* source-data strip (Ivy tab) */
.srcdata { background: var(--surface-page-2); box-shadow: var(--ring); border-radius: var(--radius-md); padding: 14px 16px; margin-bottom: 16px; }
.srcdata__top { display: flex; align-items: center; gap: 12px; }
.srcdata__ic { width: 36px; height: 36px; border-radius: var(--radius-sm); flex: none; display: flex; align-items: center;
  justify-content: center; font-size: 18px; background: var(--success-tint); color: var(--success-dark); }
.srcdata__m { flex: 1; min-width: 0; }
.srcdata__m b { font: var(--fw-medium) 13px/1.3 var(--font-sans); color: var(--text-primary); display: block; }
.srcdata__m small { font: 400 11.5px/1.3 var(--font-sans); color: var(--text-tertiary); }
.srcdata__table { margin-top: 12px; border-radius: var(--radius-sm); box-shadow: var(--ring); overflow: hidden; }

/* released banner inside Ivy tab */
.relbanner { display: flex; align-items: center; gap: 12px; background: var(--success-tint);
  box-shadow: inset 0 0 0 1px rgba(86,202,0,.35); border-radius: var(--radius-md); padding: 12px 16px; margin-bottom: 16px; }
.relbanner i { font-size: 20px; color: var(--success-dark); }
.relbanner b { font: var(--fw-semibold) 13px/1.4 var(--font-sans); color: var(--text-primary); }
.relbanner p { font: 400 12px/1.4 var(--font-sans); color: var(--text-secondary); margin: 1px 0 0; }

/* analyse overlay (Re-run Ivy) sits over the recommendation */
.reanalyse { background: var(--surface-card); box-shadow: var(--ring); border-radius: var(--radius-lg); }