/**
* MoodUS Accessibility Remediation
*
* WCAG 2.1 SC 1.4.3 Contrast (Minimum), Level AA.
* Normal text needs 4.5:1. Large text - 18.66px bold or 24px normal and up -
* needs 3:1. Every ratio below was measured with axe-core against the actual
* rendered background, and every replacement clears the threshold with margin
* rather than scraping past it.
*
* Shipped as a real stylesheet on purpose: the Customizer "Additional CSS"
* store escapes the child combinator, which silently breaks any rule using >.
*
* Doubled class selectors (.foo.foo) appear where the colour they override
* comes from the theme's inline Customizer accent block. That block is printed
* late in , so matching its specificity is not enough to win - one extra
* class is the smallest reliable increment, and it avoids !important.
*/
/* ---------------------------------------------------------------------------
* 1. Attachment file sizes - "244 kB"
* Was #8a949b on #ffffff = 3.09:1 at 12.8px and 14.6px. Fails.
* Now #5c666e on #ffffff = 5.86:1. Passes.
* 675 of the site's 829 contrast failures were this one colour.
* ------------------------------------------------------------------------ */
.lsvr_document-attachments-widget__item-filesize.lsvr_document-attachments-widget__item-filesize,
.lsvr_document-attachments-widget__item-filetype.lsvr_document-attachments-widget__item-filetype,
.post__attachment-filesize.post__attachment-filesize,
.post__attachment-filetype.post__attachment-filetype {
color: #5c666e;
}
/* ---------------------------------------------------------------------------
* 2. Brand teal used behind white text
* Was #ffffff on #008c9a = 4.02:1. Fails at every size used here: 18px
* normal, 18px bold, 15.75px bold and 13.5px bold are all below the 18.66px
* bold threshold for large text, so all of them need 4.5:1.
* Now #ffffff on #007a85 = 5.04:1. Passes.
*
* Covers the office sub-navigation panel and the theme button. The same
* teal elsewhere (search button, back-to-top, mobile menu bar) already
* passed; darkening those slightly only improves them.
*
* Alternative single-setting fix: change the theme accent colour in the
* Customizer from #008c9a to #007a85. This rule exists so the fix ships as
* versioned, reversible code instead of a site option.
* ------------------------------------------------------------------------ */
.lsvr-townpress-menu-widget__nav.lsvr-townpress-menu-widget__nav,
.lsvr-button.lsvr-button {
background-color: #007a85;
border-color: #007a85;
}
/* ---------------------------------------------------------------------------
* 3. Teal used as text on the light grey panel
* Was #008c9a on #f2f2f2 = 3.59:1 at 15.75px. Fails.
* Now #00727d on #f2f2f2 = 5.06:1. Passes.
*
* The colour comes from `.navigation.pagination a` in the theme's inline
* accent block, so the override has to carry that structure to outrank it.
* Applied to every pagination link rather than just next/prev - they are
* the same control and should not drift apart.
* ------------------------------------------------------------------------ */
.navigation.pagination a.page-numbers {
color: #00727d;
}
/* ---------------------------------------------------------------------------
* 4. Calendar - day numbers and event pills
* Was #c8902f on #ffffff = 2.80:1 at 17.1px bold. Fails.
* Was #c8902f on #f5f3ee = 2.52:1 at 14.4px bold. Fails.
* Now #8a6314 on #ffffff = 5.42:1 and on #f5f3ee = 4.89:1. Passes.
*
* Was #aab0b8 on #f6f5f2 = 2.00:1 - adjacent-month day numbers.
* Now #5f656c on #f6f5f2 = 5.40:1. Still visibly muted against the #222
* of in-month days, but now legible.
*
* Was #7a828d on #f5f3ee = 3.50:1 - event titles inside a day pill.
* Now #5c666e on #f5f3ee = 5.29:1. Passes.
* ------------------------------------------------------------------------ */
.govcal-cal__daynum {
color: #8a6314;
}
/* Days the calendar dims - previous/next month and dates already past. Dimmed
* is fine; unreadable is not. These are still links to a real day view.
*
* Was #aab0b8 on #f6f5f2 = 2.00:1 (past) and #b6bcc4 = 1.79:1 (other month).
* Now #5f656c = 5.40:1 for both.
*
* The doubled trailing class outranks the plugin's own
* `.is-past:not(.is-today) .govcal-cal__daynum`, which is already four classes
* deep. */
.govcal-cal__cell.is-past .govcal-cal__daynum.govcal-cal__daynum,
.govcal-cal__cell.is-past:not(.is-today) .govcal-cal__daynum.govcal-cal__daynum,
.govcal-cal__cell.is-outmonth .govcal-cal__daynum.govcal-cal__daynum {
color: #5f656c;
}
.govcal-cal__pilltime.govcal-cal__pilltime,
.govcal-cal__mldate.govcal-cal__mldate {
color: #8a6314;
}
/* Event titles inside a day pill. Past days get their own dimmed rule four
* classes deep, so the override has to reach past that one too. */
.govcal-cal__pilltitle.govcal-cal__pilltitle,
.govcal-cal__cell.is-past .govcal-cal__pilltitle.govcal-cal__pilltitle,
.govcal-cal__cell.is-past:not(.is-today) .govcal-cal__pilltitle.govcal-cal__pilltitle {
color: #5c666e;
}
/* ---------------------------------------------------------------------------
* 4b. Calendar - single event page and mini month widget
* Was #c8902f on #ffffff = 2.80:1 (pager direction, ICS subscribe link).
* Now #8a6314 on #ffffff = 5.42:1. Passes.
*
* Was #c2c7cf on #ffffff = 1.69:1 at 11px - adjacent-month days in the
* mini calendar, the worst ratio anywhere on the site.
* Now #5f656c on #ffffff = 5.86:1. Passes.
* ------------------------------------------------------------------------ */
.govcal-single__pagerdir.govcal-single__pagerdir,
.govcal-related__ics.govcal-related__ics {
color: #8a6314;
}
.govcal-mini__day.is-out {
color: #5f656c;
}
/* ---------------------------------------------------------------------------
* 4c. Warning alert banner
* Was #d40041 on #ffdfe0 = 4.35:1 at 18px. Fails by a whisker, on the one
* component whose whole job is to be read - currently a fraud warning.
* Now #c1003b on #ffdfe0 = 5.07:1. Passes.
*
* The link inside it was #1e73be on #ffdfe0 = 3.97:1.
* Now #17578f on #ffdfe0 = 6.04:1. Passes, and stays clearly a link.
*
* Scoped to the warning variant so the info and success variants, which sit
* on different backgrounds, keep their own colours.
* ------------------------------------------------------------------------ */
.lsvr-alert-message--warning,
.lsvr-alert-message--warning .lsvr-alert-message__text,
.lsvr-alert-message--warning .lsvr-alert-message__title {
color: #c1003b;
}
.lsvr-alert-message--warning a {
color: #17578f;
}
/* ---------------------------------------------------------------------------
* 5. Calendar "See full calendar" link on the grey panel
* Was #1e73be on #f2f2f2 = 4.41:1. Fails by a hair.
* Now #1a6aae on #f2f2f2 = 5.05:1. Passes.
* The same blue stays put on white, where it is already 4.94:1.
* ------------------------------------------------------------------------ */
.govcal-seeall a,
.govcal-seeall > a {
color: #1a6aae;
}
/* ---------------------------------------------------------------------------
* 6. WordPress core colour palette used as a background behind white text
* Was #ffffff on #00d084 = 2.02:1 at 20px bold (needs 3:1 - large text).
* Now #ffffff on #00875a = 4.55:1. Passes, and clears the stricter 4.5:1
* bar too, so the same block stays compliant if the text is ever resized.
*
* Was #ffffff on #0693e3 = 3.33:1 at 18px normal (needs 4.5:1).
* Now #ffffff on #0b6fab = 5.42:1. Passes.
*
* These are editor palette choices, so fixing the palette rather than the
* two blocks that currently use it keeps future content compliant by default.
*
* WordPress sets these backgrounds with `var(--wp--preset--color--*)
* !important`, so overriding the class is useless - the custom property is
* the only thing worth changing. `html:root` outranks core's `:root` no
* matter which stylesheet the browser reads last.
* ------------------------------------------------------------------------ */
html:root {
--wp--preset--color--vivid-green-cyan: #00875a;
--wp--preset--color--vivid-cyan-blue: #0b6fab;
}
/* ---------------------------------------------------------------------------
* 7. WCAG 1.4.1 Use of Colour, Level A
* Links sitting inside a run of text were distinguished from that text by
* colour alone, so anyone who cannot see the colour difference cannot find
* them. Underlining is the conventional non-colour cue.
*
* Scoped to links inside paragraphs. Buttons, navigation and cards carry
* their own affordances and are left alone.
* ------------------------------------------------------------------------ */
.textwidget p a:not(.lsvr-button):not(.wp-block-button__link):not(.btn),
.post__content p a:not(.lsvr-button):not(.wp-block-button__link):not(.btn),
.entry-content p a:not(.lsvr-button):not(.wp-block-button__link):not(.btn) {
text-decoration: underline;
}
/* ---------------------------------------------------------------------------
* 8. Buttons unwrapped by the nested-interactive fix
* class-markup.php rewrites into
* ... Restore the inline-block presentation
* the button element used to provide, so nothing shifts visually.
* ------------------------------------------------------------------------ */
span.btn {
display: inline-block;
}