/* Text highlighting, v2 (Bryan approved 14 November 2026).
 *
 * Same classes, colors and meanings as styles/highlights.css, which stays
 * published unchanged for cached pages. v2 softens the light-mode inline fills
 * from the 300-level highlighter shades to lighter tints of the same hues, so
 * a marked phrase still stands out in its category color while the text
 * around it stays crisp: dark text on every tint measures above 11:1 (WCAG
 * AAA). Caution keeps a slightly deeper tint than the others. Block emphasis
 * and dark mode are unchanged.
 */

/* Yellow highlight - key facts and insights */
.highlight {
  background-color: #fef08a;
  color: #1a1a1a;
  padding: 0.1em 0.3em;
  border-radius: 0.15rem;
}

/* Teal/cyan highlight - clinical recommendations */
.highlight-clinical {
  background-color: #a7f3e4;
  color: #1a1a1a;
  padding: 0.1em 0.3em;
  border-radius: 0.15rem;
}

/* Orange highlight - cautions and warnings (BOLDER) */
.highlight-caution {
  background-color: #fdcb9b;
  color: #1a1a1a;
  padding: 0.1em 0.3em;
  border-radius: 0.15rem;
}

/* Pink/rose highlight - critical warnings or liability */
.highlight-critical {
  background-color: #fbcfe8;
  color: #1a1a1a;
  padding: 0.1em 0.3em;
  border-radius: 0.15rem;
}

/* Purple/violet highlight - definitions or key terms */
.highlight-term {
  background-color: #ddd6fe;
  color: #1a1a1a;
  padding: 0.1em 0.3em;
  border-radius: 0.15rem;
}

/* Blue highlight - examples or case references */
.highlight-example {
  background-color: #bae6fd;
  color: #1a1a1a;
  padding: 0.1em 0.3em;
  border-radius: 0.15rem;
}

/* Lime/green highlight - classic highlighter green */
.highlight-green {
  background-color: #d9f99d;
  color: #1a1a1a;
  padding: 0.1em 0.3em;
  border-radius: 0.15rem;
}

/* Multi-line inline highlights: clone padding and rounding onto every line
   fragment. Without this, a highlight that wraps loses its left padding on
   continuation lines and its corners render square. */
.highlight,
.highlight-clinical,
.highlight-caution,
.highlight-critical,
.highlight-term,
.highlight-example,
.highlight-green {
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

/* ---------------------------------------------------------------------
   BLOCK-LEVEL EMPHASIS

   For content that must be read as a unit and cannot be compressed into a
   phrase. Compose the block class with any color class:

     ::: {.highlight-block .highlight-caution}
     A full paragraph that a reader must not skip.
     :::

   At paragraph scale the saturated inline color becomes the left border and
   the background drops to a readable tint. A block counts as one highlight
   against the chapter budget, and the one-per-paragraph rule still holds:
   do not put an inline span inside a block.
   --------------------------------------------------------------------- */

.highlight-block {
  display: block;
  margin: 1.25rem 0;
  border-radius: 0.35rem;
  border-left: 4px solid;
}

/* Compound selectors so block padding wins over the inline padding above,
   independent of source order. */
.highlight-block.highlight,
.highlight-block.highlight-clinical,
.highlight-block.highlight-caution,
.highlight-block.highlight-critical,
.highlight-block.highlight-term,
.highlight-block.highlight-example,
.highlight-block.highlight-green {
  padding: 0.85rem 1.15rem;
}

.highlight-block.highlight          { background-color: #fef9c3; border-left-color: #ca8a04; }
.highlight-block.highlight-clinical { background-color: #ccfbf1; border-left-color: #0d9488; }
.highlight-block.highlight-caution  { background-color: #ffedd5; border-left-color: #ea580c; }
.highlight-block.highlight-critical { background-color: #fce7f3; border-left-color: #db2777; }
.highlight-block.highlight-term     { background-color: #ede9fe; border-left-color: #7c3aed; }
.highlight-block.highlight-example  { background-color: #e0f2fe; border-left-color: #0284c7; }
.highlight-block.highlight-green    { background-color: #ecfccb; border-left-color: #65a30d; }

.highlight-block > :first-child { margin-top: 0; }
.highlight-block > :last-child  { margin-bottom: 0; }

/* Dark mode inline highlights.

   The previous values kept dark text (#1a1a1a) on a half-opaque wash. Over the
   dark page that wash composites to a mid tone, so the pair measured 3.37:1 to
   4.48:1 across the seven classes, all under WCAG AA. Dark text needs a light
   background, and translucency over a dark page cannot provide one, so the two
   goals do not reconcile.

   Follow the block rules below instead: a low-alpha wash carries the color and
   the text keeps the theme's own light color. Each alpha is the strongest that
   still clears 7:1 against that text, so the tint stays visible (about 2:1
   against the page) without dropping the text below AAA. */
:is([data-bs-theme="dark"], body.quarto-dark) .highlight {
  background-color: rgba(253, 224, 71, 0.26);
  color: inherit;
}

:is([data-bs-theme="dark"], body.quarto-dark) .highlight-clinical {
  background-color: rgba(94, 234, 212, 0.28);
  color: inherit;
}

:is([data-bs-theme="dark"], body.quarto-dark) .highlight-caution {
  background-color: rgba(251, 146, 60, 0.36);
  color: inherit;
}

:is([data-bs-theme="dark"], body.quarto-dark) .highlight-critical {
  background-color: rgba(249, 168, 212, 0.31);
  color: inherit;
}

:is([data-bs-theme="dark"], body.quarto-dark) .highlight-term {
  background-color: rgba(196, 181, 253, 0.31);
  color: inherit;
}

:is([data-bs-theme="dark"], body.quarto-dark) .highlight-example {
  background-color: rgba(125, 211, 252, 0.29);
  color: inherit;
}

:is([data-bs-theme="dark"], body.quarto-dark) .highlight-green {
  background-color: rgba(190, 242, 100, 0.25);
  color: inherit;
}

/* Dark mode blocks: a bright tint across a whole paragraph glares on a dark
   page. The saturated left border carries the signal, the background stays a
   low-alpha wash, and body text keeps its normal light color. Compound
   selectors outrank the inline dark rules above, so color: #1a1a1a does not
   leak into block text. */
:is([data-bs-theme="dark"], body.quarto-dark) .highlight-block.highlight,
:is([data-bs-theme="dark"], body.quarto-dark) .highlight-block.highlight-clinical,
:is([data-bs-theme="dark"], body.quarto-dark) .highlight-block.highlight-caution,
:is([data-bs-theme="dark"], body.quarto-dark) .highlight-block.highlight-critical,
:is([data-bs-theme="dark"], body.quarto-dark) .highlight-block.highlight-term,
:is([data-bs-theme="dark"], body.quarto-dark) .highlight-block.highlight-example,
:is([data-bs-theme="dark"], body.quarto-dark) .highlight-block.highlight-green {
  color: inherit;
}

:is([data-bs-theme="dark"], body.quarto-dark) .highlight-block.highlight          { background-color: rgba(253, 224, 71, 0.13); border-left-color: #facc15; }
:is([data-bs-theme="dark"], body.quarto-dark) .highlight-block.highlight-clinical { background-color: rgba(94, 234, 212, 0.13); border-left-color: #2dd4bf; }
:is([data-bs-theme="dark"], body.quarto-dark) .highlight-block.highlight-caution  { background-color: rgba(251, 146, 60, 0.15); border-left-color: #fb923c; }
:is([data-bs-theme="dark"], body.quarto-dark) .highlight-block.highlight-critical { background-color: rgba(249, 168, 212, 0.14); border-left-color: #f472b6; }
:is([data-bs-theme="dark"], body.quarto-dark) .highlight-block.highlight-term     { background-color: rgba(196, 181, 253, 0.14); border-left-color: #a78bfa; }
:is([data-bs-theme="dark"], body.quarto-dark) .highlight-block.highlight-example  { background-color: rgba(125, 211, 252, 0.14); border-left-color: #38bdf8; }
:is([data-bs-theme="dark"], body.quarto-dark) .highlight-block.highlight-green    { background-color: rgba(190, 242, 100, 0.13); border-left-color: #a3e635; }