Using Bootstrap (currently v5.3.3) I am using a custom-built WordPress theme and setting a whole group of overrides for the colours used.

The custom-built WordPress theme stylesheet is loaded last, after the Bootstrap stylesheet.

This is right at the top of my theme stylesheet:

/* Colours */
:root {
    
    --mk-gold:#ab9460;
    --mk-gold-rgb:171,148,96;
    --mk-dark-gold:#615338;
    --mk-dark-gold-rgb:97,83,56;
    --mk-light-gold:#c4bc9a;
    --mk-light-gold-rgb:196,188,154;

    --bs-primary:var(--mk-gold);
    --bs-primary-rgb:var(--mk-gold-rgb);

    --bs-link-color:var(--mk-gold);
    --bs-link-hover-color:var(--mk-dark-gold);
    --bs-link-color-rgb:var(--mk-gold-rgb);
    --bs-link-hover-color-rgb:var(--mk-dark-gold-rgb);

    --bs-pagination-active-bg:var(--mk-gold);
    --bs-pagination-active-border-color:var(--mk-dark-gold);

}
/* End Colours */

Everything here works, EXCEPT the last two lines regarding pagination. For some reason, these rules are not overriding the normal Bootstrap values (unlike the primary colours, and the link colours, which are all using the override values when I use classes such as text-primary etc.).

Can anyone shed some light as to why, or why the pagination works differently?