/* ============================================================
   CAV PATHOLOGY · Ischemic Heart Disease (IHD / CAD)
   Scaffold styling — ONLY the "content pending" placeholder stubs
   and labeled mount points used by the five empty IHD topic pages.
   All real component styling (cards, compares, recall, mapper)
   arrives with its content in later prompts. Page-scoped under each
   IHD content div so nothing leaks into other modules.
   ============================================================ */

/* Angina page — uniform vertical rhythm between ALL top-level section
   cards. The container is a single-column grid so every card is spaced
   by one gap; the comparator's two-article mount uses display:contents
   so its grid + ECG sections join the same rhythm (their old per-section
   margins are zeroed in angina-comparator.css). */
#cavIhdAnginaTopicContent { display: grid; gap: 20px; }
#cavIhdAnginaTopicContent[hidden] { display: none; }
#cavIhdAnginaTopicContent #angina-hero-mount { display: contents; }

#cavIhdFoundationsTopicContent .ihd-stub,
#cavIhdAnginaTopicContent .ihd-stub,
#cavIhdMiPathologyTopicContent .ihd-stub,
#cavIhdMiClinicalTopicContent .ihd-stub,
#cavIhdManagementTopicContent .ihd-stub {
    border: 1px dashed rgba(120, 144, 196, 0.55);
    border-radius: 16px;
    background: rgba(120, 144, 196, 0.06);
}

#cavIhdFoundationsTopicContent .ihd-stub-pending,
#cavIhdAnginaTopicContent .ihd-stub-pending,
#cavIhdMiPathologyTopicContent .ihd-stub-pending,
#cavIhdMiClinicalTopicContent .ihd-stub-pending,
#cavIhdManagementTopicContent .ihd-stub-pending {
    margin: 8px 0 0;
    padding: 14px 16px;
    border-radius: 12px;
    background: rgba(120, 144, 196, 0.10);
    color: var(--muted, #5a6478);
    font-size: 14px;
    font-style: italic;
}

/* A labeled mount point reserved for a later-prompt interactive
   (e.g. the Coronary Territory Mapper). Visually distinct from the
   plain text stub so later prompts can find it at a glance. */
#cavIhdFoundationsTopicContent .ihd-mount,
#cavIhdAnginaTopicContent .ihd-mount,
#cavIhdMiPathologyTopicContent .ihd-mount,
#cavIhdMiClinicalTopicContent .ihd-mount,
#cavIhdManagementTopicContent .ihd-mount {
    margin: 10px 0 0;
    padding: 28px 18px;
    border: 1px dashed rgba(96, 132, 224, 0.6);
    border-radius: 14px;
    background: rgba(96, 132, 224, 0.07);
    text-align: center;
    color: var(--muted, #5a6478);
    font-size: 14px;
}

/* Foundations title tag row — the HYPER HIGH-YIELD pill + one-liner.
   Compact inline row, never a banner. The pill styling itself comes
   from the shared reusable tag family (shared/tags/tags.css). */
#cavIhdFoundationsTopicContent .ihd-tagline {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 10px;
    margin: 4px 0 10px;
}
#cavIhdFoundationsTopicContent .ihd-tagline-note {
    font-size: 12.5px;
    color: var(--muted-strong);
}

#cavIhdFoundationsTopicContent .ihd-mount-label,
#cavIhdAnginaTopicContent .ihd-mount-label,
#cavIhdMiPathologyTopicContent .ihd-mount-label,
#cavIhdMiClinicalTopicContent .ihd-mount-label,
#cavIhdManagementTopicContent .ihd-mount-label {
    display: block;
    font-weight: 700;
    font-style: normal;
    color: var(--text, #1f2638);
    margin-bottom: 4px;
}

/* Breathing room between the Foundations section cards/widgets */
#cavIhdFoundationsTopicContent .topic-section-card + .topic-section-card { margin-top: 24px; }

/* Risk Factors scannable card grid (Foundations §2). Facts always #111. */
#cavIhdFoundationsTopicContent .ihd-rf-framing { color: #111111; font-size: 15px; line-height: 1.6; margin: 8px 0 18px; max-width: 74ch; }

#cavIhdFoundationsTopicContent .ihd-rf-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; align-items: stretch; }
#cavIhdFoundationsTopicContent .ihd-rf-col { display: flex; flex-direction: column; }
#cavIhdFoundationsTopicContent .ihd-rf-colhead {
    font-size: 13px; font-weight: 800; text-transform: uppercase; letter-spacing: 0.08em;
    color: var(--text); padding-bottom: 8px; border-bottom: 2px solid var(--accent);
}
/* cards block grows and vertically centers, so the shorter column lines up with the taller one */
#cavIhdFoundationsTopicContent .ihd-rf-cards { display: flex; flex-direction: column; gap: 12px; flex: 1; justify-content: center; margin-top: 14px; }
#cavIhdFoundationsTopicContent .ihd-rf-card {
    display: flex; gap: 13px; align-items: flex-start;
    background: #ffffff; border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 14px; padding: 14px 16px;
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
#cavIhdFoundationsTopicContent .ihd-rf-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 22px rgba(15, 23, 42, 0.10);
    border-color: rgba(10, 132, 255, 0.35);
}
#cavIhdFoundationsTopicContent .ihd-rf-icon { font-size: 24px; line-height: 1.1; flex: none; }
#cavIhdFoundationsTopicContent .ihd-rf-body { min-width: 0; }
#cavIhdFoundationsTopicContent .ihd-rf-name {
    font-size: 15.5px; font-weight: 800; color: #111111; margin-bottom: 4px;
    display: flex; align-items: center; gap: 7px; flex-wrap: wrap;
}
#cavIhdFoundationsTopicContent .ihd-rf-fact { font-size: 14.5px; line-height: 1.5; color: #111111; }

/* highlighted, centered, outlined closing note */
#cavIhdFoundationsTopicContent .ihd-rf-closing {
    color: #111111; font-size: 14px; line-height: 1.55; font-weight: 600; font-style: italic;
    margin: 22px auto 0; max-width: 64ch; text-align: center;
    background: var(--accent-soft); border: 1px solid rgba(10, 132, 255, 0.22);
    border-radius: 14px; padding: 12px 18px;
}

@media (max-width: 760px) {
    #cavIhdFoundationsTopicContent .ihd-rf-grid { grid-template-columns: 1fr; gap: 18px; }
    #cavIhdFoundationsTopicContent .ihd-rf-cards { justify-content: flex-start; }
}
@media (prefers-reduced-motion: reduce) {
    #cavIhdFoundationsTopicContent .ihd-rf-card { transition: none; }
}

/* ===== §3 Stress ECG — Rest/Stress toggle + scannable cards (all text #111) ===== */
#cavIhdFoundationsTopicContent .ihd-se-intro { color: #111111; font-size: 15px; line-height: 1.6; margin: 8px 0 0; max-width: 78ch; }

#cavIhdFoundationsTopicContent .ihd-se-interactive { display: flex; flex-direction: column; align-items: center; gap: 12px; margin: 16px 0 14px; }
/* figure card: SVG + its live caption read as one unit */
#cavIhdFoundationsTopicContent .ihd-se-figcard { width: 100%; max-width: 620px; background: #ffffff; border: 1px solid rgba(15, 23, 42, 0.10); border-radius: 16px; padding: 16px 18px; box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04); }
#cavIhdFoundationsTopicContent .ihd-se-svg { width: 100%; height: auto; display: block; }
/* caption = the diagram's readout: left-aligned, weighted, black, state-coloured accent */
#cavIhdFoundationsTopicContent .ihd-se-cap { color: #111111; font-size: 14px; font-weight: 600; line-height: 1.55; text-align: left; margin: 12px 0 0; padding-left: 12px; border-left: 3px solid transparent; }
#cavIhdFoundationsTopicContent .ihd-se-cap-rest { border-left-color: var(--accent); }
#cavIhdFoundationsTopicContent .ihd-se-cap-stress { border-left-color: #9a1f17; }

/* segmented Rest/Stress switch (pure-CSS, driven by the hidden checkbox) */
#cavIhdFoundationsTopicContent .ihd-se-switch { display: inline-flex; border: 1px solid var(--line); border-radius: 999px; background: var(--surface-soft); padding: 3px; cursor: pointer; }
#cavIhdFoundationsTopicContent .ihd-se-seg { padding: 6px 18px; border-radius: 999px; font-size: 13px; font-weight: 700; color: var(--muted-strong); transition: background .15s ease, color .15s ease; }
#cavIhdFoundationsTopicContent .ihd-se-seg-rest { background: var(--surface-strong); color: var(--accent-strong); box-shadow: var(--shadow-md); }
#cavIhdFoundationsTopicContent .ihd-se-input:checked ~ .ihd-se-switch .ihd-se-seg-rest { background: transparent; color: var(--muted-strong); box-shadow: none; }
#cavIhdFoundationsTopicContent .ihd-se-input:checked ~ .ihd-se-switch .ihd-se-seg-stress { background: var(--surface-strong); color: #9a1f17; box-shadow: var(--shadow-md); }
#cavIhdFoundationsTopicContent .ihd-se-input:focus-visible ~ .ihd-se-switch { outline: 2px solid var(--accent); outline-offset: 2px; }

/* SVG pieces */
#cavIhdFoundationsTopicContent .ihd-se-lumen { fill: #e0635c; }
#cavIhdFoundationsTopicContent .ihd-se-feed, #cavIhdFoundationsTopicContent .ihd-se-lead-line { stroke: #94a3b8; stroke-width: 2; }
#cavIhdFoundationsTopicContent .ihd-se-myo { fill: #f1c9b6; stroke: rgba(15, 23, 42, 0.12); stroke-width: 1; }
#cavIhdFoundationsTopicContent .ihd-se-ischemia { fill: #000; opacity: 0; transition: opacity .3s ease; }
#cavIhdFoundationsTopicContent .ihd-se-svg-label { fill: #334155; font-size: 12px; font-weight: 700; }
#cavIhdFoundationsTopicContent .ihd-se-demand { fill: #9a1f17; font-size: 12px; font-weight: 800; opacity: 0; transition: opacity .25s ease; }
#cavIhdFoundationsTopicContent .ihd-se-ecg-base { stroke: #cbd5e1; stroke-width: 1.5; }
#cavIhdFoundationsTopicContent .ihd-se-ecg-wave { fill: none; stroke: #111111; stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
#cavIhdFoundationsTopicContent .ihd-se-st { transition: transform .3s ease; }
#cavIhdFoundationsTopicContent .ihd-se-sttag-rest { fill: #475569; font-size: 12px; font-weight: 800; }
#cavIhdFoundationsTopicContent .ihd-se-sttag-stress { fill: #9a1f17; font-size: 12px; font-weight: 800; display: none; }

/* state changes on Stress (checked) */
#cavIhdFoundationsTopicContent .ihd-se-input:checked ~ .ihd-se-figcard .ihd-se-st { transform: translateY(13px); }
#cavIhdFoundationsTopicContent .ihd-se-input:checked ~ .ihd-se-figcard .ihd-se-ischemia { opacity: 0.5; }
#cavIhdFoundationsTopicContent .ihd-se-input:checked ~ .ihd-se-figcard .ihd-se-demand { opacity: 1; }
#cavIhdFoundationsTopicContent .ihd-se-input:checked ~ .ihd-se-figcard .ihd-se-sttag-rest { display: none; }
#cavIhdFoundationsTopicContent .ihd-se-input:checked ~ .ihd-se-figcard .ihd-se-sttag-stress { display: inline; }

/* captions swap with state */
#cavIhdFoundationsTopicContent .ihd-se-cap-stress { display: none; }
#cavIhdFoundationsTopicContent .ihd-se-input:checked ~ .ihd-se-figcard .ihd-se-cap-rest { display: none; }
#cavIhdFoundationsTopicContent .ihd-se-input:checked ~ .ihd-se-figcard .ihd-se-cap-stress { display: block; }

/* reading + pharm + safety cards */
#cavIhdFoundationsTopicContent .ihd-se-reading-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 0; }
#cavIhdFoundationsTopicContent .ihd-se-card { background: #ffffff; border: 1px solid rgba(15, 23, 42, 0.10); border-radius: 14px; padding: 14px 16px; color: #111111; }
#cavIhdFoundationsTopicContent .ihd-se-card-lead { font-size: 14.5px; font-weight: 800; color: #111111; margin-bottom: 5px; display: flex; align-items: center; gap: 7px; flex-wrap: wrap; }
#cavIhdFoundationsTopicContent .ihd-se-card p { font-size: 14px; line-height: 1.5; color: #111111; margin: 0; }
#cavIhdFoundationsTopicContent .ihd-se-card-dep { border-left: 4px solid var(--accent); }
#cavIhdFoundationsTopicContent .ihd-se-card-elev { border-left: 4px solid #9a1f17; }
#cavIhdFoundationsTopicContent .ihd-se-pharm { margin-top: 14px; }
#cavIhdFoundationsTopicContent .ihd-se-safety { display: flex; gap: 12px; align-items: flex-start; margin-top: 14px; background: rgba(214, 69, 61, 0.08); border: 1px solid rgba(214, 69, 61, 0.45); border-radius: 14px; padding: 14px 16px; }
#cavIhdFoundationsTopicContent .ihd-se-safety-icon { font-size: 20px; line-height: 1.2; flex: none; }
#cavIhdFoundationsTopicContent .ihd-se-safety p { color: #111111; font-size: 14px; line-height: 1.5; margin: 0; }

@media (max-width: 760px) {
    #cavIhdFoundationsTopicContent .ihd-se-reading-grid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
    #cavIhdFoundationsTopicContent .ihd-se-st,
    #cavIhdFoundationsTopicContent .ihd-se-ischemia,
    #cavIhdFoundationsTopicContent .ihd-se-demand,
    #cavIhdFoundationsTopicContent .ihd-se-seg { transition: none; }
}