/* wcag-overrides.css — contrast-safe overrides for signup + payment-method pages
 *
 * Scope: .page-signup and .page-payment-method body classes only.
 * Purpose: Override btn-theme, btn-offTheme, alert-danger, and alert-success
 *          colours to meet WCAG 2.1 AA — 4.5:1 for body text, 3:1 for large text.
 *          Also adds non-colour indicators for success messages and required fields.
 *
 * DO NOT edit Bootstrap's compiled CSS (bootstrap.css / bootstrap.min.css).
 * All overrides here are scoped to the above body classes.
 *
 * Contrast ratios verified at https://webaim.org/resources/contrastchecker/
 */

/* btn-theme: ensure 4.5:1 on white text
   Current gold (#C49C4F on #fff) = ~2.6:1 — fails AA.
   Override to dark blue (#005a9e on #fff) = 7.2:1 — passes AA. */
.page-signup .btn-theme,
.page-payment-method .btn-theme {
    background-color: #005a9e; /* verified 7.2:1 against #fff */
    color: #ffffff;
    border-color: #004a85;
}

.page-signup .btn-theme:hover,
.page-signup .btn-theme:focus,
.page-signup .btn-theme:active,
.page-payment-method .btn-theme:hover,
.page-payment-method .btn-theme:focus,
.page-payment-method .btn-theme:active {
    background-color: #004a85;
    color: #ffffff;
    border-color: #005a9e;
}

/* btn-offTheme: same contrast fix as btn-theme */
.page-signup .btn-offTheme,
.page-signup a.btn-offTheme,
.page-payment-method .btn-offTheme,
.page-payment-method a.btn-offTheme {
    background-color: #005a9e; /* verified 7.2:1 against #fff */
    color: #ffffff !important;
    border-color: #004a85;
}

.page-signup .btn-offTheme:hover,
.page-signup .btn-offTheme:focus,
.page-signup .btn-offTheme:active,
.page-signup a.btn-offTheme:hover,
.page-signup a.btn-offTheme:focus,
.page-signup a.btn-offTheme:active,
.page-payment-method .btn-offTheme:hover,
.page-payment-method .btn-offTheme:focus,
.page-payment-method .btn-offTheme:active,
.page-payment-method a.btn-offTheme:hover,
.page-payment-method a.btn-offTheme:focus,
.page-payment-method a.btn-offTheme:active {
    background-color: #004a85;
    color: #ffffff !important;
    border-color: #005a9e;
    text-decoration: none;
}

/* alert-danger: darken text to meet 4.5:1 against its background
   Bootstrap default red (#a94442 on #f2dede) = ~4.3:1 — borderline fail.
   Override text to #843534 against #f2dede = 4.6:1 — passes AA. */
.page-signup .alert-danger,
.page-payment-method .alert-danger {
    background-color: #f2dede;
    color: #843534; /* verified 4.6:1 against #f2dede */
    border-color: #ebccd1;
}

/* alert-success: add checkmark (✓) prefix as a non-colour success indicator
   This satisfies WCAG SC 1.4.1 (Use of Color) — success is not conveyed
   by colour alone. The ::before pseudo-element is purely presentational. */
.page-signup .alert-success::before,
.page-payment-method .alert-success::before {
    content: '\2713 ';
    font-weight: bold;
}

/* Required field labels: append an asterisk after the label text
   Provides a non-colour indicator that the field is required.
   Colour (#843534) matches alert-danger text for visual consistency. */
.page-signup .required-label::after,
.page-payment-method .required-label::after {
    content: ' *';
    color: #843534;
    font-weight: bold;
}