/* ============================================================
   CAV PATHOLOGY · IHD · Page 5 §4 Hibernation vs Stunning.
   Scoped to #cavIhdManagementTopicContent. COMPACT compare: a shared
   banner, a small 3-column table whose two column HEADERS double as the
   toggle (both columns visible, active emphasized), a tiny duration cue,
   predict-then-reveal, and a hyper pearl. Sized to content — not a
   page-filling graph. All reader text #111.
   ============================================================ */

#cavIhdManagementTopicContent .hs { display: grid; gap: 14px; }

/* shared (both viable/reversible) banner */
#cavIhdManagementTopicContent .hs-shared {
    font-size: 13.5px; color: #111111; line-height: 1.5; padding: 10px 13px; border-radius: 10px;
    background: color-mix(in srgb, #0f7a4a 8%, #fff); border: 1px solid color-mix(in srgb, #0f7a4a 28%, #fff);
}
#cavIhdManagementTopicContent .hs-shared strong { color: #111111; }

/* the compare table — label col + two mode cols */
#cavIhdManagementTopicContent .hs-table {
    display: grid; grid-template-columns: minmax(96px, .7fr) 1fr 1fr; gap: 0;
    border: 1px solid rgba(15, 23, 42, .14); border-radius: 12px; overflow: hidden;
}
#cavIhdManagementTopicContent .hs-corner { background: #fff; }
#cavIhdManagementTopicContent .hs-colhead {
    appearance: none; cursor: pointer; font: inherit; font-size: 14px; font-weight: 850; color: #111111;
    display: flex; align-items: center; justify-content: center; gap: 7px; padding: 10px 8px;
    background: var(--surface-soft, #f3f4f6); border: none; border-left: 1px solid rgba(15, 23, 42, .12);
}
#cavIhdManagementTopicContent .hs-head-ic { font-size: 16px; }
#cavIhdManagementTopicContent .hs-colhead:focus-visible { outline: 2px solid var(--mi-accent, #9a1f17); outline-offset: -2px; }

#cavIhdManagementTopicContent .hs-rowlabel {
    font-size: 12.5px; font-weight: 800; color: #111111; padding: 10px 10px; background: rgba(15, 23, 42, .025);
    border-top: 1px solid rgba(15, 23, 42, .1); display: flex; align-items: center;
}
#cavIhdManagementTopicContent .hs-cell {
    padding: 10px 11px; border-top: 1px solid rgba(15, 23, 42, .1); border-left: 1px solid rgba(15, 23, 42, .12);
    display: grid; gap: 6px; align-content: start;
}
#cavIhdManagementTopicContent .hs-cell-txt { font-size: 13px; color: #111111; line-height: 1.45; }
#cavIhdManagementTopicContent .hs-cell-txt strong { color: #111111; }

/* duration cue bars */
#cavIhdManagementTopicContent .hs-bar { height: 7px; border-radius: 999px; background: var(--mi-accent, #9a1f17); opacity: .5; }
#cavIhdManagementTopicContent .hs-bar-short { width: 22%; }
#cavIhdManagementTopicContent .hs-bar-long { width: 92%; }

/* active-column emphasis driven by the toggle */
#cavIhdManagementTopicContent .hs-table[data-hs-mode="stunning"] .hs-colhead.hs-col-stun,
#cavIhdManagementTopicContent .hs-table[data-hs-mode="hibernation"] .hs-colhead.hs-col-hib {
    background: var(--mi-accent, #9a1f17); color: #fff;
}
#cavIhdManagementTopicContent .hs-table[data-hs-mode="stunning"] .hs-cell.hs-col-stun,
#cavIhdManagementTopicContent .hs-table[data-hs-mode="hibernation"] .hs-cell.hs-col-hib {
    background: color-mix(in srgb, var(--mi-accent, #9a1f17) 8%, #fff);
}
#cavIhdManagementTopicContent .hs-table[data-hs-mode="stunning"] .hs-cell.hs-col-stun .hs-cell-txt,
#cavIhdManagementTopicContent .hs-table[data-hs-mode="hibernation"] .hs-cell.hs-col-hib .hs-cell-txt { font-weight: 650; }
#cavIhdManagementTopicContent .hs-table[data-hs-mode="stunning"] .hs-cell.hs-col-stun .hs-bar,
#cavIhdManagementTopicContent .hs-table[data-hs-mode="hibernation"] .hs-cell.hs-col-hib .hs-bar { opacity: 1; }
/* dim the inactive column a touch (still fully legible) */
#cavIhdManagementTopicContent .hs-table[data-hs-mode="stunning"] .hs-cell.hs-col-hib,
#cavIhdManagementTopicContent .hs-table[data-hs-mode="hibernation"] .hs-cell.hs-col-stun { opacity: .82; }

/* predict-then-reveal */
#cavIhdManagementTopicContent .hs-predict { display: grid; gap: 10px; }
#cavIhdManagementTopicContent .hs-predict-row { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
#cavIhdManagementTopicContent .hs-q { margin: 0; font-size: 13.5px; color: #111111; line-height: 1.45; flex: 1 1 320px; }
#cavIhdManagementTopicContent .hs-reveal {
    appearance: none; cursor: pointer; font: inherit; font-size: 12.5px; font-weight: 800; color: #fff;
    background: var(--mi-accent, #9a1f17); border: none; border-radius: 999px; padding: 6px 16px; flex: none;
}
#cavIhdManagementTopicContent .hs-reveal:hover { filter: brightness(1.06); }
#cavIhdManagementTopicContent .hs-a { margin: 0; font-size: 13.5px; color: #111111; line-height: 1.45; flex: 1 1 100%; }
#cavIhdManagementTopicContent .hs-a[hidden] { display: none; }
#cavIhdManagementTopicContent .hs-a strong { color: var(--mi-accent, #9a1f17); }

/* pearl */
#cavIhdManagementTopicContent .hs-pearl {
    display: grid; gap: 8px; padding: 13px 15px; border-radius: 12px;
    background: color-mix(in srgb, var(--mi-accent, #9a1f17) 8%, #fff); border: 1px solid color-mix(in srgb, var(--mi-accent, #9a1f17) 22%, #fff);
}
#cavIhdManagementTopicContent .hs-pearl-head { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
#cavIhdManagementTopicContent .hs-pearl-label { font-size: 15px; font-weight: 850; color: #111111; }
#cavIhdManagementTopicContent .hs-pearl p { margin: 0; font-size: 14px; color: #111111; line-height: 1.55; }
#cavIhdManagementTopicContent .hs-pearl p strong { color: #111111; }

/* cross-links */
#cavIhdManagementTopicContent .hs-xlinks { display: flex; flex-wrap: wrap; gap: 10px; }
#cavIhdManagementTopicContent .hs-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; text-align: left;
}
#cavIhdManagementTopicContent .hs-xlink:hover { background: color-mix(in srgb, var(--mi-accent, #9a1f17) 12%, #fff); }

@media (max-width: 560px) {
    #cavIhdManagementTopicContent .hs-rowlabel { font-size: 11.5px; padding: 8px 7px; }
    #cavIhdManagementTopicContent .hs-cell { padding: 8px 8px; }
    #cavIhdManagementTopicContent .hs-cell-txt { font-size: 12px; }
}