/* ============================================================
   CAV PATHOLOGY · IHD · §1 Clinical Features & Silent MI.
   Scoped to #cavIhdMiClinicalTopicContent. A designed card matching
   the Page 3 cascade pattern: tinted header band, flat labeled beats,
   tinted board-pearl footer. ONE card level, no nested boxes.
   Single accent via --mi-accent; all reader text #111.
   ============================================================ */

#cavIhdMiClinicalTopicContent .mcf-card {
    background: #fff; border: 1px solid rgba(15, 23, 42, .12); border-radius: 18px;
    box-shadow: 0 6px 18px rgba(15, 23, 42, .05);
}
/* round the tinted header corners directly (card no longer clips, so hover
   tooltips inside the card are never cut off) */

/* ---- header band ---- */
#cavIhdMiClinicalTopicContent .mcf-head {
    display: grid; gap: 8px; padding: 16px 18px; border-radius: 18px 18px 0 0;
    background: color-mix(in srgb, var(--mi-accent, #9a1f17) 9%, #fff);
    border-bottom: 1px solid color-mix(in srgb, var(--mi-accent, #9a1f17) 18%, #fff);
}
#cavIhdMiClinicalTopicContent .mcf-kicker {
    display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 850;
    letter-spacing: .02em; text-transform: uppercase; color: var(--mi-accent, #9a1f17);
}
#cavIhdMiClinicalTopicContent .mcf-ic { font-size: 18px; }
#cavIhdMiClinicalTopicContent .mcf-essence { margin: 0; font-size: 15px; font-weight: 600; color: #111111; line-height: 1.5; }
#cavIhdMiClinicalTopicContent .mcf-essence em { font-style: italic; font-weight: 800; }

/* ---- body + labeled beats ---- */
#cavIhdMiClinicalTopicContent .mcf-body { display: grid; gap: 14px; padding: 16px 18px; }
#cavIhdMiClinicalTopicContent .mcf-beat {
    display: grid; gap: 10px; padding: 14px 16px;
    background: color-mix(in srgb, var(--mi-accent, #9a1f17) 3%, #fff);
    border: 1px solid rgba(15, 23, 42, .12); border-left: 3px solid color-mix(in srgb, var(--mi-accent, #9a1f17) 40%, #fff);
    border-radius: 14px;
}
#cavIhdMiClinicalTopicContent .mcf-beat-label {
    display: flex; align-items: center; flex-wrap: wrap; gap: 10px;
    font-size: 17.5px; font-weight: 850; color: #111111; letter-spacing: -.01em;
}

/* typical presentation: list beside the radiation diagram */
#cavIhdMiClinicalTopicContent .mcf-present { display: flex; gap: 18px; align-items: flex-start; flex-wrap: wrap; }
#cavIhdMiClinicalTopicContent .mcf-list { flex: 1 1 280px; margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
#cavIhdMiClinicalTopicContent .mcf-list li { position: relative; padding-left: 20px; color: #111111; font-size: 14px; line-height: 1.5; }
#cavIhdMiClinicalTopicContent .mcf-list li::before {
    content: ""; position: absolute; left: 4px; top: 8px; width: 7px; height: 7px; border-radius: 50%;
    background: var(--mi-accent, #9a1f17);
}
#cavIhdMiClinicalTopicContent .mcf-list strong { color: #111111; }

/* radiation diagram (hoverable zones + popup) */
#cavIhdMiClinicalTopicContent .mcf-fig-wrap { position: relative; flex: 0 0 auto; align-self: flex-start; }
#cavIhdMiClinicalTopicContent .mcf-fig { display: block; width: 178px; height: auto; }
#cavIhdMiClinicalTopicContent .mcf-torso { fill: #cdd3dc; }
#cavIhdMiClinicalTopicContent .mcf-zone { fill: var(--mi-accent, #9a1f17); opacity: .3; }
#cavIhdMiClinicalTopicContent .mcf-heart { fill: var(--mi-accent, #9a1f17); }
#cavIhdMiClinicalTopicContent .mcf-ray { fill: none; stroke: var(--mi-accent, #9a1f17); stroke-width: 1.6; stroke-dasharray: 3 3; opacity: .75; }
#cavIhdMiClinicalTopicContent .mcf-figlabel { font-size: 8px; font-weight: 700; fill: #111111; }
#cavIhdMiClinicalTopicContent .mcf-hot { cursor: help; transition: opacity .12s ease; }
#cavIhdMiClinicalTopicContent .mcf-zone.mcf-hot:hover,
#cavIhdMiClinicalTopicContent .mcf-zone.mcf-hot:focus-visible { opacity: .62; outline: none; }
#cavIhdMiClinicalTopicContent .mcf-heart.mcf-hot:hover,
#cavIhdMiClinicalTopicContent .mcf-heart.mcf-hot:focus-visible { opacity: .8; outline: none; }
#cavIhdMiClinicalTopicContent .mcf-fig-tip {
    position: absolute; left: 50%; top: 50%; transform: translate(-50%, -108%); max-width: 184px; z-index: 6; pointer-events: none;
    background: #fff; color: #111111; border: 1px solid rgba(15, 23, 42, .2); border-left: 3px solid var(--mi-accent, #9a1f17);
    border-radius: 10px; padding: 8px 11px; font-size: 12.5px; line-height: 1.4; font-weight: 600;
    box-shadow: 0 8px 22px rgba(15, 23, 42, .16); text-align: left;
}
#cavIhdMiClinicalTopicContent .mcf-fig-tip[hidden] { display: none; }
#cavIhdMiClinicalTopicContent .mcf-fig-tip strong { color: var(--mi-accent, #9a1f17); font-weight: 850; }

/* ---- split rows rendered as a compact 2-column table ---- */
#cavIhdMiClinicalTopicContent .mcf-split { display: grid; gap: 0; }
#cavIhdMiClinicalTopicContent .mcf-split-row {
    display: grid; grid-template-columns: minmax(132px, .7fr) 1.7fr; align-items: baseline;
}
#cavIhdMiClinicalTopicContent .mcf-split-row + .mcf-split-row { border-top: 1px solid rgba(15, 23, 42, .12); }
#cavIhdMiClinicalTopicContent .mcf-split-term { font-weight: 850; color: #111111; font-size: 15.5px; padding: 9px 14px 9px 0; }
#cavIhdMiClinicalTopicContent .mcf-split-desc {
    color: #111111; font-size: 14px; line-height: 1.5; padding: 9px 0 9px 16px;
    border-left: 1px solid rgba(15, 23, 42, .16);
}
#cavIhdMiClinicalTopicContent .mcf-split-desc strong { color: #111111; }
#cavIhdMiClinicalTopicContent .mcf-note { margin: 0; font-size: 13.5px; color: #111111; line-height: 1.5; }

/* ---- board-pearl footer ---- */
#cavIhdMiClinicalTopicContent .mcf-pearl {
    display: grid; gap: 8px; padding: 14px 18px;
    background: color-mix(in srgb, var(--mi-accent, #9a1f17) 8%, #fff);
    border-top: 1px solid color-mix(in srgb, var(--mi-accent, #9a1f17) 22%, #fff);
}
#cavIhdMiClinicalTopicContent .mcf-pearl-head { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
#cavIhdMiClinicalTopicContent .mcf-pearl-headline { font-size: 14px; font-weight: 800; color: var(--mi-accent, #9a1f17); }
#cavIhdMiClinicalTopicContent .mcf-pearl p { margin: 0; color: #111111; font-size: 14.5px; line-height: 1.55; }
#cavIhdMiClinicalTopicContent .mcf-pearl p strong { color: #111111; }

/* ---- cross-links ---- */
#cavIhdMiClinicalTopicContent .mcf-xlinks { display: flex; flex-wrap: wrap; gap: 10px; padding: 0 18px 16px; }
#cavIhdMiClinicalTopicContent .mcf-xlink {
    appearance: none; cursor: pointer; font: inherit; font-size: 12.5px; font-weight: 800;
    color: var(--mi-accent, #9a1f17); background: #fff; border: 1.5px solid var(--mi-accent, #9a1f17);
    border-radius: 999px; padding: 6px 14px;
}
#cavIhdMiClinicalTopicContent .mcf-xlink:hover { background: color-mix(in srgb, var(--mi-accent, #9a1f17) 12%, #fff); }

@media (max-width: 640px) {
    #cavIhdMiClinicalTopicContent .mcf-split-row { grid-template-columns: 1fr; }
    #cavIhdMiClinicalTopicContent .mcf-split-term { padding: 9px 0 2px; }
    #cavIhdMiClinicalTopicContent .mcf-split-desc { border-left: none; padding: 0 0 9px; }
}
