/* Corrections to the generated designs.
 *
 * Unlike panel.js, this is NOT preview tooling - these are real layout bugs
 * that would ship. Anything here needs folding back into the final build.
 *
 * The circular credential badges in design E (and one in C) are fixed at
 * 8.5rem with 1rem of padding and 17px extra-bold type. That leaves about
 * 104px of usable width, and "Psychodynamics" is a single unbreakable
 * 14-character word needing roughly 126px, so it spills straight through the
 * dashed ring. The badges are inline-styled, hence the attribute selectors and
 * !important.
 */
/* The renderer re-serialises inline styles with spaces after the colon, so
   both spellings are matched: the source form and the rendered form. */
span[style*="border-radius:50%"][style*="dashed"],
span[style*="border-radius: 50%"][style*="dashed"] {
  width: 9.25rem !important;
  height: 9.25rem !important;
  padding: 0.85rem !important;
  font-size: 0.8125rem !important;
  letter-spacing: -0.03em !important;
  line-height: 1.12 !important;
  /* Last resort if a longer credential is added later: break rather than
     overflow. Hyphenation first so the break reads as a word break. */
  hyphens: auto;
  -webkit-hyphens: auto;
  overflow-wrap: break-word;
}

/* The role label after a testimonial's name ("Lisa T, parent") is the muted
 * grey, which works on the pale cards but not on the one with the accent
 * colour behind it: measured 3.22:1 in Calm Blue and 4.40:1 in mango, against
 * a 4.5 threshold. Using the primary colour keeps the quieter-than-the-name
 * hierarchy and passes in every scheme.
 *
 * This was missed for a while because the contrast audit only walked the home
 * page. It now walks every screen. */
li[style*="background:var(--ml-accent,"] figcaption span,
li[style*="background: var(--ml-accent,"] figcaption span {
  color: var(--ml-primary, #1C3D52) !important;
}
