/* ============================================================
   GIN Physiology subject and topic styles.

   This file is a SUPPLEMENT to the global Micro-Kit, not a
   replacement for it. Pages compose mk- classes; the two rules
   below exist only because the kit alone gets them wrong, and
   they are the same two the GIN Pharmacology supplement carries
   (see pharmacology.css). Nothing here is per-page.
   ============================================================ */

/* 1 — mk-hue-* only define the pill tokens, so a hued card has no
       visible hue. Spend the token on a left border. */
.gin-phys .mk-factor[class*="mk-hue-"],
.gin-phys .mk-card[class*="mk-hue-"] {
    border-left: 4px solid var(--mk-pill-bd, #cbd5e1);
}

/* 2 — The kit sets a titled-list's leading strong to 14.5px, BELOW the
       15px body text, which reads as a broken title. A title must
       always outrank the text under it. */
.gin-phys .mk-symptoms > li > strong:first-of-type,
.gin-phys .mk-titled-list > li > strong:first-of-type,
.gin-phys .mk-titled-list > li > .cav-term:first-of-type {
    font-size: 15.75px;
    font-weight: 800;
    color: #111111;
}

/* 3 — The kit sets .mk-lead to 15px, identical to .mk-body, so a section
       lead does not read as a lead. Same fix .gin-pharm carries. */
.gin-phys .mk-lead {
    font-size: 16.5px;
    line-height: 1.55;
    color: #111111;
}

/* ================================================================
   4 — NO DEAD CELL AT THE END OF A CARD GRID.

   A 3-column grid holding 5 cards renders 3 + 2 and leaves a hole in
   the bottom-right corner; a 2-column grid holding 3 leaves one at the
   right. Chris flagged both as "awkward white space".

   Fix: run the grid on a finer track count (6 for --3, 4 for --2) with
   each card spanning 2, so a short last row can be widened to fill.
     · a LONE trailing card spans the whole row
     · TWO trailing cards in a 3-col grid take half the row each
   Cards are never merged and the gap is preserved — only a short
   trailing row is elongated, which is the settled house rule.

   Scoped to .gin-phys so no other module's grids shift.
   ================================================================ */
.gin-phys .mk-grid--3 {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}
.gin-phys .mk-grid--3 > * { grid-column: span 2; }

/* 3-col: last row holds ONE card → it spans the full row */
.gin-phys .mk-grid--3 > :last-child:nth-child(3n + 1) { grid-column: span 6; }

/* 3-col: last row holds TWO cards → half the row each */
.gin-phys .mk-grid--3 > :nth-last-child(2):nth-child(3n + 1),
.gin-phys .mk-grid--3 > :nth-last-child(2):nth-child(3n + 1) ~ * { grid-column: span 3; }

.gin-phys .mk-grid--2 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}
.gin-phys .mk-grid--2 > * { grid-column: span 2; }

/* 2-col: a lone trailing card spans the full row */
.gin-phys .mk-grid--2 > :last-child:nth-child(2n + 1) { grid-column: span 4; }

/* Below the kit's own breakpoint everything is a single column anyway, so
   release the spans rather than fighting them. */
@media (max-width: 640px) {
    .gin-phys .mk-grid--3,
    .gin-phys .mk-grid--2 { grid-template-columns: minmax(0, 1fr); }
    .gin-phys .mk-grid--3 > *,
    .gin-phys .mk-grid--2 > *,
    .gin-phys .mk-grid--3 > :last-child:nth-child(3n + 1),
    .gin-phys .mk-grid--3 > :nth-last-child(2):nth-child(3n + 1),
    .gin-phys .mk-grid--3 > :nth-last-child(2):nth-child(3n + 1) ~ *,
    .gin-phys .mk-grid--2 > :last-child:nth-child(2n + 1) { grid-column: auto; }
}

/* ============================================================
   5 — SOURCED PHOTOS RENDER AT FIGURE WIDTH, NOT AS A 168px THUMB

   path-figure.css (RAR Pathology, but scoped to BOTH .rar-topic-content
   and .gin-topic-content) pins `.atl-figure__btn .atl-figure__img` to
   height:168px with no width constraint, which letterboxes a photo
   inside its button. It loads AFTER this file in index.html, so at equal
   specificity it wins — three classes each.

   So this carries a fourth class (.atl-figure) purely for specificity,
   which is exactly the fix GIN Pharmacology already uses for the same
   collision. Keep them in step: if one changes, change both.

   The ⤢ Zoom lightbox still opens the image at native resolution, so
   nothing is lost by sizing the inline copy to its column — which is what
   a histology slide beside a card grid needs.
   ============================================================ */
.gin-phys .atl-figure .atl-figure__btn .atl-figure__img {
    width: 100%;
    height: auto;
}