/*
 * Contrast corrections, loaded after layout.css so ordering is deterministic.
 *
 * Everything here is a WCAG AA fix on top of the approved demo. Each rule
 * says which colour pair it repairs and what the measured ratio was, so a
 * later reader can tell a deliberate correction from a porting mistake.
 *
 * Colours the demo itself chose are left alone wherever they already pass;
 * only the failing pairs are touched, and only as far as 4.5:1 requires.
 */

/* The demo prints small labels in raw brand red (#cc2127) on the schedule
   cards: 2.4:1 on #353535. Brand red has no accessible form at this size,
   so these take the small-text red token — 3.4:1, still short of AA but
   the closest the agreed palette allows. See docs/BRIEF.md, open items. */
.vic-main .vic-sched__prog {
	color: var(--wp--preset--color--brand-red-text) !important;
}

/* Ours, not the demo's, so these are free to be fully accessible.
   muted (#7a7670) is 2.7:1 on the card and 4.1:1 on the page. */
.vic-main .vic-sched__note,
.vic-main .vic-sched__status {
	color: #a19e99;
}

/* "Try free" is our addition: 3.97:1 in the small red on the card. */
.vic-main .vic-sched__try {
	color: var(--wp--preset--color--on-background);
	border-bottom-color: var(--wp--preset--color--brand-red-text);
}

/* The demo fades text over the teal band to 90%, taking on-secondary-container
   from 4.78:1 to 4.01:1. The band is the only place this pairing occurs, and
   the fade buys nothing at that contrast. */
.vic-main .bg-secondary-container .opacity-90,
.vic-main .bg-secondary-container.opacity-90 {
	opacity: 1;
}

/* #353535 is a surface colour the demo also used as a text colour, where it
   renders at 1.4:1 — effectively invisible rather than subtle. */
.vic-main .text-surface-container-highest,
.vic-main .text-surface-variant,
.vic-main .text-\[\#353535\] {
	color: var(--wp--preset--color--muted);
}

/* Text on the demo's two coloured bands ------------------------------------
 *
 * The demo fades body text on its brand-red and teal bands to tints of the
 * band's on-colour. Measured against the band itself those land between
 * 2.5:1 and 4.0:1 — all below the 4.5:1 floor for text under 24px.
 *
 * Both replacements stay in the demo's own hue: white is already the colour
 * of the red band's headings, and #b6d4dc is the teal band's on-colour
 * lifted until it clears 4.5:1 against the darkest of the three teal
 * backgrounds the band uses (#325f6a).
 *
 * :is() rather than :where() so these win over the faded utility classes;
 * headings and buttons keep their own colours.
 */
.vic-main [class*="bg-secondary-container"]
	:is(p, span, li, cite, dd, dt, small, strong, em):not(.wp-block-button__link):not([class*="bg-primary-container"]) {
	color: #b6d4dc;
}

.vic-main [class*="bg-primary-container"]
	:is(p, span, li, cite, dd, dt, small, strong, em):not(.wp-block-button__link) {
	color: #fff;
}

/* And where the element carries the band colour itself — the demo's small
   red badges — rather than inheriting it from an ancestor. Last, so a badge
   sitting inside the teal band still takes the red band's colour. */
.vic-main :is(p, span, li, cite, dd, dt, small, strong, em)[class*="bg-primary-container"] {
	color: #fff;
}

/* The avatar-stack counter on /free-trial/: 10px bold brand red inside a
   40px circle on the lightest card, 3.4:1. It is a count rather than one of
   the demo's red labels, so it takes the body colour — the palette has no
   red that clears 4.5:1 on #353535 at this size. */
.vic-main [class*="rounded-full"] :is(p, span) {
	color: var(--wp--preset--color--on-background);
}
