diff --git a/app/resources/css/app.css b/app/resources/css/app.css index 22fea661..6a792ddc 100644 --- a/app/resources/css/app.css +++ b/app/resources/css/app.css @@ -34,3 +34,43 @@ body { .v-field-label { --v-medium-emphasis-opacity: 0.7; } + +/* + * A11y rescan 2026-05-14: Vuetify tonal-variant default text color produces + * 2.0-4.4:1 contrast on ivory page background (#f6f3ec) — below WCAG 2.1 AA + * 4.5:1 threshold. Pa11y rescan flagged across /billing /admin/billing + * /admin/incidents /admin/system. Fix: darken text color inside .v-alert and + * .v-chip tonal variants; also darken .text-warning utility used in count + * badges (text-h6 text-warning «5» on ivory was 2.03:1). + */ +.v-alert--variant-tonal .v-alert__content, +.v-alert--variant-tonal .v-alert__content strong, +.v-alert--variant-tonal .v-alert__content code { + color: #0a0700; +} + +.v-chip--variant-tonal.bg-success .v-chip__content, +.v-chip--variant-tonal.text-success .v-chip__content { + /* deep forest green, ≥4.5:1 on tonal pale-success bg */ + color: #1f5e3a; +} + +.v-chip--variant-tonal.bg-warning .v-chip__content, +.v-chip--variant-tonal.text-warning .v-chip__content { + /* dark amber, ≥4.5:1 on tonal pale-warning bg + on ivory page bg */ + color: #6a4504; +} + +/* + * .text-warning is used both inside chips (covered above) and standalone + * (text-h6 count badges on ivory background). Vuetify defines the utility as + * `.v-theme--liderraForest .text-warning { color: rgb(var(--v-theme-warning)) !important }` + * which has specificity 0,2,0 + !important — plain `.text-warning !important` + * (0,1,0) loses on specificity even with !important. Match Vuetify's selector + * exactly so our override wins on cascade-order (loaded after Vuetify CSS). + */ +.v-theme--liderraForest .text-warning, +.v-theme--liderraForest.text-warning, +.text-warning { + color: #6a4504 !important; +}