/* MedGNN project page: calm widgets on the shivi template. All rules scoped to body.pc-medgnn. */
body.pc-medgnn { --pc-accent:#f08a5d; --mg-patient:#e0655b; --mg-med:#4fae74; --mg-cc:#d68f55; --mg-pmi:#6fa8dc; --mg-star:#8a8a8a; }
html[data-theme="light"] body.pc-medgnn { --pc-accent:#c2410c; --mg-pmi:#3d7fc0; --mg-star:#8a8a8a; }

/* Synthetic example graph selector */
body.pc-medgnn .mg-graph-widget { margin: 20px 0 0; padding-top: 14px; border-top: 1px solid var(--pc-line); }
body.pc-medgnn .mg-segs { display: flex; flex-wrap: wrap; gap: 6px; }
body.pc-medgnn .mg-segs .mg-seg,
html[data-theme="light"] body.pc-medgnn .mg-segs .mg-seg {
  font: 500 12.5px/1 'DM Mono', ui-monospace, monospace; padding: 8px 12px; border-radius: 6px; cursor: pointer;
  border: 1px solid var(--pc-line) !important; background: transparent !important; color: var(--pc-muted) !important;
  box-shadow: none; transition: color .15s, border-color .15s;
}
body.pc-medgnn .mg-segs .mg-seg:hover,
html[data-theme="light"] body.pc-medgnn .mg-segs .mg-seg:hover { color: var(--pc-text) !important; border-color: var(--pc-muted) !important; }
body.pc-medgnn .mg-segs .mg-seg[aria-pressed="true"],
html[data-theme="light"] body.pc-medgnn .mg-segs .mg-seg[aria-pressed="true"] {
  color: var(--pc-text) !important; border-color: var(--pc-accent) !important; background: var(--pc-chip) !important;
}
body.pc-medgnn .mg-seg:focus-visible { outline: 2px solid var(--pc-accent); outline-offset: 2px; }
body.pc-medgnn .mg-gbody { margin-top: 14px; }
body.pc-medgnn .mg-gpanel[hidden] { display: none; }
body.pc-medgnn .mg-head { display: flex; justify-content: space-between; flex-wrap: wrap; gap: 4px 12px; margin: 0 0 6px; font: 400 12.5px/1.5 'DM Mono', ui-monospace, monospace; color: var(--pc-muted); }
body.pc-medgnn .mg-head b { font-weight: 500; color: var(--pc-text); }
body.pc-medgnn .mg-graph svg { display: block; width: 100%; max-width: 840px; height: auto; margin: 0 auto; overflow: visible; color: var(--pc-text); }
body.pc-medgnn .g-star { stroke: var(--mg-star); stroke-width: 1; opacity: .7; }
body.pc-medgnn .g-pmi { stroke: var(--mg-pmi); stroke-width: 1.1; stroke-dasharray: 4 3; opacity: .85; }
body.pc-medgnn .g-node { stroke: var(--mg-star); stroke-width: 1; }
body.pc-medgnn .g-patient { fill: var(--mg-patient); }
body.pc-medgnn .g-med { fill: var(--mg-med); }
body.pc-medgnn .g-cc { fill: var(--mg-cc); }
body.pc-medgnn .g-label, body.pc-medgnn .g-hublabel { fill: currentColor; font-family: 'DM Mono', ui-monospace, monospace; font-size: 10px; }
body.pc-medgnn .g-hublabel { font-size: 11px; font-weight: 500; }
body.pc-medgnn .mg-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 16px; list-style: none; margin: 10px 0 0; padding: 0; }
body.pc-medgnn .mg-legend li { margin: 0; font: 400 12.5px/1.5 'DM Mono', ui-monospace, monospace; color: var(--pc-muted); }
body.pc-medgnn .mg-legend i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 6px; }
body.pc-medgnn .mg-legend .g-patient { background: var(--mg-patient); }
body.pc-medgnn .mg-legend .g-med { background: var(--mg-med); }
body.pc-medgnn .mg-legend .g-cc { background: var(--mg-cc); }
/* Current clinical graph node types (same circles, lines and type as the original examples) */
body.pc-medgnn { --mg-visit:#e0655b; --mg-person:#9a9a9a; --mg-vital:#d46fa8; --mg-lab:#4fae74; --mg-dx:#8f75d8; }
html[data-theme="light"] body.pc-medgnn { --mg-vital:#c2569a; --mg-dx:#7a5cc9; }
body.pc-medgnn .g-visit { fill: var(--mg-visit); }
body.pc-medgnn .g-person { fill: var(--mg-person); }
body.pc-medgnn .g-vital { fill: var(--mg-vital); }
body.pc-medgnn .g-lab { fill: var(--mg-lab); }
body.pc-medgnn .g-dx { fill: var(--mg-dx); }
body.pc-medgnn .g-node.g-prior { fill-opacity: .3; stroke: var(--mg-lab); stroke-dasharray: 2 2; stroke-width: 1.2; }
/* Time bands, dividers and edge labels */
body.pc-medgnn .g-band { fill: var(--pc-muted); font-family: 'DM Mono', ui-monospace, monospace; font-size: 10px; letter-spacing: .02em; }
body.pc-medgnn .g-divider { stroke: var(--pc-line); stroke-width: 1; stroke-dasharray: 2 4; }
body.pc-medgnn .g-elabel { fill: var(--mg-pmi); font-family: 'DM Mono', ui-monospace, monospace; font-size: 9px; paint-order: stroke; stroke: var(--pc-bg); stroke-width: 3px; stroke-linejoin: round; }
/* Halo so edges never run through node labels */
body.pc-medgnn .g-label, body.pc-medgnn .g-hublabel { paint-order: stroke; stroke: var(--pc-bg); stroke-width: 3px; stroke-linejoin: round; }
body.pc-medgnn .mg-legend .g-visit { background: var(--mg-visit); }
body.pc-medgnn .mg-legend .g-person { background: var(--mg-person); }
body.pc-medgnn .mg-legend .g-vital { background: var(--mg-vital); }
body.pc-medgnn .mg-legend .g-lab { background: var(--mg-lab); }
body.pc-medgnn .mg-legend .g-lab.g-prior { background: color-mix(in srgb, var(--mg-lab) 30%, transparent); border: 1px dashed var(--mg-lab); box-sizing: border-box; }
body.pc-medgnn .mg-legend .g-dx { background: var(--mg-dx); }
body.pc-medgnn .mg-legend .e-star, body.pc-medgnn .mg-legend .e-pmi { width: 18px; height: 0; border-radius: 0; vertical-align: middle; }
body.pc-medgnn .mg-legend .e-star { border-top: 1px solid var(--mg-star); }
body.pc-medgnn .mg-legend .e-pmi { border-top: 1.5px dashed var(--mg-pmi); }
body.pc-medgnn .mg-note { margin: 6px 0 0; text-align: center; font-family: 'DM Mono', ui-monospace, monospace; font-size: 12px; }

/* Tables */
body.pc-medgnn .pc-scroll { position: relative; margin-top: 4px; }
body.pc-medgnn .pc-scroll:focus-visible { outline: 2px solid var(--pc-accent); outline-offset: 2px; }
body.pc-medgnn .mg-table { font-size: 14px; line-height: 1.5; }
body.pc-medgnn .mg-table tbody th { font: 500 13px/1.45 'DM Mono', ui-monospace, monospace; color: var(--pc-text); }
body.pc-medgnn .mg-models tbody th { white-space: nowrap; }
body.pc-medgnn .mg-badge { display: block; margin-top: 2px; font: 400 11.5px/1.3 'DM Mono', ui-monospace, monospace; color: var(--pc-muted); }
body.pc-medgnn .mg-badge.mg-in { color: var(--pc-accent); }
body.pc-medgnn .mg-num td, body.pc-medgnn .mg-num thead th:not(:first-child) { text-align: right; font-family: 'DM Mono', ui-monospace, monospace; white-space: nowrap; }
body.pc-medgnn .mg-num td small { margin-left: 2px; font-size: .82em; color: var(--pc-muted); font-weight: 400; }
body.pc-medgnn .mg-table td[data-best="true"] { font-weight: 600; text-decoration: underline; text-decoration-color: var(--pc-accent); text-decoration-thickness: 2px; text-underline-offset: 4px; }
body.pc-medgnn .mg-table td[data-best="true"] small { text-decoration: none; }
body.pc-medgnn .graph-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
body.pc-medgnn .mg-cap { margin: 8px 0 0; }

/* Fidelity cells: value over a centred diverging bar */
body.pc-medgnn .mg-fid td, body.pc-medgnn .mg-fid thead th:not(:first-child) { text-align: center; vertical-align: middle; }
body.pc-medgnn .mg-fid tbody th { vertical-align: middle; }
body.pc-medgnn .fb { display: flex; flex-direction: column; gap: 6px; align-items: stretch; min-width: 76px; }
body.pc-medgnn .fv { text-align: center; }
body.pc-medgnn .fbar { position: relative; display: block; height: 6px; border-radius: 3px; background: var(--pc-chip); }
body.pc-medgnn .fbar::after { content: ""; position: absolute; top: 0; bottom: 0; border-radius: 3px; }
body.pc-medgnn .fbar.pos::after { left: 50%; width: calc(var(--v) * 1%); background: var(--mg-med); }
body.pc-medgnn .fbar.neg::after { left: calc(50% - var(--v) * 1%); width: calc(var(--v) * 1%); background: var(--mg-patient); }

@media (max-width: 599px) {
  body.pc-medgnn .mg-graph { overflow-x: auto; }
  body.pc-medgnn .mg-graph svg { min-width: 640px; }
  body.pc-medgnn .mg-table { font-size: 13px; }
  body.pc-medgnn .pc-section .mg-table th, body.pc-medgnn .pc-section .mg-table td { padding: 7px 6px; }
}
/* theme-toggle.css recolours every <p> in light; keep captions muted */
html[data-theme="light"] body.pc-medgnn .pc-note, html[data-theme="light"] body.pc-medgnn .mg-head { color: var(--pc-muted); }